/*
   Halqaty calm dark theme
   Deep green surfaces preserve the product identity; gold remains an accent.
*/

.theme-toggle {
    display: inline-flex;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(191, 212, 203, .82);
    border-radius: 12px;
    background: rgba(255, 255, 255, .78);
    color: #12654f;
    box-shadow: 0 5px 16px rgba(18, 101, 79, .06);
    backdrop-filter: blur(12px);
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .12s ease;
}

.theme-toggle:hover {
    border-color: #d4aa50;
    background: #fff8e7;
    color: #8b651b;
    box-shadow: 0 6px 18px rgba(151, 110, 31, .13);
}

.theme-toggle:active { transform: translateY(1px); }
.theme-toggle-icon { display: grid; place-items: center; }
.theme-toggle-icon .app-icon { width: 18px; height: 18px; }
.theme-toggle-sun { display: none; }
.theme-toggle-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.top-row > .theme-toggle { margin-right: auto; }
.top-row > .notification-menu { margin-right: 0; }

.theme-toggle-floating {
    position: fixed;
    z-index: 8;
    top: 28px;
    left: clamp(20px, 4vw, 64px);
}

.theme-toggle-public { margin-inline-start: 4px; }

html[data-theme="dark"] {
    color-scheme: dark;
    --green: #48b38d;
    --green-hover: #59c59d;
    --green-active: #328a6b;
    --green2: #1a382e;
    --ink: #eef5f1;
    --muted: #a8bbb2;
    --muted-soft: #829b90;
    --line: #2b473b;
    --bg: #0d1713;
    --cream: #132019;
    --gold: #d6aa4c;
    --gold-strong: #efc76c;
    --danger: #e37b7b;
    --danger-hover: #f09292;
    --warning: #d6aa4c;
    --warning-hover: #e7bf66;
    --focus: #65cba6;
    --surface: #15251f;
    --surface-subtle: #192d25;
    --glass: rgba(20, 39, 32, .78);
    --glass-strong: rgba(20, 38, 31, .92);
    --shadow-soft: 0 12px 32px rgba(0, 0, 0, .22);
    --shadow-hover: 0 18px 42px rgba(0, 0, 0, .3);
    background: #0d1713;
}

html[data-theme="dark"] .theme-toggle-moon { display: none; }
html[data-theme="dark"] .theme-toggle-sun { display: grid; }

