/* تم‌های مبصر — توکن کامل + اعمال روی همه اجزا */

html {
    --primary: #e4574d;
    --primary-2: #c53d36;
    --accent: #29b7a8;
    --info: #3d8fd1;
    --warning: #e6a23c;
    --success: #1faa8a;
    --danger: #e11d48;
    --gray: #5a7083;
    --ink: #102536;
    --ink-soft: #5a7083;
    --muted: #6b7c8a;
    --bg: #e8eef1;
    --bg-2: #f4f7f8;
    --surface: #ffffff;
    --surface-2: #f7fafb;
    --surface-3: #eef3f5;
    --line: rgba(16, 37, 54, 0.12);
    --shadow: rgba(14, 58, 72, 0.12);
    --sidebar-from: #0b2f3b;
    --sidebar-to: #134a5a;
    --sidebar-text: #f4f7f8;
    --sidebar-muted: rgba(244, 247, 248, 0.72);
    --topbar-from: rgba(255, 255, 255, 0.94);
    --topbar-to: rgba(232, 245, 244, 0.9);
    --orb-1: rgba(41, 183, 168, 0.35);
    --orb-2: rgba(228, 87, 77, 0.28);
    --orb-3: rgba(61, 143, 209, 0.22);
    --chip-bg: rgba(41, 183, 168, 0.12);
    --focus-ring: rgba(228, 87, 77, 0.16);
    --table-head: #f0f5f7;
    --table-hover: rgba(41, 183, 168, 0.08);
    --input-bg: #f7fafb;
    --input-border: #d7e0e6;
    --help-bg: rgba(16, 37, 54, 0.04);
    --is-dark: 0;
    color-scheme: light;
}

/* —— تم‌های روشن —— */
html[data-theme="ocean"] {
    --primary: #e4574d; --primary-2: #c53d36; --accent: #29b7a8; --info: #3d8fd1;
    --warning: #e6a23c; --success: #1faa8a; --danger: #e11d48; --gray: #5a7083;
    --ink: #102536; --ink-soft: #5a7083; --muted: #6b7c8a;
    --bg: #e8eef1; --bg-2: #f4f7f8; --surface: #ffffff; --surface-2: #f7fafb; --surface-3: #e8f2f1;
    --line: rgba(16, 37, 54, 0.12); --shadow: rgba(14, 58, 72, 0.12);
    --sidebar-from: #0b2f3b; --sidebar-to: #1a6670;
    --topbar-from: rgba(255,255,255,.94); --topbar-to: rgba(232,245,244,.9);
    --orb-1: rgba(41,183,168,.38); --orb-2: rgba(228,87,77,.3);
    --chip-bg: rgba(41,183,168,.12); --focus-ring: rgba(228,87,77,.16);
    --table-head: #eaf4f3; --table-hover: rgba(41,183,168,.1);
    --input-bg: #f7fafb; --input-border: #d5e1e6; --help-bg: rgba(14,58,72,.04);
}

html[data-theme="coral"] {
    --primary: #ff6b6b; --primary-2: #e84393; --accent: #a29bfe; --info: #54a0ff;
    --warning: #f6c445; --success: #00b894; --danger: #ff4757; --gray: #8892b0;
    --ink: #2d3436; --ink-soft: #636e72; --muted: #8892b0;
    --bg: #f3f0ff; --bg-2: #faf8ff; --surface: #ffffff; --surface-2: #fafbff; --surface-3: #fff0f3;
    --line: rgba(45,52,54,.1); --shadow: rgba(255,107,107,.12);
    --sidebar-from: #2d3436; --sidebar-to: #4a5560; --sidebar-text: #fff; --sidebar-muted: rgba(255,255,255,.7);
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(255,240,245,.9);
    --orb-1: rgba(255,107,107,.32); --orb-2: rgba(162,155,254,.28);
    --chip-bg: rgba(255,107,107,.1); --focus-ring: rgba(255,107,107,.16);
    --table-head: #fff1f3; --table-hover: rgba(255,107,107,.07);
    --input-bg: #fafbff; --input-border: #e4e7f0; --help-bg: rgba(255,107,107,.06);
}

html[data-theme="forest"] {
    --primary: #2d6a4f; --primary-2: #1b4332; --accent: #52b788; --info: #40916c;
    --warning: #d4a373; --success: #74c69d; --danger: #c1121f; --gray: #52796f;
    --ink: #081c15; --ink-soft: #2d6a4f; --muted: #52796f;
    --bg: #e9f5ef; --bg-2: #f4faf6; --surface: #ffffff; --surface-2: #f6fbf8; --surface-3: #e2f0e8;
    --line: rgba(8,28,21,.12); --shadow: rgba(27,67,50,.12);
    --sidebar-from: #081c15; --sidebar-to: #1b4332;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(233,245,239,.92);
    --orb-1: rgba(45,106,79,.32); --orb-2: rgba(82,183,136,.28);
    --chip-bg: rgba(45,106,79,.1); --focus-ring: rgba(45,106,79,.16);
    --table-head: #e8f5ee; --table-hover: rgba(45,106,79,.08);
    --input-bg: #f6fbf8; --input-border: #cfe0d6; --help-bg: rgba(45,106,79,.06);
}

