/* Dark theme: applied when <html> has class "theme-dark". Load AFTER style.css, accessibility.css, utility-bar.css */
html.theme-dark body{ background:#0f1020; background-image:none; }
html.theme-dark .bg_transprents{ background:rgba(15,16,32,.9); }

/* text and links: zero specificity so any component class (buttons, cards, hero) still wins */
:where(html.theme-dark) p, :where(html.theme-dark) li, :where(html.theme-dark) td,
:where(html.theme-dark) em, :where(html.theme-dark) label{ color:#e8e8f5; }
:where(html.theme-dark) h1, :where(html.theme-dark) h2, :where(html.theme-dark) h3,
:where(html.theme-dark) h4, :where(html.theme-dark) h5, :where(html.theme-dark) h6{ color:#fff; }
:where(html.theme-dark) a{ color:#c9c6ff; }
html.theme-dark ol li::before{ color:#fff; }
html.theme-dark ol li, html.theme-dark .vision{ border-color:#3a3b6b; }

/* surfaces */
html.theme-dark .card, html.theme-dark .qs-card, html.theme-dark .up-card{
  background:#1a1b3a; border-color:#3a3b6b; box-shadow:0 2px 8px rgba(0,0,0,.5);
}
html.theme-dark .qs-card{ color:#e8e8f5; }
html.theme-dark .qs-card:hover{ background:#2a2b5c; color:#fff; }
html.theme-dark .card ul li:nth-child(odd) a{ background:#23244a; }
html.theme-dark .up-card .up-facts li{ background:#2a2b5c; color:#e8e8f5; }
html.theme-dark table, html.theme-dark td, html.theme-dark tr{ border-color:#3a3b6b; }
html.theme-dark .nav .dropdown-menu{ background-image:none; background-color:#1a1b3a; }
html.theme-dark .nav .dropdown-menu li{ background-color:#1a1b3a; }
html.theme-dark .nav .dropdown-item{ color:#e8e8f5; }
html.theme-dark input, html.theme-dark select, html.theme-dark textarea{
  background:#1a1b3a; color:#fff; border-color:#5a5b9a;
}

/* buttons: the outline one needs light text on a dark page */
html.theme-dark .snpv-btn--outline{ color:#fff; border-color:#fff; }
html.theme-dark .snpv-btn--outline:hover{ background:#fff; color:#12124D; }

/* pattern overlay, Glimpses label, vision/mission/objectives block, card link hover */
html.theme-dark body::before{ display:none; }
html.theme-dark .galeryTitle{ background-color:#0f1020; }
html.theme-dark .vision_mission_section .accordion{ background-color:#1a1b3a; border-color:#3a3b6b; }
html.theme-dark .vision_mission_section .acc{ border-color:#3a3b6b; }
html.theme-dark .card ul li a:hover{ color:#fff; }

/* sidebar rows: both row colours, readable text and icons */
html.theme-dark .card ul li a{ color:#e8e8f5 !important; }
html.theme-dark .card ul li:nth-child(odd) a{ background:#23244a !important; }
html.theme-dark .card ul li:nth-child(even) a{ background:#1a1b3a !important; }
:where(html.theme-dark) .fa, :where(html.theme-dark) .fas{ color:#c9c6ff; }

/* state song / kul geet titles, play buttons, download icon */
html.theme-dark .geet{ color:#c9c6ff; }
html.theme-dark #play-pause, html.theme-dark #play-pause1{ filter:invert(1); }
html.theme-dark .helloaudio .fa{ color:#c9c6ff; }

/* inner pages: force readable text inside the page content */
html.theme-dark :is(.home-page, .ul_class) :is(p, li, td, th, span, div, strong, b, em, font, h1, h2, h3, h4, h5, h6):not(.snpv-btn):not(.snpv-btn *):not(.date):not(.date *){
  color:#e8e8f5 !important;
}
html.theme-dark :is(.home-page, .ul_class) :is(h1, h2, h3, h4){ color:#fff !important; }
html.theme-dark :is(.home-page, .ul_class) li::marker{ color:#c9c6ff; }
html.theme-dark :is(.home-page, .ul_class) table{ background:transparent !important; }

html.theme-dark :is(h1, h2, h3, h4, h5, h6){
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

/* UTD pages: highlights table and syllabus accordion */
html.theme-dark table th, html.theme-dark table td, html.theme-dark .table > :not(caption) > * > *{
  color:#e8e8f5 !important; background-color:transparent !important; border-color:#3a3b6b !important;
}
html.theme-dark .accordion-item{ background-color:#1a1b3a !important; border-color:#3a3b6b !important; }
html.theme-dark .accordion-button{ background-color:#23244a !important; color:#fff !important; box-shadow:none; }
html.theme-dark .accordion-button:not(.collapsed){ background-color:#2a2b5c !important; color:#fff !important; }
html.theme-dark .accordion-button::after{ filter:invert(1) brightness(2); }
html.theme-dark .accordion-body{ background-color:#1a1b3a !important; color:#e8e8f5 !important; }