html[data-theme="dark"] body {
    color: var(--ink);
    background:
        radial-gradient(circle at 14% 8%, rgba(214, 170, 76, .08), transparent 28rem),
        radial-gradient(circle at 82% 34%, rgba(72, 179, 141, .09), transparent 32rem),
        linear-gradient(145deg, #0d1713 0%, #101d18 48%, #101914 100%);
    background-attachment: fixed;
}

html[data-theme="dark"] .page::before {
    opacity: .32;
    background-image:
        linear-gradient(30deg, rgba(99, 190, 156, .025) 12%, transparent 12.5%, transparent 87%, rgba(99, 190, 156, .025) 87.5%),
        linear-gradient(150deg, rgba(99, 190, 156, .025) 12%, transparent 12.5%, transparent 87%, rgba(99, 190, 156, .025) 87.5%);
}

html[data-theme="dark"] .sidebar {
    background: linear-gradient(180deg, #0a3b30, #072c25);
    border-left-color: rgba(214, 170, 76, .14);
    box-shadow: -18px 0 52px rgba(0, 0, 0, .26);
}

html[data-theme="dark"] .top-row { color: var(--ink); }
html[data-theme="dark"] .mobile-header-context,
html[data-theme="dark"] .mobile-header-context strong { color: var(--ink); }

html[data-theme="dark"] :is(.theme-toggle, .notification-trigger, .mobile-nav-trigger, .account-menu summary) {
    border-color: rgba(74, 110, 95, .88);
    background: rgba(19, 36, 30, .86);
    color: #d9eee5;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
}

html[data-theme="dark"] :is(.theme-toggle, .notification-trigger, .mobile-nav-trigger):hover {
    border-color: rgba(214, 170, 76, .72) !important;
    background: #253728 !important;
    color: #efc76c !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .22) !important;
}

html[data-theme="dark"] .avatar {
    border-color: #35584a;
    background: linear-gradient(145deg, #203c32, #172f27);
    color: #80d7b7;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

html[data-theme="dark"] .account-menu[open] summary {
    border-color: #4e806a;
    background: #1b362c;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .25);
}

html[data-theme="dark"] .account-chevron {
    border-color: #355448;
    background: #1c352c;
    color: #75cbaa;
}

html[data-theme="dark"] .account-menu summary:hover .account-chevron,
html[data-theme="dark"] .account-menu[open] .account-chevron {
    border-color: #8c7139;
    background: #3a321f;
    color: #efc76c;
}

/* Main glass surfaces */
html[data-theme="dark"] :is(.panel, .stat-card, .page-heading, .role-dashboard, .form-panel, .table-panel) {
    border-color: rgba(55, 83, 71, .92);
    background: rgba(20, 37, 31, .9);
    color: var(--ink);
    box-shadow: var(--shadow-soft);
}

html[data-theme="dark"] :is(.page-heading, .role-dashboard) {
    background-image: linear-gradient(120deg, rgba(25, 48, 40, .96), rgba(15, 31, 25, .9));
}

html[data-theme="dark"] .page-heading::before {
    background: radial-gradient(circle, rgba(214, 170, 76, .14), transparent 68%);
}

html[data-theme="dark"] .page-heading::after {
    background: radial-gradient(circle, rgba(72, 179, 141, .11), transparent 70%);
}

html[data-theme="dark"] :is(.page-heading h1, .role-dashboard h2, .stat-card strong, .panel h1, .panel h2, .panel h3) {
    color: var(--ink);
}

html[data-theme="dark"] .eyebrow {
    border-color: #315548;
    background: rgba(30, 66, 53, .8);
    color: #79d0af;
}

html[data-theme="dark"] .panel .panel,
html[data-theme="dark"] :is(.directory-stage-content, .account-stage-circles) {
    border-color: var(--line);
    background: var(--surface-subtle);
}

/* Quran plans directory follows the same green/gold language as dashboard KPIs. */
html[data-theme="dark"] .plan-directory-groups {
    border-color: var(--line);
    background: #14251f;
}

html[data-theme="dark"] .plan-directory-groups .directory-stage {
    border-color: #355448;
    background: #182b24;
}

html[data-theme="dark"] .plan-directory-groups .directory-stage.is-open {
    border-color: #4d7a68;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .2);
}

html[data-theme="dark"] .plan-directory-groups .directory-toggle {
    color: var(--ink);
}

html[data-theme="dark"] .plan-directory-groups .directory-toggle small {
    padding: 3px 9px;
    border: 1px solid rgba(61, 113, 92, .55);
    border-radius: 999px;
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] .plan-directory-groups .stage-toggle > .app-icon,
html[data-theme="dark"] .plan-directory-groups .circle-toggle > .app-icon {
    width: 30px;
    height: 30px;
    padding: 7px;
    border: 1px solid rgba(61, 113, 92, .55);
    border-radius: 10px;
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] .plan-directory-groups .directory-stage-content {
    border-color: var(--line);
    background: #11211b;
}

html[data-theme="dark"] .plan-directory-groups .circle-toggle {
    border-color: #355448;
    background: #182b24;
}

html[data-theme="dark"] .plan-directory-groups .circle-toggle.selected {
    border-color: #766235;
    background: linear-gradient(145deg, #233a30, #302c1e);
    box-shadow: inset 0 0 0 1px rgba(239, 199, 108, .12);
}

html[data-theme="dark"] .plan-directory-groups .circle-toggle.selected > .app-icon {
    border-color: rgba(115, 95, 50, .7);
    background: #3a311e;
    color: #efc76c;
}

/* Students and guardians directory uses the same hierarchy and accents. */
html[data-theme="dark"] .student-directory > .directory-groups {
    background: #14251f;
}

html[data-theme="dark"] .student-directory :is(.directory-stage, .directory-circle) {
    border-color: #355448;
    background: #182b24;
}

html[data-theme="dark"] .student-directory .directory-stage.is-open {
    border-color: #4d7a68;
}

html[data-theme="dark"] .student-directory .directory-circle.is-open {
    border-color: #766235;
    background: linear-gradient(145deg, #233a30, #302c1e);
    box-shadow: inset 0 0 0 1px rgba(239, 199, 108, .12);
}

html[data-theme="dark"] .student-directory .directory-toggle {
    color: var(--ink);
}

html[data-theme="dark"] .student-directory .circle-toggle {
    border-color: #355448;
    background: #182b24;
    color: var(--ink);
}

html[data-theme="dark"] .student-directory .directory-circle.is-open > .circle-toggle {
    background: linear-gradient(145deg, #233a30, #302c1e);
    color: var(--ink);
}

html[data-theme="dark"] .student-directory .directory-toggle small {
    padding: 3px 9px;
    border: 1px solid rgba(61, 113, 92, .55);
    border-radius: 999px;
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] .student-directory .directory-toggle > .app-icon {
    width: 30px;
    height: 30px;
    padding: 7px;
    border: 1px solid rgba(61, 113, 92, .55);
    border-radius: 10px;
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] .student-directory .directory-circle.is-open > .circle-toggle > .app-icon {
    border-color: rgba(115, 95, 50, .7);
    background: #3a311e;
    color: #efc76c;
}

html[data-theme="dark"] .student-directory .directory-stage-content {
    border-color: var(--line);
    background: #11211b;
}

html[data-theme="dark"] .student-directory .directory-circle > .data-table {
    border-color: var(--line);
}

/* User accounts directory matches plans and students in dark mode. */
html[data-theme="dark"] .account-directory > .directory-groups {
    background: #14251f;
}

html[data-theme="dark"] .account-directory :is(.directory-stage, .directory-circle) {
    border-color: #355448;
    background: #182b24;
}

html[data-theme="dark"] .account-directory .directory-stage.is-open {
    border-color: #4d7a68;
}

html[data-theme="dark"] .account-directory .directory-toggle {
    color: var(--ink);
}

html[data-theme="dark"] .account-directory .circle-toggle {
    border-color: #355448;
    background: #182b24;
    color: var(--ink);
}

html[data-theme="dark"] .account-directory .directory-circle.is-open > .circle-toggle {
    background: linear-gradient(145deg, #233a30, #302c1e);
    color: var(--ink);
}

html[data-theme="dark"] .account-directory .directory-toggle small {
    padding: 3px 9px;
    border: 1px solid rgba(61, 113, 92, .55);
    border-radius: 999px;
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] .account-directory .directory-toggle > .app-icon {
    width: 30px;
    height: 30px;
    padding: 7px;
    border: 1px solid rgba(61, 113, 92, .55);
    border-radius: 10px;
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] .account-directory .directory-circle.is-open > .circle-toggle > .app-icon {
    border-color: rgba(115, 95, 50, .7);
    background: #3a311e;
    color: #efc76c;
}

html[data-theme="dark"] .account-directory :is(.directory-stage-content, .account-stage-circles) {
    border-color: var(--line);
    background: #11211b;
}

html[data-theme="dark"] .account-directory .directory-circle > .data-table {
    border-color: var(--line);
    background: #14251f;
}

html[data-theme="dark"] .dashboard-home :is(.dashboard-hero, .stat-card, .panel, .dashboard-value),
html[data-theme="dark"] :is(.dashboard-story, .dashboard-value) {
    border-color: rgba(55, 83, 71, .9);
    background-color: rgba(20, 37, 31, .9);
    background-image:
        radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(85, 151, 126, .08), transparent 35%),
        linear-gradient(145deg, rgba(24, 45, 38, .96), rgba(14, 30, 24, .9));
    color: var(--ink);
    box-shadow: var(--shadow-soft);
}

html[data-theme="dark"] .dashboard-value b { color: #dceae4; }

/* Dashboard operational surfaces */
html[data-theme="dark"] :is(.dashboard-term-strip, .dashboard-operations, .dashboard-exam-reminder) {
    border-color: var(--line);
    background: linear-gradient(145deg, rgba(24, 45, 38, .96), rgba(14, 30, 24, .9));
    color: var(--ink);
    box-shadow: var(--shadow-soft);
}

html[data-theme="dark"] .dashboard-term-copy h2 { color: var(--ink); }
html[data-theme="dark"] .dashboard-term-copy p { color: var(--muted); }
html[data-theme="dark"] :is(.dashboard-term-icon, .dashboard-operation-card > span) {
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] .dashboard-term-status {
    border-color: #3d715c;
    background: #1a3b30;
    color: #86dab9;
}

html[data-theme="dark"] .dashboard-term-status.status-locked {
    border-color: #735f32;
    background: #312b1c;
    color: #e7c66d;
}

html[data-theme="dark"] .dashboard-operation-card {
    border-color: var(--line);
    background: #172922;
    color: var(--ink);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .15);
}

html[data-theme="dark"] .dashboard-operation-card:hover {
    border-color: #4e806a;
    background: #1b3028;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .22);
}

html[data-theme="dark"] .dashboard-operation-card small { color: var(--muted); }
html[data-theme="dark"] .dashboard-operation-card strong { color: #82d7b7; }
html[data-theme="dark"] .dashboard-operation-card.needs-action {
    border-color: #6f5d34;
    background: linear-gradient(145deg, #2c281b, #1a251e);
}

/* Keep the lower dashboard KPIs visually consistent with the action cards above. */
html[data-theme="dark"] .dashboard-kpi-grid .stat-icon {
    width: 44px;
    height: 44px;
    border: 1px solid transparent;
    border-radius: 12px;
    box-shadow: none;
}

html[data-theme="dark"] .dashboard-kpi-grid .stat-icon.green,
html[data-theme="dark"] .dashboard-kpi-grid .stat-icon.blue {
    border-color: rgba(61, 113, 92, .55);
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] .dashboard-kpi-grid .stat-icon.gold {
    border-color: rgba(115, 95, 50, .7);
    background: #3a311e;
    color: #efc76c;
}

html[data-theme="dark"] .dashboard-kpi-grid .stat-icon.red {
    border-color: #704343;
    background: #382323;
    color: #f09595;
}

html[data-theme="dark"] .dashboard-kpi-grid .stat-card strong {
    color: #82d7b7;
}

html[data-theme="dark"] .dashboard-kpi-grid .stat-card:has(.stat-icon.gold) strong {
    color: #efc76c;
}

html[data-theme="dark"] .dashboard-kpi-grid .stat-card:has(.stat-icon.red) strong {
    color: #f09595;
}

html[data-theme="dark"] .dashboard-operation-card.needs-action > span {
    background: #3a311e;
    color: #efc76c;
}

/* Filled actions need a deeper brand green so white labels keep accessible contrast. */
html[data-theme="dark"] .role-dashboard .actions > a.primary-btn {
    border-color: #1d7257;
    background: #1d7257;
    color: #fff;
}

html[data-theme="dark"] .role-dashboard .actions > a.primary-btn:hover {
    border-color: #237d60 !important;
    background: #237d60 !important;
    color: #fff !important;
}

html[data-theme="dark"] .role-dashboard .actions > a.primary-btn:active {
    border-color: #17664d !important;
    background: #17664d !important;
}

html[data-theme="dark"] .attendance-breakdown .present {
    background: #1a3b30;
    color: #81d8b6;
}

html[data-theme="dark"] .attendance-breakdown .late {
    background: #312b1c;
    color: #e7c66d;
}

html[data-theme="dark"] .attendance-breakdown .absent {
    background: #382323;
    color: #f09595;
}

html[data-theme="dark"] .status-meter { background: #294139; }

html[data-theme="dark"] .dashboard-operation-card.needs-action strong,
html[data-theme="dark"] .dashboard-exam-reminder > strong { color: #efc76c; }

/* Forms and interaction */
html[data-theme="dark"] :is(input, textarea, select) {
    border-color: #355448 !important;
    background-color: #111f1a !important;
    color: var(--ink) !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2);
}

html[data-theme="dark"] :is(input, textarea)::placeholder { color: #71877d; }

html[data-theme="dark"] :is(input, textarea, select):hover:not(:disabled) {
    border-color: #4e806a !important;
    background-color: #162821 !important;
}

html[data-theme="dark"] :is(input, textarea, select):focus {
    border-color: var(--focus) !important;
    background-color: #182b24 !important;
    box-shadow: 0 0 0 4px rgba(101, 203, 166, .13) !important;
}

html[data-theme="dark"] .hijri-date-fields {
    border-color: #3b6554;
    background: #111f1a;
    box-shadow: 0 5px 16px rgba(0, 0, 0, .16);
}

html[data-theme="dark"] .hijri-picker-trigger {
    border-left-color: #355448;
    color: var(--ink);
}

html[data-theme="dark"] .hijri-picker-segment.year .hijri-picker-trigger {
    border-left-color: transparent;
}

html[data-theme="dark"] .hijri-picker-trigger:is(:hover, :focus-visible) {
    background: #182b24;
    box-shadow: inset 0 0 0 2px rgba(101, 203, 166, .13);
}

html[data-theme="dark"] .hijri-picker-chevron { stroke: #7fd1b2; }

html[data-theme="dark"] .hijri-picker-menu {
    border-color: #3b6554;
    background: #172a22;
    box-shadow: 0 20px 46px rgba(0, 0, 0, .42);
}

html[data-theme="dark"] .hijri-picker-menu button { color: #dce9e3; }
html[data-theme="dark"] .hijri-picker-menu button:hover { background: #203a30; color: #8bddbd; }
html[data-theme="dark"] .hijri-picker-menu button.selected { background: #b98c32; color: #102019; }

html[data-theme="dark"] select:not([multiple]) {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%237fd1b2' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E") !important;
}

html[data-theme="dark"] select option { background: #15251f; color: var(--ink); }
html[data-theme="dark"] select option:checked { background: #2d765d linear-gradient(0deg, #2d765d, #2d765d); color: #fff; }
html[data-theme="dark"] select:disabled { border-color: #293d35 !important; background-color: #17231e !important; color: #71867d !important; }
html[data-theme="dark"] ::picker(select) { border-color: #355448; background: #15251f; box-shadow: 0 20px 48px rgba(0, 0, 0, .42); }

html[data-theme="dark"] .secondary-btn,
html[data-theme="dark"] :is(.table-action, .table-link, .edit-action) {
    border-color: #355448;
    background: #182a23;
    color: #d7e7e0;
}

html[data-theme="dark"] .page :is(.secondary-btn, .logout-btn):not(:disabled):hover,
html[data-theme="dark"] .page .week-navigation .secondary-btn:not(:disabled):hover {
    border-color: #4e806a !important;
    background: #203d32 !important;
    color: #91ddc0 !important;
}

html[data-theme="dark"] .danger-btn,
html[data-theme="dark"] .row-actions .danger-btn {
    border-color: #6f4141;
    background: #352323;
    color: #f09a9a;
}

html[data-theme="dark"] button:disabled,
html[data-theme="dark"] :is(input, select, textarea):disabled { opacity: .58; }

/* Tables, directories and navigation blocks */
html[data-theme="dark"] :is(.data-table-toolbar, .table-pager) {
    border-color: var(--line);
    background: #172922;
}

html[data-theme="dark"] .data-table thead th,
html[data-theme="dark"] th {
    border-color: var(--line);
    background: #1a2e26;
    color: #a7bbb1;
}

html[data-theme="dark"] :is(td, .data-table tbody td) { border-color: var(--line); }
html[data-theme="dark"] .data-table tbody tr:hover { background: #1b3028; }
html[data-theme="dark"] :is(.result-count, .filter-chip, .scope-lock) { border-color: #355448; background: #1a2d26; color: var(--muted); }
html[data-theme="dark"] code { border-color: #355448; background: #101d18; color: #b9e6d4; }

/* Dense feature pages and scoped components */
html[data-theme="dark"] :is(
    .term-card, .rollover-student-row, .rollover-teacher-row,
    .teacher-summary, .supervisor-reactivation-form,
    .student-ward-item, .pending-ward-row,
    .supervisor-self-checkin, .location-capture-card, .approved-location-card,
    .timeline-box-number, .timeline-pending
) {
    border-color: var(--line);
    background: #172922;
    color: var(--ink);
}

html[data-theme="dark"] .table-panel > .report-header {
    border-color: var(--line);
    background: #192d25;
}

html[data-theme="dark"] :is(.rollover-student-row.excluded, .student-ward-item.completed, .supervisor-self-checkin.is-checked, .location-capture-card.is-ready) {
    border-color: #3d715c;
    background: #17382c;
}

html[data-theme="dark"] :is(.student-ward-item.pending, .pending-ward-row, .timeline-pending, .attendance-radius) {
    border-color: #735f32;
    background: #312b1c;
    color: #e7c66d;
}

html[data-theme="dark"] :is(.location-capture-card > span, .approved-location-card > div span) {
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] :is(.circle-multi-select, .permission-option, .switch-item.permission-option, .switch-item.permission-option:has(input:checked)) {
    border-color: var(--line);
    background: #172922;
    color: var(--ink);
}

html[data-theme="dark"] :is(.circle-switch, .permission-option) { border-bottom-color: var(--line); }
html[data-theme="dark"] .permission-count { border-color: #3d715c; background: #1a3b30; color: #86dab9; }
html[data-theme="dark"] .teacher-summary { border-color: var(--line); background: #1b3028; }

/* Exams */
html[data-theme="dark"] .exam-navigation {
    border-color: var(--line);
    background: rgba(16, 31, 25, .9);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .22);
}

html[data-theme="dark"] .exam-mode-tabs {
    border-color: var(--line);
    background: #172922;
}

html[data-theme="dark"] .exam-mode-tabs button.active {
    background: #203d32;
    color: #8fddbf;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .2);
}

html[data-theme="dark"] :is(
    .exam-student-actions article, .exam-week-selector button,
    .exam-day, .exam-candidate-card, .exam-candidate-details,
    .exam-detail-grid > div, .exam-saved-notes, .exam-date-options
) {
    border-color: var(--line);
    background: #172922;
    color: var(--ink);
}

html[data-theme="dark"] .exam-week-selector button.active {
    border-color: #4e806a;
    background: #203d32;
    color: #8fddbf;
}

html[data-theme="dark"] .exam-day.today { border-color: var(--gold); }
html[data-theme="dark"] .exam-calendar-entry.preparing { background: #22302a; color: #b2c2ba; }
html[data-theme="dark"] .exam-calendar-entry.internal { background: #1b3040; color: #91c3e8; }
html[data-theme="dark"] .exam-calendar-entry.passed-internal,
html[data-theme="dark"] .exam-calendar-entry.result-passed { background: #1a3b30; color: #81d8b6; }
html[data-theme="dark"] .exam-calendar-entry.association { background: #382f1d; color: #efc76c; }
html[data-theme="dark"] .exam-calendar-entry.result { background: #30293d; color: #c6a9e8; }
html[data-theme="dark"] .exam-calendar-entry.result-failed { background: #382323; color: #f09595; }
html[data-theme="dark"] .tested-thirty-btn { border-color: #467a64; background: #1c3a30; color: #82d7b7; }
html[data-theme="dark"] .exam-confirm-panel { border-color: #467a64; background: #17382c; }

/* Candidate-list status pills share the calendar palette without retaining light-theme surfaces. */
html[data-theme="dark"] .status-pill.preparing { border: 1px solid #42574e; background: #22302a; color: #b2c2ba; }
html[data-theme="dark"] .status-pill.internal { border: 1px solid #35566d; background: #1b3040; color: #91c3e8; }
html[data-theme="dark"] :is(.status-pill.passed-internal, .status-pill.result-passed) { border: 1px solid #366b56; background: #1a3b30; color: #81d8b6; }
html[data-theme="dark"] .status-pill.association { border: 1px solid #735f32; background: #382f1d; color: #efc76c; }
html[data-theme="dark"] .status-pill.result { border: 1px solid #58496f; background: #30293d; color: #c6a9e8; }
html[data-theme="dark"] .status-pill.result-failed { border: 1px solid #704343; background: #382323; color: #f09595; }

/* Menus and notifications */
html[data-theme="dark"] :is(.account-popover, .notification-popover) {
    border-color: #355448;
    background: rgba(19, 35, 29, .97);
    color: var(--ink);
    box-shadow: 0 24px 65px rgba(0, 0, 0, .42);
}

html[data-theme="dark"] :is(.account-popover-head, .notification-heading) {
    border-color: var(--line);
    background: #192d25;
}

html[data-theme="dark"] :is(.account-popover > a, .account-popover button, .notification-item) {
    border-color: var(--line);
    background: transparent;
    color: var(--ink);
}

html[data-theme="dark"] :is(.account-popover > a, .account-popover button, .notification-item):hover {
    background: #203a30 !important;
    color: #8fddbf !important;
}

html[data-theme="dark"] .notification-section-title { border-color: var(--line); background: #332d1e; color: #efc76c; }
html[data-theme="dark"] .notification-section-title.information { background: #193128; color: #80d7b7; }

/* Empty, status and feedback states */
html[data-theme="dark"] .smart-empty { border-color: #3b5a4d; background: #14251f; }
html[data-theme="dark"] .smart-empty-icon { background: #1e3b31; color: #77d0ae; }
html[data-theme="dark"] :is(.form-note, .save-message) { border-color: #315548; background: #19372d; color: #8bdab9; }
html[data-theme="dark"] :is(.credentials, .plan-alert, .announcement-confirmation, .student-existing-plan, .plan-alert-summary) { border-color: #766235; background: #2c281b; color: #e6c878; }
html[data-theme="dark"] :is(.error-message, .status-pill.rejected, .status-pill.reject) { border-color: #704343 !important; background: #382323 !important; color: #f09595 !important; }
html[data-theme="dark"] :is(.report-calculation-grid article, .followup-grid article) { border-color: var(--line); background: var(--surface-subtle); }
html[data-theme="dark"] .report-scope-summary {
    border-color: #355448;
    background: linear-gradient(135deg, rgba(27, 55, 45, .96), rgba(44, 40, 27, .9));
    box-shadow: inset 0 3px 0 rgba(214, 170, 76, .85), 0 12px 30px rgba(0, 0, 0, .2);
}
html[data-theme="dark"] .report-scope-summary > b,
html[data-theme="dark"] .report-scope-summary .result-count { color: #8bdab9; }
html[data-theme="dark"] .report-scope-summary .result-count {
    border-color: #456b5b;
    background: rgba(17, 31, 26, .78);
}
html[data-theme="dark"] .report-filter-dock {
    border-color: #355448;
    background: linear-gradient(145deg, rgba(21, 42, 34, .98), rgba(17, 31, 26, .96));
    box-shadow: inset 0 3px 0 rgba(214, 170, 76, .82), 0 14px 34px rgba(0, 0, 0, .24);
}
html[data-theme="dark"] .report-filter-dock :is(label, .report-filter-date-range > span, .personal-period-panel > span) { color: #8bdab9; }
html[data-theme="dark"] .report-filter-dock select:not([multiple]) {
    border-color: #3b6554 !important;
    background-color: #102019 !important;
    background-image: none !important;
    color: var(--ink) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
}
html[data-theme="dark"] .report-filter-dock select:not([multiple]):hover:not(:disabled) {
    border-color: #568872 !important;
    background-color: #172b23 !important;
}
html[data-theme="dark"] .report-filter-dock select:not([multiple]):focus {
    border-color: var(--focus) !important;
    background-color: #182b24 !important;
    box-shadow: 0 0 0 3px rgba(101, 203, 166, .14) !important;
}
html[data-theme="dark"] .report-filter-dock select:not([multiple])::picker-icon { display: none !important; }
html[data-theme="dark"] .report-positive-state { border-color: #315b49; background: #183427; color: #79d9b4; }
html[data-theme="dark"] :is(.report-comparison.up, .report-status-summary .excellent, .student-report-status.excellent) { background: #183b2d; color: #79d9b4; }
html[data-theme="dark"] :is(.report-comparison.down, .report-status-summary .attention, .student-report-status.attention, .attention-count) { background: #3a2525; color: #f09595; }
html[data-theme="dark"] :is(.report-status-summary .regular, .student-report-status.regular) { background: #1e3440; color: #8fc6e8; }
html[data-theme="dark"] :is(.circle-matrix-legend .present, .matrix-status.present, .circle-matrix-legend .completed, .matrix-ward.completed) { background: #183b2d; color: #79d9b4; }
html[data-theme="dark"] :is(.circle-matrix-legend .late, .matrix-status.late, .circle-matrix-legend .partial, .matrix-ward.partial) { background: #312b1c; color: #e7c66d; }
html[data-theme="dark"] :is(.circle-matrix-legend .absent, .matrix-status.absent, .circle-matrix-legend .pending, .matrix-ward.pending) { background: #3a2525; color: #f09595; }
html[data-theme="dark"] :is(.circle-matrix-legend .excused, .matrix-status.excused) { background: #1e3440; color: #8fc6e8; }
html[data-theme="dark"] :is(.status-pill.approved, .status-pill.approve, .success-pill, .surah-pill, .account-status.is-active) { border-color: #366b56; background: #1a3b30; color: #81d8b6; }
html[data-theme="dark"] :is(.status-pill.pending, .account-status.is-locked) { border-color: #735f32; background: #312b1c; color: #e7c66d; }
html[data-theme="dark"] .account-status.is-disabled { border-color: #704343; background: #382323; color: #f09595; }
html[data-theme="dark"] .kpi-state { background: #1a3b30; color: #81d8b6; }
html[data-theme="dark"] .status-medium .kpi-state { background: #312b1c; color: #e7c66d; }
html[data-theme="dark"] .status-low .kpi-state { background: #382323; color: #f09595; }
html[data-theme="dark"] .status-neutral .kpi-state { background: #22302a; color: #a7bbb1; }

/* Report KPIs sit outside the dashboard grid and need their own dark icon treatment. */
html[data-theme="dark"] .report-kpi-grid .stat-icon {
    border: 1px solid transparent;
    box-shadow: none;
}

html[data-theme="dark"] .report-kpi-grid :is(.stat-icon.green, .stat-icon.blue) {
    border-color: rgba(61, 113, 92, .55);
    background: #1c4033;
    color: #82d7b7;
}

html[data-theme="dark"] .report-kpi-grid .stat-icon.gold {
    border-color: rgba(115, 95, 50, .7);
    background: #3a311e;
    color: #efc76c;
}

html[data-theme="dark"] .report-kpi-grid .stat-icon.red {
    border-color: #704343;
    background: #382323;
    color: #f09595;
}

html[data-theme="dark"] :is(.mobile-card-chevron, .report-card-chevron) {
    border-color: #355448;
    background: #1b3028;
    color: #81d8b6;
    box-shadow: none;
}

html[data-theme="dark"] .mobile-expanded .mobile-card-chevron,
html[data-theme="dark"] .report-mobile-card[open] .report-card-chevron,
html[data-theme="dark"] .supervisor-student-card[open] .report-card-chevron {
    border-color: #1d7257;
    background: #1d7257;
    color: #fff;
}

/* Profile facts must use a dark surface; the light card made both labels and values unreadable. */
html[data-theme="dark"] .profile-details > div {
    border-color: #355448;
    background: #192d25;
    color: var(--ink);
}

html[data-theme="dark"] .profile-details small { color: var(--muted); }
html[data-theme="dark"] .profile-details b { color: var(--ink); }
html[data-theme="dark"] .profile-monogram { background: #1d7257; color: #fff; }

/* Plans, progress and dense cards */
html[data-theme="dark"] :is(
    .monthly-plan, .monthly-week, .monthly-day, .daily-plan-card,
    .golden-config,
    .review-config-card, .review-ward-card, .review-definition-card,
    .review-first-day, .personal-week-card, .personal-week-summary article,
    .plan-requirement-row, .inline-assessment, .extra-achievement-panel,
    .student-navigator, .student-guardian-management, .student-guardian-list article,
    .supervisor-student-card, .supervisor-student-details
) {
    border-color: var(--line);
    background-color: #162720;
    background-image: none;
    color: var(--ink);
}

html[data-theme="dark"] .golden-config :is(label, h3, b) { color: var(--ink); }
html[data-theme="dark"] .golden-config :is(.field-hint, .review-config-card-header span) { color: var(--muted); }
html[data-theme="dark"] .plan-box.golden-preview {
    border: 1px solid #355448;
    background: #192d25;
    color: var(--ink);
}
html[data-theme="dark"] .plan-box.golden-preview b { color: var(--ink); }
html[data-theme="dark"] .plan-box.golden-preview strong { color: #65cba6; }
html[data-theme="dark"] .plan-box.golden-preview span { color: var(--muted); }
html[data-theme="dark"] .plan-review-grid > div,
html[data-theme="dark"] .review-plan-summary > div {
    border-color: #355448;
    background: #192d25;
    color: var(--ink);
}
html[data-theme="dark"] .plan-review-grid small,
html[data-theme="dark"] .review-plan-summary small { color: var(--muted); }
html[data-theme="dark"] .plan-review-grid b,
html[data-theme="dark"] .review-plan-summary b { color: var(--ink); }
html[data-theme="dark"] .golden-config .optional-plan-field.is-disabled {
    color: var(--muted);
    opacity: .68;
}
html[data-theme="dark"] .golden-config .optional-plan-field.is-disabled input {
    border-color: #293d35 !important;
    background: #17231e !important;
    color: #71867d !important;
}

html[data-theme="dark"] :is(.monthly-week-header, .monthly-day > header, .assessment-passage, .week-mini-progress span) {
    border-color: var(--line);
    background: #1b3229;
    color: #8bdab9;
}

/* Dashboard announcements must stay on the same dark surface as the surrounding panel. */
html[data-theme="dark"] .dashboard-announcements {
    border-color: #355448;
    background: linear-gradient(135deg, #142820, #172c24);
}

html[data-theme="dark"] .dashboard-announcement-card {
    border-color: #3b5b4e;
    background: #192d25;
    color: var(--ink);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .16);
}

html[data-theme="dark"] .dashboard-announcement-card :is(b, p) { color: var(--ink); }
html[data-theme="dark"] .dashboard-announcement-meta small { color: #9fb6ab; }
html[data-theme="dark"] .dashboard-announcement-card .stat-icon.gold {
    border: 1px solid #735f32;
    background: #3a311e;
    color: #efc76c;
    box-shadow: none;
}
html[data-theme="dark"] .dashboard-announcement-card .secondary-btn {
    border-color: #4a6a5c;
    background: #20392f;
    color: #dbeae4;
}

html[data-theme="dark"] .dashboard-announcement-card .secondary-btn:hover {
    border-color: #d6aa4c;
    background: #332d1e;
    color: #efc76c;
}

/* Quran plan tables previously retained a white body in dark mode. */
html[data-theme="dark"] .requirement-table {
    border-color: #456557;
    background: #14251f;
    color: var(--ink);
}

html[data-theme="dark"] .requirement-table th {
    border-color: #3c5b4e;
    background: #1d382e;
    color: #b8d5c9;
}

html[data-theme="dark"] .requirement-table td {
    border-color: #355448;
    background: #172a22;
    color: #e2eee9;
}

html[data-theme="dark"] .monthly-plan-period {
    border: 1px solid #3d6756;
    background: #1b3a2f;
    color: #8bdab9;
}

html[data-theme="dark"] :is(.monthly-week-header > b, .timeline-component-rates > b) {
    border: 1px solid #735f32;
    background: #332d1e;
    color: #efc76c;
}

/* Expanded plan timeline: remove the light table cell and soften day dividers. */
html[data-theme="dark"] .plan-month-row > td {
    border-color: #29463a !important;
    background: #102019 !important;
}

html[data-theme="dark"] .monthly-days {
    border-color: #29463a;
    background: #13241d;
}

html[data-theme="dark"] .monthly-day {
    border-inline-start: 1px solid #29463a;
}

html[data-theme="dark"] .monthly-day:first-child {
    border-inline-start: 0;
}

html[data-theme="dark"] .next-ward-btn {
    border-color: #806a38;
    background: #302a1c;
    color: #efc76c;
}

html[data-theme="dark"] .next-ward-btn:hover:not(:disabled) {
    border-color: #d6aa4c;
    background: #3a311e;
    color: #ffe19a;
}

html[data-theme="dark"] .plan-requirement-row.completed,
html[data-theme="dark"] .achievement-row.done { border-color: #3d725d; background: #17382c; }
html[data-theme="dark"] .achievement-row.late { background: #302a1c; }
html[data-theme="dark"] .achievement-row.missed { background: #352222; }
html[data-theme="dark"] .achievement-row.upcoming { background: #17251f; }
html[data-theme="dark"] .metric-ring {
    background: conic-gradient(#48b38d calc(var(--metric-rate) * 1%), #263c33 0);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .24);
}
html[data-theme="dark"] .metric-ring.attendance {
    background: conic-gradient(#d6aa4c calc(var(--metric-rate) * 1%), #3a3323 0);
}
html[data-theme="dark"] .metric-ring::before { background: #15251f; }
html[data-theme="dark"] .metric-ring b,
html[data-theme="dark"] .student-compact-identity b { color: var(--ink); }
html[data-theme="dark"] .metric-bar-track { background: #263c33; }
html[data-theme="dark"] .student-compact-rates em { background: #1a3a30; color: #83d8b8; }
html[data-theme="dark"] .student-compact-rates em + em { background: #322c1d; color: #e5c36b; }
html[data-theme="dark"] .supervisor-student-card .report-card-chevron,
html[data-theme="dark"] .supervisor-student-card[open] .report-card-chevron {
    width: 22px;
    height: 22px;
    flex-basis: 22px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #82d7b7;
    box-shadow: none;
}

/* Permissions and supervisor editors */
html[data-theme="dark"] :is(.permission-area-tabs, .permission-area-tab, .permission-selector, .permissions-editor, .permission-group, .permission-option, .permission-presets, .circle-permission-group, .circle-permission-row, .attendance-delegation, .student-circle-permissions, .teacher-permissions) {
    border-color: var(--line);
    background-color: #162720;
    color: var(--ink);
}

html[data-theme="dark"] .permission-area-tab:hover { border-color: #8c7139; background: #302a1d; color: #efc76c; }
html[data-theme="dark"] .permission-area-tab.is-active { border-color: #467a64; background: #1c3a30; color: #82d7b7; }
html[data-theme="dark"] .permission-option:has(input:checked) { background: #19352b; }
html[data-theme="dark"] .permission-option input[type="checkbox"] {
    border-color: #56675f !important;
    background-color: transparent !important;
    background-image: none !important;
}
html[data-theme="dark"] .permission-option input[type="checkbox"]:checked {
    border-color: #d2aa54 !important;
    background-color: #d2aa54 !important;
}
html[data-theme="dark"] .permission-option:hover input[type="checkbox"]:not(:checked) {
    border-color: #788980 !important;
    background-color: transparent !important;
}
html[data-theme="dark"] .permission-option:hover input[type="checkbox"]:checked {
    border-color: #e0ba67 !important;
    background-color: #e0ba67 !important;
}
html[data-theme="dark"] .system-feature-grid .global-feature-option,
html[data-theme="dark"] .system-feature-grid .global-feature-option:has(input:checked) {
    border-color: #355448;
    background: linear-gradient(145deg, #192d25, #14251f);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .16);
}
html[data-theme="dark"] .system-feature-grid .global-feature-select {
    border-bottom-color: #4a705f;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .16), inset 0 -1px 0 #4a705f;
}
html[data-theme="dark"] .attendance-days-trigger {
    border-color: #3a5b4d;
    background: #102019;
    color: var(--ink);
    box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}
html[data-theme="dark"] .attendance-days-trigger:hover:not(:disabled) {
    border-color: #5c806f;
    background: #1b3028;
}
html[data-theme="dark"] .attendance-days-menu {
    border-color: #3d5d50;
    background: linear-gradient(180deg, #172922, #12231c);
    box-shadow: 0 20px 48px rgba(0, 0, 0, .42);
}
html[data-theme="dark"] .attendance-days-option:hover {
    border-color: #3d5d50;
    background: #1b3229;
}
html[data-theme="dark"] .attendance-days-option.selected {
    border-color: #9f7d39;
    background: #302a1c;
}
html[data-theme="dark"] .circle-permission-group h3 { border-color: var(--line); background: #1b3028; }

/* Login and public pages */
html[data-theme="dark"] :is(.login-page, .welcome-login-page) {
    background:
        radial-gradient(circle at 12% 12%, rgba(214, 170, 76, .10), transparent 28rem),
        radial-gradient(circle at 86% 34%, rgba(72, 179, 141, .12), transparent 34rem),
        linear-gradient(145deg, #0c1712, #102019 52%, #151b14);
}

html[data-theme="dark"] .welcome-login-page::after { background: rgba(7, 16, 12, .28); }
html[data-theme="dark"] .login-card,
html[data-theme="dark"] .welcome-login-page .login-card {
    border-color: rgba(67, 99, 85, .8);
    background: rgba(18, 35, 29, .9);
    color: var(--ink);
    box-shadow: 0 30px 85px rgba(0, 0, 0, .38);
}

html[data-theme="dark"] .forgot-password-help { border-color: #355448; background: rgba(24, 47, 38, .82); color: #c7d9d1; }
html[data-theme="dark"] .demo-login { border-color: #3b554a; background: #13231d; }
html[data-theme="dark"] .login-home-mark { color: #dbeae4; }
html[data-theme="dark"] .login-home-mark:hover { color: #8bddbd; }
html[data-theme="dark"] .login-backdrop-copy strong { color: #dcebe5; }
html[data-theme="dark"] .login-backdrop-card { border-color: #3d6e5a; background: rgba(20, 42, 34, .82); color: #d9ebe3; }
html[data-theme="dark"] .login-welcome-backdrop { opacity: .34; filter: saturate(.9); }

/* The keyboard skip link uses --ink as a background in light mode; invert it explicitly in dark mode. */
html[data-theme="dark"] .skip-link {
    border: 1px solid #4e806a;
    background: #17382c;
    color: #eef5f1;
}

html[data-theme="dark"] .public-home {
    color: var(--ink);
    background:
        radial-gradient(circle at 12% 12%, rgba(214, 170, 76, .10), transparent 28rem),
        radial-gradient(circle at 86% 34%, rgba(72, 179, 141, .12), transparent 34rem),
        linear-gradient(145deg, #0c1712, #102019 52%, #151b14);
}

html[data-theme="dark"] .public-home .public-glass {
    border-color: rgba(59, 88, 76, .85);
    background-image:
        radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(84, 151, 125, .10), transparent 38%),
        linear-gradient(145deg, rgba(24, 45, 38, .92), rgba(13, 28, 22, .78));
    color: var(--ink);
    box-shadow: 0 24px 65px rgba(0, 0, 0, .27);
}

html[data-theme="dark"] :is(.public-brand, .public-nav nav a, .public-hero h1, .public-section-heading h2, .public-journey h2, .public-contact h2, .public-email) { color: var(--ink); }
html[data-theme="dark"] :is(.public-hero-copy > p, .public-trust, .public-section-heading p, .public-feature p, .public-journey p, .public-contact p) { color: var(--muted); }
html[data-theme="dark"] .public-kicker { border-color: #355a4a; background: rgba(25, 56, 45, .82); color: #89d9ba; }
html[data-theme="dark"] .public-text-action { border-color: #527867; color: #9bdcc3; }
html[data-theme="dark"] .visual-progress { background: #293d35; }
html[data-theme="dark"] .visual-days i { background: #21342c; color: #a8bbb2; }
html[data-theme="dark"] .visual-days i.done { background: #1c4033; color: #8eddbd; }
html[data-theme="dark"] .visual-icon { background: #1c4033; color: #8eddbd; }
html[data-theme="dark"] .visual-icon.gold { background: #382f1d; color: #efc76c; }
html[data-theme="dark"] .public-journey li { border-color: var(--line); }
html[data-theme="dark"] .public-email { border-color: #3b5d4e; background: rgba(22, 43, 35, .84); }
html[data-theme="dark"] .public-email-icon { background: linear-gradient(145deg, #1d4033, #3a311e); color: #9addc4; }
html[data-theme="dark"] .public-footer { border-color: #2d483c; background: rgba(10, 24, 18, .72); }

/* Dialogs */
html[data-theme="dark"] .plan-delete-backdrop { background: rgba(2, 9, 6, .7); }
html[data-theme="dark"] .plan-delete-dialog { border-color: #3d5d50; background: #172821; color: var(--ink); }
html[data-theme="dark"] #components-reconnect-modal {
    border: 1px solid #3d5d50;
    background: #172821;
    color: var(--ink);
    box-shadow: 0 24px 65px rgba(0, 0, 0, .45);
}

html[data-theme="dark"] #components-reconnect-modal button {
    background: #1d7b5e;
    color: #fff;
}

/* The plan preview stays paper-white; only its surrounding toolbar follows the theme. */
html[data-theme="dark"] .plan-pdf-toolbar {
    border-color: var(--line);
    background: #13241d;
}

html[data-theme="dark"] .plan-pdf-document { background: #0f1b16; }

@media (max-width: 820px) {
    .top-row > .theme-toggle { margin-right: 0; }
    .theme-toggle { width: 38px; height: 38px; flex-basis: 38px; border-radius: 11px; }
    .theme-toggle-icon .app-icon { width: 17px; height: 17px; }
    .theme-toggle-floating { top: 20px; left: 14px; }
}

@media (max-width: 390px) {
    .top-row > .theme-toggle { width: 35px; height: 35px; flex-basis: 35px; }
    .theme-toggle-public { width: 36px; height: 36px; flex-basis: 36px; }
}

@media (max-width: 820px) {
    html[data-theme="dark"] :is(.mobile-card-table, .plan-mobile-table) {
        background: #13241d;
    }

    html[data-theme="dark"] .mobile-card-table tr,
    html[data-theme="dark"] .plan-mobile-table .plan-summary-row,
    html[data-theme="dark"] .plan-mobile-table .empty-row {
        border-color: #355448;
        background: #172922;
        color: var(--ink);
        box-shadow: 0 8px 22px rgba(0, 0, 0, .2);
    }

    html[data-theme="dark"] .mobile-card-table td,
    html[data-theme="dark"] .plan-mobile-table .plan-summary-row td {
        border-color: var(--line);
        background: #172922;
        color: var(--ink);
    }

    html[data-theme="dark"] .mobile-card-table td:first-child,
    html[data-theme="dark"] .plan-mobile-table .plan-summary-row td:first-child,
    html[data-theme="dark"] .plan-mobile-table .mobile-expanded td:first-child {
        border-color: var(--line);
        background: #1b3028;
        color: var(--ink);
    }
}

/* Student attendance cards keep the same quiet dark surfaces on mobile. */
html[data-theme="dark"] .attendance-card-panel {
    background: #102019;
}

html[data-theme="dark"] .attendance-mobile-table tr {
    border-color: #355448;
    background: #172922;
    color: var(--ink);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .2);
}

html[data-theme="dark"] .attendance-mobile-table tr.attendance-marked {
    border-color: #3d715c;
}

html[data-theme="dark"] .attendance-mobile-table .attendance-student {
    border-color: var(--line);
    background: #1b3028;
    color: var(--ink);
}

html[data-theme="dark"] .attendance-mobile-table .segmented button:not(.selected),
html[data-theme="dark"] .attendance-mobile-table .table-input,
html[data-theme="dark"] .attendance-note-toggle {
    border-color: #355448;
    background: #102019;
    color: var(--ink);
}

html[data-theme="dark"] .attendance-mobile-table .segmented button:not(.selected):hover:not(:disabled),
html[data-theme="dark"] .attendance-note-toggle:hover:not(:disabled) {
    border-color: #d6aa4c !important;
    background: #302a1c !important;
    color: #efc76c !important;
}

html[data-theme="dark"] .attendance-mobile-table .table-input::placeholder {
    color: #6f877c;
}

html[data-theme="dark"] .plan-requirement-check input[type="checkbox"] {
    border-color: #527867;
    background: #102019;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .22);
}

html[data-theme="dark"] .check-item:not(.switch-item) > input[type="checkbox"] {
    border-color: #527867;
    background: #102019;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .22);
}

html[data-theme="dark"] .check-item:not(.switch-item) > input[type="checkbox"]:checked {
    border-color: #48b38d;
    background: #247d60;
    box-shadow: 0 0 0 3px rgba(72, 179, 141, .16);
}

html[data-theme="dark"] .check-item:not(.switch-item) > input[type="checkbox"]:hover:not(:disabled) {
    border-color: #d6aa4c;
    box-shadow: 0 0 0 4px rgba(214, 170, 76, .16);
}

html[data-theme="dark"] .plan-wizard .wizard-actions {
    border-color: var(--line);
    background: #172922;
}

html[data-theme="dark"] .plan-requirement-check input[type="checkbox"]:checked {
    border-color: #1d7257;
    background: #1d7257;
    box-shadow: 0 0 0 3px rgba(72, 179, 141, .16);
}

html[data-theme="dark"] .plan-requirement-check input[type="checkbox"]:hover:not(:disabled) {
    border-color: #d6aa4c;
    box-shadow: 0 0 0 4px rgba(214, 170, 76, .16);
}

@media (prefers-reduced-motion: reduce) {
    .theme-toggle { transition: none; }
}

/* Printed reports and PDF exports remain light and ink-friendly. */
@media print {
    html[data-theme="dark"] {
        color-scheme: light;
        --ink: #17221e;
        --muted: #60756d;
        --line: #d7e5de;
        --surface: #fff;
        --surface-subtle: #f6faf8;
    }

    html[data-theme="dark"] body,
    html[data-theme="dark"] :is(.panel, .stat-card, .page-heading, .report-area, .table-panel, .data-table thead th, input, select, textarea) {
        border-color: #d7e5de !important;
        background: #fff !important;
        color: #17221e !important;
        box-shadow: none !important;
    }

    .theme-toggle { display: none !important; }
}