html[data-theme="azure"] {
    --primary: #0077b6; --primary-2: #023e8a; --accent: #00b4d8; --info: #48cae4;
    --warning: #ffb703; --success: #2a9d8f; --danger: #e63946; --gray: #4a6fa5;
    --ink: #023047; --ink-soft: #0077b6; --muted: #4a6fa5;
    --bg: #e8f4fb; --bg-2: #f3faff; --surface: #ffffff; --surface-2: #f5fbff; --surface-3: #dff1fb;
    --line: rgba(2,48,71,.12); --shadow: rgba(0,119,182,.12);
    --sidebar-from: #023e8a; --sidebar-to: #0077b6;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(232,244,251,.92);
    --orb-1: rgba(0,180,216,.32); --orb-2: rgba(0,119,182,.28);
    --chip-bg: rgba(0,180,216,.12); --focus-ring: rgba(0,119,182,.16);
    --table-head: #e6f5fc; --table-hover: rgba(0,180,216,.1);
    --input-bg: #f5fbff; --input-border: #c9dde9; --help-bg: rgba(0,119,182,.06);
}

html[data-theme="sunset"] {
    --primary: #ea580c; --primary-2: #c2410c; --accent: #f59e0b; --info: #fb923c;
    --warning: #fbbf24; --success: #65a30d; --danger: #dc2626; --gray: #78716c;
    --ink: #431407; --ink-soft: #9a3412; --muted: #9a6b4a;
    --bg: #fff7ed; --bg-2: #fffbeb; --surface: #ffffff; --surface-2: #fffaf3; --surface-3: #ffedd5;
    --line: rgba(67,20,7,.12); --shadow: rgba(194,65,12,.12);
    --sidebar-from: #7c2d12; --sidebar-to: #c2410c;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(255,247,237,.92);
    --orb-1: rgba(234,88,12,.28); --orb-2: rgba(251,191,36,.28);
    --chip-bg: rgba(234,88,12,.1); --focus-ring: rgba(234,88,12,.16);
    --table-head: #ffedd5; --table-hover: rgba(234,88,12,.08);
    --input-bg: #fffaf3; --input-border: #f0d9bd; --help-bg: rgba(234,88,12,.06);
}

html[data-theme="rose"] {
    --primary: #e11d48; --primary-2: #be123c; --accent: #fb7185; --info: #f472b6;
    --warning: #f59e0b; --success: #10b981; --danger: #9f1239; --gray: #9f7a86;
    --ink: #4c0519; --ink-soft: #9f1239; --muted: #9f7a86;
    --bg: #fff1f2; --bg-2: #fff7f8; --surface: #ffffff; --surface-2: #fff8f9; --surface-3: #ffe4e6;
    --line: rgba(76,5,25,.12); --shadow: rgba(225,29,72,.12);
    --sidebar-from: #4c0519; --sidebar-to: #9f1239;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(255,241,242,.92);
    --orb-1: rgba(225,29,72,.28); --orb-2: rgba(251,113,133,.28);
    --chip-bg: rgba(225,29,72,.1); --focus-ring: rgba(225,29,72,.16);
    --table-head: #ffe4e6; --table-hover: rgba(225,29,72,.07);
    --input-bg: #fff8f9; --input-border: #f0c9d0; --help-bg: rgba(225,29,72,.06);
}

html[data-theme="slate"] {
    --primary: #475569; --primary-2: #334155; --accent: #64748b; --info: #0ea5e9;
    --warning: #f59e0b; --success: #10b981; --danger: #ef4444; --gray: #64748b;
    --ink: #0f172a; --ink-soft: #334155; --muted: #64748b;
    --bg: #f1f5f9; --bg-2: #f8fafc; --surface: #ffffff; --surface-2: #f8fafc; --surface-3: #e2e8f0;
    --line: rgba(15,23,42,.12); --shadow: rgba(15,23,42,.1);
    --sidebar-from: #0f172a; --sidebar-to: #334155;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(241,245,249,.92);
    --orb-1: rgba(71,85,105,.25); --orb-2: rgba(14,165,233,.2);
    --chip-bg: rgba(71,85,105,.1); --focus-ring: rgba(71,85,105,.16);
    --table-head: #e2e8f0; --table-hover: rgba(71,85,105,.08);
    --input-bg: #f8fafc; --input-border: #cbd5e1; --help-bg: rgba(15,23,42,.04);
}

html[data-theme="mint"] {
    --primary: #0d9488; --primary-2: #0f766e; --accent: #14b8a6; --info: #06b6d4;
    --warning: #eab308; --success: #22c55e; --danger: #f43f5e; --gray: #5b7c7a;
    --ink: #134e4a; --ink-soft: #0f766e; --muted: #5b7c7a;
    --bg: #ecfdf8; --bg-2: #f0fdfa; --surface: #ffffff; --surface-2: #f3fffb; --surface-3: #ccfbf1;
    --line: rgba(19,78,74,.12); --shadow: rgba(13,148,136,.12);
    --sidebar-from: #042f2e; --sidebar-to: #0f766e;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(236,253,248,.92);
    --orb-1: rgba(20,184,166,.32); --orb-2: rgba(6,182,212,.24);
    --chip-bg: rgba(13,148,136,.1); --focus-ring: rgba(13,148,136,.16);
    --table-head: #ccfbf1; --table-hover: rgba(20,184,166,.1);
    --input-bg: #f3fffb; --input-border: #b6e6dc; --help-bg: rgba(13,148,136,.06);
}

