/* === PRINT === */
        @media print {
            html,body{overflow:visible!important;height:auto!important;background:#fff!important;color:#000!important;}
            #root{height:auto!important;display:block!important;}
            header,.no-print,.print-hide,button{display:none!important;}
            main{overflow:visible!important;height:auto!important;}
            .print-area{padding:8px;}
            *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;}
        }

        /* === RESET === */
        *,*::before,*::after{box-sizing:border-box;}
        body{margin:0;padding:0;transition:background-color .25s;-webkit-font-smoothing:antialiased;overscroll-behavior:none;}

        /* === LAYOUT === */
        html, body { margin: 0; padding: 0; overflow: hidden; height: 100%; }
        body { background: inherit; }

        #root {
            position: fixed !important;
            top: 0 !important; left: 0 !important;
            right: 0 !important; bottom: 0 !important;
            display: flex !important;
            flex-direction: column !important;
            overflow-y: auto !important;
            overflow-x: hidden !important;
            z-index: 0;
        }

        #root > * {
            flex: 1 !important;
            min-height: 0 !important;
            display: flex !important;
            flex-direction: column !important;
        }

        header { flex-shrink: 0 !important; }
        main { flex: 1 !important; min-height: 0 !important; overflow: hidden !important; }

        .main-inner {
            height: 100% !important;
            overflow-y: auto !important;
            overflow-x: hidden !important;
            direction: ltr;
            -webkit-overflow-scrolling: touch;
            overscroll-behavior-y: contain;
        }
        .main-inner > * { direction: rtl; }



