/* ============================================================
   TTX Platform v3 — Shared Enhancements
   Loaded after every theme. Accessibility, toasts, motion,
   and contrast/legibility fixes that apply across all themes.
   ============================================================ */

/* ── Accessibility: visible keyboard focus everywhere ───────── */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.nav-item:focus-visible,
.btn:focus-visible {
    outline: 2px solid var(--border-glow, #60a5fa);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ── Accessibility: minimum legible label sizes ─────────────── */
/* Several themes set 9–10px uppercase mono labels — too small.  */
.stat-label,
.form-label,
.nav-section-label,
th,
.tab {
    font-size: 12px !important;
}

/* ── Accessibility: reduced motion ──────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    body::after { display: none !important; } /* scanline overlay */
}

/* Keep the scanline overlay below dropdowns, modals and toasts  */
body::after { z-index: 1 !important; }

/* ── Toast notifications (theme-aware via CSS variables) ────── */
#ttx-toast-host {
    position: fixed;
    top: calc(var(--header-height, 60px) + 16px);
    right: 16px;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: min(360px, calc(100vw - 32px));
    pointer-events: none;
}
.ttx-toast {
    background: var(--bg-card, #111a25);
    color: var(--text-primary, #e0e8f0);
    border: 1px solid var(--border-color, #1e3a5f);
    border-left: 3px solid var(--accent-blue, #3388ff);
    border-radius: 8px;
    padding: 12px 16px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.35);
    opacity: 0;
    transform: translateX(12px);
    transition: opacity .25s ease, transform .25s ease;
    pointer-events: auto;
}
.ttx-toast.show { opacity: 1; transform: translateX(0); }
.ttx-toast-title { font-weight: 700; font-size: 13px; margin-bottom: 2px; }
.ttx-toast-msg   { font-size: 13px; color: var(--text-secondary, #94a3b8); }
.ttx-toast-success { border-left-color: var(--accent-green, #00ff88); }
.ttx-toast-warning { border-left-color: var(--accent-yellow, #ffaa00); }
.ttx-toast-error   { border-left-color: var(--accent-red, #ff3366); }

/* ── Tablet/mobile: ensure usable layout on event devices ───── */
@media (max-width: 1024px) {
    .header-search { display: none; }
    .page-content { padding-left: 16px; padding-right: 16px; }
}
@media (max-width: 768px) {
    table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .card { padding: 14px; }
}

/* ── Print: reports should print clean (facilitator handouts) ── */
@media print {
    .sidebar, .top-header, .flash-messages, #ttx-toast-host { display: none !important; }
    .main-content { margin-left: 0 !important; }
    body { background: #fff !important; color: #000 !important; }
    body::after { display: none !important; }
}
