/* assets/css/dark.css - black (dark) theme for the whole LMS.
 * Active when <html data-theme="dark">. Switched with the moon / sun button next to the language
 * buttons; the choice is kept in the "lms_theme" cookie. Pages need no changes: everything here
 * only overrides colours. Question / paper images keep their own colours so they stay readable.
 */
html[data-theme="dark"] {
    --dk-bg: #11141c;
    --dk-panel: #1a1f2b;
    --dk-panel-2: #222838;
    --dk-line: #2f3648;
    --dk-text: #e3e7ef;
    --dk-muted: #9aa4b8;
    --dk-link: #8fa6ff;
    color-scheme: dark;
}

/* ---------- page ---------- */
html[data-theme="dark"] body { background: var(--dk-bg) !important; color: var(--dk-text) !important; }
html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3,
html[data-theme="dark"] h4, html[data-theme="dark"] h5, html[data-theme="dark"] h6,
html[data-theme="dark"] .h1, html[data-theme="dark"] .h2, html[data-theme="dark"] .h3,
html[data-theme="dark"] .h4, html[data-theme="dark"] .h5, html[data-theme="dark"] .h6,
html[data-theme="dark"] label, html[data-theme="dark"] legend, html[data-theme="dark"] strong,
html[data-theme="dark"] b, html[data-theme="dark"] th, html[data-theme="dark"] td, html[data-theme="dark"] dt { color: inherit; }
html[data-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):not(.badge):not(.list-group-item):not(.page-link) { color: var(--dk-link); }
html[data-theme="dark"] .text-dark, html[data-theme="dark"] .text-body, html[data-theme="dark"] .text-black { color: var(--dk-text) !important; }
html[data-theme="dark"] .text-muted, html[data-theme="dark"] .text-secondary, html[data-theme="dark"] .form-text,
html[data-theme="dark"] .small.text-muted, html[data-theme="dark"] small.text-muted { color: var(--dk-muted) !important; }
html[data-theme="dark"] hr { border-color: var(--dk-line); opacity: 1; }
html[data-theme="dark"] .border, html[data-theme="dark"] .border-top, html[data-theme="dark"] .border-bottom,
html[data-theme="dark"] .border-start, html[data-theme="dark"] .border-end, html[data-theme="dark"] [class*="border-"]:not([class*="border-primary"]):not([class*="border-success"]):not([class*="border-danger"]):not([class*="border-warning"]):not([class*="border-info"]):not([class*="border-0"]) { border-color: var(--dk-line) !important; }