/* === DESIGN SYSTEM THEME FOUNDATION === */
:root,
html[data-theme="light"]{
    color-scheme: light;
    --bg:#f8fafc;
    --surface:#ffffff;
    --surface-soft:#f1f5f9;
    --text:#0f172a;
    --text-muted:#64748b;
    --border:#e2e8f0;
    --primary:#0f4c3a;
    --primary-hover:#16654a;
    --primary-soft:#eaf4ef;
    --primary-rgb:15,76,58;
    --accent:#0d9488;
    --accent-soft:#ccfbf1;
    --accent-rgb:13,148,136;
    --focus-ring:rgba(15,76,58,.22);
    --shadow:0 14px 34px rgba(15,23,42,.08);
    --input-bg:#ffffff;
    --input-border:#cbd5e1;
    --danger:#dc2626;
    --success:#059669;
    --warning:#d97706;
    --info:#2563eb;
    --overlay:rgba(15,23,42,.42);
    --header-gradient:linear-gradient(135deg,#0f4c3a 0%,#16654a 58%,#0d9488 100%);
    --ring:var(--focus-ring);
    --waqar-primary:var(--primary);
    --waqar-primary-2:var(--primary-hover);
    --waqar-bg:var(--bg);
    --waqar-surface:var(--surface);
    --waqar-surface-soft:var(--surface-soft);
    --waqar-text:var(--text);
    --waqar-muted:var(--text-muted);
    --waqar-border:var(--border);
    --waqar-shadow:var(--shadow);
}
html[data-theme="dark"],
html.dark{
    color-scheme: dark;
    --bg:#0b1120;
    --surface:#111827;
    --surface-soft:#1e293b;
    --text:#f8fafc;
    --text-muted:#cbd5e1;
    --border:#334155;
    --primary:#34d399;
    --primary-hover:#10b981;
    --primary-soft:rgba(52,211,153,.14);
    --primary-rgb:52,211,153;
    --accent:#2dd4bf;
    --accent-soft:rgba(45,212,191,.16);
    --accent-rgb:45,212,191;
    --focus-ring:rgba(52,211,153,.24);
    --shadow:0 18px 44px rgba(0,0,0,.42);
    --input-bg:#0f172a;
    --input-border:#475569;
    --danger:#fb7185;
    --success:#34d399;
    --warning:#fbbf24;
    --info:#60a5fa;
    --overlay:rgba(2,6,23,.72);
    --header-gradient:linear-gradient(135deg,#020617 0%,#0f172a 40%,#064e3b 100%);
    --ring:var(--focus-ring);
    --waqar-primary:var(--primary);
    --waqar-primary-2:var(--primary-hover);
    --waqar-bg:var(--bg);
    --waqar-surface:var(--surface);
    --waqar-surface-soft:var(--surface-soft);
    --waqar-text:var(--text);
    --waqar-muted:var(--text-muted);
    --waqar-border:var(--border);
    --waqar-shadow:var(--shadow);
}

/* === ACCENT COLOR SYSTEM === */
:root{
    --accent-green-preview:#0f4c3a;
    --accent-blue-preview:#2563eb;
    --accent-purple-preview:#7c3aed;
    --accent-gold-preview:#b45309;
    --accent-rose-preview:#be123c;
}
html[data-theme="light"][data-accent="green"],html[data-accent="green"]{
    --primary:#0f4c3a;--primary-hover:#16654a;--primary-soft:#eaf4ef;--primary-rgb:15,76,58;
    --accent:#0d9488;--accent-soft:#ccfbf1;--accent-rgb:13,148,136;--focus-ring:rgba(15,76,58,.22);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#0f4c3a 0%,#16654a 58%,#0d9488 100%);
}
html[data-theme="light"][data-accent="blue"]{
    --primary:#2563eb;--primary-hover:#1d4ed8;--primary-soft:#dbeafe;--primary-rgb:37,99,235;
    --accent:#0ea5e9;--accent-soft:#e0f2fe;--accent-rgb:14,165,233;--focus-ring:rgba(37,99,235,.22);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#1e3a8a 0%,#2563eb 58%,#0ea5e9 100%);
}
html[data-theme="light"][data-accent="purple"]{
    --primary:#7c3aed;--primary-hover:#6d28d9;--primary-soft:#ede9fe;--primary-rgb:124,58,237;
    --accent:#a855f7;--accent-soft:#f3e8ff;--accent-rgb:168,85,247;--focus-ring:rgba(124,58,237,.22);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#4c1d95 0%,#7c3aed 58%,#a855f7 100%);
}
html[data-theme="light"][data-accent="gold"]{
    --primary:#b45309;--primary-hover:#92400e;--primary-soft:#fef3c7;--primary-rgb:180,83,9;
    --accent:#d97706;--accent-soft:#ffedd5;--accent-rgb:217,119,6;--focus-ring:rgba(180,83,9,.24);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#7c2d12 0%,#b45309 56%,#d97706 100%);
}
html[data-theme="light"][data-accent="rose"]{
    --primary:#be123c;--primary-hover:#9f1239;--primary-soft:#ffe4e6;--primary-rgb:190,18,60;
    --accent:#db2777;--accent-soft:#fce7f3;--accent-rgb:219,39,119;--focus-ring:rgba(190,18,60,.22);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#881337 0%,#be123c 56%,#db2777 100%);
}
html[data-theme="dark"][data-accent="green"],html.dark[data-accent="green"]{
    --primary:#34d399;--primary-hover:#10b981;--primary-soft:rgba(52,211,153,.14);--primary-rgb:52,211,153;
    --accent:#2dd4bf;--accent-soft:rgba(45,212,191,.16);--accent-rgb:45,212,191;--focus-ring:rgba(52,211,153,.24);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#020617 0%,#0f172a 40%,#064e3b 100%);
}
html[data-theme="dark"][data-accent="blue"],html.dark[data-accent="blue"]{
    --primary:#60a5fa;--primary-hover:#3b82f6;--primary-soft:rgba(96,165,250,.16);--primary-rgb:96,165,250;
    --accent:#38bdf8;--accent-soft:rgba(56,189,248,.16);--accent-rgb:56,189,248;--focus-ring:rgba(96,165,250,.26);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#020617 0%,#0f172a 42%,#1d4ed8 100%);
}
html[data-theme="dark"][data-accent="purple"],html.dark[data-accent="purple"]{
    --primary:#c084fc;--primary-hover:#a855f7;--primary-soft:rgba(192,132,252,.16);--primary-rgb:192,132,252;
    --accent:#e879f9;--accent-soft:rgba(232,121,249,.15);--accent-rgb:232,121,249;--focus-ring:rgba(192,132,252,.27);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#020617 0%,#1e1b4b 44%,#7e22ce 100%);
}
html[data-theme="dark"][data-accent="gold"],html.dark[data-accent="gold"]{
    --primary:#fbbf24;--primary-hover:#f59e0b;--primary-soft:rgba(251,191,36,.16);--primary-rgb:251,191,36;
    --accent:#f97316;--accent-soft:rgba(249,115,22,.16);--accent-rgb:249,115,22;--focus-ring:rgba(251,191,36,.27);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#020617 0%,#1c1917 44%,#92400e 100%);
}
html[data-theme="dark"][data-accent="rose"],html.dark[data-accent="rose"]{
    --primary:#fb7185;--primary-hover:#f43f5e;--primary-soft:rgba(251,113,133,.16);--primary-rgb:251,113,133;
    --accent:#f472b6;--accent-soft:rgba(244,114,182,.15);--accent-rgb:244,114,182;--focus-ring:rgba(251,113,133,.27);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#020617 0%,#1f1723 44%,#be123c 100%);
}

html,body{background:var(--bg)!important;color:var(--text)!important;}
body{min-height:100vh;}
#root,.main-inner{background:var(--bg);color:var(--text);}
#root{transition:background-color .2s ease,color .2s ease;}
html[data-theme="dark"] #root,
html.dark #root{background:radial-gradient(circle at 16% 0%,rgba(var(--primary-rgb),.13),transparent 26%),radial-gradient(circle at 82% 12%,rgba(var(--accent-rgb),.08),transparent 24%),var(--bg);}
input,select,textarea{
    background:var(--input-bg)!important;
    color:var(--text)!important;
    border-color:var(--input-border)!important;
    caret-color:var(--primary);
    box-shadow:none;
}
input:focus,select:focus,textarea:focus{border-color:var(--primary)!important;box-shadow:0 0 0 3px var(--ring)!important;}
input::placeholder,textarea::placeholder{color:var(--text-muted)!important;opacity:.75;}
option{background:var(--input-bg)!important;color:var(--text)!important;}
.table-wrap,table{background:transparent;color:var(--text);}
th,td{border-color:var(--border)!important;}
.modal-overlay{background:var(--overlay)!important;}
.modal-body{background:var(--surface)!important;color:var(--text)!important;}
.card,.home-card,.teacher-panel,.student-action-panel,.teacher-soft-card,.course-card,.audio-reciter-card,.waqar-book-viewer{
    background:var(--surface)!important;
    color:var(--text)!important;
    border-color:var(--border)!important;
}
.teacher-soft-card,.student-action-panel,.course-card,.audio-reciter-card{box-shadow:var(--shadow);}
.home-panel{background:linear-gradient(135deg,rgba(var(--primary-rgb),.08),rgba(255,255,255,.98) 48%,rgba(var(--accent-rgb),.10))!important;border-color:rgba(var(--primary-rgb),.14)!important;}
html[data-theme="dark"] .home-panel,
html.dark .home-panel{background:linear-gradient(135deg,rgba(var(--primary-rgb),.13),rgba(17,24,39,.94) 44%,rgba(var(--accent-rgb),.10))!important;border-color:rgba(var(--primary-rgb),.20)!important;box-shadow:0 22px 50px rgba(0,0,0,.35)!important;}
.waqar-main-header{background-image:var(--header-gradient)!important;}
.waqar-main-logo{background:var(--primary-soft)!important;color:var(--primary)!important;}
html[data-theme="dark"] .waqar-main-logo,
html.dark .waqar-main-logo{background:var(--primary-soft)!important;color:var(--primary)!important;border:1px solid rgba(var(--primary-rgb),.25);box-shadow:0 12px 30px rgba(0,0,0,.28);}
.waqar-top-controls{position:absolute;top:.75rem;left:1rem;display:flex;align-items:flex-start;gap:.55rem;z-index:25;direction:rtl;}
.waqar-theme-switch,.waqar-accent-toggle{display:inline-flex;align-items:center;gap:.5rem;border:1px solid rgba(255,255,255,.32);background:rgba(255,255,255,.14);color:#fff;border-radius:999px;padding:.45rem .7rem;font-weight:900;font-size:.78rem;backdrop-filter:blur(10px);box-shadow:0 10px 24px rgba(0,0,0,.14);transition:transform .16s ease,background-color .16s ease,border-color .16s ease;}
.waqar-theme-switch:hover,.waqar-accent-toggle:hover{transform:translateY(-1px);background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.52);}
.waqar-theme-switch:active,.waqar-accent-toggle:active{transform:translateY(0) scale(.98);}
.waqar-theme-switch__icon,.waqar-accent-toggle__dot{width:1.75rem;height:1.75rem;border-radius:999px;background:rgba(255,255,255,.22);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.waqar-accent-toggle__dot{background:var(--primary);box-shadow:inset 0 0 0 3px rgba(255,255,255,.88),0 0 0 1px rgba(255,255,255,.38);}
.waqar-theme-switch__label,.waqar-accent-toggle__label{line-height:1;white-space:nowrap;}
.waqar-accent-picker{position:relative;}
.waqar-accent-menu{position:absolute;top:calc(100% + .55rem);left:0;width:14.5rem;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:1.15rem;padding:.65rem;box-shadow:var(--shadow);backdrop-filter:blur(14px);z-index:50;}
.waqar-accent-menu::before{content:"";position:absolute;top:-7px;left:1.25rem;width:12px;height:12px;transform:rotate(45deg);background:var(--surface);border-top:1px solid var(--border);border-left:1px solid var(--border);}
.waqar-accent-menu__title{font-size:.72rem;font-weight:900;color:var(--text-muted);padding:.2rem .35rem .55rem;}
.waqar-accent-option{width:100%;display:flex;align-items:center;gap:.6rem;border:1px solid transparent;background:transparent;color:var(--text);border-radius:.9rem;padding:.58rem .62rem;font-size:.82rem;font-weight:900;text-align:right;transition:background-color .15s ease,border-color .15s ease,transform .15s ease;}
.waqar-accent-option:hover{background:var(--surface-soft);transform:translateX(-2px);}
.waqar-accent-option.is-active{background:var(--primary-soft);border-color:rgba(var(--primary-rgb),.30);color:var(--primary);}
.waqar-accent-option__dot{width:1.25rem;height:1.25rem;border-radius:999px;background:var(--accent-preview);box-shadow:inset 0 0 0 3px rgba(255,255,255,.88),0 0 0 1px rgba(15,23,42,.12);flex-shrink:0;}
.waqar-accent-option__text{flex:1;}
@media(max-width:520px){.waqar-top-controls{top:.55rem;left:.55rem;gap:.38rem}.waqar-theme-switch,.waqar-accent-toggle{padding:.38rem .52rem;font-size:.68rem}.waqar-theme-switch__label,.waqar-accent-toggle__label{display:none}.waqar-theme-switch__icon,.waqar-accent-toggle__dot{width:1.65rem;height:1.65rem}.waqar-accent-menu{width:13.25rem;left:0}.waqar-accent-option{font-size:.78rem;padding:.55rem}}
button:not([class*="bg-"]){color:var(--text);}
button:focus-visible,a:focus-visible{outline:3px solid var(--ring);outline-offset:3px;border-radius:.75rem;}
input[type="date"]::-webkit-calendar-picker-indicator{filter:none;}
html[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
html.dark input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1) brightness(1.4);}


/* Accent-aware bridge for existing Tailwind-heavy markup */
::selection{background:rgba(var(--primary-rgb),.22);color:var(--text);}
input[type="checkbox"],input[type="radio"]{accent-color:var(--primary);}
.bg-teal-600,.bg-emerald-600,.bg-green-600,.bg-cyan-600,.hover\:bg-teal-700:hover,.hover\:bg-emerald-700:hover{background-color:var(--primary)!important;color:#fff!important;}
.bg-teal-700,.bg-emerald-700,.hover\:bg-teal-800:hover,.hover\:bg-emerald-800:hover{background-color:var(--primary-hover)!important;color:#fff!important;}
.text-teal-500,.text-teal-600,.text-teal-700,.text-teal-800,.text-emerald-500,.text-emerald-600,.text-emerald-700,.text-emerald-800{color:var(--primary)!important;}
.bg-teal-50,.bg-teal-100,.bg-emerald-50,.bg-emerald-100,.bg-green-50,.bg-green-100{background-color:var(--primary-soft)!important;color:var(--primary)!important;}
.border-teal-100,.border-teal-200,.border-teal-300,.border-teal-500,.border-teal-600,.border-emerald-100,.border-emerald-200,.border-emerald-600{border-color:rgba(var(--primary-rgb),.34)!important;}
a:not([class*="text-"]){color:var(--primary);} 
.audio-reciter-card.active{border-color:var(--primary)!important;background:var(--primary-soft)!important;box-shadow:0 10px 22px rgba(var(--primary-rgb),.16)!important;color:var(--primary)!important;}
.student-header{border-bottom-color:var(--primary)!important;}

/* Theme-aware utility bridge for existing Tailwind-heavy markup */
.bg-white,.bg-slate-50{box-shadow:none;}
html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .bg-white\/95,
html[data-theme="dark"] .bg-white\/80,
html[data-theme="dark"] .bg-white\/75,
html[data-theme="dark"] .bg-white\/70,
html[data-theme="dark"] .bg-slate-50,
html[data-theme="dark"] .bg-slate-50\/50,
html.dark .bg-white,
html.dark .bg-white\/95,
html.dark .bg-white\/80,
html.dark .bg-white\/75,
html.dark .bg-white\/70,
html.dark .bg-slate-50,
html.dark .bg-slate-50\/50{background-color:var(--surface)!important;color:var(--text)!important;border-color:var(--border)!important;}
html[data-theme="dark"] .bg-slate-100,
html[data-theme="dark"] .bg-slate-200,
html[data-theme="dark"] .bg-slate-300,
html.dark .bg-slate-100,
html.dark .bg-slate-200,
html.dark .bg-slate-300{background-color:var(--surface-soft)!important;color:var(--text)!important;border-color:var(--border)!important;}
html[data-theme="dark"] .text-slate-900,
html[data-theme="dark"] .text-slate-800,
html[data-theme="dark"] .text-slate-700,
html[data-theme="dark"] .text-slate-600,
html[data-theme="dark"] .text-gray-900,
html[data-theme="dark"] .text-gray-800,
html.dark .text-slate-900,
html.dark .text-slate-800,
html.dark .text-slate-700,
html.dark .text-slate-600,
html.dark .text-gray-900,
html.dark .text-gray-800{color:var(--text)!important;}
html[data-theme="dark"] .text-slate-500,
html[data-theme="dark"] .text-slate-400,
html[data-theme="dark"] .text-slate-300,
html[data-theme="dark"] .text-slate-200,
html[data-theme="dark"] .text-gray-500,
html[data-theme="dark"] .text-gray-400,
html.dark .text-slate-500,
html.dark .text-slate-400,
html.dark .text-slate-300,
html.dark .text-slate-200,
html.dark .text-gray-500,
html.dark .text-gray-400{color:var(--text-muted)!important;}
html[data-theme="dark"] .border,
html[data-theme="dark"] .border-t,
html[data-theme="dark"] .border-b,
html[data-theme="dark"] .border-slate-50,
html[data-theme="dark"] .border-slate-100,
html[data-theme="dark"] .border-slate-200,
html[data-theme="dark"] .border-white,
html.dark .border,
html.dark .border-t,
html.dark .border-b,
html.dark .border-slate-50,
html.dark .border-slate-100,
html.dark .border-slate-200,
html.dark .border-white{border-color:var(--border)!important;}
html[data-theme="dark"] .shadow,
html[data-theme="dark"] .shadow-sm,
html[data-theme="dark"] .shadow-md,
html[data-theme="dark"] .shadow-lg,
html[data-theme="dark"] .shadow-xl,
html[data-theme="dark"] .shadow-2xl,
html.dark .shadow,
html.dark .shadow-sm,
html.dark .shadow-md,
html.dark .shadow-lg,
html.dark .shadow-xl,
html.dark .shadow-2xl{box-shadow:var(--shadow)!important;}
html[data-theme="dark"] .hover\:bg-slate-50:hover,
html[data-theme="dark"] .hover\:bg-slate-100:hover,
html[data-theme="dark"] .hover\:bg-white:hover,
html.dark .hover\:bg-slate-50:hover,
html.dark .hover\:bg-slate-100:hover,
html.dark .hover\:bg-white:hover{background-color:#233047!important;color:var(--text)!important;}

/* Dark status surfaces keep semantic colors readable */
html[data-theme="dark"] .bg-red-50,
html[data-theme="dark"] .bg-red-50\/70,
html[data-theme="dark"] .bg-red-100,
html.dark .bg-red-50,
html.dark .bg-red-50\/70,
html.dark .bg-red-100{background-color:rgba(127,29,29,.30)!important;border-color:rgba(251,113,133,.30)!important;}
html[data-theme="dark"] .text-red-500,
html[data-theme="dark"] .text-red-600,
html[data-theme="dark"] .text-red-700,
html[data-theme="dark"] .text-red-800,
html.dark .text-red-500,
html.dark .text-red-600,
html.dark .text-red-700,
html.dark .text-red-800{color:#fca5a5!important;}
html[data-theme="dark"] .bg-emerald-50,
html[data-theme="dark"] .bg-emerald-100,
html[data-theme="dark"] .bg-teal-50,
html.dark .bg-emerald-50,
html.dark .bg-emerald-100,
html.dark .bg-teal-50{background-color:rgba(6,78,59,.38)!important;border-color:rgba(52,211,153,.30)!important;}
html[data-theme="dark"] .text-emerald-600,
html[data-theme="dark"] .text-emerald-700,
html[data-theme="dark"] .text-emerald-800,
html[data-theme="dark"] .text-teal-600,
html[data-theme="dark"] .text-teal-700,
html[data-theme="dark"] .text-teal-800,
html.dark .text-emerald-600,
html.dark .text-emerald-700,
html.dark .text-emerald-800,
html.dark .text-teal-600,
html.dark .text-teal-700,
html.dark .text-teal-800{color:#5eead4!important;}
html[data-theme="dark"] .bg-amber-50,
html[data-theme="dark"] .bg-amber-100,
html[data-theme="dark"] .bg-yellow-50,
html.dark .bg-amber-50,
html.dark .bg-amber-100,
html.dark .bg-yellow-50{background-color:rgba(120,53,15,.34)!important;border-color:rgba(251,191,36,.30)!important;}
html[data-theme="dark"] .text-amber-500,
html[data-theme="dark"] .text-amber-600,
html[data-theme="dark"] .text-amber-700,
html[data-theme="dark"] .text-amber-800,
html[data-theme="dark"] .text-amber-950,
html.dark .text-amber-500,
html.dark .text-amber-600,
html.dark .text-amber-700,
html.dark .text-amber-800,
html.dark .text-amber-950{color:#fcd34d!important;}
html[data-theme="dark"] .bg-blue-50,
html[data-theme="dark"] .bg-blue-100,
html[data-theme="dark"] .bg-sky-50,
html[data-theme="dark"] .bg-sky-100,
html[data-theme="dark"] .bg-indigo-50,
html[data-theme="dark"] .bg-indigo-100,
html[data-theme="dark"] .bg-purple-50,
html[data-theme="dark"] .bg-purple-100,
html.dark .bg-blue-50,
html.dark .bg-blue-100,
html.dark .bg-sky-50,
html.dark .bg-sky-100,
html.dark .bg-indigo-50,
html.dark .bg-indigo-100,
html.dark .bg-purple-50,
html.dark .bg-purple-100{background-color:rgba(30,41,59,.68)!important;border-color:rgba(96,165,250,.26)!important;}
html[data-theme="dark"] .text-blue-600,
html[data-theme="dark"] .text-blue-700,
html[data-theme="dark"] .text-sky-600,
html[data-theme="dark"] .text-sky-700,
html[data-theme="dark"] .text-indigo-600,
html[data-theme="dark"] .text-indigo-700,
html[data-theme="dark"] .text-indigo-800,
html[data-theme="dark"] .text-purple-800,
html.dark .text-blue-600,
html.dark .text-blue-700,
html.dark .text-sky-600,
html.dark .text-sky-700,
html.dark .text-indigo-600,
html.dark .text-indigo-700,
html.dark .text-indigo-800,
html.dark .text-purple-800{color:#93c5fd!important;}
html[data-theme="dark"] .bg-rose-100,
html.dark .bg-rose-100{background-color:rgba(136,19,55,.30)!important;border-color:rgba(251,113,133,.28)!important;}
html[data-theme="dark"] .text-rose-700,
html.dark .text-rose-700{color:#fda4af!important;}


        /* === SCROLLBAR DESIGN === */
        ::-webkit-scrollbar{width:5px;height:5px;}
        ::-webkit-scrollbar-track{background:transparent;}
        ::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:8px;}
        *{scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent;}

        .scroll-box{direction:ltr;overflow-y:auto;-webkit-overflow-scrolling:touch;}
        .scroll-box>*{direction:rtl;}
        .line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
        .break-anywhere{overflow-wrap:anywhere;word-break:break-word;}

        /* === HOME POLISH === */
        .home-shell{position:relative;}
        .home-panel{
            background:linear-gradient(135deg,rgba(15,76,58,.10),rgba(255,255,255,.94) 44%,rgba(245,158,11,.12));
            border:1px solid rgba(15,76,58,.12);
            box-shadow:0 18px 42px rgba(15,23,42,.08);
        }
        .home-card{min-height:132px;isolation:isolate;overflow:hidden;}
        .home-card::after{content:"";position:absolute;inset:auto -24px -34px auto;width:88px;height:88px;border-radius:999px;background:currentColor;opacity:.055;z-index:-1;}
        .home-card:hover{transform:translateY(-2px);}
        .home-icon{box-shadow:inset 0 0 0 1px rgba(255,255,255,.65);}

        /* === IMAGE PREVIEW === */
        .zoomed-image{max-width:min(96vw,1100px);max-height:86vh;object-fit:contain;}

        @media (max-width:640px){
            .home-shell{max-width:100%!important;}
            .home-panel{padding:1rem!important;border-radius:1.25rem!important;}
            .home-grid{gap:.65rem!important;}
            .home-card{min-height:118px;padding:.8rem!important;gap:.55rem!important;flex-direction:column;align-items:flex-start;}
            .home-icon{width:2.6rem!important;height:2.6rem!important;border-radius:.9rem!important;}
            .home-title{font-size:.82rem!important;line-height:1.35!important;}
            .home-desc{font-size:.68rem!important;line-height:1.35!important;}
            .home-arrow{display:none!important;}
        }

        /* === WHITE UI SAFETY PATCH + QURAN READER === */
        @font-face{font-family:'KFGQPCHafs';src:local('KFGQPC Uthmanic Script HAFS'),local('KFGQPCHafs');font-display:swap;}
        @font-face{font-family:'UthmanicHafs';src:local('KFGQPC Uthmanic Script HAFS'),local('Uthmanic Hafs'),local('Amiri Quran');font-display:swap;}
        .quran-reader-text{font-family:'KFGQPCHafs','UthmanicHafs','Traditional Arabic',serif;font-weight:400;line-height:2.05;word-spacing:.025em;text-rendering:optimizeLegibility;font-feature-settings:'liga' 1,'calt' 1;unicode-bidi:plaintext;}
        .quran-ayah-num{font-family:'KFGQPCHafs','Traditional Arabic',serif;display:inline-flex;align-items:center;justify-content:center;min-width:2.22em;height:2.22em;margin-inline:.22em;border-radius:999px;border:1.5px solid rgba(107,85,46,.45);font-size:.62em;color:#5b4630;background:radial-gradient(circle,#fffdf2 40%,#eadfc7 100%);vertical-align:middle;font-weight:400;line-height:1;box-shadow:0 1px 2px rgba(0,0,0,.08), inset 0 0 0 2px rgba(255,255,255,.52);}
        .quran-fullscreen-overlay{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;z-index:2147483000!important;transform:none!important;contain:none!important;isolation:isolate;background:#fbf7ee!important;color:#2b2117!important;overflow:hidden!important;}
        .quran-reader-mobile-shell{height:100%;width:100%;display:flex;flex-direction:column;background:#fbf7ee;}
        .quran-reader-topbar{height:54px;min-height:54px;display:grid;grid-template-columns:46px 1fr 46px;align-items:center;gap:5px;padding:5px 7px;background:#fbf7ee;position:relative;z-index:5;direction:ltr;}
        .quran-reader-toolbar-center{height:42px;display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;position:relative;}
        .quran-reader-ornament{height:16px;flex:1;min-width:16px;opacity:.75;background:linear-gradient(90deg,transparent,#b99a71 18%,#d8c29e 50%,#b99a71 82%,transparent);-webkit-mask:radial-gradient(circle at center,#000 2px,transparent 2.6px) 0 0/8px 8px,linear-gradient(#000 0 0);mask:radial-gradient(circle at center,#000 2px,transparent 2.6px) 0 0/8px 8px,linear-gradient(#000 0 0);}
        .quran-top-pill{height:30px;min-width:104px;max-width:40vw;display:flex;align-items:center;justify-content:center;padding:0 12px;border-radius:11px;background:#fffdf8;border:1.5px solid #d2b58a;box-shadow:0 1px 2px rgba(104,70,28,.08),inset 0 0 0 1px rgba(255,255,255,.9);font-weight:900;color:#2c261f;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:rtl;}
        .quran-circle-btn{width:40px;height:40px;border-radius:13px;background:#f2e8d9;border:1px solid #dfc8a7;color:#2b2117;display:flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 3px 10px rgba(64,43,20,.14),inset 0 0 0 1px rgba(255,255,255,.65);}
        .quran-circle-btn:active{transform:scale(.96);}
        .quran-page-card{position:relative;background:transparent!important;border:0!important;box-shadow:none!important;color:#1c1a17;padding:0!important;height:100%;}
        .quran-page-card::before,.quran-page-card::after{display:none!important;content:none!important;}
        .quran-page-slide{height:100%;display:flex;flex-direction:column;justify-content:flex-start;position:relative;z-index:1;}
        .mushaf-image-shell{height:calc(100svh - 44px);height:calc(100dvh - 44px);width:100vw;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:pan-y;background:#fbf7ee;padding:0 0 max(4px,env(safe-area-inset-bottom)) 0;}
        .mushaf-page-img{height:calc(100svh - 48px - env(safe-area-inset-bottom));height:calc(100dvh - 48px - env(safe-area-inset-bottom));width:auto;min-width:100vw;max-width:none;max-height:100%;object-fit:contain;object-position:center center;background:#fbf7ee;box-shadow:none;border-radius:0;user-select:none;-webkit-user-drag:none;display:block;transform:none!important;transform-origin:center center;}
        .quran-swipe-area{cursor:grab;touch-action:pan-y;}
        .quran-swipe-area:active{cursor:grabbing;}
        @media(max-width:430px){.quran-reader-topbar{height:42px;min-height:42px;grid-template-columns:36px 1fr 36px;padding:3px 4px}.quran-circle-btn{width:32px;height:32px;border-radius:10px;font-size:14px}.quran-top-pill{min-width:62px;max-width:36vw;height:22px;padding:0 6px;font-size:8.5px;border-radius:8px}.quran-reader-toolbar-center{gap:3px;height:32px}.quran-reader-ornament{min-width:5px;height:12px}.mushaf-image-shell{height:calc(100svh - 42px);height:calc(100dvh - 42px);padding-bottom:max(4px,env(safe-area-inset-bottom));}.mushaf-page-img{height:calc(100svh - 46px - env(safe-area-inset-bottom));height:calc(100dvh - 46px - env(safe-area-inset-bottom));width:auto;min-width:100vw;max-width:none;max-height:100%;transform:none!important;object-fit:contain;}}
        @media(orientation:portrait) and (min-width:431px){.quran-reader-topbar{height:44px;min-height:44px}.mushaf-image-shell{height:calc(100svh - 44px);height:calc(100dvh - 44px);}.mushaf-page-img{height:calc(100svh - 48px - env(safe-area-inset-bottom));height:calc(100dvh - 48px - env(safe-area-inset-bottom));width:auto;min-width:0;max-width:calc(100vw - 6px);max-height:100%;object-fit:contain;}}
        @media(orientation:landscape){.quran-reader-topbar{height:38px;min-height:38px}.quran-circle-btn{width:32px;height:32px}.quran-top-pill{height:24px;font-size:10px}.mushaf-image-shell{height:calc(100svh - 38px);height:calc(100dvh - 38px);}.mushaf-page-img{height:calc(100svh - 42px - env(safe-area-inset-bottom));height:calc(100dvh - 42px - env(safe-area-inset-bottom));width:auto;min-width:0;max-width:calc(100vw - 8px);max-height:100%;object-fit:contain;}}

        .leaderboard-tab-scroll{overflow:visible!important;}
        .leaderboard-tabs-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;width:100%;max-width:760px;margin-inline:auto;}
        .leaderboard-tab-btn{min-width:0!important;border-radius:1rem;padding:.75rem .35rem;font-size:.72rem;line-height:1.25;font-weight:900;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.28rem;min-height:4.25rem;}
        .leaderboard-tab-btn i{font-size:1rem;}
        .mushaf-page-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.75rem;margin:0 auto .75rem;max-width:780px;color:#6b4f34;font-weight:900;font-size:.78rem;}
        .mushaf-page-header span{background:#fbf5e7;border:1px solid #b79a70;border-radius:999px;padding:.18rem .75rem;box-shadow:inset 0 0 0 1px rgba(255,255,255,.65);white-space:nowrap;}
        .mushaf-page-header .mushaf-center{font-size:.92rem;color:#1f5f4f;border-width:2px;}

        .course-card{position:relative;overflow:hidden;border-radius:1.15rem;padding:1rem;border:1px solid rgba(148,163,184,.22);background:linear-gradient(135deg,#ffffff,#f8fafc);transition:.18s ease;min-height:118px;}
        .course-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(15,23,42,.10);}
        .course-card::after{content:"";position:absolute;inset:auto -24px -30px auto;width:90px;height:90px;border-radius:999px;background:currentColor;opacity:.055;}
        .audio-reciter-card{border:1px solid rgba(148,163,184,.22);border-radius:1rem;padding:.8rem;background:#fff;transition:.16s ease;}
        .audio-reciter-card.active{border-color:#0d9488;background:#f0fdfa;box-shadow:0 10px 22px rgba(13,148,136,.16);}
        .waqar-book-viewer{height:min(76vh,780px);border-radius:1.25rem;overflow:hidden;border:1px solid rgba(148,163,184,.32);background:#f8fafc;box-shadow:0 16px 36px rgba(15,23,42,.10);display:flex;flex-direction:column;position:relative;isolation:isolate;}
        .waqar-book-viewer.book-soft-fullscreen,.waqar-book-viewer:fullscreen{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;z-index:2147483200!important;border-radius:0!important;border:0!important;background:#05070b!important;padding:0!important;box-shadow:none!important;}
        .waqar-pdf-toolbar{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem;background:rgba(255,255,255,.94);border-bottom:1px solid rgba(148,163,184,.25);}
        .book-soft-fullscreen .waqar-pdf-toolbar,.waqar-book-viewer:fullscreen .waqar-pdf-toolbar{position:absolute;top:max(8px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));z-index:6;border:1px solid rgba(148,163,184,.35);border-radius:1rem;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);box-shadow:0 8px 22px rgba(15,23,42,.18);}
        .waqar-pdf-title{min-width:0;font-size:.78rem;font-weight:900;color:#0f4c3a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
        .waqar-pdf-btn{height:32px;min-width:32px;border-radius:.7rem;border:1px solid rgba(148,163,184,.35);background:#fff;color:#334155;font-size:.75rem;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:.3rem;padding:0 .55rem;box-shadow:0 2px 8px rgba(15,23,42,.06);}
        .waqar-pdf-btn:disabled{opacity:.42;cursor:not-allowed;}
        .waqar-pdf-stage{flex:1;min-height:0;overflow:auto;background:linear-gradient(135deg,#e2e8f0,#f8fafc);display:flex;align-items:center;justify-content:center;padding:.65rem;-webkit-overflow-scrolling:touch;}
        .book-soft-fullscreen .waqar-pdf-stage,.waqar-book-viewer:fullscreen .waqar-pdf-stage{position:absolute;inset:0!important;width:100%!important;height:100%!important;padding:max(50px,calc(env(safe-area-inset-top) + 48px)) max(54px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(54px,env(safe-area-inset-left))!important;background:#05070b!important;overflow:hidden!important;}
        .waqar-pdf-canvas{display:block;background:#fff;border-radius:.35rem;box-shadow:0 14px 34px rgba(15,23,42,.22);max-width:none;max-height:none;}
        .book-soft-fullscreen .waqar-pdf-canvas,.waqar-book-viewer:fullscreen .waqar-pdf-canvas{border-radius:.2rem;box-shadow:0 0 0 1px rgba(255,255,255,.10),0 26px 70px rgba(0,0,0,.55);}
        .waqar-pdf-state{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1rem;color:#64748b;font-weight:800;}
        .book-soft-fullscreen .waqar-pdf-controls,.waqar-book-viewer:fullscreen .waqar-pdf-controls{display:none!important;}
        .waqar-pdf-side-nav{display:none;position:absolute;top:50%;transform:translateY(-50%);z-index:8;width:48px;height:74px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(15,23,42,.58);color:#fff;font-size:1.35rem;align-items:center;justify-content:center;backdrop-filter:blur(12px);box-shadow:0 12px 28px rgba(0,0,0,.34);}
        .waqar-pdf-side-nav:disabled{opacity:.25;}
        .waqar-pdf-side-nav.right{right:max(8px,env(safe-area-inset-right));}
        .waqar-pdf-side-nav.left{left:max(8px,env(safe-area-inset-left));}
        .book-soft-fullscreen .waqar-pdf-side-nav,.waqar-book-viewer:fullscreen .waqar-pdf-side-nav{display:flex;}
        @media(max-width:640px){.waqar-book-viewer{height:74vh;border-radius:1rem;}.waqar-pdf-toolbar{padding:.4rem}.waqar-pdf-btn{height:30px;min-width:30px;font-size:.68rem;padding:0 .45rem}.waqar-pdf-title{font-size:.7rem}.waqar-pdf-stage{padding:.35rem;align-items:center;}.book-soft-fullscreen .waqar-pdf-stage,.waqar-book-viewer:fullscreen .waqar-pdf-stage{padding:max(44px,calc(env(safe-area-inset-top) + 42px)) max(38px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(38px,env(safe-area-inset-left))!important}.waqar-pdf-side-nav{width:34px;height:56px;font-size:1rem}.book-soft-fullscreen .waqar-pdf-toolbar,.waqar-book-viewer:fullscreen .waqar-pdf-toolbar{top:max(4px,env(safe-area-inset-top));left:max(4px,env(safe-area-inset-left));right:max(4px,env(safe-area-inset-right));}}
        @media(max-width:640px){.quran-reader-text{line-height:1.92}.quran-page-card{border-radius:0!important}.quran-ayah-num{font-size:.64em}.mushaf-page-img{object-fit:contain;transform:none!important;}.leaderboard-tabs-grid{gap:.32rem;max-width:100%;}.leaderboard-tab-btn{border-radius:.78rem;padding:.52rem .12rem;font-size:.54rem;min-height:3.55rem;letter-spacing:-.02em;}.leaderboard-tab-btn i{font-size:.8rem;}}

        /* === MODALS === */
        .modal-body{direction:ltr;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
        .modal-body>*{direction:rtl;}

        /* === UI === */
        .rounded-3xl{border-radius:1.5rem!important;}.rounded-2xl{border-radius:1rem!important;}
        *{-webkit-tap-highlight-color:transparent;}
        button{cursor:pointer;}
        button:active{opacity:.8;}
        .animate-in{animation:fadeIn .15s ease-out both;}
        
        .modal-overlay {
            position: fixed !important;
            inset: 0 !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 16px !important;
            z-index: 999999 !important;
            overflow: hidden !important;
            transform: none !important;
            perspective: none !important;
            filter: none !important;
            contain: layout style paint !important;
            isolation: isolate !important;
            overscroll-behavior: contain !important;
        }

        .modal-body {
            overflow-y: auto !important;
            overflow-x: hidden !important;
            -webkit-overflow-scrolling: touch;
            direction: ltr;
        }

        .modal-body > * {
            direction: rtl;
        }
        
        @keyframes fadeIn{from{opacity:0;transform:translateY(5px);}to{opacity:1;transform:none;}}

        /* === RESPONSIVE === */
        @media(max-width:639px){
            .grid.md\:grid-cols-2,.grid.md\:grid-cols-3{grid-template-columns:1fr!important;}
            .grid.md\:grid-cols-4,.grid.md\:grid-cols-5{grid-template-columns:repeat(2,1fr)!important;}
            table{min-width:460px;font-size:12px;}
            th,td{padding:6px 4px!important;}
            input,select,textarea{font-size:16px!important;}
            .max-w-2xl{max-width:100%!important;}
        }
        @media(min-width:640px)and(max-width:1023px){
            .grid.md\:grid-cols-3{grid-template-columns:repeat(2,1fr)!important;}
            .grid.md\:grid-cols-4{grid-template-columns:repeat(2,1fr)!important;}
        }

/* === V40: mobile student page + barcode cleanup === */
.waqar-qr-reader video{width:100%!important;max-height:62vh!important;object-fit:cover!important;border-radius:1rem!important;}
.student-page,.student-page *{box-sizing:border-box;}
.student-page{max-width:100%;overflow-x:hidden;}
.student-page .scroll-box{overflow-x:hidden;}
.student-page img{max-width:100%;}
@media(max-width:640px){
    body{overflow-x:hidden;}
    #root{max-width:100vw;overflow-x:hidden;}
    .student-page{padding-inline:0!important;width:100%!important;}
    .student-header{align-items:stretch!important;border-bottom:3px solid #0d9488;padding-bottom:.65rem;}
    .student-header h2{font-size:1.05rem!important;text-align:center;order:2;}
    .student-header button{order:1;width:max-content;align-self:flex-start;}
    .student-grid{display:block!important;width:100%!important;max-width:100%!important;}
    .student-grid>*{width:100%!important;max-width:100%!important;margin-bottom:1rem!important;}
    .student-page .bg-white,.student-page .bg-amber-50,.student-page .bg-indigo-50,.student-page .bg-purple-50{border-radius:1rem!important;}
    .student-page .flex.justify-between{gap:.5rem;}
    .student-page .flex.justify-between:not(.student-header){flex-wrap:wrap;}
    .student-page .grid{min-width:0!important;}
    .student-page .truncate{max-width:100%;}
    .student-page .rounded-3xl{border-radius:1rem!important;}
    .student-page .p-5{padding:1rem!important;}
    .student-page .p-4{padding:.9rem!important;}
    .student-page h3{line-height:1.45;}
}


/* =====================================================================
   V4 COLOR IDENTITY SYSTEM — FULL ACCENT DESIGN TOKENS
   This layer intentionally comes last to convert the old green-only UI
   into a token-driven identity system for Light + Dark themes.
   ===================================================================== */
:root{
    --primary-active:#0b3d2f;
    --primary-softer:#f4fbf8;
    --primary-muted:#5c8a79;
    --primary-border:rgba(15,76,58,.18);
    --primary-ring:rgba(15,76,58,.24);
    --primary-shadow:0 14px 32px rgba(15,76,58,.16);
    --primary-gradient-start:#0f4c3a;
    --primary-gradient-end:#0d9488;
    --accent-border:rgba(13,148,136,.22);
    --link:var(--primary);
    --link-hover:var(--primary-hover);
    --selection-bg:rgba(15,76,58,.20);
    --selection-text:#052e24;
    --badge-bg:var(--primary-soft);
    --badge-text:var(--primary);
    --badge-border:var(--primary-border);
    --nav-active-bg:rgba(var(--primary-rgb),.12);
    --nav-hover-bg:rgba(var(--primary-rgb),.08);
    --tab-active-bg:var(--primary-soft);
    --table-head-bg:linear-gradient(180deg,var(--primary-softer),var(--surface));
    --table-row-hover:rgba(var(--primary-rgb),.055);
    --table-row-selected:rgba(var(--primary-rgb),.095);
    --control-hover:rgba(var(--primary-rgb),.10);
    --surface-accent:linear-gradient(135deg,var(--surface),var(--primary-softer));
    --decor-glow:rgba(var(--primary-rgb),.10);
    --primary-contrast:#ffffff;
}
html[data-theme="dark"],html.dark{
    --primary-active:var(--primary-hover);
    --primary-softer:rgba(var(--primary-rgb),.075);
    --primary-muted:rgba(var(--primary-rgb),.74);
    --primary-border:rgba(var(--primary-rgb),.28);
    --primary-ring:rgba(var(--primary-rgb),.30);
    --primary-shadow:0 18px 42px rgba(var(--primary-rgb),.16);
    --accent-border:rgba(var(--accent-rgb),.24);
    --link:var(--primary);
    --link-hover:#ffffff;
    --selection-bg:rgba(var(--primary-rgb),.34);
    --selection-text:#ffffff;
    --badge-bg:rgba(var(--primary-rgb),.13);
    --badge-text:var(--primary);
    --badge-border:rgba(var(--primary-rgb),.28);
    --nav-active-bg:rgba(var(--primary-rgb),.18);
    --nav-hover-bg:rgba(var(--primary-rgb),.11);
    --tab-active-bg:rgba(var(--primary-rgb),.14);
    --table-head-bg:linear-gradient(180deg,rgba(var(--primary-rgb),.13),rgba(15,23,42,.72));
    --table-row-hover:rgba(var(--primary-rgb),.085);
    --table-row-selected:rgba(var(--primary-rgb),.14);
    --control-hover:rgba(var(--primary-rgb),.15);
    --surface-accent:linear-gradient(135deg,var(--surface),rgba(var(--primary-rgb),.08));
    --decor-glow:rgba(var(--primary-rgb),.16);
    --primary-contrast:#07111f;
}

/* Light accent palettes */
html[data-theme="light"][data-accent="green"],html:not([data-theme="dark"])[data-accent="green"]{
    --primary:#0f4c3a;--primary-hover:#16654a;--primary-active:#0b3d2f;--primary-soft:#eaf4ef;--primary-softer:#f5fbf8;--primary-muted:#5b8376;--primary-border:rgba(15,76,58,.18);--primary-ring:rgba(15,76,58,.24);--primary-shadow:0 14px 32px rgba(15,76,58,.16);--primary-gradient-start:#0f4c3a;--primary-gradient-end:#0d9488;--primary-rgb:15,76,58;--accent:#0d9488;--accent-soft:#ccfbf1;--accent-border:rgba(13,148,136,.22);--accent-rgb:13,148,136;--link:#0f4c3a;--link-hover:#16654a;--selection-bg:rgba(15,76,58,.20);--selection-text:#052e24;--header-gradient:linear-gradient(135deg,#0f4c3a 0%,#16654a 58%,#0d9488 100%);
}
html[data-theme="light"][data-accent="blue"]{
    --primary:#2563eb;--primary-hover:#1d4ed8;--primary-active:#1e40af;--primary-soft:#dbeafe;--primary-softer:#eff6ff;--primary-muted:#5d7fbf;--primary-border:rgba(37,99,235,.20);--primary-ring:rgba(37,99,235,.25);--primary-shadow:0 14px 32px rgba(37,99,235,.16);--primary-gradient-start:#1e40af;--primary-gradient-end:#0ea5e9;--primary-rgb:37,99,235;--accent:#0ea5e9;--accent-soft:#e0f2fe;--accent-border:rgba(14,165,233,.23);--accent-rgb:14,165,233;--link:#1d4ed8;--link-hover:#1e40af;--selection-bg:rgba(37,99,235,.20);--selection-text:#0b1e49;--header-gradient:linear-gradient(135deg,#1e3a8a 0%,#2563eb 58%,#0ea5e9 100%);
}
html[data-theme="light"][data-accent="purple"]{
    --primary:#7c3aed;--primary-hover:#6d28d9;--primary-active:#5b21b6;--primary-soft:#ede9fe;--primary-softer:#f5f3ff;--primary-muted:#8467b5;--primary-border:rgba(124,58,237,.20);--primary-ring:rgba(124,58,237,.25);--primary-shadow:0 14px 32px rgba(124,58,237,.16);--primary-gradient-start:#5b21b6;--primary-gradient-end:#a855f7;--primary-rgb:124,58,237;--accent:#a855f7;--accent-soft:#f3e8ff;--accent-border:rgba(168,85,247,.23);--accent-rgb:168,85,247;--link:#6d28d9;--link-hover:#5b21b6;--selection-bg:rgba(124,58,237,.20);--selection-text:#2e1065;--header-gradient:linear-gradient(135deg,#4c1d95 0%,#7c3aed 58%,#a855f7 100%);
}
html[data-theme="light"][data-accent="gold"]{
    --primary:#b45309;--primary-hover:#92400e;--primary-active:#78350f;--primary-soft:#fef3c7;--primary-softer:#fffbeb;--primary-muted:#9a7352;--primary-border:rgba(180,83,9,.22);--primary-ring:rgba(180,83,9,.26);--primary-shadow:0 14px 32px rgba(180,83,9,.17);--primary-gradient-start:#92400e;--primary-gradient-end:#f59e0b;--primary-rgb:180,83,9;--accent:#d97706;--accent-soft:#ffedd5;--accent-border:rgba(217,119,6,.24);--accent-rgb:217,119,6;--link:#a16207;--link-hover:#78350f;--selection-bg:rgba(180,83,9,.22);--selection-text:#3b2207;--header-gradient:linear-gradient(135deg,#7c2d12 0%,#b45309 56%,#d97706 100%);
}
html[data-theme="light"][data-accent="rose"]{
    --primary:#be123c;--primary-hover:#9f1239;--primary-active:#881337;--primary-soft:#ffe4e6;--primary-softer:#fff1f2;--primary-muted:#aa6273;--primary-border:rgba(190,18,60,.20);--primary-ring:rgba(190,18,60,.25);--primary-shadow:0 14px 32px rgba(190,18,60,.16);--primary-gradient-start:#9f1239;--primary-gradient-end:#db2777;--primary-rgb:190,18,60;--accent:#db2777;--accent-soft:#fce7f3;--accent-border:rgba(219,39,119,.23);--accent-rgb:219,39,119;--link:#be123c;--link-hover:#881337;--selection-bg:rgba(190,18,60,.19);--selection-text:#4c0519;--header-gradient:linear-gradient(135deg,#881337 0%,#be123c 56%,#db2777 100%);
}

/* Dark accent palettes */
html[data-theme="dark"][data-accent="green"],html.dark[data-accent="green"]{
    --primary:#34d399;--primary-hover:#6ee7b7;--primary-active:#10b981;--primary-soft:rgba(52,211,153,.14);--primary-softer:rgba(52,211,153,.075);--primary-muted:rgba(110,231,183,.72);--primary-border:rgba(52,211,153,.30);--primary-ring:rgba(52,211,153,.30);--primary-shadow:0 18px 42px rgba(52,211,153,.16);--primary-gradient-start:#065f46;--primary-gradient-end:#2dd4bf;--primary-rgb:52,211,153;--accent:#2dd4bf;--accent-soft:rgba(45,212,191,.16);--accent-border:rgba(45,212,191,.26);--accent-rgb:45,212,191;--link:#6ee7b7;--link-hover:#ffffff;--selection-bg:rgba(52,211,153,.34);--selection-text:#ffffff;--header-gradient:linear-gradient(135deg,#020617 0%,#0f172a 38%,#064e3b 100%);
}
html[data-theme="dark"][data-accent="blue"],html.dark[data-accent="blue"]{
    --primary:#60a5fa;--primary-hover:#93c5fd;--primary-active:#3b82f6;--primary-soft:rgba(96,165,250,.16);--primary-softer:rgba(96,165,250,.08);--primary-muted:rgba(147,197,253,.72);--primary-border:rgba(96,165,250,.30);--primary-ring:rgba(96,165,250,.31);--primary-shadow:0 18px 42px rgba(96,165,250,.16);--primary-gradient-start:#1d4ed8;--primary-gradient-end:#38bdf8;--primary-rgb:96,165,250;--accent:#38bdf8;--accent-soft:rgba(56,189,248,.16);--accent-border:rgba(56,189,248,.26);--accent-rgb:56,189,248;--link:#93c5fd;--link-hover:#ffffff;--selection-bg:rgba(96,165,250,.34);--selection-text:#ffffff;--header-gradient:linear-gradient(135deg,#020617 0%,#0f172a 40%,#1d4ed8 100%);
}
html[data-theme="dark"][data-accent="purple"],html.dark[data-accent="purple"]{
    --primary:#c084fc;--primary-hover:#d8b4fe;--primary-active:#a855f7;--primary-soft:rgba(192,132,252,.16);--primary-softer:rgba(192,132,252,.08);--primary-muted:rgba(216,180,254,.72);--primary-border:rgba(192,132,252,.30);--primary-ring:rgba(192,132,252,.32);--primary-shadow:0 18px 42px rgba(192,132,252,.16);--primary-gradient-start:#7e22ce;--primary-gradient-end:#e879f9;--primary-rgb:192,132,252;--accent:#e879f9;--accent-soft:rgba(232,121,249,.15);--accent-border:rgba(232,121,249,.25);--accent-rgb:232,121,249;--link:#d8b4fe;--link-hover:#ffffff;--selection-bg:rgba(192,132,252,.35);--selection-text:#ffffff;--header-gradient:linear-gradient(135deg,#020617 0%,#1e1b4b 42%,#7e22ce 100%);
}
html[data-theme="dark"][data-accent="gold"],html.dark[data-accent="gold"]{
    --primary:#fbbf24;--primary-hover:#fde68a;--primary-active:#f59e0b;--primary-soft:rgba(251,191,36,.16);--primary-softer:rgba(251,191,36,.08);--primary-muted:rgba(253,230,138,.74);--primary-border:rgba(251,191,36,.31);--primary-ring:rgba(251,191,36,.32);--primary-shadow:0 18px 42px rgba(251,191,36,.15);--primary-gradient-start:#92400e;--primary-gradient-end:#f97316;--primary-rgb:251,191,36;--accent:#f97316;--accent-soft:rgba(249,115,22,.16);--accent-border:rgba(249,115,22,.25);--accent-rgb:249,115,22;--link:#fde68a;--link-hover:#ffffff;--selection-bg:rgba(251,191,36,.34);--selection-text:#ffffff;--header-gradient:linear-gradient(135deg,#020617 0%,#1c1917 42%,#92400e 100%);
}
html[data-theme="dark"][data-accent="rose"],html.dark[data-accent="rose"]{
    --primary:#fb7185;--primary-hover:#fda4af;--primary-active:#f43f5e;--primary-soft:rgba(251,113,133,.16);--primary-softer:rgba(251,113,133,.08);--primary-muted:rgba(253,164,175,.74);--primary-border:rgba(251,113,133,.30);--primary-ring:rgba(251,113,133,.32);--primary-shadow:0 18px 42px rgba(251,113,133,.16);--primary-gradient-start:#be123c;--primary-gradient-end:#f472b6;--primary-rgb:251,113,133;--accent:#f472b6;--accent-soft:rgba(244,114,182,.15);--accent-border:rgba(244,114,182,.25);--accent-rgb:244,114,182;--link:#fda4af;--link-hover:#ffffff;--selection-bg:rgba(251,113,133,.34);--selection-text:#ffffff;--header-gradient:linear-gradient(135deg,#020617 0%,#1f1723 42%,#be123c 100%);
}

/* Green legacy restore: keep the default green identity exactly on the stable base style.
   The enhanced V4 identity layer below is intentionally scoped to the other
   four accents only: blue, purple, gold, and rose. */
html[data-theme="light"][data-accent="green"],html:not([data-theme="dark"])[data-accent="green"]{
    --primary:#0f4c3a;--primary-hover:#16654a;--primary-soft:#eaf4ef;--primary-rgb:15,76,58;
    --accent:#0d9488;--accent-soft:#ccfbf1;--accent-rgb:13,148,136;--focus-ring:rgba(15,76,58,.22);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#0f4c3a 0%,#16654a 58%,#0d9488 100%);
}
html[data-theme="dark"][data-accent="green"],html.dark[data-accent="green"]{
    --primary:#34d399;--primary-hover:#10b981;--primary-soft:rgba(52,211,153,.14);--primary-rgb:52,211,153;
    --accent:#2dd4bf;--accent-soft:rgba(45,212,191,.16);--accent-rgb:45,212,191;--focus-ring:rgba(52,211,153,.24);--ring:var(--focus-ring);
    --header-gradient:linear-gradient(135deg,#020617 0%,#0f172a 40%,#064e3b 100%);
}

/* Token aliases for enhanced non-green accent identities */
html[data-accent="blue"],html[data-accent="purple"],html[data-accent="gold"],html[data-accent="rose"]{
    --waqar-primary:var(--primary);--waqar-primary-2:var(--primary-hover);--focus-ring:var(--primary-ring);--ring:var(--primary-ring);
}
html[data-accent]:not([data-accent="green"]),
html[data-accent]:not([data-accent="green"]) body,
html[data-accent]:not([data-accent="green"]) #root,
html[data-accent]:not([data-accent="green"]) .main-inner{transition:background-color .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease;}
html[data-accent]:not([data-accent="green"]) ::selection{background:var(--selection-bg)!important;color:var(--selection-text)!important;}
html[data-accent]:not([data-accent="green"]) a{color:var(--link);}html[data-accent]:not([data-accent="green"]) a:hover{color:var(--link-hover);} 
html[data-accent]:not([data-accent="green"]) :focus-visible{outline:3px solid var(--primary-ring)!important;outline-offset:2px;}
html[data-accent]:not([data-accent="green"]) input:focus,html[data-accent]:not([data-accent="green"]) select:focus,html[data-accent]:not([data-accent="green"]) textarea:focus{border-color:var(--primary)!important;box-shadow:0 0 0 4px var(--primary-ring)!important;}
html[data-accent]:not([data-accent="green"]) input[type="checkbox"],html[data-accent]:not([data-accent="green"]) input[type="radio"]{accent-color:var(--primary)!important;}

/* Primary identity mapping for Tailwind-heavy markup and old inline green — non-green accents only */
html[data-accent]:not([data-accent="green"]) .bg-teal-600,html[data-accent]:not([data-accent="green"]) .bg-emerald-600,html[data-accent]:not([data-accent="green"]) .bg-green-600,html[data-accent]:not([data-accent="green"]) .bg-cyan-600,html[data-accent]:not([data-accent="green"]) .bg-\[\#0f4c3a\],html[data-accent]:not([data-accent="green"]) .hover\:bg-teal-700:hover,html[data-accent]:not([data-accent="green"]) .hover\:bg-emerald-700:hover,html[data-accent]:not([data-accent="green"]) .hover\:bg-green-700:hover{background:var(--primary)!important;color:var(--primary-contrast)!important;box-shadow:var(--primary-shadow);}
html[data-accent]:not([data-accent="green"]) .bg-teal-700,html[data-accent]:not([data-accent="green"]) .bg-emerald-700,html[data-accent]:not([data-accent="green"]) .hover\:bg-teal-800:hover,html[data-accent]:not([data-accent="green"]) .hover\:bg-emerald-800:hover{background:var(--primary-hover)!important;color:var(--primary-contrast)!important;}
html[data-accent]:not([data-accent="green"]) button.bg-teal-600:hover,html[data-accent]:not([data-accent="green"]) button.bg-emerald-600:hover,html[data-accent]:not([data-accent="green"]) button.bg-\[\#0f4c3a\]:hover,html[data-accent]:not([data-accent="green"]) .waqar-primary-action:hover{background:var(--primary-hover)!important;}
html[data-accent]:not([data-accent="green"]) .text-teal-500,html[data-accent]:not([data-accent="green"]) .text-teal-600,html[data-accent]:not([data-accent="green"]) .text-teal-700,html[data-accent]:not([data-accent="green"]) .text-teal-800,html[data-accent]:not([data-accent="green"]) .text-emerald-500,html[data-accent]:not([data-accent="green"]) .text-emerald-600,html[data-accent]:not([data-accent="green"]) .text-emerald-700,html[data-accent]:not([data-accent="green"]) .text-emerald-800,html[data-accent]:not([data-accent="green"]) .text-\[\#0f4c3a\]{color:var(--primary)!important;}
html[data-accent]:not([data-accent="green"]) .bg-teal-50,html[data-accent]:not([data-accent="green"]) .bg-teal-100,html[data-accent]:not([data-accent="green"]) .bg-emerald-50,html[data-accent]:not([data-accent="green"]) .bg-emerald-100,html[data-accent]:not([data-accent="green"]) .bg-green-50,html[data-accent]:not([data-accent="green"]) .bg-green-100{background:var(--primary-soft)!important;color:var(--primary)!important;border-color:var(--primary-border)!important;}
html[data-accent]:not([data-accent="green"]) .from-teal-50,html[data-accent]:not([data-accent="green"]) .from-emerald-50{--tw-gradient-from:var(--primary-softer)!important;--tw-gradient-to:rgba(255,255,255,0)!important;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)!important;}
html[data-accent]:not([data-accent="green"]) .to-emerald-50,html[data-accent]:not([data-accent="green"]) .to-teal-50{--tw-gradient-to:var(--primary-soft)!important;}
html[data-accent]:not([data-accent="green"]) .border-teal-100,html[data-accent]:not([data-accent="green"]) .border-teal-200,html[data-accent]:not([data-accent="green"]) .border-teal-300,html[data-accent]:not([data-accent="green"]) .border-teal-500,html[data-accent]:not([data-accent="green"]) .border-teal-600,html[data-accent]:not([data-accent="green"]) .border-emerald-100,html[data-accent]:not([data-accent="green"]) .border-emerald-200,html[data-accent]:not([data-accent="green"]) .border-emerald-600{border-color:var(--primary-border)!important;}
html[data-accent]:not([data-accent="green"]) [style*="#0f4c3a"]{color:var(--primary)!important;}
html[data-accent]:not([data-accent="green"]) [style*="background:#0f4c3a"],html[data-accent]:not([data-accent="green"]) [style*="background: #0f4c3a"]{background:var(--primary)!important;color:var(--primary-contrast)!important;}
html[data-accent]:not([data-accent="green"]) [style*="#0d9488"]{border-color:var(--primary-border)!important;color:var(--primary)!important;}

/* Header, nav, top controls */
html[data-accent]:not([data-accent="green"]) .waqar-main-header{background:var(--header-gradient)!important;box-shadow:0 18px 44px rgba(var(--primary-rgb),.22)!important;}
html[data-accent]:not([data-accent="green"]) .waqar-main-header::after{content:"";position:absolute;inset:auto 8% -32px 8%;height:50px;background:radial-gradient(ellipse at center,rgba(var(--accent-rgb),.26),transparent 66%);pointer-events:none;filter:blur(18px);}
html[data-accent]:not([data-accent="green"]) .waqar-theme-switch,html[data-accent]:not([data-accent="green"]) .waqar-accent-toggle{border-color:rgba(255,255,255,.30)!important;background:rgba(255,255,255,.14)!important;color:#fff!important;box-shadow:0 10px 26px rgba(var(--primary-rgb),.26)!important;}
html[data-accent]:not([data-accent="green"]) .waqar-theme-switch:hover,html[data-accent]:not([data-accent="green"]) .waqar-accent-toggle:hover{background:rgba(255,255,255,.24)!important;box-shadow:0 14px 32px rgba(var(--accent-rgb),.28)!important;}
html[data-accent]:not([data-accent="green"]) .waqar-theme-switch__icon,html[data-accent]:not([data-accent="green"]) .waqar-accent-toggle__dot{background:rgba(255,255,255,.20)!important;}
html[data-accent]:not([data-accent="green"]) .waqar-accent-toggle__dot{background:linear-gradient(135deg,var(--primary),var(--accent))!important;box-shadow:inset 0 0 0 3px rgba(255,255,255,.90),0 0 0 1px rgba(255,255,255,.36),0 0 22px rgba(var(--primary-rgb),.35)!important;}
html[data-accent]:not([data-accent="green"]) .waqar-accent-menu{border-color:var(--primary-border)!important;box-shadow:0 22px 50px rgba(15,23,42,.18),0 0 0 1px rgba(var(--primary-rgb),.06),0 18px 42px rgba(var(--primary-rgb),.12)!important;}
html[data-theme="dark"][data-accent]:not([data-accent="green"]) .waqar-accent-menu,html.dark[data-accent]:not([data-accent="green"]) .waqar-accent-menu{box-shadow:0 24px 60px rgba(0,0,0,.50),0 0 0 1px rgba(var(--primary-rgb),.16),0 18px 42px rgba(var(--primary-rgb),.12)!important;}
html[data-accent]:not([data-accent="green"]) .waqar-accent-option:hover{background:var(--nav-hover-bg)!important;border-color:var(--primary-border)!important;color:var(--primary)!important;}
html[data-accent]:not([data-accent="green"]) .waqar-accent-option.is-active{background:var(--nav-active-bg)!important;border-color:var(--primary-border)!important;color:var(--primary)!important;box-shadow:inset 4px 0 0 var(--primary);}
html[data-accent]:not([data-accent="green"]) .waqar-main-logo{background:linear-gradient(135deg,var(--primary-soft),var(--accent-soft))!important;color:var(--primary)!important;border:1px solid var(--primary-border)!important;box-shadow:0 12px 30px rgba(var(--primary-rgb),.16)!important;}

/* Buttons */
html[data-accent]:not([data-accent="green"]) button,html[data-accent]:not([data-accent="green"]) .btn{transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;}
html[data-accent]:not([data-accent="green"]) button[class*="bg-transparent"],html[data-accent]:not([data-accent="green"]) .btn-ghost{box-shadow:none!important;}
html[data-accent]:not([data-accent="green"]) button:not(:disabled):active,html[data-accent]:not([data-accent="green"]) .btn:not(:disabled):active{transform:translateY(1px) scale(.99);}
html[data-accent]:not([data-accent="green"]) button:disabled,html[data-accent]:not([data-accent="green"]) .btn:disabled{opacity:.55!important;box-shadow:none!important;cursor:not-allowed!important;}
html[data-accent]:not([data-accent="green"]) button[class*="border"].text-teal-600,html[data-accent]:not([data-accent="green"]) button[class*="border"].text-emerald-600{background:var(--primary-softer)!important;border-color:var(--primary-border)!important;color:var(--primary)!important;}

/* Cards and surfaces */
html[data-accent]:not([data-accent="green"]) .card,html[data-accent]:not([data-accent="green"]) .home-card,html[data-accent]:not([data-accent="green"]) .teacher-panel,html[data-accent]:not([data-accent="green"]) .student-action-panel,html[data-accent]:not([data-accent="green"]) .teacher-soft-card,html[data-accent]:not([data-accent="green"]) .course-card,html[data-accent]:not([data-accent="green"]) .audio-reciter-card,html[data-accent]:not([data-accent="green"]) .waqar-book-viewer,html[data-accent]:not([data-accent="green"]) .bg-white,html[data-accent]:not([data-accent="green"]) .bg-slate-50{border-color:var(--border)!important;}
html[data-accent]:not([data-accent="green"]) .card:hover,html[data-accent]:not([data-accent="green"]) .home-card:hover,html[data-accent]:not([data-accent="green"]) .teacher-soft-card:hover,html[data-accent]:not([data-accent="green"]) .course-card:hover,html[data-accent]:not([data-accent="green"]) .audio-reciter-card:hover{border-color:var(--primary-border)!important;box-shadow:0 16px 34px rgba(15,23,42,.09),0 10px 24px rgba(var(--primary-rgb),.08)!important;}
html[data-theme="dark"][data-accent]:not([data-accent="green"]) .card:hover,html[data-theme="dark"][data-accent]:not([data-accent="green"]) .home-card:hover,html[data-theme="dark"][data-accent]:not([data-accent="green"]) .teacher-soft-card:hover,html[data-theme="dark"][data-accent]:not([data-accent="green"]) .course-card:hover,html[data-theme="dark"][data-accent]:not([data-accent="green"]) .audio-reciter-card:hover,html.dark[data-accent]:not([data-accent="green"]) .card:hover,html.dark[data-accent]:not([data-accent="green"]) .home-card:hover,html.dark[data-accent]:not([data-accent="green"]) .teacher-soft-card:hover,html.dark[data-accent]:not([data-accent="green"]) .course-card:hover,html.dark[data-accent]:not([data-accent="green"]) .audio-reciter-card:hover{box-shadow:0 20px 46px rgba(0,0,0,.40),0 12px 26px rgba(var(--primary-rgb),.11)!important;}
html[data-accent]:not([data-accent="green"]) .home-panel{background:linear-gradient(135deg,var(--primary-softer),rgba(255,255,255,.96) 48%,var(--accent-soft))!important;border-color:var(--primary-border)!important;box-shadow:0 20px 44px rgba(15,23,42,.08),0 18px 44px rgba(var(--primary-rgb),.09)!important;}
html[data-theme="dark"][data-accent]:not([data-accent="green"]) .home-panel,html.dark[data-accent]:not([data-accent="green"]) .home-panel{background:linear-gradient(135deg,rgba(var(--primary-rgb),.15),rgba(17,24,39,.94) 44%,rgba(var(--accent-rgb),.12))!important;border-color:var(--primary-border)!important;}
html[data-accent]:not([data-accent="green"]) .home-card::before,html[data-accent]:not([data-accent="green"]) .course-card::before,html[data-accent]:not([data-accent="green"]) .teacher-soft-card::before,html[data-accent]:not([data-accent="green"]) .student-action-panel::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,var(--primary),var(--accent));opacity:.65;border-radius:999px;}
html[data-accent]:not([data-accent="green"]) .home-card,html[data-accent]:not([data-accent="green"]) .course-card,html[data-accent]:not([data-accent="green"]) .teacher-soft-card,html[data-accent]:not([data-accent="green"]) .student-action-panel{position:relative;}
html[data-accent]:not([data-accent="green"]) .home-icon{background:linear-gradient(135deg,var(--primary-soft),var(--accent-soft))!important;color:var(--primary)!important;border:1px solid var(--primary-border)!important;}
html[data-accent]:not([data-accent="green"]) .audio-reciter-card.active{border-color:var(--primary)!important;background:var(--tab-active-bg)!important;box-shadow:var(--primary-shadow)!important;color:var(--primary)!important;}

/* Forms */
html[data-accent]:not([data-accent="green"]) label:has(+ input:focus),html[data-accent]:not([data-accent="green"]) label:has(+ select:focus),html[data-accent]:not([data-accent="green"]) label:has(+ textarea:focus){color:var(--primary)!important;}
html[data-accent]:not([data-accent="green"]) select:focus-visible,html[data-accent]:not([data-accent="green"]) input:focus-visible,html[data-accent]:not([data-accent="green"]) textarea:focus-visible{outline:none!important;}
html[data-accent]:not([data-accent="green"]) input[type="file"]::file-selector-button{background:var(--primary)!important;color:var(--primary-contrast)!important;border:0;border-radius:.75rem;padding:.5rem .75rem;margin-inline-end:.5rem;}

/* Tables */
html[data-accent]:not([data-accent="green"]) thead th,html[data-accent]:not([data-accent="green"]) table th{background:var(--table-head-bg)!important;color:var(--text)!important;border-bottom-color:var(--primary-border)!important;}
html[data-accent]:not([data-accent="green"]) tbody tr{transition:background-color .16s ease;}
html[data-accent]:not([data-accent="green"]) tbody tr:hover{background:var(--table-row-hover)!important;}
html[data-accent]:not([data-accent="green"]) tr.is-active,html[data-accent]:not([data-accent="green"]) tr.active,html[data-accent]:not([data-accent="green"]) tr[aria-selected="true"]{background:var(--table-row-selected)!important;}

/* Tabs, filters, chips, badges */
html[data-accent]:not([data-accent="green"]) [role="tab"][aria-selected="true"],html[data-accent]:not([data-accent="green"]) .active-tab,html[data-accent]:not([data-accent="green"]) .is-active,html[data-accent]:not([data-accent="green"]) .leaderboard-tab-btn.active{background:var(--tab-active-bg)!important;color:var(--primary)!important;border-color:var(--primary-border)!important;box-shadow:inset 0 -3px 0 var(--primary);}
html[data-accent]:not([data-accent="green"]) .leaderboard-tab-btn:hover{background:var(--nav-hover-bg)!important;color:var(--primary)!important;border-color:var(--primary-border)!important;}
html[data-accent]:not([data-accent="green"]) .badge,html[data-accent]:not([data-accent="green"]) .chip,html[data-accent]:not([data-accent="green"]) .tag,html[data-accent]:not([data-accent="green"]) [class*="badge"]{background:var(--badge-bg)!important;color:var(--badge-text)!important;border-color:var(--badge-border)!important;}

/* Modals, dropdowns and popovers */
html[data-accent]:not([data-accent="green"]) .modal-body{border-color:var(--primary-border)!important;box-shadow:0 24px 70px rgba(15,23,42,.18),0 0 0 1px rgba(var(--primary-rgb),.05)!important;}
html[data-accent]:not([data-accent="green"]) .modal-body h1,html[data-accent]:not([data-accent="green"]) .modal-body h2,html[data-accent]:not([data-accent="green"]) .modal-body h3{color:var(--text)!important;}
html[data-accent]:not([data-accent="green"]) .modal-body h3 i,html[data-accent]:not([data-accent="green"]) .modal-body .text-teal-600{color:var(--primary)!important;}
html[data-accent]:not([data-accent="green"]) [role="menu"],html[data-accent]:not([data-accent="green"]) [role="listbox"],html[data-accent]:not([data-accent="green"]) .dropdown,html[data-accent]:not([data-accent="green"]) .popover{background:var(--surface)!important;color:var(--text)!important;border-color:var(--primary-border)!important;box-shadow:var(--shadow)!important;}
html[data-accent]:not([data-accent="green"]) [role="menuitem"]:hover,html[data-accent]:not([data-accent="green"]) [role="option"]:hover{background:var(--nav-hover-bg)!important;color:var(--primary)!important;}

/* Progress/loading/decorative */
html[data-accent]:not([data-accent="green"]) .waqar-spinner{border-top-color:var(--primary)!important;border-color:var(--primary-soft);border-top-color:var(--primary)!important;}
html[data-accent]:not([data-accent="green"]) .progress-bar,html[data-accent]:not([data-accent="green"]) .progress,html[data-accent]:not([data-accent="green"]) .loading-bar{background:linear-gradient(90deg,var(--primary),var(--accent))!important;}
html[data-accent]:not([data-accent="green"]) .text-teal-600 .fa-spin,html[data-accent]:not([data-accent="green"]) .fa-spinner.fa-spin{color:var(--primary)!important;}
html[data-accent]:not([data-accent="green"]) #root{background:radial-gradient(circle at 14% 0%,var(--decor-glow),transparent 24%),radial-gradient(circle at 88% 8%,rgba(var(--accent-rgb),.075),transparent 22%),var(--bg)!important;}
html[data-theme="light"][data-accent]:not([data-accent="green"]) #root{background:radial-gradient(circle at 14% 0%,rgba(var(--primary-rgb),.07),transparent 24%),radial-gradient(circle at 88% 8%,rgba(var(--accent-rgb),.055),transparent 22%),var(--bg)!important;}

/* Book / Quran UI: keep reading surfaces neutral but accent controls */
html[data-accent]:not([data-accent="green"]) .waqar-pdf-title{color:var(--primary)!important;}
html[data-accent]:not([data-accent="green"]) .waqar-pdf-btn:hover{border-color:var(--primary-border)!important;color:var(--primary)!important;background:var(--primary-softer)!important;}
html[data-accent]:not([data-accent="green"]) .student-header{border-bottom-color:var(--primary)!important;}
@media(max-width:640px){html[data-accent]:not([data-accent="green"]) .student-header{border-bottom-color:var(--primary)!important;}}


/* Local embedded readers for Quran/Hadith/Tuhfa */
body.waqar-local-reader-open{overflow:hidden!important;}
.waqar-local-reader-overlay{position:fixed;inset:0;z-index:999999;background:#050505;direction:rtl;overflow:hidden;}
.waqar-local-reader-frame{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff;display:block;}
.waqar-local-reader-back{position:fixed;top:10px;right:10px;z-index:1000000;border:1px solid rgba(255,255,255,.35);background:rgba(10,15,20,.72);color:#fff;border-radius:999px;padding:9px 14px;font-family:Cairo,Arial,sans-serif;font-weight:900;font-size:13px;line-height:1;display:inline-flex;align-items:center;gap:7px;box-shadow:0 10px 28px rgba(0,0,0,.28);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);cursor:pointer;transition:transform .16s ease,background .16s ease,box-shadow .16s ease;}
.waqar-local-reader-back:hover{background:rgba(15,76,58,.88);transform:translateY(-1px);box-shadow:0 14px 34px rgba(0,0,0,.34);}
.waqar-local-reader-back:active{transform:translateY(0) scale(.98);}
@media(max-width:640px){.waqar-local-reader-back{top:8px;right:8px;padding:8px 12px;font-size:12px;}}