html[data-theme="honey"] {
    --primary: #d97706; --primary-2: #b45309; --accent: #f59e0b; --info: #ea580c;
    --warning: #fbbf24; --success: #65a30d; --danger: #dc2626; --gray: #78716c;
    --ink: #451a03; --ink-soft: #92400e; --muted: #92663a;
    --bg: #fffbeb; --bg-2: #fef3c7; --surface: #ffffff; --surface-2: #fffdf5; --surface-3: #fde68a;
    --line: rgba(69,26,3,.12); --shadow: rgba(180,83,9,.12);
    --sidebar-from: #451a03; --sidebar-to: #92400e;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(255,251,235,.92);
    --orb-1: rgba(217,119,6,.28); --orb-2: rgba(252,211,77,.28);
    --chip-bg: rgba(217,119,6,.1); --focus-ring: rgba(217,119,6,.16);
    --table-head: #fef3c7; --table-hover: rgba(217,119,6,.08);
    --input-bg: #fffdf5; --input-border: #edd9a3; --help-bg: rgba(217,119,6,.06);
}

html[data-theme="cherry"] {
    --primary: #dc2626; --primary-2: #b91c1c; --accent: #f87171; --info: #fb7185;
    --warning: #f59e0b; --success: #16a34a; --danger: #7f1d1d; --gray: #7f1d1d;
    --ink: #450a0a; --ink-soft: #7f1d1d; --muted: #9f4a4a;
    --bg: #fef2f2; --bg-2: #fff5f5; --surface: #ffffff; --surface-2: #fffafa; --surface-3: #fecaca;
    --line: rgba(69,10,10,.12); --shadow: rgba(185,28,28,.12);
    --sidebar-from: #450a0a; --sidebar-to: #7f1d1d;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(254,242,242,.92);
    --orb-1: rgba(220,38,38,.28); --orb-2: rgba(248,113,113,.24);
    --chip-bg: rgba(220,38,38,.1); --focus-ring: rgba(220,38,38,.16);
    --table-head: #fee2e2; --table-hover: rgba(220,38,38,.07);
    --input-bg: #fffafa; --input-border: #efc4c4; --help-bg: rgba(220,38,38,.06);
}

html[data-theme="arctic"] {
    --primary: #486581; --primary-2: #334e68; --accent: #627d98; --info: #829ab1;
    --warning: #f0a202; --success: #2a9d8f; --danger: #e63946; --gray: #627d98;
    --ink: #102a43; --ink-soft: #334e68; --muted: #627d98;
    --bg: #f0f4f8; --bg-2: #f5f7fa; --surface: #ffffff; --surface-2: #f8fafc; --surface-3: #d9e2ec;
    --line: rgba(16,42,67,.12); --shadow: rgba(51,78,104,.12);
    --sidebar-from: #102a43; --sidebar-to: #334e68;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(240,244,248,.92);
    --orb-1: rgba(72,101,129,.25); --orb-2: rgba(130,154,177,.22);
    --chip-bg: rgba(72,101,129,.1); --focus-ring: rgba(72,101,129,.16);
    --table-head: #d9e2ec; --table-hover: rgba(72,101,129,.08);
    --input-bg: #f8fafc; --input-border: #bcccdc; --help-bg: rgba(16,42,67,.04);
}

html[data-theme="grape"] {
    --primary: #7c3aed; --primary-2: #6d28d9; --accent: #a78bfa; --info: #8b5cf6;
    --warning: #f59e0b; --success: #10b981; --danger: #e11d48; --gray: #7c6f9a;
    --ink: #2e1065; --ink-soft: #5b21b6; --muted: #7c6f9a;
    --bg: #f5f3ff; --bg-2: #faf5ff; --surface: #ffffff; --surface-2: #faf8ff; --surface-3: #ede9fe;
    --line: rgba(46,16,101,.12); --shadow: rgba(109,40,217,.12);
    --sidebar-from: #2e1065; --sidebar-to: #5b21b6;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(245,243,255,.92);
    --orb-1: rgba(124,58,237,.28); --orb-2: rgba(167,139,250,.26);
    --chip-bg: rgba(124,58,237,.1); --focus-ring: rgba(124,58,237,.16);
    --table-head: #ede9fe; --table-hover: rgba(124,58,237,.08);
    --input-bg: #faf8ff; --input-border: #d4c8f5; --help-bg: rgba(124,58,237,.06);
}

html[data-theme="olive"] {
    --primary: #4d7c0f; --primary-2: #3f6212; --accent: #65a30d; --info: #84cc16;
    --warning: #ca8a04; --success: #16a34a; --danger: #dc2626; --gray: #6b7280;
    --ink: #1a2e05; --ink-soft: #3f6212; --muted: #5b6b3a;
    --bg: #f7fee7; --bg-2: #ecfccb; --surface: #ffffff; --surface-2: #f9fef0; --surface-3: #d9f99d;
    --line: rgba(26,46,5,.12); --shadow: rgba(63,98,18,.12);
    --sidebar-from: #1a2e05; --sidebar-to: #3f6212;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(247,254,231,.92);
    --orb-1: rgba(77,124,15,.28); --orb-2: rgba(190,242,100,.26);
    --chip-bg: rgba(77,124,15,.1); --focus-ring: rgba(77,124,15,.16);
    --table-head: #ecfccb; --table-hover: rgba(77,124,15,.08);
    --input-bg: #f9fef0; --input-border: #c9dd9a; --help-bg: rgba(77,124,15,.06);
}