/* ---------- surfaces (Bootstrap) ---------- */
html[data-theme="dark"] .card:not([class*="bg-"]):not(.text-white), html[data-theme="dark"] .card:not([class*="bg-"]) > .card-header, html[data-theme="dark"] .card:not([class*="bg-"]) > .card-footer,
html[data-theme="dark"] .modal-content, html[data-theme="dark"] .dropdown-menu, html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .offcanvas, html[data-theme="dark"] .toast, html[data-theme="dark"] .popover, html[data-theme="dark"] .accordion-item,
html[data-theme="dark"] .accordion-button, html[data-theme="dark"] .bg-white, html[data-theme="dark"] .bg-body {
    background-color: var(--dk-panel) !important; color: var(--dk-text) !important; border-color: var(--dk-line) !important;
}
html[data-theme="dark"] .bg-light, html[data-theme="dark"] .table-light, html[data-theme="dark"] .table-light th,
html[data-theme="dark"] .table-light td, html[data-theme="dark"] thead.table-light tr, html[data-theme="dark"] .card-header.bg-light,
html[data-theme="dark"] .accordion-button:not(.collapsed) { background-color: var(--dk-panel-2) !important; color: var(--dk-text) !important; }
html[data-theme="dark"] .modal-header, html[data-theme="dark"] .modal-footer { border-color: var(--dk-line) !important; }
html[data-theme="dark"] .btn-close { filter: invert(1) grayscale(1) brightness(1.6); }
html[data-theme="dark"] .dropdown-item { color: var(--dk-text); }
html[data-theme="dark"] .dropdown-item:hover, html[data-theme="dark"] .dropdown-item:focus { background: var(--dk-panel-2); color: #fff; }
html[data-theme="dark"] .dropdown-divider { border-color: var(--dk-line); }
html[data-theme="dark"] .shadow, html[data-theme="dark"] .shadow-sm { box-shadow: 0 2px 10px rgba(0,0,0,.45) !important; }

/* tables */
html[data-theme="dark"] .table { color: var(--dk-text); border-color: var(--dk-line); --bs-table-bg: transparent; --bs-table-striped-bg: rgba(255,255,255,.03); --bs-table-hover-bg: rgba(255,255,255,.05); --bs-table-striped-color: var(--dk-text); --bs-table-hover-color: var(--dk-text); }
html[data-theme="dark"] .table > :not(caption) > * > * { border-bottom-color: var(--dk-line); color: inherit; }
html[data-theme="dark"] .table-hover > tbody > tr:hover > * { color: var(--dk-text); }
html[data-theme="dark"] .table-success, html[data-theme="dark"] .table-success > * { --bs-table-bg: rgba(25,135,84,.18); color: var(--dk-text) !important; }
html[data-theme="dark"] .table-danger, html[data-theme="dark"] .table-danger > * { --bs-table-bg: rgba(220,53,69,.18); color: var(--dk-text) !important; }
html[data-theme="dark"] .table-warning, html[data-theme="dark"] .table-warning > * { --bs-table-bg: rgba(255,193,7,.15); color: var(--dk-text) !important; }
html[data-theme="dark"] .table-info, html[data-theme="dark"] .table-info > * { --bs-table-bg: rgba(13,202,240,.14); color: var(--dk-text) !important; }
html[data-theme="dark"] .table-primary, html[data-theme="dark"] .table-primary > * { --bs-table-bg: rgba(102,126,234,.18); color: var(--dk-text) !important; }

/* forms */
html[data-theme="dark"] .form-control, html[data-theme="dark"] .form-select, html[data-theme="dark"] .input-group-text,
html[data-theme="dark"] textarea, html[data-theme="dark"] input[type="text"], html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="number"], html[data-theme="dark"] input[type="password"], html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="url"], html[data-theme="dark"] input[type="date"], html[data-theme="dark"] input[type="datetime-local"],
html[data-theme="dark"] input[type="time"], html[data-theme="dark"] input[type="search"], html[data-theme="dark"] select {
    background-color: #151925 !important; color: var(--dk-text) !important; border-color: var(--dk-line) !important;
}
html[data-theme="dark"] .form-control::placeholder, html[data-theme="dark"] textarea::placeholder { color: #6f788c !important; }
html[data-theme="dark"] .form-control:disabled, html[data-theme="dark"] .form-control[readonly], html[data-theme="dark"] .form-select:disabled { background-color: #1d2230 !important; color: var(--dk-muted) !important; }
html[data-theme="dark"] .form-select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23aab3c5' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important; }
html[data-theme="dark"] .form-check-input { background-color: #151925; border-color: #4a5370; }
html[data-theme="dark"] .form-check-input:checked { background-color: #667eea; border-color: #667eea; }
html[data-theme="dark"] .form-control:focus, html[data-theme="dark"] .form-select:focus { border-color: #667eea !important; box-shadow: 0 0 0 .2rem rgba(102,126,234,.25); }

/* navigation */
html[data-theme="dark"] .nav-tabs { border-color: var(--dk-line); }
html[data-theme="dark"] .nav-tabs .nav-link { color: var(--dk-muted); }
html[data-theme="dark"] .nav-tabs .nav-link:hover { border-color: var(--dk-line); color: var(--dk-text); }
html[data-theme="dark"] .nav-tabs .nav-link.active { background: var(--dk-panel); color: #fff; border-color: var(--dk-line) var(--dk-line) var(--dk-panel); }
html[data-theme="dark"] .nav-pills .nav-link:not(.active) { color: var(--dk-muted); }
html[data-theme="dark"] .page-link { background: var(--dk-panel); border-color: var(--dk-line); color: var(--dk-text); }
html[data-theme="dark"] .page-item.active .page-link { background: #667eea; border-color: #667eea; color: #fff; }
html[data-theme="dark"] .page-item.disabled .page-link { background: var(--dk-panel); color: #5d6579; }
html[data-theme="dark"] .breadcrumb-item, html[data-theme="dark"] .breadcrumb-item.active { color: var(--dk-muted); }

/* buttons */
html[data-theme="dark"] .btn-light { background: var(--dk-panel-2); border-color: var(--dk-line); color: var(--dk-text); }
html[data-theme="dark"] .btn-light:hover { background: #2b3245; color: #fff; }
html[data-theme="dark"] .btn-outline-secondary { color: #b9c1d3; border-color: #4a5370; }
html[data-theme="dark"] .btn-outline-secondary:hover { background: #3a4257; color: #fff; }
html[data-theme="dark"] .btn-outline-dark { color: var(--dk-text); border-color: #69728a; }
html[data-theme="dark"] .btn-outline-dark:hover { background: #3a4257; color: #fff; }
html[data-theme="dark"] .btn-outline-primary { color: #9fb2ff; border-color: #667eea; }
html[data-theme="dark"] .btn-outline-primary:hover { background: #667eea; color: #fff; }
html[data-theme="dark"] .btn-outline-info { color: #7fe0f5; }
html[data-theme="dark"] .btn-outline-success { color: #7fd6a8; border-color: #2f9e6a; }
html[data-theme="dark"] .btn-dark { background: #2b3245; border-color: #2b3245; }
html[data-theme="dark"] .btn-white, html[data-theme="dark"] .btn.bg-white { background: var(--dk-panel-2) !important; color: var(--dk-text) !important; }

/* alerts & badges: darker tints, readable text */
html[data-theme="dark"] .alert { border-color: transparent; }
html[data-theme="dark"] .alert-info      { background: rgba(13,202,240,.14);  color: #9fe6f6; }
html[data-theme="dark"] .alert-success   { background: rgba(25,135,84,.2);    color: #9fe0bf; }
html[data-theme="dark"] .alert-warning   { background: rgba(255,193,7,.15);   color: #ffe08a; }
html[data-theme="dark"] .alert-danger    { background: rgba(220,53,69,.2);    color: #f5a8b1; }
html[data-theme="dark"] .alert-primary   { background: rgba(102,126,234,.2);  color: #c3cdff; }
html[data-theme="dark"] .alert-secondary, html[data-theme="dark"] .alert-light { background: var(--dk-panel-2); color: var(--dk-text); }
html[data-theme="dark"] .alert .alert-link { color: inherit; }
html[data-theme="dark"] .badge.bg-light { background: #2b3245 !important; color: var(--dk-text) !important; }
html[data-theme="dark"] .bg-opacity-10 { --bs-bg-opacity: .18; }
html[data-theme="dark"] .progress { background: #262c3c; }
html[data-theme="dark"] code { color: #ff8fc0; }
html[data-theme="dark"] pre, html[data-theme="dark"] code.bg-light, html[data-theme="dark"] code.d-block { background: #151925 !important; color: #e3e7ef; }
html[data-theme="dark"] blockquote, html[data-theme="dark"] .rt blockquote { color: var(--dk-muted) !important; border-color: var(--dk-line) !important; }
html[data-theme="dark"] .list-group-item.active { background: #667eea !important; border-color: #667eea !important; }

/* ---------- LMS panels (custom page classes with a white / light background) ---------- */
html[data-theme="dark"] :is(.card-box, .image-upload-box, .sv-chip, .pv-card, .kg-in, .vs-tab, .toc, .sv-month, .question-display,
  .progress-container, .option-display, .mode-box, .mini-stat, .ls-card, .level-card, .grade-filter, .explain-box, .bubble,
  .vf-btn, .topic-row, .topic-chip, .timed-toggle-card, .sv-panel, .sv-newpw, .sv-head, .stats-card, .stat-card, .sms-preview,
  .sheet-save, .sheet-row, .session-row, .score-tile, .scheme-preview, .req-item, .qa-thumb, .qa-row-attn, .qa-card, .q-source,
  .pv-del, .price-tag, .payment-warning, .pay-instructions, .pa-toolbar, .p2-card, .opt-line, .nt-card, .note-sec, .note-item,
  .live-card, .le-card, .grade-option, .focus-card, .feedback-box, .exam-row, .exam-card, .ec-stat, .drop-zone, .champ-row,
  .cat-pick, .box, .ans-pill, .att-item, .att-row, .table-card, .content-card, .dash-card, .welcome-card, .result-card, .question-card,
  .video-card, .announcement-card, .quote-card, .info-card, .chart-card, .filter-card, .topbar, .exam-header, .question-navigator,
  .options-container, .option-label, .tab-content, .gf-btn, .stat-box, .summary-card, .profile-card, .payment-card,
  .lms-panel, .panel, .widget, .tile) {
    background-color: var(--dk-panel) !important; color: var(--dk-text) !important; border-color: var(--dk-line) !important;
}
html[data-theme="dark"] :is(.note-item, .sheet-row, .opt-line, .exam-row, .session-row, .topic-row, .req-item, .champ-row) { background-color: var(--dk-panel-2) !important; }
html[data-theme="dark"] :is(.option-label:hover, .grade-option:hover, .gf-btn:hover, .toc a:hover, .ls-card:hover) { background-color: var(--dk-panel-2) !important; }
html[data-theme="dark"] :is(.option-label.selected, .grade-option.selected, .gf-btn.is-active, .level-card.on) { background-color: rgba(102,126,234,.22) !important; border-color: #667eea !important; }
html[data-theme="dark"] .toc a, html[data-theme="dark"] .ls-card { color: var(--dk-text) !important; }
html[data-theme="dark"] .pdf-frame { background: #151925 !important; }

/* panels written with inline styles */
html[data-theme="dark"] [style*="background:#fff"], html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#ffffff"], html[data-theme="dark"] [style*="background: #ffffff"],
html[data-theme="dark"] [style*="background:white"], html[data-theme="dark"] [style*="background: white"],
html[data-theme="dark"] [style*="background-color:#fff"], html[data-theme="dark"] [style*="background-color: #fff"],
html[data-theme="dark"] [style*="background-color: white"], html[data-theme="dark"] [style*="background:#f8f9fa"],
html[data-theme="dark"] [style*="background: #f8f9fa"], html[data-theme="dark"] [style*="background:#f4f6fb"],
html[data-theme="dark"] [style*="background:#f8f9fb"], html[data-theme="dark"] [style*="background:#f1f3f9"] {
    background: var(--dk-panel) !important; color: var(--dk-text) !important;
}

/* rich text editor (Quill) */
html[data-theme="dark"] .ql-toolbar, html[data-theme="dark"] .rich-wrap .ql-toolbar { background: var(--dk-panel-2) !important; border-color: var(--dk-line) !important; }
html[data-theme="dark"] .ql-container, html[data-theme="dark"] .rich-wrap, html[data-theme="dark"] .ql-editor { background: #151925 !important; color: var(--dk-text) !important; border-color: var(--dk-line) !important; }
html[data-theme="dark"] .ql-snow .ql-stroke { stroke: #c3cad8; }
html[data-theme="dark"] .ql-snow .ql-fill { fill: #c3cad8; }
html[data-theme="dark"] .ql-snow .ql-picker { color: #c3cad8; }
html[data-theme="dark"] .ql-snow .ql-picker-options { background: var(--dk-panel); border-color: var(--dk-line); }
html[data-theme="dark"] .ql-editor.ql-blank::before { color: #6f788c !important; }

/* images of papers keep white backgrounds but are a little softer on the eyes */
html[data-theme="dark"] .question-image img, html[data-theme="dark"] .question-img, html[data-theme="dark"] img.q-img,
html[data-theme="dark"] .qa-thumb img, html[data-theme="dark"] .note-img { filter: brightness(.9); }

/* scrollbars */
html[data-theme="dark"] ::-webkit-scrollbar { width: 10px; height: 10px; }
html[data-theme="dark"] ::-webkit-scrollbar-track { background: var(--dk-bg); }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #343b50; border-radius: 6px; }

/* language / theme buttons */
html[data-theme="dark"] .lms-lang { background: rgba(26,31,43,.95) !important; border-color: var(--dk-line) !important; color: var(--dk-muted) !important; }
html[data-theme="dark"] .lms-lang button { color: var(--dk-text) !important; }
html[data-theme="dark"] .lms-lang button:hover { background: var(--dk-panel-2) !important; }
html[data-theme="dark"] .lms-lang button.on { background: #667eea !important; color: #fff !important; }

/* always print in the light theme */
@media print {
    html[data-theme="dark"] body, html[data-theme="dark"] * { background: #fff !important; color: #000 !important; }
}