/* TTC Premium Refactor Layer
 * Centralizes high-impact dashboard polish so templates depend less on inline styling.
 * This file intentionally overrides only TTC surfaces.
 */
.ttc-dashboard-v3,.ttc-question-library-page,.ttc-student-dashboard,.ttc-teacher-dashboard,.ttc-parent-dashboard,.ttc-school-dashboard{--ttc-surface-bg:linear-gradient(135deg,#07111f 0%,#0b1730 50%,#101827 100%);--ttc-card-bg:rgba(255,255,255,.08);--ttc-card-border:rgba(255,255,255,.12);--ttc-card-shadow:0 18px 55px rgba(0,0,0,.22);--ttc-text-strong:#f8fafc;--ttc-text-soft:#cbd5e1;--ttc-accent:#f6c768;--ttc-accent-2:#38bdf8}
.ttc-dashboard-v3{position:relative;isolation:isolate;overflow:hidden;background:var(--ttc-surface-bg);color:var(--ttc-text-soft);font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;letter-spacing:-0.01em}
.ttc-dashboard-v3:before{content:"";position:absolute;inset:-20%;z-index:-1;background:radial-gradient(circle at top left,rgba(56,189,248,.22),transparent 34%),radial-gradient(circle at bottom right,rgba(246,199,104,.16),transparent 35%);pointer-events:none}
.ttc-dashboard-v3 .ttc-premium-card,.ttc-dashboard-v3 .ttc-card,.ttc-dashboard-v3 .dashboard-card,.ttc-question-library-page .ttc-card{background:var(--ttc-card-bg)!important;border:1px solid var(--ttc-card-border)!important;box-shadow:var(--ttc-card-shadow);backdrop-filter:blur(18px);border-radius:22px}
.ttc-dashboard-v3 h1,.ttc-dashboard-v3 h2,.ttc-dashboard-v3 h3,.ttc-question-library-page h1,.ttc-question-library-page h2,.ttc-question-library-page h3{color:var(--ttc-text-strong);letter-spacing:-.025em;line-height:1.15}
.ttc-dashboard-v3 p,.ttc-dashboard-v3 li,.ttc-dashboard-v3 td,.ttc-dashboard-v3 span{color:inherit}
.ttc-dashboard-v3 button,.ttc-dashboard-v3 .button,.ttc-question-library-page button,.ttc-question-library-page .button{border-radius:999px!important;font-weight:700;transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease}
.ttc-dashboard-v3 button:hover,.ttc-dashboard-v3 .button:hover,.ttc-question-library-page button:hover,.ttc-question-library-page .button:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(15,23,42,.18)}
.ttc-dashboard-v3 input,.ttc-dashboard-v3 select,.ttc-dashboard-v3 textarea,.ttc-question-library-page input,.ttc-question-library-page select,.ttc-question-library-page textarea{border-radius:14px!important;border:1px solid rgba(148,163,184,.32)!important;background:rgba(255,255,255,.92)!important;color:#0f172a!important}
.ttc-dashboard-v3 table,.ttc-question-library-page table{border-collapse:separate;border-spacing:0;width:100%;overflow:hidden;border-radius:18px}
.ttc-dashboard-v3 img,.ttc-question-library-page img{max-width:100%;height:auto}
.ttc-surface-shell{max-width:1280px;margin:0 auto;padding:clamp(16px,3vw,34px)}
.ttc-premium-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(14px,2vw,24px)}
.ttc-action-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.ttc-muted{color:var(--ttc-text-soft)}
@media(max-width:782px){.ttc-dashboard-v3{padding:12px}.ttc-dashboard-v3 .ttc-premium-card,.ttc-dashboard-v3 .ttc-card,.ttc-dashboard-v3 .dashboard-card{border-radius:18px}.ttc-action-row{align-items:stretch}.ttc-action-row>*{width:100%}}


/* Production analytics widgets: replaces mock chart placeholders with real, accessible metric visuals. */
.ttc-live-chart { min-height: 260px; }
.ttc-metric-row { display: flex; flex-direction: column; gap: 8px; margin: 14px 0; }
.ttc-metric-label { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--ttc-text-main, #e5e7eb); }
.ttc-metric-label strong { color: var(--ttc-accent, #67e8f9); white-space: nowrap; }
.ttc-meter { height: 10px; border-radius: 999px; overflow: hidden; background: rgba(148, 163, 184, 0.18); border: 1px solid rgba(148, 163, 184, 0.18); }
.ttc-meter span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, rgba(34,211,238,.75), rgba(168,85,247,.85)); }
.ttc-license-donut { width: 150px; height: 150px; margin: 20px auto; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at center, var(--ttc-panel-bg, #0f172a) 0 54%, transparent 55%), conic-gradient(rgba(34,211,238,.9) var(--ttc-license-efficiency, 0%), rgba(148,163,184,.18) 0); border: 1px solid rgba(148,163,184,.2); }
.ttc-license-donut-value { font-size: 28px; font-weight: 800; color: var(--ttc-text-main, #fff); }
.ttc-mini-stats > div { padding: 14px; border: 1px solid rgba(148,163,184,.16); border-radius: 14px; background: rgba(15, 23, 42, .35); }
.ttc-mini-stats strong { display:block; font-size: 22px; color: var(--ttc-text-main, #fff); }
.ttc-mini-stats span { display:block; font-size: 12px; color: var(--ttc-text-muted, #94a3b8); }

/* Shared UI polish for dashboards and the question library */
.ttc-dashboard-v3,
.ttc-qa-browser {
    --ttc-surface-strong: rgba(255,255,255,0.11);
    --ttc-surface-soft: rgba(255,255,255,0.07);
    --ttc-border-soft: rgba(148,163,184,0.2);
    --ttc-shadow-soft: 0 10px 30px rgba(2, 6, 23, 0.14);
}

.ttc-dashboard-v3 .ttc-premium-card,
.ttc-dashboard-v3 .ttc-card,
.ttc-dashboard-v3 .dashboard-card,
.ttc-qa-browser .ttc-card,
.ttc-qa-browser .ttc-panel,
.ttc-qa-browser .ttc-panel-content,
.ttc-qa-browser .ttc-al-modal-content {
    border: 1px solid var(--ttc-border-soft) !important;
    box-shadow: var(--ttc-shadow-soft) !important;
    border-radius: 20px !important;
    backdrop-filter: blur(14px);
}

.ttc-dashboard-v3 .ttc-db-header,
.ttc-dashboard-v3 .ttc-db-nav,
.ttc-dashboard-v3 .ttc-level-aware-nav {
    border: 1px solid var(--ttc-border-soft);
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(12px);
    box-shadow: var(--ttc-shadow-soft);
}

.ttc-dashboard-v3 .ttc-db-header {
    border-radius: 24px;
    padding: 18px 20px;
    margin-bottom: 16px;
}

.ttc-dashboard-v3 .ttc-db-nav {
    border-radius: 999px;
    padding: 6px;
    gap: 6px;
}

.ttc-dashboard-v3 .ttc-db-nav .ttc-nav-item,
.ttc-dashboard-v3 .ttc-db-nav .ttc-db-tab {
    border-radius: 999px;
    padding: 8px 12px;
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.ttc-dashboard-v3 .ttc-db-nav .ttc-nav-item:hover,
.ttc-dashboard-v3 .ttc-db-nav .ttc-db-tab:hover,
.ttc-dashboard-v3 .ttc-db-nav .ttc-nav-item.active,
.ttc-dashboard-v3 .ttc-db-nav .ttc-db-tab.active {
    background: rgba(56, 189, 248, 0.16);
    color: #f8fafc;
    transform: translateY(-1px);
}

.ttc-dashboard-v3 .ttc-premium-card:hover,
.ttc-dashboard-v3 .ttc-card:hover,
.ttc-dashboard-v3 .dashboard-card:hover,
.ttc-qa-browser .ttc-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 36px rgba(2, 6, 23, 0.16);
}

.ttc-dashboard-v3 .ttc-stat-premium,
.ttc-dashboard-v3 .ttc-stat-card,
.ttc-dashboard-v3 .stats-card {
    border-radius: 18px;
    border: 1px solid var(--ttc-border-soft);
    background: linear-gradient(135deg, rgba(255,255,255,0.09), rgba(255,255,255,0.05));
    box-shadow: var(--ttc-shadow-soft);
}

.ttc-dashboard-v3 .ttc-badge,
.ttc-dashboard-v3 .ttc-badge-premium,
.ttc-dashboard-v3 .badge {
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    background: rgba(56, 189, 248, 0.16);
    color: #e0f2fe;
    border: 1px solid rgba(56, 189, 248, 0.24);
}

.ttc-dashboard-v3 table,
.ttc-question-library-page table {
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    border-radius: 16px;
}

.ttc-dashboard-v3 table th,
.ttc-dashboard-v3 table td,
.ttc-question-library-page table th,
.ttc-question-library-page table td {
    padding: 12px 14px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}

.ttc-filter-bar {
    position: sticky;
    top: 10px;
    z-index: 20;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: end;
    padding: 12px 14px;
    margin-bottom: 16px;
    border: 1px solid var(--ttc-border-soft);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.62);
    backdrop-filter: blur(12px);
    box-shadow: var(--ttc-shadow-soft);
}

.ttc-filter-bar .ttc-filter-label {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--ttc-text-main, #f8fafc);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    opacity: 0.92;
}

.ttc-filter-bar .ttc-filter-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 140px;
}

.ttc-filter-bar .ttc-filter-field label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ttc-text-muted, #cbd5e1);
}

.ttc-filter-bar select,
.ttc-filter-bar input,
.ttc-filter-bar textarea {
    min-height: 40px;
    border-radius: 999px !important;
    border: 1px solid rgba(148,163,184,0.28) !important;
    background: rgba(248,250,252,0.96) !important;
    color: #0f172a !important;
    padding: 0 12px !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.ttc-filter-bar .ttc-filter-action {
    margin-left: auto;
}

.ttc-qa-browser .ttc-al-btn,
.ttc-dashboard-v3 .ttc-btn-wow,
.ttc-dashboard-v3 button,
.ttc-dashboard-v3 .button {
    border-radius: 999px !important;
    font-weight: 700;
    letter-spacing: 0.01em;
    transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.ttc-qa-browser .ttc-al-btn:hover,
.ttc-dashboard-v3 .ttc-btn-wow:hover,
.ttc-dashboard-v3 button:hover,
.ttc-dashboard-v3 .button:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
}

.ttc-qa-browser .ttc-al-btn-primary,
.ttc-dashboard-v3 .ttc-btn-wow,
.ttc-dashboard-v3 .button-primary {
    background: linear-gradient(135deg, var(--ttc-accent, #38bdf8), var(--ttc-accent-2, #6366f1));
    color: #fff;
    border: none;
    box-shadow: 0 10px 24px rgba(56, 189, 248, 0.18);
}

.ttc-qa-browser .ttc-al-btn-outline,
.ttc-dashboard-v3 .ttc-btn-secondary {
    background: rgba(255,255,255,0.07);
    color: var(--ttc-text-main, #f8fafc);
    border: 1px solid rgba(148,163,184,0.24);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}

.ttc-qa-browser .ttc-question-card,
.ttc-qa-browser .ttc-course-card,
.ttc-qa-browser .ttc-recommendation-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
    will-change: transform;
    position: relative;
    overflow: hidden;
}

.ttc-qa-browser .ttc-question-card::before,
.ttc-qa-browser .ttc-course-card::before,
.ttc-qa-browser .ttc-recommendation-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(56,189,248,0.08), transparent 45%);
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
}

.ttc-qa-browser .ttc-question-card:hover,
.ttc-qa-browser .ttc-course-card:hover,
.ttc-qa-browser .ttc-recommendation-card:hover {
    transform: translateY(-2px);
    border-color: rgba(56,189,248,0.4) !important;
    box-shadow: 0 20px 46px rgba(2, 6, 23, 0.22);
    background-color: rgba(255,255,255,0.12);
}

.ttc-qa-browser .ttc-question-card:hover::before,
.ttc-qa-browser .ttc-course-card:hover::before,
.ttc-qa-browser .ttc-recommendation-card:hover::before {
    opacity: 1;
}

.ttc-qa-browser .ttc-empty,
.ttc-dashboard-v3 .ttc-empty-state,
.ttc-dashboard-v3 .ttc-empty {
    padding: 20px;
    border: 1px dashed rgba(148,163,184,0.28);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.28), rgba(30, 41, 59, 0.2));
    color: var(--ttc-text-soft, #cbd5e1);
}

.ttc-dashboard-v3 :focus-visible,
.ttc-qa-browser :focus-visible {
    outline: 3px solid rgba(56,189,248,0.55);
    outline-offset: 2px;
}

/* Extra refinement for shared content blocks, progress, pagination, and dialogs */
.ttc-dashboard-v3 .ttc-section-header,
.ttc-dashboard-v3 .ttc-panel-header,
.ttc-dashboard-v3 .ttc-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.ttc-dashboard-v3 .ttc-section-header h3,
.ttc-dashboard-v3 .ttc-panel-header h3,
.ttc-dashboard-v3 .ttc-card-header h3 {
    margin: 0;
    font-size: 1rem;
    color: var(--ttc-text-main, #f8fafc);
}

.ttc-dashboard-v3 .ttc-progress-track,
.ttc-dashboard-v3 .progress-bar,
.ttc-dashboard-v3 .ttc-meter-track {
    height: 10px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(148, 163, 184, 0.18);
    border: 1px solid rgba(148, 163, 184, 0.18);
}

.ttc-dashboard-v3 .ttc-progress-fill,
.ttc-dashboard-v3 .progress-bar > span,
.ttc-dashboard-v3 .ttc-meter-track > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(56, 189, 248, 0.92), rgba(99, 102, 241, 0.95));
}

.ttc-dashboard-v3 .ttc-list-item,
.ttc-dashboard-v3 .ttc-notification-item,
.ttc-dashboard-v3 .ttc-activity-item {
    padding: 12px 14px;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.05);
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.ttc-dashboard-v3 .ttc-list-item:hover,
.ttc-dashboard-v3 .ttc-notification-item:hover,
.ttc-dashboard-v3 .ttc-activity-item:hover {
    background: rgba(255, 255, 255, 0.09);
    border-color: rgba(56, 189, 248, 0.28);
}

.ttc-dashboard-v3 .ttc-pagination,
.ttc-dashboard-v3 .pagination,
.ttc-dashboard-v3 .ttc-pager {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-top: 16px;
}

.ttc-dashboard-v3 .ttc-pagination a,
.ttc-dashboard-v3 .pagination a,
.ttc-dashboard-v3 .ttc-pager a,
.ttc-dashboard-v3 .ttc-pagination span,
.ttc-dashboard-v3 .pagination span,
.ttc-dashboard-v3 .ttc-pager span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    padding: 8px 10px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.24);
    background: rgba(255, 255, 255, 0.06);
    color: var(--ttc-text-main, #f8fafc);
    text-decoration: none;
}

.ttc-dashboard-v3 .ttc-pagination .current,
.ttc-dashboard-v3 .pagination .current,
.ttc-dashboard-v3 .ttc-pager .current {
    background: linear-gradient(135deg, var(--ttc-accent, #38bdf8), var(--ttc-accent-2, #6366f1));
    color: #fff;
    border-color: transparent;
}

.ttc-dashboard-v3 .ttc-modal,
.ttc-dashboard-v3 .modal,
.ttc-qa-browser .ttc-al-modal-content {
    border-radius: 24px !important;
    border: 1px solid rgba(148, 163, 184, 0.25) !important;
    box-shadow: 0 24px 60px rgba(2, 6, 23, 0.26) !important;
    overflow: hidden;
}

.ttc-dashboard-v3 .ttc-modal .ttc-modal-header,
.ttc-dashboard-v3 .modal .modal-header,
.ttc-qa-browser .ttc-al-modal-content .ttc-al-modal-header {
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
    padding: 16px 18px;
    background: rgba(255, 255, 255, 0.04);
}

.ttc-dashboard-v3 .ttc-modal .ttc-modal-body,
.ttc-dashboard-v3 .modal .modal-body,
.ttc-qa-browser .ttc-al-modal-content .ttc-al-modal-body {
    padding: 16px 18px;
    background: rgba(15, 23, 42, 0.3);
}

.ttc-dashboard-v3 .ttc-modal .ttc-modal-footer,
.ttc-dashboard-v3 .modal .modal-footer,
.ttc-qa-browser .ttc-al-modal-content .ttc-al-modal-footer {
    border-top: 1px solid rgba(148, 163, 184, 0.16);
    padding: 14px 18px;
    background: rgba(255, 255, 255, 0.03);
}

.ttc-dashboard-v3 .ttc-search-bar,
.ttc-dashboard-v3 .ttc-search-box {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.22);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

@media (max-width: 782px) {
    .ttc-filter-bar {
        position: static;
        border-radius: 20px;
        padding: 12px;
    }

    .ttc-filter-bar .ttc-filter-field {
        width: 100%;
        min-width: 0;
    }

    .ttc-filter-bar .ttc-filter-action {
        width: 100%;
        margin-left: 0;
    }

    .ttc-qa-browser {
        padding: 12px;
    }
}

/* Student dashboard 2026 visible refresh */
.ttc-dashboard-v3,
.ttc-student-dashboard,
.ttc-student-dashboard-v3 {
    background:
        radial-gradient(circle at 10% 0%, rgba(99, 91, 255, 0.18), transparent 34rem),
        radial-gradient(circle at 100% 6%, rgba(45, 212, 191, 0.13), transparent 30rem),
        linear-gradient(180deg, #f8fbff 0%, #eef8ff 46%, #fff 100%) !important;
}
.ttc-dashboard-v3 .ttc-student-hero,
.ttc-dashboard-v3 .ttc-hero,
.ttc-dashboard-v3 .student-command-center,
.ttc-dashboard-v3 .ttc-tab-nav,
.ttc-dashboard-v3 .ttc-card,
.ttc-dashboard-v3 .ttc-panel {
    border: 1px solid rgba(99, 102, 241, 0.16) !important;
    background: rgba(255, 255, 255, 0.86) !important;
    backdrop-filter: blur(18px);
    box-shadow: 0 22px 62px rgba(15, 23, 42, 0.09) !important;
}
.ttc-dashboard-v3 .ttc-tab-nav a.active,
.ttc-dashboard-v3 .ttc-tab-nav button.active,
.ttc-dashboard-v3 .ttc-nav-tabs .active,
.ttc-dashboard-v3 .ttc-button-primary,
.ttc-dashboard-v3 .button-primary {
    background: linear-gradient(135deg, #635bff, #7c3aed) !important;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 14px 30px rgba(99, 91, 255, 0.25) !important;
}
.ttc-dashboard-v3 input,
.ttc-dashboard-v3 select,
.ttc-dashboard-v3 textarea {
    border-radius: 14px !important;
    border: 1px solid rgba(99, 102, 241, 0.18) !important;
    background: rgba(255, 255, 255, 0.92) !important;
}