html[data-theme="ink"] {
    --primary: #2563eb; --primary-2: #1d4ed8; --accent: #3b82f6; --info: #60a5fa;
    --warning: #f59e0b; --success: #10b981; --danger: #ef4444; --gray: #64748b;
    --ink: #0f172a; --ink-soft: #1e3a5f; --muted: #64748b;
    --bg: #eef2ff; --bg-2: #f8fafc; --surface: #ffffff; --surface-2: #f8faff; --surface-3: #dbeafe;
    --line: rgba(15,23,42,.12); --shadow: rgba(37,99,235,.12);
    --sidebar-from: #0f172a; --sidebar-to: #1e3a5f;
    --topbar-from: rgba(255,255,255,.95); --topbar-to: rgba(238,242,255,.92);
    --orb-1: rgba(37,99,235,.28); --orb-2: rgba(96,165,250,.24);
    --chip-bg: rgba(37,99,235,.1); --focus-ring: rgba(37,99,235,.16);
    --table-head: #dbeafe; --table-hover: rgba(37,99,235,.08);
    --input-bg: #f8faff; --input-border: #c7d2fe; --help-bg: rgba(37,99,235,.06);
}

/* —— تم‌های تیره (سطح تیره + متن روشن) —— */
html[data-theme="midnight"] {
    --primary: #38bdf8; --primary-2: #0ea5e9; --accent: #818cf8; --info: #67e8f9;
    --warning: #fbbf24; --success: #34d399; --danger: #fb7185; --gray: #94a3b8;
    --ink: #e2e8f0; --ink-soft: #cbd5e1; --muted: #94a3b8;
    --bg: #0b1220; --bg-2: #111827;
    --surface: #1e293b; --surface-2: #243247; --surface-3: #334155;
    --line: rgba(148,163,184,.22); --shadow: rgba(0,0,0,.4);
    --sidebar-from: #020617; --sidebar-to: #0f172a;
    --sidebar-text: #e2e8f0; --sidebar-muted: rgba(226,232,240,.68);
    --topbar-from: rgba(15,23,42,.96); --topbar-to: rgba(30,41,59,.94);
    --orb-1: rgba(56,189,248,.2); --orb-2: rgba(129,140,248,.18);
    --chip-bg: rgba(56,189,248,.14); --focus-ring: rgba(56,189,248,.22);
    --table-head: #243247; --table-hover: rgba(56,189,248,.12);
    --input-bg: #243247; --input-border: rgba(148,163,184,.28);
    --help-bg: rgba(148,163,184,.08);
    --is-dark: 1;
    color-scheme: dark;
}

html[data-theme="ember"] {
    --primary: #fb923c; --primary-2: #ea580c; --accent: #f97316; --info: #fdba74;
    --warning: #fbbf24; --success: #84cc16; --danger: #f87171; --gray: #a8a29e;
    --ink: #fafaf9; --ink-soft: #e7e5e4; --muted: #a8a29e;
    --bg: #1c1917; --bg-2: #292524;
    --surface: #292524; --surface-2: #35302c; --surface-3: #44403c;
    --line: rgba(168,162,158,.24); --shadow: rgba(0,0,0,.45);
    --sidebar-from: #0c0a09; --sidebar-to: #1c1917;
    --sidebar-text: #fafaf9; --sidebar-muted: rgba(250,250,249,.68);
    --topbar-from: rgba(28,25,23,.96); --topbar-to: rgba(41,37,36,.94);
    --orb-1: rgba(234,88,12,.26); --orb-2: rgba(251,146,60,.2);
    --chip-bg: rgba(251,146,60,.14); --focus-ring: rgba(251,146,60,.22);
    --table-head: #35302c; --table-hover: rgba(251,146,60,.12);
    --input-bg: #35302c; --input-border: rgba(168,162,158,.3);
    --help-bg: rgba(168,162,158,.1);
    --is-dark: 1;
    color-scheme: dark;
}

/* =========================
   اعمال تم روی کل سایت
   ========================= */

body:not(.auth-body) {
    background:
        radial-gradient(120% 80% at 100% 0%, var(--orb-1), transparent 55%),
        radial-gradient(90% 70% at 0% 100%, var(--orb-2), transparent 50%),
        linear-gradient(160deg, var(--bg) 0%, var(--bg-2) 52%, var(--bg) 100%) !important;
    color: var(--ink) !important;
    background-attachment: fixed;
}

.animated-bg .orb-1 { background: var(--orb-1) !important; }
.animated-bg .orb-2 { background: var(--orb-2) !important; }
.animated-bg .orb-3 { background: var(--orb-3) !important; }

/* سایدبار */
.sidebar {
    background: linear-gradient(180deg, var(--sidebar-from) 0%, var(--sidebar-to) 55%, var(--sidebar-from) 100%) !important;
    color: var(--sidebar-text) !important;
    border-left: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: -8px 0 28px var(--shadow) !important;
}
.sidebar::after {
    background:
        radial-gradient(120px 80px at 85% 8%, var(--orb-1), transparent 70%),
        radial-gradient(140px 100px at 10% 92%, var(--orb-2), transparent 70%) !important;
}
.sidebar-header { border-bottom-color: rgba(255,255,255,.1) !important; }
.sidebar-header h2 { color: var(--sidebar-text) !important; }
.sidebar-header p { color: var(--sidebar-muted) !important; }
.sidebar-logo {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    box-shadow: 0 8px 22px rgba(0,0,0,.25) !important;
}
.sidebar-nav a { color: var(--sidebar-muted) !important; }
.sidebar-nav a:hover,
.sidebar-nav a.active {
    color: #fff !important;
    background: rgba(255,255,255,.08) !important;
    border-left-color: var(--accent) !important;
}
.sidebar-nav a::before { background: linear-gradient(90deg, rgba(255,255,255,.12), transparent) !important; }
.sidebar-nav a::after { background: linear-gradient(135deg, var(--primary), var(--accent)) !important; }
.sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.25) !important; }
.sidebar .logout { color: #fecaca !important; }

/* تاپ‌بار */
.topbar {
    background: linear-gradient(135deg, var(--topbar-from), var(--topbar-to)) !important;
    border-bottom: 1px solid var(--line) !important;
}
.topbar h1 { color: var(--ink) !important; }
.topbar .topbar-emoji {
    /* ایموجی‌ها رنگ خودشان را نگه دارند؛ فقط فاصله و اندازه */
    color: inherit;
    filter: none;
}
.user-chip { background: var(--chip-bg) !important; border-color: var(--line) !important; }
.user-chip-avatar { background: linear-gradient(135deg, var(--primary), var(--accent)) !important; color:#fff !important; }
.user-chip-info {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    min-width: 0 !important;
    overflow: hidden !important;
}
.user-chip-name { color: var(--ink) !important; }
.user-chip-role { display: none !important; color: var(--primary) !important; }
.topbar-refresh {
    background: color-mix(in srgb, var(--surface, #fff) 92%, transparent) !important;
    border-color: var(--line) !important;
    color: var(--ink) !important;
    box-shadow: 0 1px 2px var(--shadow, rgba(0,0,0,.06)) !important;
}
.topbar-refresh:hover {
    background: color-mix(in srgb, var(--accent, #2ec4b6) 14%, var(--surface, #fff)) !important;
    color: var(--primary, #0f766e) !important;
}

/* دکمه منوی موبایل — همیشه خوانا روی همه تم‌ها */
.sidebar-toggle,
.topbar .sidebar-toggle,
button.sidebar-toggle {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    color: #fff !important;
    border: 1px solid transparent !important;
    box-shadow: 0 4px 16px var(--shadow) !important;
}
.sidebar-toggle:hover,
.sidebar-toggle:focus-visible,
.topbar .sidebar-toggle:hover {
    background: linear-gradient(135deg, var(--accent), var(--primary)) !important;
    color: #fff !important;
}
.sidebar-toggle-bars span {
    background: #fff !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.25) !important;
}
.sidebar-close {
    display: none;
    background: rgba(255,255,255,.14) !important;
    border: 1px solid rgba(255,255,255,.2) !important;
    color: #fff !important;
}
.sidebar-expanded .sidebar-close,
body.sidebar-expanded .sidebar-close {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}
.sidebar-close:hover {
    background: rgba(255,255,255,.24) !important;
    color: #fff !important;
}
.notification-btn {
    background: var(--chip-bg) !important;
    color: var(--ink) !important;
    border: 1px solid var(--line) !important;
}

/* کارت‌ها و پنل‌ها */
.card,
.profile-card,
.stat-card,
.viz-card,
.online-stat,
.toolbar,
.tabs,
.modal-content,
.notification-dropdown,
.app-download-box,
.login-box {
    background: var(--surface) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
    box-shadow: 0 8px 24px var(--shadow) !important;
}
.card:hover,
.stat-card:hover { box-shadow: 0 14px 36px var(--shadow) !important; }
.card-header h3,
.stat-info h3,
.profile-card h3,
.viz-card h3,
.online-stat h4 { color: var(--ink) !important; }
.stat-info p,
.online-stat p,
.muted,
.text-muted,
.help-text,
.user-chip-role + *,
small { color: var(--muted) !important; }
.help-text {
    background: var(--help-bg) !important;
    border-radius: 12px;
    border-right-color: var(--accent, #4ECDC4) !important;
    color: var(--muted) !important;
    max-width: 100%;
    box-sizing: border-box;
}

/* جدول‌ها — مهم‌ترین بخش خوانایی */
.table-responsive {
    background: var(--surface) !important;
    border: 1px solid var(--line) !important;
    border-radius: 14px;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-x: contain;
    touch-action: pan-x pan-y;
    max-width: 100%;
}
.schedule-wrapper,
.my-week {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-x pan-y;
    max-width: 100%;
}
.data-table {
    background: var(--surface) !important;
    color: var(--ink) !important;
}
.data-table th,
.data-table td {
    color: var(--ink) !important;
    border-bottom: 1px solid var(--line) !important;
    background: transparent !important;
}
.data-table th {
    background: var(--table-head) !important;
    color: var(--ink) !important;
    font-weight: 800 !important;
}
.data-table tbody tr:hover {
    background: var(--table-hover) !important;
}
.data-table tbody tr:hover td {
    background: transparent !important;
}
.data-table a { color: var(--info) !important; }
.data-table a.badge,
.data-table a.badge-absent,
.data-table a.badge-present,
.data-table a.badge-late,
.data-table a.badge-info,
.data-table a.badge-warning,
.data-table a.badge-danger {
    color: #fff !important;
}
.cls-board-table td,
.cls-board-table th {
    background: var(--surface) !important;
    color: var(--ink) !important;
}
.cls-board-table .cls-row.is-missing td {
    background: color-mix(in srgb, var(--danger, #FF4757) 12%, var(--surface)) !important;
}
.cls-board-table .cls-row.is-partial td {
    background: color-mix(in srgb, var(--warning, #FF9F43) 14%, var(--surface)) !important;
}
.cls-board-table .cls-row.is-done td {
    background: color-mix(in srgb, var(--success, #00B894) 12%, var(--surface)) !important;
}
.cls-board-table .cls-slot {
    background: color-mix(in srgb, var(--surface-2, var(--surface)) 88%, var(--surface)) !important;
    border-color: var(--line) !important;
    box-shadow: 0 1px 2px color-mix(in srgb, var(--shadow, rgba(0,0,0,.2)) 35%, transparent),
                0 6px 14px color-mix(in srgb, var(--shadow, rgba(0,0,0,.2)) 20%, transparent);
}
.cls-board-table .cls-row.is-missing .cls-slot {
    background: color-mix(in srgb, var(--danger, #FF4757) 10%, var(--surface)) !important;
    border-color: color-mix(in srgb, var(--danger, #FF4757) 28%, var(--line)) !important;
}
.cls-board-table .cls-row.is-partial .cls-slot {
    background: color-mix(in srgb, var(--warning, #FF9F43) 12%, var(--surface)) !important;
    border-color: color-mix(in srgb, var(--warning, #FF9F43) 35%, var(--line)) !important;
}
.cls-board-table .cls-row.is-done .cls-slot {
    background: color-mix(in srgb, var(--success, #00B894) 10%, var(--surface)) !important;
    border-color: color-mix(in srgb, var(--success, #00B894) 28%, var(--line)) !important;
}
.cls-board-table .cls-period-teacher { color: var(--ink) !important; white-space: normal !important; }
.cls-board-table .cls-period-lesson { color: var(--ink-soft, var(--muted)) !important; white-space: normal !important; overflow-wrap: anywhere; word-break: break-word; }
.cls-board-table .cls-period-empty { color: var(--muted) !important; }
.cls-board-table .cls-period-cell {
    max-width: 180px !important;
    white-space: normal !important;
    overflow: hidden;
}
.cls-board-table .cls-slot {
    max-width: 100%;
    overflow: hidden;
    min-width: 0;
}
.user-name-cell { color: var(--ink) !important; }

/* فرم‌ها */
.form-group label { color: var(--ink-soft) !important; }
.form-group input,
.form-group select,
.form-group textarea,
.form-input,
.search-box input,
.online-search input,
input[type="text"],
input[type="search"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="email"],
select,
textarea {
    background: var(--input-bg) !important;
    color: var(--ink) !important;
    border-color: var(--input-border) !important;
}

/* تاریخ شمسی — اولویت بالاتر از select عمومی */
.jalali-date,
.pdp-container {
    background: var(--surface) !important;
    border-color: var(--line) !important;
    box-shadow: 0 6px 18px var(--shadow) !important;
}
.jalali-date select,
.jalali-date input,
.pdp-container input.pdp-year,
.pdp-container select.pdp-month,
.pdp-container select.pdp-day,
.jalali-date .cls-board-date-sel {
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235a7083' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: left 2px center !important;
    border: none !important;
    color: var(--ink) !important;
    box-shadow: none !important;
}
.jalali-date__field[data-label]::before { color: var(--muted) !important; }
.jalali-date__icon {
    background: linear-gradient(160deg, color-mix(in srgb, var(--accent) 18%, transparent), color-mix(in srgb, var(--primary) 12%, transparent)) !important;
    border-left-color: var(--line) !important;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
.form-input:focus,
.search-box input:focus,
.online-search input:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 4px var(--focus-ring) !important;
    background: var(--surface) !important;
}
.read-only-value {
    background: var(--surface-2) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.read-only-value.empty { color: var(--muted) !important; }

/* فیلترها و تب‌ها */
.filter-tabs a,
.tab-btn {
    background: var(--surface-2) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.filter-tabs a.active,
.tab-btn.active {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    color: #fff !important;
    border-color: transparent !important;
}

/* دکمه‌ها */
.btn-primary,
.btn-block {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    color: #fff !important;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--primary) 35%, transparent) !important;
    animation: none !important;
}
.btn-success { background: linear-gradient(135deg, var(--success), var(--accent)) !important; color:#fff !important; }
.btn-warning { background: linear-gradient(135deg, var(--warning), var(--primary)) !important; color:#fff !important; }
.btn-danger { background: linear-gradient(135deg, var(--danger), var(--primary-2)) !important; color:#fff !important; }
.btn-secondary { background: linear-gradient(135deg, var(--gray), var(--accent)) !important; color:#fff !important; }

/* نوتیف و بج */
.notification-dropdown { background: var(--surface) !important; color: var(--ink) !important; }
.notification-header strong,
.notification-title { color: var(--ink) !important; }
.notification-text,
.notification-time,
.notification-empty { color: var(--muted) !important; }
.notification-item { border-color: var(--line) !important; background: var(--surface) !important; }
.notification-item:hover { background: var(--table-hover) !important; }
.notification-icon { background: color-mix(in srgb, var(--accent) 16%, transparent) !important; }
.notification-item.is-chat .notification-icon { background: color-mix(in srgb, var(--primary) 18%, transparent) !important; }
.sidebar-nav a .nav-badge { background: var(--accent) !important; color: #fff !important; }
.notification-badge { background: var(--primary) !important; color: #fff !important; }
.badge-info { background: linear-gradient(135deg, var(--info), var(--accent)) !important; }
.badge-present { background: linear-gradient(135deg, var(--success), var(--accent)) !important; }
.badge-absent,
.badge-danger { background: linear-gradient(135deg, var(--danger), var(--primary)) !important; }

/* آلرت‌ها */
.alert { border-color: var(--line) !important; }
.alert-success { background: color-mix(in srgb, var(--success) 16%, var(--surface)) !important; color: var(--ink) !important; }
.alert-danger { background: color-mix(in srgb, var(--danger) 16%, var(--surface)) !important; color: var(--ink) !important; }
.alert-warning { background: color-mix(in srgb, var(--warning) 18%, var(--surface)) !important; color: var(--ink) !important; }
.alert-info { background: color-mix(in srgb, var(--info) 16%, var(--surface)) !important; color: var(--ink) !important; }

/* پروفایل / نوتیس */
.profile-notice {
    background: color-mix(in srgb, var(--warning) 14%, var(--surface)) !important;
    border-color: color-mix(in srgb, var(--warning) 35%, transparent) !important;
    color: var(--ink) !important;
}
.cred-live {
    border-color: color-mix(in srgb, var(--accent) 45%, var(--line)) !important;
    background: color-mix(in srgb, var(--accent) 10%, var(--surface)) !important;
}

/* انتخابگر تم */
.theme-picker-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
    gap: 12px;
}
.theme-swatch {
    appearance: none;
    border: 2px solid var(--line);
    background: var(--surface-2);
    border-radius: 16px;
    padding: 12px;
    cursor: pointer;
    text-align: right;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    color: var(--ink);
    font-family: inherit;
}
.theme-swatch:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px var(--shadow);
}
.theme-swatch.is-active {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--focus-ring), 0 10px 24px var(--shadow);
}
.theme-swatch__colors { display: flex; gap: 6px; margin-bottom: 10px; }
.theme-swatch__colors span {
    width: 22px; height: 22px; border-radius: 50%;
    border: 2px solid rgba(255,255,255,.65);
    box-shadow: 0 2px 6px rgba(0,0,0,.18);
}
.theme-swatch__label { display:block; font-size:13px; font-weight:800; margin-bottom:2px; color: var(--ink); }
.theme-swatch__desc { display:block; font-size:11px; color: var(--muted); line-height:1.5; }

/* صفحات خاص با استایل inline روشن */
.online-stat,
.filter-tabs a,
.online-search input[type="search"] {
    background: var(--surface) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}

/* منوی راست‌کلیک سراسری */
.app-ctx {
    background: color-mix(in srgb, var(--surface) 94%, transparent) !important;
    border-color: var(--line) !important;
    color: var(--ink) !important;
    box-shadow: 0 16px 40px var(--shadow) !important;
}
.app-ctx button { color: var(--ink) !important; }
.app-ctx button:hover { background: color-mix(in srgb, var(--accent) 12%, transparent) !important; }
.app-ctx button.danger { color: var(--danger) !important; }

/* لیست انتخاب دانش‌آموز در برنامه هفتگی */
.students-checkbox-wrapper {
    background: var(--surface-2) !important;
    border-color: var(--line) !important;
    color: var(--ink) !important;
}
.student-checkbox-item {
    display: flex !important;
    width: 100% !important;
    color: var(--ink) !important;
    border-bottom-color: var(--line) !important;
}
.student-checkbox-item:hover {
    background: color-mix(in srgb, var(--primary) 10%, var(--surface)) !important;
}
.student-checkbox-name { color: var(--ink) !important; }
.student-checkbox-meta { color: var(--muted) !important; }
.student-checkbox-class { color: var(--success) !important; }
.student-checkbox-class.none { color: var(--muted) !important; }
.filter-chip {
    background: var(--surface-2) !important;
    color: var(--ink) !important;
}
.filter-chip.active {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    color: #fff !important;
}
.students-toolbar input[type="text"] {
    background: var(--input-bg) !important;
    color: var(--ink) !important;
    border-color: var(--input-border) !important;
}
.students-toolbar button {
    background: var(--surface) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}

/* کارت انتخاب کلاس در نمرات — جلوگیری از متن نامرئی روی سفید */
.grade-class-card {
    background: var(--surface-2) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.grade-class-card strong { color: inherit !important; }
.grade-class-card .meta { color: var(--muted) !important; }
.grade-class-card:hover {
    border-color: var(--primary) !important;
    background: color-mix(in srgb, var(--primary) 10%, var(--surface)) !important;
}
.grade-class-card.active {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    color: #fff !important;
    border-color: transparent !important;
}
.grade-class-card.active strong,
.grade-class-card.active .meta { color: #fff !important; }

/* کارت‌های گزارش‌گیری */
.report-card {
    background: var(--surface) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
    box-shadow: 0 8px 24px var(--shadow) !important;
}
.report-card-head h3,
.report-mini-stat b { color: var(--ink) !important; }
.report-card-head p,
.report-mini-stat span { color: var(--muted) !important; }
.report-mini-stat {
    background: var(--surface-2) !important;
    border-color: var(--line) !important;
}
.report-card-link.secondary {
    background: var(--surface-2) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.report-card-link:not(.secondary) {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    color: #fff !important;
}

/* تنظیمات دسترسی نقش‌ها — جلوگیری از متن روشن روی کارت سفید */
.perm-card {
    background: var(--surface-2) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
    box-shadow: 0 8px 24px var(--shadow) !important;
}
.perm-card h3,
.perm-card label,
.perm-table td,
.perm-table th {
    color: var(--ink) !important;
}
.perm-table th {
    background: var(--table-head) !important;
}
.role-selector button,
.role-tab-btn {
    background: var(--surface-2) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.role-selector button.active,
.role-tab-btn.active {
    background: color-mix(in srgb, var(--primary) 14%, var(--surface)) !important;
    color: var(--ink) !important;
    border-color: var(--primary) !important;
}

/* Select2 — خوانایی در همه تم‌ها (دراپ‌داون کلاس و …) */
.select2-container--default .select2-selection--single {
    background: var(--input-bg) !important;
    border-color: var(--input-border) !important;
    color: var(--ink) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--ink) !important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--muted) !important;
}
.select2-dropdown {
    background: var(--surface) !important;
    border-color: var(--line) !important;
    color: var(--ink) !important;
}
.select2-search--dropdown {
    background: var(--surface-2) !important;
    border-bottom-color: var(--line) !important;
}
.select2-search--dropdown .select2-search__field {
    background: var(--input-bg) !important;
    color: var(--ink) !important;
    border-color: var(--input-border) !important;
}
.select2-results__option {
    background: var(--surface) !important;
    color: var(--ink) !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    color: #fff !important;
}
.select2-container--default .select2-results__option[aria-selected=true] {
    background: color-mix(in srgb, var(--primary) 14%, var(--surface)) !important;
    color: var(--ink) !important;
}
.select2-results__option .student-option-name { color: inherit !important; }
.select2-results__option .student-option-code { color: var(--muted) !important; }
.select2-results__option--highlighted .student-option-name,
.select2-results__option--highlighted .student-option-code {
    color: #fff !important;
}

/* دکمه‌های وضعیت حضور و غیاب */
.att-choice {
    background: var(--surface) !important;
    color: var(--muted) !important;
    border-color: var(--line) !important;
}
.att-choice.is-present.is-active {
    background: linear-gradient(135deg, var(--success), var(--accent)) !important;
    color: #fff !important;
    border-color: transparent !important;
}
.att-choice.is-absent.is-active {
    background: linear-gradient(135deg, var(--danger), #FF6B6B) !important;
    color: #fff !important;
    border-color: transparent !important;
}
.att-choice.is-late.is-active {
    background: linear-gradient(135deg, var(--warning), #FDCB6E) !important;
    color: #fff !important;
    border-color: transparent !important;
}
.att-choice.is-not-done.is-active {
    background: color-mix(in srgb, var(--muted) 22%, var(--surface)) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}

/* پیام کوتاه + ویرایشگر متن غنی — همه تم‌ها */
.send-mode-tab {
    background: var(--surface-2) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.send-mode-tab.active {
    background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
    color: #fff !important;
    border-color: transparent !important;
}
.send-mode-tabs { border-bottom-color: var(--line) !important; }
.mode-section {
    background: var(--surface-2) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.role-option {
    background: var(--surface) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.role-option:hover,
.role-option:has(input:checked) {
    border-color: var(--primary) !important;
    background: color-mix(in srgb, var(--primary) 12%, var(--surface)) !important;
}
.users-checkbox-list,
.class-option,
.class-group-item,
.select-all-bar button,
.message-item {
    background: var(--surface) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.message-item.unread {
    background: color-mix(in srgb, var(--danger) 10%, var(--surface)) !important;
    border-right-color: var(--danger) !important;
}
.message-subject,
.message-body,
.class-option .class-option-title,
.users-checkbox-list label { color: var(--ink) !important; }
.class-option .class-count,
.class-groups-hint,
.class-group-item small,
.message-meta,
.select-all-bar span,
.users-checkbox-list small { color: var(--muted) !important; }
.class-option.selected {
    border-color: var(--primary) !important;
    background: color-mix(in srgb, var(--primary) 12%, var(--surface)) !important;
}
.class-groups { border-top-color: var(--line) !important; }
.read-only-note {
    background: color-mix(in srgb, var(--accent) 12%, var(--surface)) !important;
    color: var(--ink) !important;
    border-color: color-mix(in srgb, var(--accent) 28%, transparent) !important;
}
.search-users input,
.search-users select {
    background: var(--input-bg) !important;
    color: var(--ink) !important;
    border-color: var(--input-border) !important;
}
.rt-editor {
    background: var(--input-bg) !important;
    color: var(--ink) !important;
    border-color: var(--input-border) !important;
}
.rt-toolbar {
    background: var(--surface-2) !important;
    border-bottom-color: var(--line) !important;
}
.rt-toolbar button {
    background: var(--surface) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}
.rt-toolbar button:hover {
    border-color: var(--primary) !important;
    background: color-mix(in srgb, var(--primary) 12%, var(--surface)) !important;
    color: var(--ink) !important;
}
.rt-sep { background: var(--line) !important; }
.rt-area { color: var(--ink) !important; }
.rt-area:empty:before { color: var(--muted) !important; }
.rich-body { color: var(--ink) !important; }
.rich-body a { color: var(--info) !important; }
.content,
.main-content { color: var(--ink); }
.content h1, .content h2, .content h3, .content h4,
.main-content h1, .main-content h2, .main-content h3 { color: var(--ink) !important; }

/* دونات و ویژوال */
.donut-center {
    background: var(--surface) !important;
    color: var(--ink) !important;
}
.donut-center h4 { color: var(--ink) !important; }
.legend-item { color: var(--ink) !important; }

/* مودال‌ها */
[id*="Modal"] > div,
.modal > div {
    background: var(--surface) !important;
    color: var(--ink) !important;
    border-color: var(--line) !important;
}

@media (max-width: 768px) {
    .theme-picker-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
}
@media (max-width: 400px) {
    .theme-picker-grid { grid-template-columns: 1fr; }
}