/**
 * File: dark-theme.css
 * Purpose: Dark mode overrides for the whole site (via [data-theme="dark"])
 * Note: See IMPORTANT comment below — use background-color longhand
 *       for input/select/textarea dark rules to avoid sprite tiling.
 */
/* =====================================================================
   !! IMPORTANT — DARK-THEME CSS RULE (READ BEFORE EDITING)

   When a dark-mode rule's selector includes <input>, <select>,
   <textarea>, or any class variant thereof (e.g.
   `.auth-input-wrap.has-icon select`, `.auth-form select`,
   `.search-input`, .support-form-select, `.library-filter-select`,
   `.mode-select`, `.candidate-add-field select`,
   `.attendance-filters select`, etc.), you MUST use the
   `background-color:` longhand — NOT the `background:` shorthand —
   to set the element's background color.

   Why: the `background:` shorthand implicitly resets
     • background-image:        none
     • background-size:         auto
     • background-repeat:       repeat

   Because dark-mode rules carry the `[data-theme="dark"]` attribute
   selector (+1 in column a), they routinely outrank the light-side
   rules that set size / repeat / longhand chevrons. So the
   shorthand's implicit reset silently wins the cascade for any
   chevron, icon, or sprite that uses `background-image` —
   typically rendering it TILE across the entire element instead of
   appearing as a single icon.

   Real-world incident: the .auth-input-wrap has-icon select chevron
   on register.php was tiled across the entire select three times in
   a row before the cascade was patched end-to-end. The three fix
   points live in this file (search for "FIX 1", "FIX 2", "FIX 3"):
     • FIX 1 — `.auth-input-wrap` base / hover / focus / invalid.
     • FIX 2 — `.auth-grid-two` / `.auth-form` / `.auth-input-wrap`
                (auth-page selects that ALSO carry `.auth-form` class).
     • FIX 3 — global `input` / `select` / `textarea` reset.
   ===================================================================== */

:root[data-theme="dark"] {
  --ink: #e2e8f0;
  --ink-soft: #94a3b8;
  --accent: #60a5fa;
  --accent-deep: #3b82f6;
  --card: rgba(15, 23, 42, 0.78);
  --stroke: rgba(148, 163, 184, 0.28);
  --shadow: rgba(2, 6, 23, 0.62);
}

[data-theme="dark"] body {
  background: linear-gradient(138deg, #020617 0%, #071022 42%, #091325 72%, #030712 100%);
}

[data-theme="dark"] body::before {
  background:
    radial-gradient(920px 560px at 108% -8%, rgba(30, 64, 175, 0.36) 0%, rgba(30, 64, 175, 0) 64%),
    radial-gradient(760px 520px at -12% 106%, rgba(15, 118, 110, 0.3) 0%, rgba(15, 118, 110, 0) 60%),
    conic-gradient(from 210deg at 76% 30%, rgba(59, 130, 246, 0.22), rgba(14, 165, 233, 0.12), rgba(30, 64, 175, 0.18), rgba(59, 130, 246, 0.22));
}

[data-theme="dark"] body::after {
  opacity: 0.28;
  background-image:
    linear-gradient(120deg, rgba(148, 163, 184, 0.14) 0%, rgba(148, 163, 184, 0) 46%),
    repeating-linear-gradient(125deg, rgba(51, 65, 85, 0.24) 0px, rgba(51, 65, 85, 0.24) 2px, transparent 2px, transparent 36px),
    repeating-linear-gradient(0deg, rgba(51, 65, 85, 0.18) 0px, rgba(51, 65, 85, 0.18) 1px, transparent 1px, transparent 44px),
    repeating-linear-gradient(90deg, rgba(51, 65, 85, 0.18) 0px, rgba(51, 65, 85, 0.18) 1px, transparent 1px, transparent 44px);
}

[data-theme="dark"] .site-header {
  background: rgba(2, 6, 23, 0.8);
  border-bottom-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 10px 30px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] body.is-scrolled .site-header {
  background: rgba(2, 6, 23, 0.92);
  border-bottom-color: rgba(148, 163, 184, 0.22);
  box-shadow: 0 12px 30px rgba(2, 6, 23, 0.58);
}


[data-theme="dark"] .hamburger {
  background: rgba(15, 23, 42, 0.92);
  border-color: rgba(148, 163, 184, 0.3);
  color: #e2e8f0;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.4);
}

[data-theme="dark"] .hamburger:hover {
  background: rgba(96, 165, 250, 0.2);
  border-color: rgba(96, 165, 250, 0.4);
  color: #bfdbfe;
}

[data-theme="dark"] .hamburger.is-open::after {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M18 6L6 18M6 6l12 12'/%3E%3C/svg%3E") center / contain no-repeat;
}

[data-theme="dark"] .hamburger:focus-visible {
  outline-color: rgba(96, 165, 250, 0.65);
}

[data-theme="dark"] .mark {
  background: rgba(15, 23, 42, 0.95);
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow: 0 8px 22px rgba(30, 64, 175, 0.35);
}

[data-theme="dark"] .nav a:hover,
[data-theme="dark"] .students-menu > summary:hover,
[data-theme="dark"] .students-menu[open] > summary,
[data-theme="dark"] .students-menu.is-active > summary,
[data-theme="dark"] .admin-menu > summary:hover,
[data-theme="dark"] .admin-menu[open] > summary,
[data-theme="dark"] .admin-menu.is-active > summary {
  background: rgba(96, 165, 250, 0.2);
}

[data-theme="dark"] .admin-menu-list,
[data-theme="dark"] .students-menu-list,
[data-theme="dark"] .profile-menu-list {
  background: rgba(15, 23, 42, 0.96);
  border-color: rgba(148, 163, 184, 0.3);
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.58), 0 4px 12px rgba(59, 130, 246, 0.2);
}



[data-theme="dark"] .notif-bell-btn {
  background: rgba(15, 23, 42, 0.7);
  border-color: rgba(148, 163, 184, 0.22);
  color: #94a3b8;
}

[data-theme="dark"] .notif-bell-btn:hover {
  background: rgba(37, 99, 235, 0.15);
  color: #60a5fa;
  border-color: rgba(59, 130, 246, 0.35);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2);
}

[data-theme="dark"] .notif-bell-badge {
  background: linear-gradient(135deg, #f43f5e, #e11d48);
  box-shadow: 0 2px 6px rgba(244, 63, 94, 0.4);
}

[data-theme="dark"] .notif-dropdown {
  background: rgba(15, 23, 42, 0.96);
  border-color: rgba(148, 163, 184, 0.25);
  box-shadow: 0 20px 40px rgba(2, 6, 23, 0.6), 0 4px 12px rgba(59, 130, 246, 0.15);
}

[data-theme="dark"] .notif-dropdown-header {
  border-bottom-color: rgba(148, 163, 184, 0.15);
  background: rgba(15, 23, 42, 0.85);
}

[data-theme="dark"] .notif-dropdown-title {
  color: #f1f5f9;
}

[data-theme="dark"] .notif-item {
  color: #e2e8f0;
}

[data-theme="dark"] .notif-item:hover {
  background: rgba(59, 130, 246, 0.08);
}

[data-theme="dark"] .notif-item.is-unread {
  background: rgba(59, 130, 246, 0.06);
}

[data-theme="dark"] .notif-item-title {
  color: #f1f5f9;
}

[data-theme="dark"] .notif-item.is-read .notif-item-title {
  color: #94a3b8;
}

[data-theme="dark"] .notif-item-text {
  color: #94a3b8;
}

[data-theme="dark"] .notif-item-time {
  color: #64748b;
}

[data-theme="dark"] .notif-icon {
  background: rgba(59, 130, 246, 0.12);
  color: #60a5fa;
}

[data-theme="dark"] .notif-icon.notif-icon-support {
  background: rgba(20, 184, 166, 0.12);
  color: #2dd4bf;
}

[data-theme="dark"] .notif-icon.notif-icon-registration {
  background: rgba(245, 158, 11, 0.12);
  color: #fbbf24;
}

[data-theme="dark"] .notif-icon.notif-icon-news {
  background: rgba(139, 92, 246, 0.12);
  color: #a78bfa;
}

[data-theme="dark"] .notif-icon.notif-icon-absence {
  background: rgba(244, 63, 94, 0.12);
  color: #fb7185;
}

[data-theme="dark"] .notif-icon.notif-icon-calendar {
  background: rgba(14, 165, 233, 0.12);
  color: #38bdf8;
}

[data-theme="dark"] .notif-empty {
  color: #64748b;
}

[data-theme="dark"] .notif-delete-btn {
  color: #64748b;
}

[data-theme="dark"] .notif-delete-btn:hover {
  background: rgba(244, 63, 94, 0.12);
  color: #fb7185;
}


[data-theme="dark"] .nav {
  border-top-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .nav a:hover {
  background: rgba(96, 165, 250, 0.18);
  color: #bfdbfe;
}

[data-theme="dark"] .header-actions {
  border-top-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .admin-menu-list a:not(:last-child),
[data-theme="dark"] .students-menu-list a:not(:last-child),
[data-theme="dark"] .profile-item:not(:last-child) {
  border-bottom-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .admin-menu-list a:hover,
[data-theme="dark"] .admin-menu-list a.active,
[data-theme="dark"] .students-menu-list a:hover,
[data-theme="dark"] .students-menu-list a.active,
[data-theme="dark"] .profile-item:hover,
[data-theme="dark"] .profile-item.active {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.24), rgba(59, 130, 246, 0.12));
}

[data-theme="dark"] .admin-menu-list a::before,
[data-theme="dark"] .students-menu-list a::before,
[data-theme="dark"] .profile-item::before {
  filter: brightness(0) invert(1);
  opacity: 0.9;
}

[data-theme="dark"] .profile-trigger {
  background: #0b1220;
  border-color: rgba(148, 163, 184, 0.34);
  box-shadow: 0 8px 16px rgba(2, 6, 23, 0.44);
}

[data-theme="dark"] .profile-menu[open] .profile-trigger {
  border-color: rgba(96, 165, 250, 0.78);
}

[data-theme="dark"] .profile-item.theme-toggle {
  color: #cbd5e1;
}

[data-theme="dark"] .profile-item.theme-toggle:hover {
  color: #bfdbfe;
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.24), rgba(59, 130, 246, 0.12));
}

[data-theme="dark"] .profile-item.theme-toggle.is-dark {
  color: #b4b4b4;
}

[data-theme="dark"] .profile-item.theme-toggle.is-dark:hover {
  color: #ffee00;
  background: linear-gradient(135deg, rgba(247, 250, 96, 0.24), rgba(246, 243, 59, 0.12));
}

[data-theme="dark"] .profile-item.danger {
  color: #fb7185;
}

[data-theme="dark"] .profile-item.danger:hover {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.24), rgba(225, 29, 72, 0.14));
  color: #fecdd3;
}

[data-theme="dark"] .site-footer {
  border-top-color: rgba(148, 163, 184, 0.22);
}



[data-theme="dark"] .footer-badge {
  color: #94a3b8;
}

[data-theme="dark"] .footer-decor {
  background:
    radial-gradient(600px 300px at 10% 0%, rgba(96, 165, 250, 0.06) 0%, transparent 60%),
    radial-gradient(500px 280px at 90% 100%, rgba(34, 211, 238, 0.04) 0%, transparent 55%);
}

[data-theme="dark"] .footer-logo-mark {
  border-color: rgba(96, 165, 250, 0.3);
  box-shadow: 0 4px 12px rgba(30, 64, 175, 0.3);
}

[data-theme="dark"] .footer-logo-mark:hover {
  box-shadow: 0 6px 18px rgba(59, 130, 246, 0.4);
}

[data-theme="dark"] .footer-title {
  background: linear-gradient(135deg, #e2e8f0 40%, #60a5fa 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

[data-theme="dark"] .footer-col-title {
  color: #e2e8f0;
  border-bottom-color: rgba(96, 165, 250, 0.2);
}

[data-theme="dark"] .footer-col-title svg {
  color: #60a5fa;
}

[data-theme="dark"] .footer-contact-item {
  color: #94a3b8;
}

[data-theme="dark"] .footer-contact-item:hover {
  background: rgba(96, 165, 250, 0.1);
  color: #bfdbfe;
}

[data-theme="dark"] .footer-col a,
[data-theme="dark"] .footer-legal a {
  color: #94a3b8;
}

[data-theme="dark"] .footer-col a:hover,
[data-theme="dark"] .footer-legal a:hover {
  color: #93c5fd;
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.1) 0%, rgba(34, 211, 238, 0.04) 100%);
  box-shadow: 0 2px 14px rgba(96, 165, 250, 0.08);
}

[data-theme="dark"] .footer-col a::before {
  background: linear-gradient(180deg, #60a5fa, #22d3ee);
}

[data-theme="dark"] .footer-bottom {
  border-top-color: rgba(148, 163, 184, 0.25);
}

[data-theme="dark"] .footer-col a::after,
[data-theme="dark"] .footer-legal a::after {
  background: linear-gradient(90deg, #60a5fa, #22d3ee);
}

[data-theme="dark"] .footer-link {
  color: #94a3b8;
}

[data-theme="dark"] .footer-link:hover {
  color: #93c5fd;
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.1) 0%, rgba(34, 211, 238, 0.04) 100%);
  box-shadow: 0 2px 14px rgba(96, 165, 250, 0.08);
}

[data-theme="dark"] .footer-link:hover svg {
  color: #93c5fd;
}

[data-theme="dark"] .footer-link::before {
  background: #60a5fa;
  box-shadow: 0 0 8px rgba(96, 165, 250, 0.5);
}

[data-theme="dark"] .footer-link::after {
  background: linear-gradient(90deg, #60a5fa, #22d3ee);
}


[data-theme="dark"] .footer-legal a:hover {
  background: rgba(96, 165, 250, 0.14);
  border-color: rgba(96, 165, 250, 0.4);
  color: #93c5fd;
  box-shadow: 0 2px 10px rgba(96, 165, 250, 0.12);
}



[data-theme="dark"] .election-card,
[data-theme="dark"] .candidate-card {
  background: rgba(15, 23, 42, 0.92);
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 8px 24px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .election-stat-item,
[data-theme="dark"] .election-progress-bar {
  background: rgba(15, 23, 42, 0.8);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .candidate-name,
[data-theme="dark"] .candidate-meta {
  color: var(--ink);
}

[data-theme="dark"] .quick-link,
[data-theme="dark"] .stat-card,
[data-theme="dark"] .home-hero,
[data-theme="dark"] .home-news,
[data-theme="dark"] .home-quick,
[data-theme="dark"] .home-stats {
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.92) 0%, rgba(15, 23, 42, 0.8) 100%);
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .quick-link:hover,
[data-theme="dark"] .stat-card:hover {
  box-shadow: 0 12px 26px rgba(2, 6, 23, 0.58);
}

[data-theme="dark"] main.home-page .home-hero {
  border-color: rgba(148, 163, 184, 0.28);
  background: linear-gradient(145deg, rgba(11, 18, 32, 0.96) 0%, rgba(15, 23, 42, 0.92) 54%, rgba(15, 23, 42, 0.9) 100%);
}

[data-theme="dark"] main.home-page .home-hero::before {
  background: linear-gradient(90deg, rgba(96, 165, 250, 0.06), rgba(96, 165, 250, 0.5), rgba(96, 165, 250, 0.06));
}

[data-theme="dark"] main.home-page .home-hero::after {
  background: radial-gradient(circle, rgba(59, 130, 246, 0.14), rgba(59, 130, 246, 0));
}

[data-theme="dark"] main.home-page .hero-copy h1 {
  color: #f8fafc;
}

[data-theme="dark"] main.home-page .hero-copy p {
  color: #cbd5e1;
}

[data-theme="dark"] main.home-page .hero-greeting-icon {
  background: linear-gradient(145deg, rgba(30, 41, 59, 0.96), rgba(15, 23, 42, 0.96));
  border-color: rgba(96, 165, 250, 0.34);
  box-shadow: 0 8px 16px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] main.home-page .hero-greeting-icon svg {
  stroke: #93c5fd;
  fill: rgba(59, 130, 246, 0.24);
}

[data-theme="dark"] main.home-page .home-hero .cta {
  background: rgba(30, 41, 59, 0.95);
  border-color: rgba(148, 163, 184, 0.34);
  color: #e2e8f0;
  box-shadow: 0 6px 14px rgba(2, 6, 23, 0.42);
}

[data-theme="dark"] main.home-page .home-hero .cta.cta-primary {
  background: rgba(30, 64, 175, 0.24);
  border-color: rgba(96, 165, 250, 0.42);
  border-right-color: #60a5fa;
  color: #bfdbfe;
}

[data-theme="dark"] main.home-page .home-hero .cta.cta-purple {
  background: rgba(51, 65, 85, 0.85);
  border-color: rgba(148, 163, 184, 0.34);
  border-right-color: #94a3b8;
  color: #e2e8f0;
}

[data-theme="dark"] main.home-page .home-hero .cta:hover {
  box-shadow: 0 10px 18px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] main.home-page .home-stats .stat-card {
  border-color: rgba(148, 163, 184, 0.28);
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.88));
}

[data-theme="dark"] main.home-page .stat-emoji {
  background: rgba(30, 41, 59, 0.92);
  color: #93c5fd;
}

[data-theme="dark"] main.home-page .stat-value {
  color: #bfdbfe;
}

[data-theme="dark"] main.home-page .stat-label {
  color: #cbd5e1;
}

[data-theme="dark"] main.home-page .home-news,
[data-theme="dark"] main.home-page .home-quick {
  background: linear-gradient(145deg, rgba(11, 18, 32, 0.94), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.home-page .section-head h2,
[data-theme="dark"] main.home-page .home-quick h2 {
  color: #f8fafc;
}

[data-theme="dark"] main.home-page .link-more {
  border-color: rgba(96, 165, 250, 0.34);
  background: rgba(30, 64, 175, 0.2);
  color: #bfdbfe;
}

[data-theme="dark"] main.home-page .home-news .news-card {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(15, 23, 42, 0.92);
}

[data-theme="dark"] main.home-page .home-news .news-card:hover {
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow: 0 10px 20px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] main.home-page .home-news .news-meta {
  color: #94a3b8;
}

[data-theme="dark"] main.home-page .home-news .news-card h3 {
  color: #e2e8f0;
}

[data-theme="dark"] main.home-page .home-news .news-link {
  color: #93c5fd;
}

[data-theme="dark"] main.home-page .empty-state {
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(15, 23, 42, 0.84);
  color: #cbd5e1;
}

[data-theme="dark"] main.home-page .quick-link {
  background: rgba(15, 23, 42, 0.92);
  color: #dbeafe;
  box-shadow: 0 6px 14px rgba(2, 6, 23, 0.42);
}

[data-theme="dark"] main.home-page .quick-link:hover {
  border-color: rgba(96, 165, 250, 0.42);
  box-shadow: 0 10px 18px rgba(2, 6, 23, 0.52);
}

[data-theme="dark"] .about-hero,
[data-theme="dark"] .about-card,
[data-theme="dark"] .about-contact {
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.82));
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 14px 30px rgba(2, 6, 23, 0.46);
}

[data-theme="dark"] .amenity-item {
  background: linear-gradient(135deg, rgba(30, 58, 138, 0.28), rgba(30, 64, 175, 0.18));
  border-color: rgba(96, 165, 250, 0.3);
}

[data-theme="dark"] main.about-page .about-kicker {
  color: #93c5fd;
}

[data-theme="dark"] main.about-page .about-hero h1,
[data-theme="dark"] main.about-page .about-card h2,
[data-theme="dark"] main.about-page .about-card h3,
[data-theme="dark"] main.about-page .about-contact h2 {
  color: #f8fafc;
}

[data-theme="dark"] main.about-page .about-subtitle,
[data-theme="dark"] main.about-page .about-card p,
[data-theme="dark"] main.about-page .about-card li,
[data-theme="dark"] main.about-page .about-contact p,
[data-theme="dark"] main.about-page .about-address,
[data-theme="dark"] main.about-page .about-muted {
  color: #cbd5e1 !important;
}

[data-theme="dark"] main.about-page .about-card strong,
[data-theme="dark"] main.about-page .about-contact strong {
  color: #f8fafc;
}

[data-theme="dark"] main.about-page .amenity-item {
  color: #e2e8f0;
}

[data-theme="dark"] main.about-page .about-phone {
  color: #22d3ee;
}

[data-theme="dark"] .auth-shell {
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.84));
  border-color: rgba(148, 163, 184, 0.26);
  box-shadow: 0 20px 44px rgba(2, 6, 23, 0.56);
}

/* Dark-mode `.auth-visual` background. Two layers (white shine +
   rich base) are overridden via `background-image:` LONGFHAND instead
   of the `background:` shorthand so the cascade preserves the
   animation-critical longhands from the light-mode rule:
     • background-size      (200% 200%, 240% 240%)
     • background-position  (0% 15%, 0% 50%)   ← animated
     • background-blend-mode (soft-light, normal)
     • animation: auth-visual-colorflow 16s ...
     • will-change: background-position
   The light-mode keyframe `auth-visual-colorflow` mutates
   `background-position` over the values seeded by the static
   `background-position: 0% 15%, 0% 50%` — using the `background:`
   shorthand here would silently reset that to `0% 0%, 0% 0%` and
   break the colorflow drift. Same number of layers as
   the light-mode stack, so the existing keyframe continues to
   drive them unchanged.

   Both layers tint slightly deeper (close to midnight-950) so the
   panel still reads as a deep blue block against the dark page,
   without going pure black. */
[data-theme="dark"] .auth-visual {
  background-image:
    linear-gradient(118deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0) 32%, rgba(255, 255, 255, 0.06) 100%),
    linear-gradient(135deg,
      #050b1d 0%,
      #0c1b4a 18%,
      #1e3a8a 38%,
      #2563eb 52%,
      #0c5f8c 70%,    /* deeper teal so dark mode reads as midnight-sky */
      #1e40af 86%,
      #0a0824 100%);
}

[data-theme="dark"] .auth-card {
  background: transparent;
}

/* Use longhand `background-color:` (NOT the `background:` shorthand) so
   the chevron `background-image` + `background-size: 14px` + `no-repeat`
   (declared in the later `[data-theme="dark"] .auth-input-wrap select`
   rule, plus the light `.auth-input-wrap select` rule) all cascade
   through unchanged. With the `background:` shorthand we were implicitly
   resetting `background-image: none` `background-size: auto` and
   `background-repeat: repeat` — which tiled the SVG chevron across the
   entire select.   The shorthand's implicit resets apply at specificity
   (1,1,1) which beats the chevron rule's specificity for any
   background property the chevron rule does NOT explicitly set.

   FIX 2 of 3 in the chevron-tiling-cascade patch.

   See also: FIX 1 (`.auth-input-wrap` base / hover / focus / invalid
   — just above), FIX 3 (global input / select / textarea reset —
   further down), the `.auth-input-wrap.has-icon` block (already
   longhand before this fix), and the top-of-file WARNING for the
   discipline that keeps this cascade honest. */
[data-theme="dark"] .auth-grid-two input,
[data-theme="dark"] .auth-form input,
[data-theme="dark"] .auth-form select,
[data-theme="dark"] .auth-form textarea {
  background-color: #0f172a;
  color: var(--ink);
  border-color: rgba(148, 163, 184, 0.35);
}

[data-theme="dark"] .auth-grid-two input::placeholder,
[data-theme="dark"] .auth-form input::placeholder,
[data-theme="dark"] .auth-form textarea::placeholder {
  color: #64748b;
}

/* DARK MODE — new auth components (icon wrap, password toggle,
   strength meter, alerts, gradient h1, switch link) */

[data-theme="dark"] .auth-card-head h1 {
  background: linear-gradient(135deg, #e2e8f0 30%, #60a5fa 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

[data-theme="dark"] .auth-subtitle { color: #cbd5e1; }

/* FIX 1 of 3 — use `background-color:` (NOT the `background:` shorthand)
   on the `.auth-input-wrap input, .auth-input-wrap select` base/hover/
   focus/invalid rules. The shorthand would implicitly reset
   `background-image: none`, `background-size: auto`, and
   `background-repeat: repeat`, which tiled the SVG chevron (no
   intrinsic width/height attributes) across the entire select.

   This is ONE of three rules that was wiping the chevron cascade on
   register.php. See FIX 2 (`.auth-grid-two` / `.auth-form` / wrapper
   rules, just above) and FIX 3 (global input / select / textarea
   reset, further down) for the other two leak points, plus the
   top-of-file WARNING for the discipline that keeps the cascade
   honest going forward. */
[data-theme="dark"] .auth-input-wrap input,
[data-theme="dark"] .auth-input-wrap select {
  background-color: rgba(15, 23, 42, 0.78);
  border-color: rgba(148, 163, 184, 0.32);
  color: #f1f5f9;
}

[data-theme="dark"] .auth-input-wrap input::placeholder { color: #64748b; }

[data-theme="dark"] .auth-input-wrap input:hover:not(:focus),
[data-theme="dark"] .auth-input-wrap select:hover:not(:focus) {
  border-color: rgba(96, 165, 250, 0.5);
  /* longhand so the chevron `background-image` + `background-size: 14px`
     cascade through unchanged */
  background-color: rgba(15, 23, 42, 0.9);
}

[data-theme="dark"] .auth-input-wrap input:focus,
[data-theme="dark"] .auth-input-wrap select:focus {
  /* longhand so the chevron `background-image` + `background-size: 14px`
     cascade through unchanged */
  background-color: rgba(15, 23, 42, 0.95);
  border-color: rgba(96, 165, 250, 0.7);
  box-shadow:
    0 0 0 4px rgba(96, 165, 250, 0.2),
    0 8px 18px rgba(30, 64, 175, 0.25);
}

[data-theme="dark"] .auth-input-wrap input[aria-invalid="true"],
[data-theme="dark"] .auth-input-wrap select[aria-invalid="true"] {
  /* longhand so the chevron `background-image` + `background-size: 14px`
     cascade through unchanged */
  background-color: rgba(127, 29, 29, 0.32);
  border-color: rgba(248, 113, 113, 0.55);
}

[data-theme="dark"] .auth-input-wrap > .auth-input-icon { color: #94a3b8; }
[data-theme="dark"] .auth-input-wrap:focus-within > .auth-input-icon { color: #93c5fd; }
[data-theme="dark"] .auth-input-wrap input[aria-invalid="true"] ~ .auth-input-icon { color: #fb7185; }

[data-theme="dark"] .auth-input-wrap select {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
}

/* DARK MODE — polished .auth-input-wrap.has-icon states */

[data-theme="dark"] .auth-input-wrap.has-icon {
  background: rgba(15, 23, 42, 0.78);
  border-color: rgba(148, 163, 184, 0.32);
}

[data-theme="dark"] .auth-input-wrap.has-icon > .auth-input-icon { color: #94a3b8; }

[data-theme="dark"] .auth-input-wrap.has-icon:hover {
  background: rgba(15, 23, 42, 0.9);
  border-color: rgba(96, 165, 250, 0.5);
  box-shadow:
    0 4px 12px rgba(30, 64, 175, 0.18),
    0 1px 2px  rgba(2, 6, 23, 0.4);
}

/* Same `background-color:` (longhand) trick that the light file uses:
   the `background:` shorthand would reset `background-image: none`
   on the select and erase the chevron declared in the earlier
   `[data-theme="dark"] .auth-input-wrap select` rule. */
[data-theme="dark"] .auth-input-wrap.has-icon input,
[data-theme="dark"] .auth-input-wrap.has-icon select {
  background-color: transparent;
  caret-color: #93c5fd;
}

[data-theme="dark"] .auth-input-wrap.has-icon:focus-within {
  background: rgba(15, 23, 42, 0.95);
  box-shadow:
    0 0 0 4px rgba(96, 165, 250, 0.22),
    0 10px 24px rgba(30, 64, 175, 0.32),
    0 2px 6px  rgba(2, 6, 23, 0.55);
}

[data-theme="dark"] .auth-input-wrap.has-icon:focus-within > .auth-input-icon {
  color: #93c5fd;
}

[data-theme="dark"] .auth-input-wrap.has-icon.is-filled {
  border-color: rgba(16, 185, 129, 0.42);
  background: linear-gradient(180deg, rgba(6, 78, 59, 0.4), rgba(15, 23, 42, 0.92));
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.1);
}

[data-theme="dark"] .auth-input-wrap.has-icon.is-filled > .auth-input-icon { color: #6ee7b7; }
[data-theme="dark"] .auth-input-wrap.has-icon.is-filled:focus-within > .auth-input-icon { color: #93c5fd; }

/* Dark-mode twin of the light-mode "is-filled:focus-within" gradient
   ring: keep the "value captured" cue alive by tinting the ring
   emerald→cyan instead of blue→cyan→violet. */
[data-theme="dark"] .auth-input-wrap.has-icon.is-filled:focus-within::after {
  background: linear-gradient(135deg, #10b981 0%, #22d3ee 60%, #60a5fa 100%);
}

[data-theme="dark"] .auth-input-wrap.has-icon.has-error {
  border-color: rgba(248, 113, 113, 0.55);
  background: rgba(127, 29, 29, 0.32);
}

[data-theme="dark"] .auth-input-wrap.has-icon input::selection,
[data-theme="dark"] .auth-input-wrap.has-icon select::selection {
  background: rgba(96, 165, 250, 0.32);
}

[data-theme="dark"] .auth-input-wrap.has-icon input:-webkit-autofill,
[data-theme="dark"] .auth-input-wrap.has-icon input:-webkit-autofill:hover,
[data-theme="dark"] .auth-input-wrap.has-icon input:-webkit-autofill:focus {
  -webkit-text-fill-color: #f1f5f9;
  -webkit-box-shadow: 0 0 0 1000px rgba(15, 23, 42, 0.92) inset;
          box-shadow: 0 0 0 1000px rgba(15, 23, 42, 0.92) inset;
  caret-color: #93c5fd;
}

[data-theme="dark"] .auth-field label { color: #cbd5e1; }
[data-theme="dark"] .auth-field-hint { color: #94a3b8; }
[data-theme="dark"] .auth-field-hint.is-error { color: #fda4af; }
[data-theme="dark"] .auth-field-hint.is-ok    { color: #6ee7b7; }

[data-theme="dark"] .auth-pw-toggle {
  color: #94a3b8;
}
[data-theme="dark"] .auth-pw-toggle:hover {
  background: rgba(96, 165, 250, 0.18);
  color: #93c5fd;
}
[data-theme="dark"] .auth-pw-toggle:focus-visible {
  outline-color: rgba(96, 165, 250, 0.6);
}

[data-theme="dark"] .auth-pw-meter-bar { background: rgba(148, 163, 184, 0.18); }

[data-theme="dark"] .auth-pw-rules li {
  background: rgba(30, 41, 59, 0.65);
  border-color: rgba(148, 163, 184, 0.2);
  color: #cbd5e1;
}
[data-theme="dark"] .auth-pw-rules li .pw-rule-circle { border-color: rgba(148, 163, 184, 0.5); }
[data-theme="dark"] .auth-pw-rules li.is-valid {
  background: rgba(6, 95, 70, 0.32);
  border-color: rgba(16, 185, 129, 0.32);
  color: #6ee7b7;
}
[data-theme="dark"] .auth-pw-rules li.is-valid .pw-rule-circle {
  background: #10b981;
  border-color: #10b981;
}
[data-theme="dark"] .auth-pw-rules li .pw-rule-icon { color: #6ee7b7; }

[data-theme="dark"] .auth-error {
  background: linear-gradient(135deg, rgba(127, 29, 29, 0.32), rgba(153, 27, 27, 0.24));
  border-color: rgba(248, 113, 113, 0.36);
  color: #fecdd3;
}
[data-theme="dark"] .auth-success {
  background: linear-gradient(135deg, rgba(6, 95, 70, 0.32), rgba(5, 150, 105, 0.24));
  border-color: rgba(16, 185, 129, 0.36);
  color: #bbf7d0;
}

[data-theme="dark"] .auth-switch {
  background: rgba(15, 23, 42, 0.55);
  border-color: rgba(148, 163, 184, 0.2);
  color: #cbd5e1;
}
[data-theme="dark"] .auth-switch a { color: #93c5fd; }
[data-theme="dark"] .auth-switch a:hover {
  background: rgba(96, 165, 250, 0.16);
  color: #bfdbfe;
}

[data-theme="dark"] .schedule-shell {
  background: rgba(15, 23, 42, 0.9);
  border-color: rgba(148, 163, 184, 0.26);
  box-shadow: 0 20px 42px rgba(2, 6, 23, 0.56);
}

[data-theme="dark"] .schedule-head h1 {
  color: #f8fafc;
  text-shadow: none;
}

[data-theme="dark"] .schedule-badge--admin {
  background: rgba(22, 101, 52, 0.24);
  color: #bbf7d0;
  border-color: rgba(34, 197, 94, 0.32);
}

[data-theme="dark"] .schedule-badge--user {
  background: rgba(30, 64, 175, 0.26);
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.32);
}

[data-theme="dark"] .grade-tabs {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.32);
}

[data-theme="dark"] .grade-tab {
  color: #cbd5e1;
}

[data-theme="dark"] .grade-tab:hover {
  color: #bfdbfe;
  background: rgba(59, 130, 246, 0.18);
}

[data-theme="dark"] .field-tab {
  background: rgba(30, 41, 59, 0.9);
  color: #cbd5e1;
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .field-tab:hover {
  background: rgba(30, 64, 175, 0.26);
  border-color: rgba(96, 165, 250, 0.4);
}

[data-theme="dark"] .schedule-table-wrap {
  border-color: rgba(148, 163, 184, 0.3);
  box-shadow: 0 16px 30px rgba(2, 6, 23, 0.56);
  background: rgba(15, 23, 42, 0.86);
}

[data-theme="dark"] .schedule-table th {
  border-color: rgba(148, 163, 184, 0.26);
  background: linear-gradient(180deg, #152036 0%, #0f172a 100%);
  color: #e2e8f0;
}

[data-theme="dark"] .schedule-table td {
  border-color: rgba(148, 163, 184, 0.24);
  background: rgba(15, 23, 42, 0.95);
}

[data-theme="dark"] .schedule-table tbody tr:nth-child(even) td {
  background: rgba(12, 19, 32, 0.95);
}

[data-theme="dark"] .schedule-table tbody tr:hover td {
  background: rgba(30, 64, 175, 0.26);
}

[data-theme="dark"] .schedule-table .day-cell {
  background: linear-gradient(145deg, rgba(30, 41, 59, 0.96), rgba(15, 23, 42, 0.96));
  color: #e2e8f0;
}

[data-theme="dark"] .schedule-cell-input::placeholder {
  color: #64748b;
}

[data-theme="dark"] .schedule-cell-input:focus {
  background-color: rgba(30, 64, 175, 0.32);
  box-shadow: inset 0 0 0 2px #60a5fa;
}

[data-theme="dark"] .schedule-view-cell {
  color: #cbd5e1;
}

[data-theme="dark"] .schedule-form-message {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(15, 23, 42, 0.86);
}

[data-theme="dark"] .schedule-form-message.success {
  background: rgba(22, 101, 52, 0.22);
  color: #bbf7d0;
}

[data-theme="dark"] .schedule-form-message.error {
  background: rgba(153, 27, 27, 0.25);
  color: #fecaca;
}

[data-theme="dark"] .attendance-card,
[data-theme="dark"] .logs-card,
[data-theme="dark"] .user-management-logs-card,
[data-theme="dark"] .auth-logs-card,
[data-theme="dark"] .users-card,
[data-theme="dark"] .database-card,
[data-theme="dark"] .tool-card,
[data-theme="dark"] .bulk-modal-card,
[data-theme="dark"] .attendance-modal-dialog {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.84));
  border-color: rgba(148, 163, 184, 0.26);
  box-shadow: 0 20px 44px rgba(2, 6, 23, 0.56);
}

[data-theme="dark"] .attendance-table,
[data-theme="dark"] .logs-table,
[data-theme="dark"] .users-table,
[data-theme="dark"] .backup-table,
[data-theme="dark"] .bulk-preview-table {
  color: var(--ink);
}

[data-theme="dark"] .attendance-table th,
[data-theme="dark"] .logs-table th,
[data-theme="dark"] .users-table th,
[data-theme="dark"] .backup-table th,
[data-theme="dark"] .bulk-preview-table th {
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(148, 163, 184, 0.28);
}

[data-theme="dark"] .attendance-table td,
[data-theme="dark"] .logs-table td,
[data-theme="dark"] .users-table td,
[data-theme="dark"] .backup-table td,
[data-theme="dark"] .bulk-preview-table td {
  background: rgba(15, 23, 42, 0.9);
  border-color: rgba(148, 163, 184, 0.22);
}

[data-theme="dark"] .attendance-table tbody tr:hover td,
[data-theme="dark"] .logs-table tbody tr:hover td,
[data-theme="dark"] .users-table tbody tr:hover td,
[data-theme="dark"] .backup-table tbody tr:hover td {
  background: rgba(30, 64, 175, 0.2);
}

[data-theme="dark"] main.users-page > .users-card {
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(300px 140px at 90% -12%, rgba(37, 99, 235, 0.2), transparent 72%),
    radial-gradient(280px 140px at 10% 112%, rgba(14, 165, 233, 0.12), transparent 76%);
  border-color: rgba(96, 165, 250, 0.28);
  box-shadow:
    0 30px 64px rgba(2, 6, 23, 0.62),
    0 10px 24px rgba(37, 99, 235, 0.16),
    inset 0 1px 0 rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] main.users-page > .users-card::before {
  background: linear-gradient(120deg, rgba(59, 130, 246, 0.44), rgba(14, 165, 233, 0.08), rgba(59, 130, 246, 0.38));
  opacity: 0.85;
}

[data-theme="dark"] main.users-page .users-head {
  border-bottom-color: rgba(148, 163, 184, 0.28);
}

[data-theme="dark"] main.users-page .users-stats .stat-item {
  border-color: rgba(96, 165, 250, 0.24);
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.95), rgba(15, 23, 42, 0.95));
}

[data-theme="dark"] main.users-page .users-stats .stat-item strong {
  color: #f8fafc;
}

[data-theme="dark"] main.users-page .users-stats .stat-item span {
  color: #cbd5e1;
}

[data-theme="dark"] main.users-page .users-toolbar {
  border-color: rgba(96, 165, 250, 0.24);
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.92), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.users-page .users-filters label,
[data-theme="dark"] main.users-page .add-user-grid label,
[data-theme="dark"] main.users-page .edit-user-grid label,
[data-theme="dark"] main.users-page .edit-user-grid .edit-user-grid-cell,
[data-theme="dark"] main.users-page .bulk-import-hint,
[data-theme="dark"] main.users-page .bulk-role-field,
[data-theme="dark"] main.users-page .bulk-text-label {
  color: #cbd5e1;
}

[data-theme="dark"] main.users-page .users-filters input,
[data-theme="dark"] main.users-page .role-select,
[data-theme="dark"] main.users-page .add-user-form input,
[data-theme="dark"] main.users-page .add-user-form select,
[data-theme="dark"] main.users-page .edit-user-form input,
[data-theme="dark"] main.users-page .edit-user-form select,
[data-theme="dark"] main.users-page .bulk-import-form select,
[data-theme="dark"] main.users-page .bulk-import-form textarea {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.34);
}

[data-theme="dark"] main.users-page .users-filters input::placeholder,
[data-theme="dark"] main.users-page .bulk-import-form textarea::placeholder {
  color: #64748b;
}

[data-theme="dark"] main.users-page .users-table-wrap,
[data-theme="dark"] main.users-page .bulk-preview-wrap {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.users-page .users-table th,
[data-theme="dark"] main.users-page .bulk-preview-table th {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.95));
  color: #cbd5e1;
}

[data-theme="dark"] main.users-page .users-table td,
[data-theme="dark"] main.users-page .bulk-preview-table td {
  border-bottom-color: rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] main.users-page .users-table tbody tr:hover td {
  background: rgba(37, 99, 235, 0.18);
}

[data-theme="dark"] main.users-page .cell-id,
[data-theme="dark"] main.users-page .empty-cell {
  color: #94a3b8;
}

[data-theme="dark"] main.users-page .cell-avatar img {
  border-color: rgba(148, 163, 184, 0.34);
  box-shadow: 0 6px 14px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] main.users-page .role-admin {
  background: rgba(59, 130, 246, 0.22);
  color: #bfdbfe;
}

[data-theme="dark"] main.users-page .role-user {
  background: rgba(51, 65, 85, 0.7);
  color: #cbd5e1;
}

[data-theme="dark"] main.users-page .request-status-pending {
  background: rgba(245, 158, 11, 0.2);
  color: #fcd34d;
}

[data-theme="dark"] main.users-page .request-status-approved,
[data-theme="dark"] main.users-page .self-label,
[data-theme="dark"] main.users-page .bulk-status-valid,
[data-theme="dark"] main.users-page .bulk-no-error {
  background: rgba(16, 185, 129, 0.2);
  color: #6ee7b7;
}

[data-theme="dark"] main.users-page .request-status-rejected,
[data-theme="dark"] main.users-page .bulk-status-invalid {
  background: rgba(244, 63, 94, 0.2);
  color: #fda4af;
}

[data-theme="dark"] main.users-page .admin-lock-label {
  border-color: rgba(245, 158, 11, 0.35);
  background: rgba(245, 158, 11, 0.2);
  color: #fcd34d;
}

[data-theme="dark"] main.users-page .admin-lock-label::before {
  background: rgba(245, 158, 11, 0.3);
  color: #fde68a;
}

[data-theme="dark"] main.users-page .add-user-panel,
[data-theme="dark"] main.users-page .edit-user-panel,
[data-theme="dark"] main.users-page .bulk-modal-card {
  border-color: rgba(148, 163, 184, 0.28);
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(320px 140px at 94% -12%, rgba(56, 189, 248, 0.14), transparent 70%);
}

[data-theme="dark"] main.users-page .bulk-chip {
  background: rgba(51, 65, 85, 0.7);
  color: #cbd5e1;
}

[data-theme="dark"] main.users-page .bulk-chip-success {
  background: rgba(16, 185, 129, 0.2);
  color: #6ee7b7;
}

[data-theme="dark"] main.users-page .bulk-chip-danger {
  background: rgba(244, 63, 94, 0.2);
  color: #fda4af;
}

[data-theme="dark"] main.users-page .bulk-error-list {
  color: #fda4af;
}

[data-theme="dark"] main.users-page .btn-secondary,
[data-theme="dark"] main.users-page .page-btn {
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(148, 163, 184, 0.34);
  color: #e2e8f0;
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.42);
}

[data-theme="dark"] main.users-page .btn-secondary:hover,
[data-theme="dark"] main.users-page .page-btn:hover {
  background: rgba(30, 64, 175, 0.24);
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.42);
}

[data-theme="dark"] main.users-page .users-table-wrap::-webkit-scrollbar,
[data-theme="dark"] main.users-page .bulk-preview-wrap::-webkit-scrollbar {
  height: 12px;
  width: 12px;
}

[data-theme="dark"] main.users-page .users-table-wrap::-webkit-scrollbar-track,
[data-theme="dark"] main.users-page .bulk-preview-wrap::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.users-page .users-table-wrap::-webkit-scrollbar-thumb,
[data-theme="dark"] main.users-page .bulk-preview-wrap::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, 0.85);
  border-radius: 999px;
  border: 2px solid rgba(15, 23, 42, 0.92);
}

[data-theme="dark"] main.users-page .users-table-wrap,
[data-theme="dark"] main.users-page .bulk-preview-wrap {
  scrollbar-color: rgba(100, 116, 139, 0.85) rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.logs-page > .logs-card {
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(300px 140px at 90% -12%, rgba(37, 99, 235, 0.2), transparent 72%),
    radial-gradient(280px 140px at 10% 112%, rgba(14, 165, 233, 0.12), transparent 76%);
  border-color: rgba(96, 165, 250, 0.28);
  box-shadow:
    0 30px 64px rgba(2, 6, 23, 0.62),
    0 10px 24px rgba(37, 99, 235, 0.16),
    inset 0 1px 0 rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] main.logs-page > .logs-card::before {
  background: linear-gradient(120deg, rgba(59, 130, 246, 0.44), rgba(14, 165, 233, 0.08), rgba(59, 130, 246, 0.38));
  opacity: 0.85;
}

[data-theme="dark"] main.logs-page .logs-head p,
[data-theme="dark"] main.logs-page .logs-filters label,
[data-theme="dark"] main.logs-page .logs-meta {
  color: #cbd5e1;
}

[data-theme="dark"] main.logs-page .logs-filters select,
[data-theme="dark"] main.logs-page .logs-filters input {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.34);
}

[data-theme="dark"] main.logs-page .logs-filters input::placeholder {
  color: #64748b;
}

[data-theme="dark"] main.logs-page .logs-filters input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(0.84) hue-rotate(180deg);
}

[data-theme="dark"] main.logs-page .logs-table-wrap {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.logs-page .logs-table th {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.95));
  color: #cbd5e1;
}

[data-theme="dark"] main.logs-page .logs-table td {
  border-bottom-color: rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] main.logs-page .logs-table tbody tr:hover td {
  background: rgba(37, 99, 235, 0.18);
}

[data-theme="dark"] main.logs-page .cell-id,
[data-theme="dark"] main.logs-page .empty-cell {
  color: #94a3b8;
}

[data-theme="dark"] main.logs-page .action-create,
[data-theme="dark"] main.logs-page .action-success {
  background: rgba(16, 185, 129, 0.2);
  color: #6ee7b7;
}

[data-theme="dark"] main.logs-page .action-update,
[data-theme="dark"] main.logs-page .action-login {
  background: rgba(59, 130, 246, 0.22);
  color: #bfdbfe;
}

[data-theme="dark"] main.logs-page .action-delete,
[data-theme="dark"] main.logs-page .action-fail {
  background: rgba(244, 63, 94, 0.2);
  color: #fda4af;
}

[data-theme="dark"] main.logs-page .action-register {
  background: rgba(236, 72, 153, 0.2);
  color: #f9a8d4;
}

[data-theme="dark"] main.logs-page .payload-details summary {
  color: #93c5fd;
}

[data-theme="dark"] main.logs-page .logs-table pre {
  background: rgba(2, 6, 23, 0.56);
  color: #cbd5e1;
}

[data-theme="dark"] main.logs-page .btn-secondary,
[data-theme="dark"] main.logs-page .page-btn {
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(148, 163, 184, 0.34);
  color: #e2e8f0;
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.42);
}

[data-theme="dark"] main.logs-page .btn-secondary:hover,
[data-theme="dark"] main.logs-page .page-btn:hover {
  background: rgba(30, 64, 175, 0.24);
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.42);
}

[data-theme="dark"] main.logs-page .logs-pagination .page-indicator {
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(30, 41, 59, 0.88);
  color: #cbd5e1;
}

[data-theme="dark"] main.logs-page .logs-pagination .page-btn.is-disabled,
[data-theme="dark"] main.logs-page .logs-pagination .page-btn.is-disabled:hover {
  background: rgba(51, 65, 85, 0.66);
  color: rgba(148, 163, 184, 0.86);
  border-color: rgba(100, 116, 139, 0.52);
}

[data-theme="dark"] main.logs-page .logs-table-wrap::-webkit-scrollbar {
  height: 12px;
  width: 12px;
}

[data-theme="dark"] main.logs-page .logs-table-wrap::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.logs-page .logs-table-wrap::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, 0.85);
  border-radius: 999px;
  border: 2px solid rgba(15, 23, 42, 0.92);
}

[data-theme="dark"] main.logs-page .logs-table-wrap {
  scrollbar-color: rgba(100, 116, 139, 0.85) rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] .bulk-modal-backdrop,
[data-theme="dark"] .attendance-modal-backdrop,
[data-theme="dark"] .election-result-backdrop {
  background: rgba(2, 6, 23, 0.74);
}

[data-theme="dark"] .news-card,
[data-theme="dark"] .detail-card,
[data-theme="dark"] .draft-actions,
[data-theme="dark"] .news-form,
[data-theme="dark"] .news-create-upload-card,
[data-theme="dark"] .news-create-media,
[data-theme="dark"] .media-card,
[data-theme="dark"] .gallery-card,
[data-theme="dark"] .thumb,
[data-theme="dark"] .pending-media {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.84));
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 12px 30px rgba(2, 6, 23, 0.46);
}

[data-theme="dark"] .news-body,
[data-theme="dark"] .muted,
[data-theme="dark"] .muted-note,
[data-theme="dark"] .news-meta {
  color: #94a3b8;
}

/* ===== News Detail — dark theme ===== */

[data-theme="dark"] .news-detail-blob { mix-blend-mode: screen; opacity: 0.6; }
[data-theme="dark"] .news-detail-grid-overlay {
  background-image:
    linear-gradient(rgba(96, 165, 250, 0.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(96, 165, 250, 0.1) 1px, transparent 1px);
  opacity: 0.85;
}

[data-theme="dark"] .news-detail .back-link {
  border-color: rgba(96, 165, 250, 0.34);
  background: linear-gradient(135deg, rgba(30, 64, 175, 0.2), rgba(14, 165, 233, 0.1));
  color: #bfdbfe;
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.42);
}
[data-theme="dark"] .news-detail .back-link:hover {
  background: linear-gradient(135deg, rgba(30, 64, 175, 0.3), rgba(14, 165, 233, 0.16));
  box-shadow: 0 14px 26px rgba(2, 6, 23, 0.5);
  border-color: rgba(96, 165, 250, 0.5);
}

[data-theme="dark"] .news-detail .detail-card {
  background:
    radial-gradient(420px 260px at 92% -10%, rgba(37, 99, 235, 0.16), transparent 65%),
    linear-gradient(170deg, rgba(15, 23, 42, 0.94), rgba(2, 6, 23, 0.92));
  border-color: rgba(148, 163, 184, 0.3);
  box-shadow:
    0 22px 46px rgba(0, 0, 0, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
[data-theme="dark"] .news-detail-glow {
  background: radial-gradient(circle, rgba(14, 165, 233, 0.3), transparent 70%);
  opacity: 0.5;
}

[data-theme="dark"] .news-detail .detail-card h1,
[data-theme="dark"] .news-detail .detail-title {
  color: #f1f5f9;
}

[data-theme="dark"] .news-detail-eyebrow {
  color: #93c5fd;
  background: linear-gradient(120deg, rgba(96, 165, 250, 0.18), rgba(56, 189, 248, 0.1));
  border-color: rgba(96, 165, 250, 0.36);
}

[data-theme="dark"] .news-detail .news-meta-chip {
  color: #cbd5e1;
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.86), rgba(15, 23, 42, 0.8));
  border-color: rgba(148, 163, 184, 0.28);
}
[data-theme="dark"] .news-detail .news-meta-chip:hover {
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.4);
}
[data-theme="dark"] .news-detail .news-meta-chip svg { color: #60a5fa; }

[data-theme="dark"] .news-detail .hero-media {
  background:
    radial-gradient(200px 120px at 90% -10%, rgba(37, 99, 235, 0.12), transparent 70%),
    linear-gradient(160deg, rgba(30, 41, 59, 0.88), rgba(15, 23, 42, 0.92));
  border-color: rgba(148, 163, 184, 0.3);
}
[data-theme="dark"] .news-detail .hero-media:hover {
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.55);
}

[data-theme="dark"] .news-detail .detail-card img,
[data-theme="dark"] .news-detail .detail-card video {
  box-shadow: 0 14px 30px rgba(2, 6, 23, 0.58);
}

[data-theme="dark"] .news-detail .video-btn {
  border-color: rgba(148, 163, 184, 0.34);
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.92), rgba(15, 23, 42, 0.88));
  color: #e2e8f0;
}
[data-theme="dark"] .news-detail .video-btn:hover {
  background: linear-gradient(135deg, rgba(30, 64, 175, 0.24), rgba(14, 165, 233, 0.14));
  color: #bfdbfe;
  box-shadow: 0 10px 20px rgba(2, 6, 23, 0.42);
  border-color: rgba(96, 165, 250, 0.36);
}
[data-theme="dark"] .news-detail .video-btn.is-active {
  background: linear-gradient(135deg, #2563eb, #0ea5e9);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.32);
}
[data-theme="dark"] .news-detail .video-btn svg { color: #60a5fa; }
[data-theme="dark"] .news-detail .video-btn:hover svg { color: #93c5fd; }
[data-theme="dark"] .news-detail .video-btn.is-active svg { color: #fff; }

[data-theme="dark"] .news-detail .gallery-card {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(2, 6, 23, 0.88));
  border-color: rgba(148, 163, 184, 0.3);
  box-shadow: 0 10px 22px rgba(2, 6, 23, 0.46);
}
[data-theme="dark"] .news-detail .gallery-card:hover {
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.6);
}

[data-theme="dark"] .news-detail .news-content {
  color: #e2e8f0;
}
[data-theme="dark"] .news-detail .news-content::first-letter {
  background: linear-gradient(135deg, #60a5fa, #38bdf8);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Image Lightbox — dark theme */

[data-theme="dark"] .image-lightbox-backdrop {
  background: radial-gradient(120% 100% at 50% 50%, rgba(2, 6, 23, 0.78) 0%, rgba(2, 6, 23, 0.94) 100%);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
  backdrop-filter: blur(22px) saturate(140%);
}

[data-theme="dark"] .image-lightbox-img {
  background:
    linear-gradient(135deg, rgba(37, 99, 235, 0.18), rgba(14, 165, 233, 0.06)),
    rgba(11, 18, 32, 0.6);
  box-shadow:
    0 36px 90px rgba(0, 0, 0, 0.7),
    0 16px 36px rgba(0, 0, 0, 0.5),
    inset 0 0 0 1px rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] .image-lightbox-close {
  border-color: rgba(148, 163, 184, 0.28);
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(2, 6, 23, 0.92));
  color: #cbd5e1;
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.55),
    0 4px 10px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .image-lightbox-close:hover {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.96), rgba(15, 23, 42, 0.96));
  color: #93c5fd;
  border-color: rgba(96, 165, 250, 0.5);
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.6),
    0 8px 18px rgba(37, 99, 235, 0.35),
    inset 0 1px 0 rgba(148, 163, 184, 0.08);
}

[data-theme="dark"] .image-lightbox-close:focus-visible {
  outline-color: rgba(96, 165, 250, 0.85);
}

[data-theme="dark"] .news-form-page .form-head h1,
[data-theme="dark"] .news-create-page .form-head h1,
[data-theme="dark"] .news-form-page .section-title,
[data-theme="dark"] .news-form-page .form-field > span {
  color: #f8fafc;
}

[data-theme="dark"] .news-form-page .kicker,
[data-theme="dark"] .news-create-page .news-create-subtitle {
  color: #cbd5e1;
}

[data-theme="dark"] .news-form-page .link-back {
  border-color: rgba(96, 165, 250, 0.34);
  background: rgba(30, 64, 175, 0.2);
  color: #bfdbfe;
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.42);
}

[data-theme="dark"] .news-form-page .link-back:hover {
  background: rgba(30, 64, 175, 0.3);
  box-shadow: 0 12px 22px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .news-form-page .media-card-head {
  color: #e2e8f0;
}

[data-theme="dark"] .news-form-page .media-preview img,
[data-theme="dark"] .news-form-page .media-preview video,
[data-theme="dark"] .news-form-page .media-card img {
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.54);
}

[data-theme="dark"] .news-form-page .selectable .thumb-select {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.9));
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 10px 22px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .news-form-page .thumb-select img,
[data-theme="dark"] .news-form-page .thumb-select video {
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 10px 20px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .news-form-page .pending-name {
  color: #94a3b8;
}

[data-theme="dark"] .news-form-page .btn-clear {
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(148, 163, 184, 0.34);
  color: #e2e8f0;
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.42);
}

[data-theme="dark"] .news-form-page .btn-clear:hover {
  background: rgba(30, 64, 175, 0.24);
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.42);
}

[data-theme="dark"] .news-form-page .media-badge.badge-image {
  background: rgba(67, 56, 202, 0.3);
  color: #c7d2fe;
}

[data-theme="dark"] .news-form-page .media-badge.badge-video {
  background: rgba(3, 105, 161, 0.3);
  color: #bae6fd;
}

[data-theme="dark"] .news-create-page .news-create-form {
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(300px 140px at 90% -12%, rgba(37, 99, 235, 0.18), transparent 72%),
    radial-gradient(280px 140px at 10% 112%, rgba(14, 165, 233, 0.1), transparent 76%);
  border-color: rgba(96, 165, 250, 0.28);
  box-shadow:
    0 30px 64px rgba(2, 6, 23, 0.62),
    0 10px 24px rgba(37, 99, 235, 0.16),
    inset 0 1px 0 rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] .news-create-page .news-create-field span,
[data-theme="dark"] .news-create-page .news-create-media-head h2,
[data-theme="dark"] .news-create-page .news-create-upload-head h3,
[data-theme="dark"] .news-create-page .news-create-publish {
  color: #e2e8f0;
}

[data-theme="dark"] .news-create-page .news-create-publish {
  border-color: rgba(148, 163, 184, 0.36);
  background: rgba(15, 23, 42, 0.76);
}

[data-theme="dark"] .news-create-page .news-create-publish:hover {
  border-color: rgba(96, 165, 250, 0.58);
  background: rgba(30, 64, 175, 0.26);
}

[data-theme="dark"] .news-create-page .news-create-publish input[type="checkbox"] {
  accent-color: #60a5fa;
}

[data-theme="dark"] .news-create-page .news-create-form .news-create-field input[type="text"],
[data-theme="dark"] .news-create-page .news-create-form .news-create-field textarea {
  border-color: rgba(148, 163, 184, 0.34);
  background: #0b1220;
  color: #e2e8f0;
}

[data-theme="dark"] .news-create-page .news-create-form .news-create-field textarea:focus-visible,
[data-theme="dark"] .news-create-page .news-create-form .news-create-field input[type="text"]:focus-visible {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
  background: #0b1220;
}

[data-theme="dark"] .news-create-page .news-create-hint,
[data-theme="dark"] .news-create-page .news-create-media-head p,
[data-theme="dark"] .news-create-page .news-create-help {
  color: #94a3b8;
}

[data-theme="dark"] .news-create-page .news-create-counter {
  color: #93c5fd;
}

[data-theme="dark"] .news-create-page .news-create-badge {
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.38);
  background: rgba(30, 64, 175, 0.22);
}

[data-theme="dark"] .news-create-page .news-create-dropzone {
  border-color: rgba(96, 165, 250, 0.36);
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] .news-create-page .news-create-dropzone:hover {
  border-color: rgba(96, 165, 250, 0.52);
  background: linear-gradient(160deg, rgba(30, 64, 175, 0.3), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] .news-create-page .news-create-dropzone.is-dragging {
  border-color: rgba(96, 165, 250, 0.72);
  background: linear-gradient(160deg, rgba(30, 64, 175, 0.38), rgba(15, 23, 42, 0.92));
}

[data-theme="dark"] .news-create-page .news-create-drop-title {
  color: #93c5fd;
}

[data-theme="dark"] .news-create-page .news-create-drop-subtitle,
[data-theme="dark"] .news-create-page .news-create-file-meta {
  color: #cbd5e1;
}

[data-theme="dark"] .news-create-page .news-create-inline-error {
  border-color: rgba(248, 113, 113, 0.36);
  background: rgba(127, 29, 29, 0.28);
  color: #fecaca;
}

[data-theme="dark"] .news-create-page .news-create-media-preview {
  border-color: rgba(148, 163, 184, 0.3);
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] .news-create-page .news-create-file-list li {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(30, 41, 59, 0.86);
  color: #e2e8f0;
}

[data-theme="dark"] .news-create-page .news-create-form .btn-primary:disabled {
  opacity: 0.72;
  background: rgba(71, 85, 105, 0.8);
  color: rgba(226, 232, 240, 0.86);
}

[data-theme="dark"] .badge-image {
  background: rgba(67, 56, 202, 0.24);
  color: #c7d2fe;
}

[data-theme="dark"] .badge-video {
  background: rgba(3, 105, 161, 0.24);
  color: #bae6fd;
}

[data-theme="dark"] .alert-error {
  background: rgba(185, 28, 28, 0.22);
  color: #fecaca;
  border-color: rgba(248, 113, 113, 0.34);
}

[data-theme="dark"] .alert-success {
  background: rgba(6, 95, 70, 0.22);
  color: #bbf7d0;
  border-color: rgba(16, 185, 129, 0.34);
}

[data-theme="dark"] .profile-settings-card,
[data-theme="dark"] .profile-settings-preview-panel,
[data-theme="dark"] .profile-settings-upload-panel,
[data-theme="dark"] .candidate-add-card,
[data-theme="dark"] .candidate-add-preview-box {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.84));
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 16px 36px rgba(2, 6, 23, 0.54);
}

[data-theme="dark"] .candidate-add-dropzone,
[data-theme="dark"] .profile-settings-dropzone {
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
  border-color: rgba(96, 165, 250, 0.34);
}

[data-theme="dark"] .candidate-add-dropzone:hover,
[data-theme="dark"] .profile-settings-dropzone:hover {
  background: linear-gradient(160deg, rgba(30, 64, 175, 0.3), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.candidate-add-page .candidate-add-card {
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(300px 140px at 90% -12%, rgba(37, 99, 235, 0.2), transparent 72%),
    radial-gradient(280px 140px at 10% 112%, rgba(14, 165, 233, 0.12), transparent 76%);
  border-color: rgba(96, 165, 250, 0.28);
  box-shadow:
    0 30px 64px rgba(2, 6, 23, 0.62),
    0 10px 24px rgba(37, 99, 235, 0.16),
    inset 0 1px 0 rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] main.candidate-add-page .candidate-add-kicker {
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.38);
  background: rgba(30, 64, 175, 0.22);
}

[data-theme="dark"] main.candidate-add-page .candidate-add-election-title,
[data-theme="dark"] main.candidate-add-page .candidate-add-hint,
[data-theme="dark"] main.candidate-add-page .candidate-add-help,
[data-theme="dark"] main.candidate-add-page .candidate-add-preview-hint {
  color: #94a3b8;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-counter {
  color: #93c5fd;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-field label {
  color: #e2e8f0;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-field input[type="text"],
[data-theme="dark"] main.candidate-add-page .candidate-add-field select {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.34);
}

[data-theme="dark"] main.candidate-add-page .candidate-add-field input[type="text"]::placeholder {
  color: #64748b;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-field input[type="text"]:focus-visible,
[data-theme="dark"] main.candidate-add-page .candidate-add-field select:focus-visible {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
  background: #0b1220;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-field select option,
[data-theme="dark"] main.candidate-add-page .candidate-add-field select optgroup {
  background-color: #0b1220;
  color: #e2e8f0;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-field select option:checked {
  background-color: #1d4ed8;
  color: #f8fafc;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-file-meta {
  color: #cbd5e1;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-inline-error {
  border-color: rgba(248, 113, 113, 0.36);
  background: rgba(127, 29, 29, 0.28);
  color: #fecaca;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-preview-box {
  border-color: rgba(148, 163, 184, 0.28);
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.95), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.candidate-add-page .candidate-add-preview-frame {
  border-color: rgba(148, 163, 184, 0.3);
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.candidate-add-page .candidate-add-preview-frame span {
  color: #94a3b8;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-drop-title {
  color: #93c5fd;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-drop-subtitle {
  color: #cbd5e1;
}

[data-theme="dark"] main.candidate-add-page .candidate-add-submit:disabled {
  opacity: 0.72;
  background: rgba(71, 85, 105, 0.8);
  color: rgba(226, 232, 240, 0.86);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-card {
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(300px 140px at 90% -12%, rgba(37, 99, 235, 0.18), transparent 72%),
    radial-gradient(280px 140px at 10% 112%, rgba(14, 165, 233, 0.1), transparent 76%);
  border-color: rgba(96, 165, 250, 0.28);
  box-shadow:
    0 30px 64px rgba(2, 6, 23, 0.62),
    0 10px 24px rgba(37, 99, 235, 0.16),
    inset 0 1px 0 rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-card::before {
  background: radial-gradient(closest-side, rgba(59, 130, 246, 0.24), rgba(59, 130, 246, 0));
}

[data-theme="dark"] main.profile-settings-main .profile-settings-kicker {
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.38);
  background: rgba(30, 64, 175, 0.22);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-card h1 {
  color: #f8fafc;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-subtitle {
  color: #cbd5e1;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-alert.success {
  border-color: rgba(74, 222, 128, 0.3);
  background: rgba(6, 95, 70, 0.24);
  color: #bbf7d0;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-alert.error {
  border-color: rgba(248, 113, 113, 0.36);
  background: rgba(153, 27, 27, 0.24);
  color: #fecaca;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-preview-panel,
[data-theme="dark"] main.profile-settings-main .profile-settings-upload-panel {
  border-color: rgba(148, 163, 184, 0.28);
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.95), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.profile-settings-main .profile-settings-preview {
  background: #0b1220;
  border-color: rgba(96, 165, 250, 0.38);
  box-shadow: 0 14px 28px rgba(2, 6, 23, 0.58);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-preview-hint {
  color: #e2e8f0;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-file-meta {
  color: #94a3b8;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-reset {
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(30, 41, 59, 0.92);
  color: #e2e8f0;
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.42);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-reset:hover {
  background: rgba(30, 64, 175, 0.24);
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.42);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-reset:focus-visible,
[data-theme="dark"] main.profile-settings-main .profile-settings-dropzone:focus-visible {
  outline-color: rgba(96, 165, 250, 0.7);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-field-label {
  color: #e2e8f0;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-dropzone {
  border-color: rgba(96, 165, 250, 0.36);
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.profile-settings-main .profile-settings-dropzone:hover {
  border-color: rgba(96, 165, 250, 0.52);
  background: linear-gradient(160deg, rgba(30, 64, 175, 0.3), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.profile-settings-main .profile-settings-dropzone.is-dragging {
  border-color: rgba(96, 165, 250, 0.72);
  background: linear-gradient(160deg, rgba(30, 64, 175, 0.38), rgba(15, 23, 42, 0.92));
}

[data-theme="dark"] main.profile-settings-main .profile-settings-drop-title {
  color: #93c5fd;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-drop-subtitle {
  color: #cbd5e1;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-selected-file {
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.3);
  background: rgba(30, 41, 59, 0.86);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-help {
  color: #94a3b8;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-inline-error {
  border-color: rgba(248, 113, 113, 0.36);
  background: rgba(127, 29, 29, 0.28);
  color: #fecaca;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-tips li {
  border-color: rgba(16, 185, 129, 0.28);
  background: rgba(6, 78, 59, 0.34);
  color: #a7f3d0;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-submit:disabled {
  opacity: 0.72;
  background: rgba(71, 85, 105, 0.8);
  color: rgba(226, 232, 240, 0.86);
}


[data-theme="dark"] main.profile-settings-main .profile-settings-remove-section {
  border-color: rgba(244, 63, 94, 0.22);
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(35, 12, 16, 0.65));
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-section::before {
  background: radial-gradient(closest-side, rgba(244, 63, 94, 0.1), rgba(244, 63, 94, 0));
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-section h2 {
  color: #fda4af;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-kicker-remove {
  color: #fda4af;
  background: rgba(244, 63, 94, 0.14);
  border-color: rgba(244, 63, 94, 0.28);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-preview-panel,
[data-theme="dark"] main.profile-settings-main .profile-settings-remove-action-panel {
  border-color: rgba(148, 163, 184, 0.28);
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.95), rgba(15, 23, 42, 0.9));
  box-shadow: 0 14px 30px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-preview-panel:hover,
[data-theme="dark"] main.profile-settings-main .profile-settings-remove-action-panel:hover {
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.58);
  border-color: rgba(96, 165, 250, 0.3);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-avatar {
  background: #0b1220;
  border-color: rgba(244, 63, 94, 0.3);
  box-shadow: 0 12px 28px rgba(2, 6, 23, 0.55);
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-current-label {
  color: #e2e8f0;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-info {
  background: rgba(245, 158, 11, 0.08);
  border-color: rgba(245, 158, 11, 0.25);
  color: #fcd34d;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-info svg {
  color: #fbbf24;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-submit {
  background: linear-gradient(135deg, #e11d48, #be123c);
  border-color: #be123c;
}

[data-theme="dark"] main.profile-settings-main .profile-settings-remove-submit:hover {
  background: linear-gradient(135deg, #be123c, #9f1239);
  box-shadow: 0 10px 22px rgba(225, 29, 72, 0.35);
}

[data-theme="dark"] .report-page {
  --bg: #020617;
  --card-bg: rgba(15, 23, 42, 0.9);
  --text: #e2e8f0;
  --text-soft: #94a3b8;
  --primary: #60a5fa;
  --primary-dark: #3b82f6;
  --primary-glow: rgba(96, 165, 250, 0.28);
  --danger: #f87171;
  --warning: #f59e0b;
  --success: #34d399;
  --border: rgba(148, 163, 184, 0.26);
  --shadow-sm: 0 6px 16px rgba(2, 6, 23, 0.46);
  --shadow-md: 0 12px 32px rgba(2, 6, 23, 0.58);
}

[data-theme="dark"] main.page {
  --bg: #020617;
  --surface: #0f172a;
  --panel: rgba(15, 23, 42, 0.92);
  --panel-strong: #152238;
  --text: #e2e8f0;
  --muted: #94a3b8;
  --primary: #60a5fa;
  --primary-soft: rgba(96, 165, 250, 0.24);
  --accent: #93c5fd;
  --danger: #f87171;
  --weekend: #64748b;
  --stroke: rgba(148, 163, 184, 0.3);
  --shadow: 0 24px 60px rgba(2, 6, 23, 0.55);
  color: var(--text);
}

[data-theme="dark"] main.page .page-header h1,
[data-theme="dark"] main.page .calendar-title h2,
[data-theme="dark"] main.page .calendar-details h3,
[data-theme="dark"] main.page .side-card h3,
[data-theme="dark"] main.page .event-panel h3 {
  color: #f8fafc;
}

[data-theme="dark"] main.page .page-header p,
[data-theme="dark"] main.page .calendar-title span,
[data-theme="dark"] main.page .calendar-label,
[data-theme="dark"] main.page .legend-item,
[data-theme="dark"] main.page .panel-hint,
[data-theme="dark"] main.page .form-group label,
[data-theme="dark"] main.page .event-meta span,
[data-theme="dark"] main.page .event-note {
  color: #cbd5e1;
}

[data-theme="dark"] main.page .calendar-card {
  border-color: rgba(96, 165, 250, 0.24);
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(300px 140px at 90% -12%, rgba(37, 99, 235, 0.16), transparent 72%);
}

[data-theme="dark"] main.page .nav-btn {
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(30, 41, 59, 0.92);
  color: #e2e8f0;
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.44);
}

[data-theme="dark"] main.page .btn.ghost {
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(148, 163, 184, 0.34);
  color: #e2e8f0;
}

[data-theme="dark"] main.page .add-event-icon-btn {
  background: rgba(30, 41, 59, 0.92) !important;
  border-color: rgba(148, 163, 184, 0.34);
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.44);
}

[data-theme="dark"] main.page .add-event-icon-btn:hover {
  background: rgba(30, 64, 175, 0.24) !important;
  border-color: rgba(96, 165, 250, 0.42);
}

[data-theme="dark"] main.page .filter-chip {
  color: #e2e8f0;
}


[data-theme="dark"] main.page .calendar-details,
[data-theme="dark"] main.page .side-card,
[data-theme="dark"] main.page .event-panel {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(15, 23, 42, 0.9);
}

[data-theme="dark"] main.page .form-group input,
[data-theme="dark"] main.page .form-group select,
[data-theme="dark"] main.page .form-group textarea {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.34);
}

[data-theme="dark"] main.page .form-group input::placeholder,
[data-theme="dark"] main.page .form-group textarea::placeholder {
  color: #64748b;
}

[data-theme="dark"] main.page .form-group select option,
[data-theme="dark"] main.page .form-group select optgroup {
  background: #0b1220;
  color: #e2e8f0;
}

[data-theme="dark"] .calendar-day.today {
  background: #17253c !important;
}

[data-theme="dark"] .calendar-upcoming-item,
[data-theme="dark"] .calendar-weekly-item,
[data-theme="dark"] .event-item {
  background: rgba(15, 23, 42, 0.9);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] main.attendance-page > .attendance-card {
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(300px 140px at 90% -12%, rgba(37, 99, 235, 0.2), transparent 72%),
    radial-gradient(280px 140px at 10% 112%, rgba(14, 165, 233, 0.12), transparent 76%);
  border-color: rgba(96, 165, 250, 0.28);
  box-shadow:
    0 30px 64px rgba(2, 6, 23, 0.62),
    0 10px 24px rgba(37, 99, 235, 0.16),
    inset 0 1px 0 rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] main.attendance-page > .attendance-card::before {
  background: linear-gradient(120deg, rgba(59, 130, 246, 0.44), rgba(14, 165, 233, 0.08), rgba(59, 130, 246, 0.38));
  opacity: 0.85;
}

[data-theme="dark"] main.attendance-page .attendance-head {
  border-bottom-color: rgba(148, 163, 184, 0.28);
}

[data-theme="dark"] main.attendance-page .attendance-head p,
[data-theme="dark"] main.attendance-page .attendance-filters label,
[data-theme="dark"] main.attendance-page .attendance-form label:not(.hour-checkbox),
[data-theme="dark"] main.attendance-page .attendance-modal-form label:not(.hour-checkbox),
[data-theme="dark"] main.attendance-page .section-head p,
[data-theme="dark"] main.attendance-page .hours-fieldset legend {
  color: #cbd5e1;
}

[data-theme="dark"] main.attendance-page .attendance-filters input,
[data-theme="dark"] main.attendance-page .attendance-filters select,
[data-theme="dark"] main.attendance-page .attendance-form input,
[data-theme="dark"] main.attendance-page .attendance-modal-form input,
[data-theme="dark"] main.attendance-page .attendance-modal-form textarea {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.34);
}

[data-theme="dark"] main.attendance-page .attendance-filters input::placeholder,
[data-theme="dark"] main.attendance-page .attendance-form input::placeholder,
[data-theme="dark"] main.attendance-page .attendance-modal-form textarea::placeholder {
  color: #64748b;
}

[data-theme="dark"] main.attendance-page .attendance-filters input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(0.84) hue-rotate(180deg);
}

[data-theme="dark"] main.attendance-page .attendance-meta {
  border-color: rgba(148, 163, 184, 0.3);
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.92), rgba(15, 23, 42, 0.9));
  color: #cbd5e1;
}

[data-theme="dark"] main.attendance-page .attendance-meta strong {
  color: #f8fafc;
}

[data-theme="dark"] main.attendance-page .attendance-create,
[data-theme="dark"] main.attendance-page .attendance-list {
  border-color: rgba(148, 163, 184, 0.28);
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.attendance-page .absent-row {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(30, 41, 59, 0.75);
}

[data-theme="dark"] main.attendance-page .hours-fieldset {
  border-color: rgba(148, 163, 184, 0.3);
  background: rgba(15, 23, 42, 0.86);
}

[data-theme="dark"] main.attendance-page .hour-checkbox {
  border-color: rgba(148, 163, 184, 0.32);
  background: rgba(15, 23, 42, 0.92);
  color: #cbd5e1;
}

[data-theme="dark"] main.attendance-page .hour-checkbox:hover {
  border-color: rgba(96, 165, 250, 0.44);
  background: rgba(30, 64, 175, 0.2);
  color: #bfdbfe;
}

[data-theme="dark"] main.attendance-page .hour-checkbox input {
  border-color: rgba(148, 163, 184, 0.72);
  background: #0b1220;
}

[data-theme="dark"] main.attendance-page .hour-checkbox.is-checked {
  border-color: rgba(248, 113, 113, 0.48);
  background: linear-gradient(180deg, rgba(127, 29, 29, 0.24), rgba(153, 27, 27, 0.2));
  color: #fecaca;
}

[data-theme="dark"] main.attendance-page .hour-checkbox.is-checked:hover {
  border-color: rgba(248, 113, 113, 0.62);
  background: linear-gradient(180deg, rgba(153, 27, 27, 0.3), rgba(185, 28, 28, 0.24));
}

[data-theme="dark"] main.attendance-page .btn-secondary,
[data-theme="dark"] main.attendance-page .btn-action {
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(148, 163, 184, 0.34);
  color: #e2e8f0;
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.42);
}

[data-theme="dark"] main.attendance-page .btn-secondary:hover,
[data-theme="dark"] main.attendance-page .btn-action:hover {
  background: rgba(30, 64, 175, 0.24);
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.42);
}

[data-theme="dark"] main.attendance-page .btn-danger,
[data-theme="dark"] main.attendance-page .btn-delete {
  border-color: rgba(248, 113, 113, 0.45);
  background: rgba(185, 28, 28, 0.24);
  color: #fecaca;
}

[data-theme="dark"] main.attendance-page .btn-danger:hover,
[data-theme="dark"] main.attendance-page .btn-delete:hover {
  background: rgba(185, 28, 28, 0.34);
}

[data-theme="dark"] main.attendance-page .attendance-table-wrap {
  border-color: rgba(148, 163, 184, 0.28);
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.attendance-page .attendance-table th {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.95));
  color: #cbd5e1;
}

[data-theme="dark"] main.attendance-page .attendance-table td {
  border-bottom-color: rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] main.attendance-page .attendance-table tbody tr:hover td {
  background: rgba(37, 99, 235, 0.18);
}

[data-theme="dark"] main.attendance-page .hour-badge.is-absent {
  background: rgba(244, 63, 94, 0.22);
  color: #fda4af;
}

[data-theme="dark"] main.attendance-page .hour-badge.is-present {
  background: rgba(51, 65, 85, 0.75);
  color: #cbd5e1;
}

[data-theme="dark"] main.attendance-page .empty-state {
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(15, 23, 42, 0.84);
  color: #cbd5e1;
}

[data-theme="dark"] main.attendance-page .attendance-modal-backdrop {
  background: rgba(2, 6, 23, 0.76);
}

[data-theme="dark"] main.attendance-page .attendance-modal-dialog {
  border-color: rgba(148, 163, 184, 0.32);
  background: linear-gradient(180deg, rgba(11, 18, 32, 0.98), rgba(15, 23, 42, 0.96));
  box-shadow: 0 24px 48px rgba(2, 6, 23, 0.62);
}

[data-theme="dark"] main.attendance-page .attendance-modal-head {
  border-bottom-color: rgba(148, 163, 184, 0.28);
  background: rgba(30, 64, 175, 0.16);
}

[data-theme="dark"] main.attendance-page .icon-close {
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(30, 41, 59, 0.92);
  color: #cbd5e1;
}

[data-theme="dark"] main.attendance-page .icon-close:hover {
  background: rgba(30, 64, 175, 0.24);
  color: #bfdbfe;
}

[data-theme="dark"] main.attendance-page .attendance-table-wrap::-webkit-scrollbar {
  height: 12px;
  width: 12px;
}

[data-theme="dark"] main.attendance-page .attendance-table-wrap::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.attendance-page .attendance-table-wrap::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, 0.85);
  border-radius: 999px;
  border: 2px solid rgba(15, 23, 42, 0.92);
}

[data-theme="dark"] main.attendance-page .attendance-table-wrap {
  scrollbar-color: rgba(100, 116, 139, 0.85) rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.database-page > .database-card {
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(300px 140px at 90% -12%, rgba(37, 99, 235, 0.2), transparent 72%),
    radial-gradient(280px 140px at 10% 112%, rgba(14, 165, 233, 0.12), transparent 76%);
  border-color: rgba(96, 165, 250, 0.28);
  box-shadow:
    0 30px 64px rgba(2, 6, 23, 0.62),
    0 10px 24px rgba(37, 99, 235, 0.16),
    inset 0 1px 0 rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] main.database-page .database-head {
  border-bottom-color: rgba(148, 163, 184, 0.28);
}

[data-theme="dark"] main.database-page .database-head p,
[data-theme="dark"] main.database-page .tool-card p,
[data-theme="dark"] main.database-page .grid-form label,
[data-theme="dark"] main.database-page .meta-list,
[data-theme="dark"] main.database-page .empty-state,
[data-theme="dark"] main.database-page .restore-note {
  color: #cbd5e1;
}

[data-theme="dark"] main.database-page .database-stats .stat-item {
  border-color: rgba(96, 165, 250, 0.24);
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.95), rgba(15, 23, 42, 0.95));
}

[data-theme="dark"] main.database-page .database-stats .stat-item strong {
  color: #f8fafc;
}

[data-theme="dark"] main.database-page .database-stats .stat-item span {
  color: #cbd5e1;
}

[data-theme="dark"] main.database-page .tool-card {
  border-color: rgba(148, 163, 184, 0.28);
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.database-page .grid-form input[type="number"] {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.34);
}

[data-theme="dark"] main.database-page .grid-form input[type="number"]:focus-visible {
  outline: none;
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
}

[data-theme="dark"] main.database-page .meta-list span {
  color: #f8fafc;
}

[data-theme="dark"] main.database-page .error-text {
  color: #fda4af;
}

[data-theme="dark"] main.database-page .switch-ui {
  background: rgba(71, 85, 105, 0.86);
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] main.database-page .switch-ui::before {
  background: #e2e8f0;
  box-shadow: 0 2px 8px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] main.database-page .switch-field input[type="checkbox"]:checked + .switch-ui {
  background: #3b82f6;
}

[data-theme="dark"] main.database-page .backup-list {
  border-color: rgba(148, 163, 184, 0.3);
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.database-page .driver-chip {
  color: #bfdbfe;
  background: rgba(59, 130, 246, 0.2);
  border-color: rgba(96, 165, 250, 0.34);
}

[data-theme="dark"] main.database-page .security-note {
  color: #fcd34d;
}

[data-theme="dark"] main.database-page .backup-table th,
[data-theme="dark"] main.database-page .backup-table td {
  border-bottom-color: rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] main.database-page .backup-table th {
  color: #94a3b8;
}

[data-theme="dark"] main.database-page .backup-table td {
  color: #e2e8f0;
}

[data-theme="dark"] main.database-page .backup-table tbody tr:hover td {
  background: rgba(37, 99, 235, 0.18);
}

[data-theme="dark"] main.database-page .table-wrap::-webkit-scrollbar {
  height: 12px;
  width: 12px;
}

[data-theme="dark"] main.database-page .table-wrap::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.database-page .table-wrap::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, 0.85);
  border-radius: 999px;
  border: 2px solid rgba(15, 23, 42, 0.92);
}

[data-theme="dark"] main.database-page .table-wrap {
  scrollbar-color: rgba(100, 116, 139, 0.85) rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.election-page .election-hero-card {
  border-color: rgba(96, 165, 250, 0.32);
  background: linear-gradient(
    135deg,
    rgba(30, 41, 59, 0.96) 0%,
    rgba(15, 23, 42, 0.94) 52%,
    rgba(15, 23, 42, 0.9) 100%
  );
  box-shadow: 0 14px 30px rgba(2, 6, 23, 0.56);
}

[data-theme="dark"] main.election-page .election-hero-card h1 {
  color: #f8fafc;
}

[data-theme="dark"] main.election-page .election-hero-card .subtitle {
  color: #cbd5e1;
}

[data-theme="dark"] main.election-page .status-chip.is-active {
  background: rgba(59, 130, 246, 0.24);
  color: #bfdbfe;
  border-color: rgba(96, 165, 250, 0.44);
}

[data-theme="dark"] main.election-page .status-chip.is-inactive {
  background: rgba(244, 63, 94, 0.2);
  color: #fda4af;
  border-color: rgba(248, 113, 113, 0.42);
}

[data-theme="dark"] main.election-page .status-chip.is-mode {
  background: rgba(14, 165, 233, 0.2);
  color: #bae6fd;
  border-color: rgba(56, 189, 248, 0.4);
}

[data-theme="dark"] main.election-page .election-card {
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.96), rgba(15, 23, 42, 0.92)),
    radial-gradient(300px 140px at 92% -12%, rgba(37, 99, 235, 0.16), transparent 72%);
  border-color: rgba(96, 165, 250, 0.26);
  box-shadow: 0 20px 40px rgba(2, 6, 23, 0.52);
}

[data-theme="dark"] main.election-page .election-card:hover {
  border-color: rgba(96, 165, 250, 0.38);
  box-shadow: 0 24px 44px rgba(2, 6, 23, 0.58);
}

[data-theme="dark"] main.election-page .section-head p,
[data-theme="dark"] main.election-page .mode-help,
[data-theme="dark"] main.election-page .candidate-body p {
  color: #cbd5e1;
}

[data-theme="dark"] main.election-page .mode-row label,
[data-theme="dark"] main.election-page .candidate-form label {
  color: #e2e8f0;
}

[data-theme="dark"] main.election-page .table-wrap,
[data-theme="dark"] main.election-page .result-table-wrap {
  border-color: rgba(148, 163, 184, 0.3);
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.election-page .mode-select,
[data-theme="dark"] main.election-page .mode-input,
[data-theme="dark"] main.election-page .cell-input,
[data-theme="dark"] main.election-page .vote-link-card input[type="text"],
[data-theme="dark"] main.election-page .candidate-form input[type="text"],
[data-theme="dark"] main.election-page .candidate-form input[type="file"],
[data-theme="dark"] main.election-page .candidate-form select {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.34);
}

[data-theme="dark"] main.election-page .mode-select:focus-visible,
[data-theme="dark"] main.election-page .mode-input:focus-visible,
[data-theme="dark"] main.election-page .cell-input:focus-visible,
[data-theme="dark"] main.election-page .vote-link-card input[type="text"]:focus-visible,
[data-theme="dark"] main.election-page .candidate-form input[type="text"]:focus-visible,
[data-theme="dark"] main.election-page .candidate-form input[type="file"]:focus-visible,
[data-theme="dark"] main.election-page .candidate-form select:focus-visible {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
}

[data-theme="dark"] main.election-page .eligible-table,
[data-theme="dark"] main.election-page .result-table {
  background: rgba(15, 23, 42, 0.92);
}

[data-theme="dark"] main.election-page .eligible-table thead th,
[data-theme="dark"] main.election-page .result-table thead th {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.95));
  color: #cbd5e1;
}

[data-theme="dark"] main.election-page .eligible-table td,
[data-theme="dark"] main.election-page .result-table td {
  border-top-color: rgba(148, 163, 184, 0.2);
  color: #e2e8f0;
}

[data-theme="dark"] main.election-page .eligible-table tbody tr:hover td,
[data-theme="dark"] main.election-page .result-table tbody tr:hover td {
  background: rgba(37, 99, 235, 0.18);
}

[data-theme="dark"] main.election-page .empty-state {
  border-color: rgba(148, 163, 184, 0.34);
  background: rgba(15, 23, 42, 0.84);
  color: #cbd5e1;
}

[data-theme="dark"] main.election-page .candidate-card {
  border-color: rgba(148, 163, 184, 0.26);
  background: rgba(15, 23, 42, 0.92);
}

[data-theme="dark"] main.election-page .candidate-photo.placeholder {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.95), rgba(15, 23, 42, 0.92));
  color: #94a3b8;
}

[data-theme="dark"] main.election-page .candidate-body h3,
[data-theme="dark"] main.election-page .voted-cell {
  color: #f8fafc;
}

[data-theme="dark"] main.election-page .candidate-body p.votes,
[data-theme="dark"] main.election-page .election-result-status {
  color: #93c5fd;
}

[data-theme="dark"] main.election-page .danger-zone {
  border-color: rgba(248, 113, 113, 0.36);
  background: linear-gradient(145deg, rgba(127, 29, 29, 0.24), rgba(15, 23, 42, 0.94));
}

[data-theme="dark"] main.election-page .danger-zone h2 {
  color: #fda4af;
}

[data-theme="dark"] main.election-page .danger-zone p {
  color: #fecaca;
}

[data-theme="dark"] main.election-page .result-badge {
  color: #bfdbfe;
  background: rgba(59, 130, 246, 0.2);
  border-color: rgba(96, 165, 250, 0.36);
}

[data-theme="dark"] main.election-page .result-badge.winner {
  color: #fcd34d;
  border-color: rgba(245, 158, 11, 0.42);
  background: rgba(120, 53, 15, 0.32);
}

[data-theme="dark"] body:not(.election-print-mode) main.election-page .election-result-card {
  border-color: rgba(96, 165, 250, 0.32);
  background:
    linear-gradient(180deg, rgba(11, 18, 32, 0.97), rgba(15, 23, 42, 0.94)),
    radial-gradient(420px 180px at 95% -10%, rgba(37, 99, 235, 0.18), transparent 72%);
  box-shadow:
    0 34px 72px rgba(2, 6, 23, 0.72),
    0 10px 24px rgba(37, 99, 235, 0.14),
    inset 0 1px 0 rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] body:not(.election-print-mode) main.election-page .election-result-head {
  border-bottom: 1px solid rgba(148, 163, 184, 0.24);
  padding-bottom: 0.7rem;
}

[data-theme="dark"] body:not(.election-print-mode) main.election-page .election-result-actions {
  border-top: 1px solid rgba(148, 163, 184, 0.22);
  padding-top: 0.75rem;
}

[data-theme="dark"] body:not(.election-print-mode) main.election-page .election-result-close {
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(148, 163, 184, 0.34);
  color: #e2e8f0;
}

[data-theme="dark"] body:not(.election-print-mode) main.election-page .election-result-close:hover {
  background: rgba(30, 64, 175, 0.24);
  border-color: rgba(96, 165, 250, 0.42);
  color: #bfdbfe;
}

[data-theme="dark"] main.election-page .kpi-card span {
  color: #94a3b8;
}

[data-theme="dark"] main.election-page .kpi-card strong,
[data-theme="dark"] main.election-page .election-result-head h2 {
  color: #f8fafc;
}

[data-theme="dark"] main.election-page .election-result-head p {
  color: #cbd5e1;
}

[data-theme="dark"] main.election-page .current-photo-wrap {
  color: #cbd5e1;
}

[data-theme="dark"] main.election-page .current-photo {
  border-color: rgba(148, 163, 184, 0.34);
}

[data-theme="dark"] main.election-page .table-wrap::-webkit-scrollbar,
[data-theme="dark"] main.election-page .result-table-wrap::-webkit-scrollbar {
  height: 12px;
  width: 12px;
}

[data-theme="dark"] main.election-page .table-wrap::-webkit-scrollbar-track,
[data-theme="dark"] main.election-page .result-table-wrap::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] main.election-page .table-wrap::-webkit-scrollbar-thumb,
[data-theme="dark"] main.election-page .result-table-wrap::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, 0.85);
  border-radius: 999px;
  border: 2px solid rgba(15, 23, 42, 0.92);
}

[data-theme="dark"] main.election-page .table-wrap,
[data-theme="dark"] main.election-page .result-table-wrap {
  scrollbar-color: rgba(100, 116, 139, 0.85) rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] .election-page,
[data-theme="dark"] .election-form-page {
  --election-bg: #020617;
  --election-text: #e2e8f0;
  --election-muted: #94a3b8;
  --election-border: rgba(148, 163, 184, 0.28);
}

[data-theme="dark"] .election-card,
[data-theme="dark"] .vote-link-card,
[data-theme="dark"] .result-table-wrap,
[data-theme="dark"] .kpi-card {
  background: rgba(15, 23, 42, 0.92);
  border-color: rgba(148, 163, 184, 0.28);
}

[data-theme="dark"] .eligible-table th,
[data-theme="dark"] .result-table th {
  background: rgba(30, 41, 59, 0.9);
}

[data-theme="dark"] .eligible-table td,
[data-theme="dark"] .result-table td {
  background: rgba(15, 23, 42, 0.9);
}

[data-theme="dark"] .vote-page {
  --vote-bg: #020617;
  --vote-border: rgba(148, 163, 184, 0.28);
  --vote-text: #e2e8f0;
  --vote-muted: #94a3b8;
}

[data-theme="dark"] .vote-card,
[data-theme="dark"] .candidate-option,
[data-theme="dark"] .vote-limit-info {
  background: rgba(15, 23, 42, 0.92);
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .candidate-option.is-selected,
[data-theme="dark"] .candidate-option:has(.candidate-checkbox:checked) {
  background: linear-gradient(180deg, rgba(30, 64, 175, 0.24) 0%, rgba(15, 23, 42, 0.95) 100%);
}

/* Use longhand `background-color:` (NOT the `background:` shorthand) so
   any element that ALSO has a `background-image` declared elsewhere
   (like the chevron on `.auth-input-wrap select`, which is declared
   in `[data-theme="dark"] .auth-input-wrap select` at higher
   specificity (1,1,1)) keeps that image correctly sized and not
   tiled. With the `background:` shorthand, this rule was implicitly
   resetting `background-image: none` AND `background-size: auto` AND
   `background-repeat: repeat` for global input/select/textarea.
   At specificity (1,0,1) (`select` alone), this rule's shorthand
   reset was overriding light's `background-size: 14px` (0,1,1)
   AND any cascading size/repeat from the more-specific chevron
   rules (which typically set only the image, leaving size/repeat
   to cascade).

   Visible symptom: chevron tiled across the entire select instead
   of appearing as one icon.

   FIX 3 of 3 in the chevron-tiling-cascade patch. See FIX 1 and
   FIX 2 (above) for the other two leak points. The top-of-file
   WARNING in this file documents the discipline that keeps this
   cascade honest going forward.

   Note for future maintainers: every OTHER page's <select> that
   carries a `background-image` (chevron or graphic) is also touched
   by this rule. Most custom-chevron rules already win the cascade
   for `background-image` and `background-repeat` at higher
   specificity, so their chevrons remain visible as icons – but
   their `background-size` now resolves via whichever rule
   next-strict sets it. If any other page renders a tiled or
   oversized chevron after this patch, that page's rule likely
   needs an explicit `background-size: 14px` (or whatever the
   design intent is). When auditing, verify each rule actually
   targets a real <select> in the matching *.php file – styled
   <div>/<button> widgets (custom dropdowns/ pickers) are not
   selects and short-circuit the audit. */
[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]),
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background-color: #0f172a;
  color: var(--ink);
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: #64748b;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
}

/* Dark-theme styling for the option-list popup on `.auth-form select`
   elements — e.g. register.php's `#academic_grade` and `#academic_field`,
   and any future auth-page select.

   Without these rules, the <option> text inherits `color: #f1f5f9`
   from `[data-theme="dark"] .auth-input-wrap select` while the OS-
   default popup background stays white, yielding the white-on-white
   unreadable dropdown that the user originally reported.

   We use the `background-color:` longhand (NOT the `background:`
   shorthand) per the top-of-file WARNING discipline, so any future
   `background-image` declared on an option/optgroup would still cascade
   through unchanged. Pattern mirrors `.candidate-add-field select option`
   and `.support-form-select option` elsewhere in this file. The
   `:checked` variant gives a blue tint to the currently-selected option
   so the active value is visible at a glance when the popup opens. */
[data-theme="dark"] .auth-form select option,
[data-theme="dark"] .auth-form select optgroup {
  background-color: #0b1220;
  color: #e2e8f0;
}

[data-theme="dark"] .auth-form select option:checked {
  background-color: #1d4ed8;
  color: #f8fafc;
}

[data-theme="dark"] .empty-state,
[data-theme="dark"] .empty-cell {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .btn-secondary,
[data-theme="dark"] .btn-ghost,
[data-theme="dark"] .ghost {
  background: rgba(15, 23, 42, 0.82);
  color: #cbd5e1;
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .btn-secondary:hover,
[data-theme="dark"] .btn-ghost:hover,
[data-theme="dark"] .ghost:hover {
  background: rgba(30, 41, 59, 0.94);
  border-color: rgba(96, 165, 250, 0.5);
}

[data-theme="dark"] .vote-lable-page{
  color: white;
}




[data-theme="dark"] .support-hero {
  background: linear-gradient(135deg, rgba(30, 64, 175, 0.12) 0%, rgba(51, 65, 85, 0.08) 100%);
  border-color: rgba(96, 165, 250, 0.2);
}

[data-theme="dark"] .support-title {
  color: #f8fafc;
}

[data-theme="dark"] .support-subtitle {
  color: #94a3b8;
}


[data-theme="dark"] .support-search-box {
  background: rgba(15, 23, 42, 0.8);
  border-color: rgba(148, 163, 184, 0.28);
}

[data-theme="dark"] .support-search-box:focus-within {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.18);
}

[data-theme="dark"] .support-search-box svg {
  color: #94a3b8;
}

[data-theme="dark"] .support-search-input {
  color: #e2e8f0;
}

[data-theme="dark"] .support-search-input::placeholder {
  color: #64748b;
}

[data-theme="dark"] .support-search-clear {
  background: rgba(100, 116, 139, 0.3);
  color: #94a3b8;
}

[data-theme="dark"] .support-search-clear:hover {
  background: rgba(248, 113, 113, 0.2);
  color: #fda4af;
}


[data-theme="dark"] .support-empty-state {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .support-empty-icon-wrapper {
  background: rgba(96, 165, 250, 0.1);
  color: #94a3b8;
}

[data-theme="dark"] .support-empty-state h3 {
  color: #f8fafc;
}

[data-theme="dark"] .support-empty-state p {
  color: #94a3b8;
}


[data-theme="dark"] .support-results-info {
  color: #94a3b8;
}


[data-theme="dark"] .support-ticket-card {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .support-ticket-card-link:hover .support-ticket-card {
  border-color: rgba(96, 165, 250, 0.35);
  box-shadow: 0 4px 16px rgba(96, 165, 250, 0.1);
}

[data-theme="dark"] .support-ticket-subject {
  color: #f8fafc;
}

[data-theme="dark"] .support-meta-item {
  color: #94a3b8;
}


[data-theme="dark"] .support-status-pending {
  background: rgba(245, 158, 11, 0.2);
  color: #fcd34d;
}

[data-theme="dark"] .support-status-in-progress {
  background: rgba(59, 130, 246, 0.2);
  color: #93c5fd;
}

[data-theme="dark"] .support-status-answered {
  background: rgba(16, 185, 129, 0.2);
  color: #6ee7b7;
}

[data-theme="dark"] .support-status-closed {
  background: rgba(100, 116, 139, 0.2);
  color: #94a3b8;
}

[data-theme="dark"] .support-priority-low {
  background: rgba(16, 185, 129, 0.2);
  color: #6ee7b7;
}

[data-theme="dark"] .support-priority-medium {
  background: rgba(245, 158, 11, 0.2);
  color: #fcd34d;
}

[data-theme="dark"] .support-priority-high {
  background: rgba(248, 113, 113, 0.2);
  color: #fca5a5;
}

[data-theme="dark"] .support-priority-urgent {
  background: rgba(248, 113, 113, 0.25);
  color: #fca5a5;
}


[data-theme="dark"] .modal-overlay {
  background: rgba(2, 6, 23, 0.7);
}

[data-theme="dark"] .modal-content {
  background: rgba(15, 23, 42, 0.96);
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 24px 60px rgba(2, 6, 23, 0.6);
}

[data-theme="dark"] .modal-header {
  border-bottom-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .modal-title-row h2 {
  color: #f8fafc;
}

[data-theme="dark"] .modal-close-btn {
  background: rgba(100, 116, 139, 0.3);
  color: #94a3b8;
}

[data-theme="dark"] .modal-close-btn:hover {
  background: rgba(248, 113, 113, 0.2);
  color: #fda4af;
}


[data-theme="dark"] .support-form-label {
  color: #e2e8f0;
}

[data-theme="dark"] .support-form-input,
[data-theme="dark"] .support-form-textarea,
[data-theme="dark"] .support-form-select {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .support-form-input::placeholder,
[data-theme="dark"] .support-form-textarea::placeholder {
  color: #64748b;
}

[data-theme="dark"] .support-form-input:focus,
[data-theme="dark"] .support-form-textarea:focus,
[data-theme="dark"] .support-form-select:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.18);
}

[data-theme="dark"] .support-form-select {
  
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 1rem center;
}

[data-theme="dark"] .support-form-select option,
[data-theme="dark"] .support-form-select optgroup {
  background-color: #0b1220;
  color: #e2e8f0;
}

[data-theme="dark"] .support-form-select option:checked {
  background-color: #1d4ed8;
  color: #f8fafc;
}

[data-theme="dark"] .support-form-actions {
  border-top-color: rgba(148, 163, 184, 0.24);
}


[data-theme="dark"] .stat-card {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .stat-card::before {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.06) 0%, transparent 100%);
}

[data-theme="dark"] .stat-card:hover {
  border-color: rgba(96, 165, 250, 0.35);
  box-shadow: 0 4px 12px rgba(96, 165, 250, 0.08);
}

[data-theme="dark"] .stat-card.stat-active {
  border-color: #60a5fa;
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.1) 0%, rgba(59, 130, 246, 0.06) 100%);
  box-shadow: 0 4px 16px rgba(96, 165, 250, 0.15);
}

[data-theme="dark"] .stat-number {
  color: #f8fafc;
}

[data-theme="dark"] .stat-label {
  color: #94a3b8;
}


[data-theme="dark"] .stat-icon-all {
  background: rgba(124, 58, 237, 0.18);
  color: #a78bfa;
}

[data-theme="dark"] .stat-icon-pending {
  background: rgba(245, 158, 11, 0.18);
  color: #fbbf24;
}

[data-theme="dark"] .stat-icon-progress {
  background: rgba(59, 130, 246, 0.18);
  color: #60a5fa;
}

[data-theme="dark"] .stat-icon-answered {
  background: rgba(16, 185, 129, 0.18);
  color: #34d399;
}

[data-theme="dark"] .stat-icon-closed {
  background: rgba(107, 114, 128, 0.18);
  color: #9ca3af;
}


[data-theme="dark"] .stat-pending.stat-active .stat-icon-wrap {
  background: rgba(245, 158, 11, 0.25);
}

[data-theme="dark"] .stat-in-progress.stat-active .stat-icon-wrap {
  background: rgba(59, 130, 246, 0.25);
}

[data-theme="dark"] .stat-answered.stat-active .stat-icon-wrap {
  background: rgba(16, 185, 129, 0.25);
}

[data-theme="dark"] .stat-closed.stat-active .stat-icon-wrap {
  background: rgba(107, 114, 128, 0.25);
}

[data-theme="dark"] .stat-pending.stat-active { border-color: #fcd34d; background: rgba(245, 158, 11, 0.1); }
[data-theme="dark"] .stat-in-progress.stat-active { border-color: #60a5fa; background: rgba(59, 130, 246, 0.1); }
[data-theme="dark"] .stat-answered.stat-active { border-color: #34d399; background: rgba(16, 185, 129, 0.1); }
[data-theme="dark"] .stat-closed.stat-active { border-color: #94a3b8; background: rgba(100, 116, 139, 0.1); }


[data-theme="dark"] .admin-dept-chip {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.28);
  color: #94a3b8;
}

[data-theme="dark"] .admin-dept-chip:hover {
  border-color: rgba(96, 165, 250, 0.4);
  color: #93c5fd;
}

[data-theme="dark"] .admin-dept-chip.active {
  background: #3b82f6;
  border-color: #3b82f6;
  color: #fff;
}


[data-theme="dark"] .support-bulk-bar {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.08) 0%, rgba(59, 130, 246, 0.04) 100%);
  border-color: rgba(96, 165, 250, 0.25);
}

[data-theme="dark"] .support-bulk-info {
  color: #93c5fd;
}


[data-theme="dark"] .support-results-bar {
  border-bottom-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .support-results-count {
  color: #94a3b8;
}

[data-theme="dark"] .support-select-all-label {
  color: #94a3b8;
}


[data-theme="dark"] .admin-support-ticket {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .admin-support-ticket:hover {
  border-color: rgba(96, 165, 250, 0.3);
  box-shadow: 0 2px 8px rgba(96, 165, 250, 0.06);
}

[data-theme="dark"] .admin-ticket-subject {
  color: #f8fafc;
}

[data-theme="dark"] .admin-ticket-subject:hover {
  color: #93c5fd;
}

[data-theme="dark"] .admin-ticket-meta .meta-item {
  color: #94a3b8;
}

[data-theme="dark"] .admin-ticket-meta .meta-ticket-num a {
  color: #93c5fd;
}


[data-theme="dark"] .support-menu-trigger {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.28);
  color: #94a3b8;
}

[data-theme="dark"] .support-menu-trigger:hover {
  border-color: rgba(96, 165, 250, 0.4);
  color: #93c5fd;
  background: rgba(96, 165, 250, 0.08);
}

[data-theme="dark"] .support-dropdown-menu {
  background: rgba(15, 23, 42, 0.96);
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 12px 32px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .support-dropdown-section-label {
  color: #64748b;
}

[data-theme="dark"] .support-dropdown-select {
  background: rgba(15, 23, 42, 0.9);
  border-color: rgba(148, 163, 184, 0.3);
  color: #e2e8f0;
}

[data-theme="dark"] .support-dropdown-select:focus {
  border-color: #60a5fa;
}

[data-theme="dark"] .support-dropdown-divider {
  background: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .support-dropdown-action {
  color: #e2e8f0;
}

[data-theme="dark"] .support-dropdown-action:hover {
  background: rgba(96, 165, 250, 0.12);
  color: #93c5fd;
}

[data-theme="dark"] .support-dropdown-danger {
  color: #fda4af;
}

[data-theme="dark"] .support-dropdown-danger:hover {
  background: rgba(248, 113, 113, 0.12);
  color: #fda4af;
}


[data-theme="dark"] .support-conversation {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .support-conversation-header {
  background: linear-gradient(180deg, rgba(96, 165, 250, 0.06) 0%, transparent 100%);
  border-bottom-color: rgba(148, 163, 184, 0.24);
  color: #f8fafc;
}

[data-theme="dark"] .support-message-count {
  background: rgba(100, 116, 139, 0.3);
  color: #94a3b8;
}

[data-theme="dark"] .support-msg-admin .support-msg-text {
  background: rgba(16, 185, 129, 0.12);
  border-color: rgba(16, 185, 129, 0.25);
  color: #e2e8f0;
}

[data-theme="dark"] .support-msg-user .support-msg-text {
  background: rgba(100, 116, 139, 0.12);
  border-color: rgba(100, 116, 139, 0.2);
  color: #e2e8f0;
}

[data-theme="dark"] .support-msg-internal .support-msg-text {
  background: rgba(245, 158, 11, 0.1);
  border-color: rgba(245, 158, 11, 0.3);
}

[data-theme="dark"] .support-msg-internal-badge {
  background: rgba(245, 158, 11, 0.2);
  color: #fcd34d;
}


[data-theme="dark"] .support-reply-box {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .support-reply-box:focus-within {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.18);
}

[data-theme="dark"] .support-reply-header {
  background: linear-gradient(180deg, rgba(96, 165, 250, 0.06) 0%, transparent 100%);
  border-bottom-color: rgba(148, 163, 184, 0.24);
  color: #f8fafc;
}

[data-theme="dark"] .support-reply-input {
  background: rgba(15, 23, 42, 0.9);
  border-color: rgba(148, 163, 184, 0.3);
  color: #e2e8f0;
}

[data-theme="dark"] .support-reply-input::placeholder {
  color: #64748b;
}

[data-theme="dark"] .support-reply-input:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.18);
}


[data-theme="dark"] .support-sidebar-card {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .support-sidebar-card:hover {
  border-color: rgba(96, 165, 250, 0.3);
  box-shadow: 0 4px 12px rgba(96, 165, 250, 0.08);
}

[data-theme="dark"] .support-sidebar-title {
  border-bottom-color: rgba(148, 163, 184, 0.24);
  background: linear-gradient(180deg, rgba(96, 165, 250, 0.06) 0%, transparent 100%);
  color: #f8fafc;
}

[data-theme="dark"] .support-sidebar-label {
  color: #94a3b8;
}

[data-theme="dark"] .support-sidebar-value {
  color: #e2e8f0;
}


[data-theme="dark"] .support-detail-header-card {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.08) 0%, rgba(59, 130, 246, 0.04) 100%);
  border-color: rgba(96, 165, 250, 0.2);
}

[data-theme="dark"] .support-detail-subject {
  color: #f8fafc;
}


[data-theme="dark"] .support-internal-note-box {
  border-color: rgba(245, 158, 11, 0.3);
}

[data-theme="dark"] .support-internal-textarea {
  background: rgba(245, 158, 11, 0.06) !important;
  border-color: rgba(245, 158, 11, 0.3) !important;
}

[data-theme="dark"] .support-internal-textarea:focus {
  border-color: #f59e0b !important;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.15) !important;
}


[data-theme="dark"] .support-closed-notice {
  background: rgba(100, 116, 139, 0.1);
  border-color: rgba(100, 116, 139, 0.25);
  color: #94a3b8;
}


[data-theme="dark"] .support-rating-box {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .support-rating-label {
  color: #f8fafc;
}

[data-theme="dark"] .support-star-btn {
  color: #475569;
}

[data-theme="dark"] .support-rating-value {
  color: #f8fafc;
}

[data-theme="dark"] .support-rating-feedback {
  color: #94a3b8;
}


[data-theme="dark"] .support-alert-success {
  background: rgba(16, 185, 129, 0.12);
  border-color: rgba(16, 185, 129, 0.3);
  color: #6ee7b7;
}

[data-theme="dark"] .support-alert-error {
  background: rgba(248, 113, 113, 0.12);
  border-color: rgba(248, 113, 113, 0.3);
  color: #fda4af;
}


[data-theme="dark"] .support-toast {
  background: rgba(15, 23, 42, 0.96);
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 18px 40px rgba(2, 6, 23, 0.6);
}

[data-theme="dark"] .support-toast-success {
  background: linear-gradient(180deg, rgba(16, 185, 129, 0.18), rgba(16, 185, 129, 0.1));
  border-color: rgba(16, 185, 129, 0.3);
  color: #6ee7b7;
}

[data-theme="dark"] .support-toast-error {
  background: linear-gradient(180deg, rgba(248, 113, 113, 0.18), rgba(248, 113, 113, 0.1));
  border-color: rgba(248, 113, 113, 0.3);
  color: #fda4af;
}


[data-theme="dark"] .support-attachment-item {
  background: rgba(96, 165, 250, 0.06);
  border-color: rgba(96, 165, 250, 0.15);
  color: #e2e8f0;
}

[data-theme="dark"] .support-attachment-item:hover {
  background: rgba(96, 165, 250, 0.12);
  border-color: #60a5fa;
}

[data-theme="dark"] .att-size {
  color: #94a3b8;
}


[data-theme="dark"] .support-file-upload {
  border-color: rgba(96, 165, 250, 0.3);
  background: rgba(96, 165, 250, 0.04);
  color: #94a3b8;
}

[data-theme="dark"] .support-file-upload:hover {
  border-color: #60a5fa;
  background: rgba(96, 165, 250, 0.1);
}

[data-theme="dark"] .support-file-item {
  background: rgba(96, 165, 250, 0.1);
  border-color: rgba(96, 165, 250, 0.25);
  color: #e2e8f0;
}

[data-theme="dark"] .support-file-item:hover {
  background: rgba(96, 165, 250, 0.18);
  border-color: rgba(96, 165, 250, 0.4);
}

[data-theme="dark"] .support-file-item svg {
  color: #93c5fd;
}



[data-theme="dark"] .library-page-hero {
  background: linear-gradient(135deg, rgba(30, 58, 138, 0.5) 0%, rgba(37, 99, 235, 0.3) 60%, rgba(59, 130, 246, 0.2) 100%);
  box-shadow: 0 10px 30px rgba(2, 6, 23, 0.4);
}

[data-theme="dark"] .library-search,
[data-theme="dark"] .library-filter-select {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .library-search:focus,
[data-theme="dark"] .library-filter-select:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
}

[data-theme="dark"] .library-cat-chip {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.28);
  color: #94a3b8;
}

[data-theme="dark"] .library-cat-chip:hover {
  background: rgba(96, 165, 250, 0.12);
  border-color: rgba(96, 165, 250, 0.4);
  color: #93c5fd;
}

[data-theme="dark"] .library-cat-chip.is-active {
  background: #3b82f6;
  border-color: #3b82f6;
  color: #fff;
}

[data-theme="dark"] .library-book-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.84));
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .library-book-card:hover {
  box-shadow: 0 14px 32px rgba(2, 6, 23, 0.58);
  border-color: rgba(96, 165, 250, 0.35);
}

[data-theme="dark"] .library-book-cover {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] .library-book-cover-placeholder {
  background: linear-gradient(135deg, rgba(30, 58, 138, 0.6), rgba(37, 99, 235, 0.4));
}

[data-theme="dark"] .library-book-title {
  color: #f8fafc;
}

[data-theme="dark"] .library-book-author {
  color: #94a3b8;
}

[data-theme="dark"] .library-book-meta {
  border-top-color: rgba(148, 163, 184, 0.15);
  color: #94a3b8;
}

[data-theme="dark"] .library-book-availability.available {
  background: rgba(52, 211, 153, 0.15);
  color: #6ee7b7;
}

[data-theme="dark"] .library-book-availability.unavailable {
  background: rgba(251, 113, 133, 0.15);
  color: #fda4af;
}










[data-theme="dark"] .library-star-btn {
  color: rgba(251, 191, 36, 0.22);
}
[data-theme="dark"] .library-star-btn:hover,
[data-theme="dark"] .library-star-btn.is-preview {
  color: #fcd34d;
  background: rgba(245, 158, 11, 0.12);
}

[data-theme="dark"] .library-star-btn.is-filled {
  color: #fbbf24;
}

[data-theme="dark"] .library-star-value {
  color: #f8fafc;
}

[data-theme="dark"] .library-star-count {
  color: #94a3b8;
}

[data-theme="dark"] .library-comments-section,
[data-theme="dark"] .library-borrow-card,
[data-theme="dark"] .library-manage-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.84));
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 14px 30px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .library-comments-title,
[data-theme="dark"] .library-borrow-title,
[data-theme="dark"] .library-manage-head h2 {
  color: #f8fafc;
}

[data-theme="dark"] .library-comment-textarea {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .library-comment-textarea:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
}

[data-theme="dark"] .library-comment-item {
  background: rgba(15, 23, 42, 0.6);
  border-color: rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] .library-comment-avatar {
  border-color: rgba(96, 165, 250, 0.3);
}

[data-theme="dark"] .library-comment-name {
  color: #f8fafc;
}

[data-theme="dark"] .library-comment-date {
  color: #64748b;
}

[data-theme="dark"] .library-comment-text {
  color: #cbd5e1;
}

[data-theme="dark"] .library-comment-delete-btn {
  color: #64748b;
}

[data-theme="dark"] .library-comment-delete-btn:hover {
  color: #fb7185;
  background: rgba(244, 63, 94, 0.12);
}

[data-theme="dark"] .library-borrow-table-wrap,
[data-theme="dark"] .library-table-wrap {
  border-color: rgba(148, 163, 184, 0.24);
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] .library-borrow-table th,
[data-theme="dark"] .library-table th {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.95));
  color: #cbd5e1;
  border-bottom-color: rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] .library-borrow-table td,
[data-theme="dark"] .library-table td {
  color: #e2e8f0;
  border-bottom-color: rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] .library-borrow-table tbody tr:hover td,
[data-theme="dark"] .library-table tbody tr:hover td {
  background: rgba(37, 99, 235, 0.15);
}

[data-theme="dark"] .borrow-status-badge.borrowed {
  background: rgba(96, 165, 250, 0.18);
  color: #93c5fd;
}

[data-theme="dark"] .borrow-status-badge.returned {
  background: rgba(52, 211, 153, 0.18);
  color: #6ee7b7;
}

[data-theme="dark"] .borrow-status-badge.overdue {
  background: rgba(251, 113, 133, 0.18);
  color: #fda4af;
}

[data-theme="dark"] .library-form-field label {
  color: #e2e8f0;
}

[data-theme="dark"] .library-form-field input,
[data-theme="dark"] .library-form-field select,
[data-theme="dark"] .library-form-field textarea {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .library-form-field input:focus,
[data-theme="dark"] .library-form-field select:focus,
[data-theme="dark"] .library-form-field textarea:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
}

[data-theme="dark"] .library-modal-backdrop {
  background: rgba(2, 6, 23, 0.74);
}

[data-theme="dark"] .library-modal-card {
  background: rgba(15, 23, 42, 0.96);
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 30px 60px rgba(2, 6, 23, 0.6);
}

[data-theme="dark"] .library-modal-head {
  border-bottom-color: rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] .library-modal-head h3 {
  color: #f8fafc;
}

[data-theme="dark"] .library-modal-close {
  background: rgba(51, 65, 85, 0.8);
  border-color: rgba(148, 163, 184, 0.3);
  color: #94a3b8;
}

[data-theme="dark"] .library-modal-close:hover {
  background: rgba(244, 63, 94, 0.15);
  border-color: rgba(244, 63, 94, 0.4);
  color: #fda4af;
}

[data-theme="dark"] .library-modal-foot {
  border-top-color: rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] .library-empty {
  border-color: rgba(148, 163, 184, 0.2);
  background: rgba(15, 23, 42, 0.6);
  color: #94a3b8;
}

[data-theme="dark"] .library-empty h3 {
  color: #f8fafc;
}

[data-theme="dark"] .library-fav-btn {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.28);
  color: #64748b;
}

[data-theme="dark"] .library-fav-btn:hover {
  border-color: rgba(251, 113, 133, 0.4);
  color: #fda4af;
  background: rgba(244, 63, 94, 0.08);
}

[data-theme="dark"] .library-fav-btn.is-favorited {
  color: #fb7185;
  background: rgba(244, 63, 94, 0.1);
  border-color: rgba(244, 63, 94, 0.3);
}

[data-theme="dark"] .library-flash.success {
  background: rgba(6, 95, 70, 0.22);
  color: #bbf7d0;
  border-color: rgba(16, 185, 129, 0.34);
}

[data-theme="dark"] .library-flash.error {
  background: rgba(153, 27, 27, 0.22);
  color: #fecaca;
  border-color: rgba(248, 113, 113, 0.34);
}

[data-theme="dark"] .library-detail-back {
  border-color: rgba(96, 165, 250, 0.3);
  background: rgba(30, 64, 175, 0.15);
  color: #93c5fd;
}

[data-theme="dark"] .library-detail-back:hover {
  background: rgba(30, 64, 175, 0.25);
  box-shadow: 0 4px 12px rgba(96, 165, 250, 0.15);
}

[data-theme="dark"] .library-manage-card::before {
  background: linear-gradient(90deg, #60a5fa, #3b82f6, #60a5fa);
}

[data-theme="dark"] .library-manage-head {
  border-bottom-color: rgba(148, 163, 184, 0.15);
}

[data-theme="dark"] .library-manage-head p {
  color: #94a3b8;
}




[data-theme="dark"] .library-manage-hero {
  background: linear-gradient(135deg, rgba(30, 58, 138, 0.6) 0%, rgba(30, 64, 175, 0.4) 40%, rgba(59, 130, 246, 0.25) 100%);
  box-shadow: 0 10px 30px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .library-hero-back {
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.8);
}

[data-theme="dark"] .library-hero-back:hover {
  background: rgba(255, 255, 255, 0.18);
}

[data-theme="dark"] .library-manage-stat {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
}


[data-theme="dark"] .library-admin-tabs {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.24);
}

[data-theme="dark"] .library-admin-tab {
  color: #94a3b8;
}

[data-theme="dark"] .library-admin-tab:hover {
  background: rgba(96, 165, 250, 0.12);
  color: #93c5fd;
}

[data-theme="dark"] .library-admin-tab.is-active {
  background: #3b82f6;
  color: #fff;
}

[data-theme="dark"] .library-admin-tab-add {
  color: #6ee7b7;
}

[data-theme="dark"] .library-admin-tab-add:hover {
  background: rgba(52, 211, 153, 0.12);
  color: #a7f3d0;
}

[data-theme="dark"] .tab-badge {
  background: rgba(96, 165, 250, 0.2);
  color: #93c5fd;
}

[data-theme="dark"] .library-admin-tab.is-active .tab-badge {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

[data-theme="dark"] .tab-badge-warn {
  background: rgba(245, 158, 11, 0.2);
  color: #fbbf24;
}


[data-theme="dark"] .library-manage-head-text h2 svg {
  color: #60a5fa;
}

[data-theme="dark"] .library-manage-head-text p {
  color: #94a3b8;
}

[data-theme="dark"] .head-count {
  background: rgba(96, 165, 250, 0.2);
  color: #93c5fd;
}


[data-theme="dark"] .library-admin-search-wrap input {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .library-admin-search-wrap input:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
  background: #0b1220;
}

[data-theme="dark"] .library-admin-search-wrap svg {
  color: #64748b;
}


[data-theme="dark"] .library-table th {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.95));
  color: #cbd5e1;
  border-bottom-color: rgba(148, 163, 184, 0.28);
}

[data-theme="dark"] .library-table td {
  border-bottom-color: rgba(148, 163, 184, 0.12);
}

[data-theme="dark"] .library-table tbody tr:hover td {
  background: rgba(37, 99, 235, 0.12);
}

[data-theme="dark"] .library-table tbody tr.is-overdue td {
  background: rgba(244, 63, 94, 0.06);
}

[data-theme="dark"] .library-table tbody tr.is-overdue:hover td {
  background: rgba(244, 63, 94, 0.12);
}

[data-theme="dark"] .library-table-book-link {
  color: #60a5fa;
}

[data-theme="dark"] .library-table-book-link:hover {
  color: #93c5fd;
}

[data-theme="dark"] .library-table-cat-badge {
  background: rgba(96, 165, 250, 0.15);
  color: #93c5fd;
}

[data-theme="dark"] .library-table-cat-name {
  color: #f8fafc;
}

[data-theme="dark"] .library-table-muted {
  color: #64748b;
}

[data-theme="dark"] .library-copies-badge.is-available {
  background: rgba(52, 211, 153, 0.15);
  color: #6ee7b7;
}

[data-theme="dark"] .library-copies-badge.is-empty {
  background: rgba(251, 113, 133, 0.12);
  color: #fda4af;
}

[data-theme="dark"] .library-table-rating {
  color: #fbbf24;
}


[data-theme="dark"] .library-action-btn {
  background: rgba(15, 23, 42, 0.8);
  border-color: rgba(148, 163, 184, 0.2);
  color: #94a3b8;
}

[data-theme="dark"] .library-action-btn:hover {
  background: rgba(30, 41, 59, 0.9);
  box-shadow: 0 2px 8px rgba(2, 6, 23, 0.4);
}

[data-theme="dark"] .library-action-edit:hover {
  color: #60a5fa;
  border-color: rgba(96, 165, 250, 0.3);
}

[data-theme="dark"] .library-action-delete:hover {
  color: #fda4af;
  border-color: rgba(248, 113, 113, 0.3);
  background: rgba(248, 113, 113, 0.1);
}


[data-theme="dark"] .library-btn-primary {
  background: #3b82f6;
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

[data-theme="dark"] .library-btn-primary:hover {
  background: #2563eb;
}

[data-theme="dark"] .library-btn-ghost {
  background: rgba(15, 23, 42, 0.7);
  border-color: rgba(148, 163, 184, 0.3);
  color: #cbd5e1;
}

[data-theme="dark"] .library-btn-ghost:hover {
  background: rgba(96, 165, 250, 0.12);
  border-color: rgba(96, 165, 250, 0.4);
  color: #93c5fd;
}

[data-theme="dark"] .library-btn-success {
  background: rgba(16, 185, 129, 0.15);
  color: #6ee7b7;
  border-color: rgba(16, 185, 129, 0.25);
}

[data-theme="dark"] .library-btn-success:hover {
  background: rgba(16, 185, 129, 0.25);
}


[data-theme="dark"] .library-overdue-badge {
  color: #fda4af;
}


[data-theme="dark"] .library-page-btn {
  background: rgba(30, 41, 59, 0.92);
  border-color: rgba(148, 163, 184, 0.34);
  color: #93c5fd;
}

[data-theme="dark"] .library-page-btn:hover {
  background: rgba(30, 64, 175, 0.24);
  border-color: rgba(96, 165, 250, 0.42);
}

[data-theme="dark"] .library-page-info {
  color: #94a3b8;
}


[data-theme="dark"] .library-form-card::before {
  background: linear-gradient(90deg, #3b82f6, #7c3aed, #3b82f6);
}

[data-theme="dark"] .library-form-field .required {
  color: #fda4af;
}

[data-theme="dark"] .library-form-field label {
  color: #e2e8f0;
}

[data-theme="dark"] .library-form-hint {
  color: #94a3b8;
}


[data-theme="dark"] .library-flash.success {
  background: rgba(16, 185, 129, 0.12);
  border-color: rgba(16, 185, 129, 0.25);
  color: #6ee7b7;
}

[data-theme="dark"] .library-flash.error {
  background: rgba(248, 113, 113, 0.12);
  border-color: rgba(248, 113, 113, 0.25);
  color: #fda4af;
}


[data-theme="dark"] .library-cat-add-fields .library-form-field label {
  color: #e2e8f0;
}


[data-theme="dark"] .library-manage-card {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.92));
  border-color: rgba(148, 163, 184, 0.18);
  box-shadow:
    0 1px 3px rgba(2, 6, 23, 0.2),
    0 8px 24px rgba(2, 6, 23, 0.3),
    0 20px 48px rgba(2, 6, 23, 0.2);
}

[data-theme="dark"] .library-manage-card:hover {
  box-shadow:
    0 1px 3px rgba(2, 6, 23, 0.2),
    0 12px 28px rgba(2, 6, 23, 0.35),
    0 24px 56px rgba(2, 6, 23, 0.25);
  border-color: rgba(148, 163, 184, 0.25);
}

[data-theme="dark"] .library-manage-head {
  border-bottom-color: rgba(148, 163, 184, 0.12);
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.4) 0%, transparent 100%);
}

[data-theme="dark"] .library-manage-head-text h2 {
  color: #f8fafc;
}

[data-theme="dark"] .library-manage-head-text h2 svg {
  color: #60a5fa;
}

[data-theme="dark"] .library-manage-head-text p {
  color: #94a3b8;
}

[data-theme="dark"] .head-count {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.2) 0%, rgba(96, 165, 250, 0.1) 100%);
  color: #93c5fd;
  border-color: rgba(96, 165, 250, 0.15);
}


[data-theme="dark"] .library-form-grid {
  padding: 1.8rem 2rem;
}

[data-theme="dark"] .library-form-field label {
  color: #e2e8f0;
}

[data-theme="dark"] .library-form-field input,
[data-theme="dark"] .library-form-field select,
[data-theme="dark"] .library-form-field textarea {
  background: rgba(11, 18, 32, 0.7);
  border-color: rgba(148, 163, 184, 0.22);
  color: #e2e8f0;
}

[data-theme="dark"] .library-form-field input:hover,
[data-theme="dark"] .library-form-field select:hover,
[data-theme="dark"] .library-form-field textarea:hover {
  border-color: rgba(148, 163, 184, 0.35);
  background: rgba(11, 18, 32, 0.9);
}

[data-theme="dark"] .library-form-field input:focus,
[data-theme="dark"] .library-form-field select:focus,
[data-theme="dark"] .library-form-field textarea:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.18), 0 1px 2px rgba(96, 165, 250, 0.08);
  background: rgba(11, 18, 32, 0.95);
}

[data-theme="dark"] .library-form-field .required {
  color: #fda4af;
}

[data-theme="dark"] .library-form-hint {
  color: #94a3b8;
}

[data-theme="dark"] .library-form-hint::before {
  background: #60a5fa;
}

[data-theme="dark"] .library-form-actions {
  border-top-color: rgba(148, 163, 184, 0.12);
}


[data-theme="dark"] .library-table th {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.7), rgba(15, 23, 42, 0.6));
  color: #cbd5e1;
  border-bottom-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .library-table td {
  border-bottom-color: rgba(148, 163, 184, 0.08);
}

[data-theme="dark"] .library-table tbody tr:nth-child(even) td {
  background: rgba(30, 41, 59, 0.25);
}

[data-theme="dark"] .library-table tbody tr:hover td {
  background: rgba(59, 130, 246, 0.1);
}

[data-theme="dark"] .library-table tbody tr.is-overdue td {
  background: rgba(244, 63, 94, 0.06);
  border-inline-start-color: rgba(244, 63, 94, 0.4);
}

[data-theme="dark"] .library-table tbody tr.is-overdue:hover td {
  background: rgba(244, 63, 94, 0.12);
}

[data-theme="dark"] .library-table-wrap {
  border-top-color: rgba(148, 163, 184, 0.08);
}


[data-theme="dark"] .library-cat-add-form {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.04) 0%, rgba(139, 92, 246, 0.03) 100%);
  border-color: rgba(96, 165, 250, 0.2);
}


[data-theme="dark"] .library-empty {
  background: rgba(15, 23, 42, 0.6);
  border-color: rgba(148, 163, 184, 0.2);
  color: #94a3b8;
}

[data-theme="dark"] .library-empty h3 {
  color: #e2e8f0;
}


[data-theme="dark"] .library-page,
[data-theme="dark"] .library-detail-page,
[data-theme="dark"] .library-manage-page {
  --lib-accent: #818cf8;
  --lib-accent-deep: #6366f1;
  --lib-accent-light: #a5b4fc;
  --lib-accent-glow: rgba(129, 140, 248, 0.22);
  --lib-glass-bg: rgba(15, 23, 42, 0.82);
  --lib-glass-border: rgba(148, 163, 184, 0.18);
}


[data-theme="dark"] .library-page-hero {
  background: linear-gradient(135deg, #312e81 0%, #3730a3 40%, #4f46e5 70%, #6366f1 100%);
  box-shadow: 0 20px 60px rgba(49, 46, 129, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .library-hero-stat {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.15);
}

[data-theme="dark"] .library-hero-stat:hover {
  background: rgba(255, 255, 255, 0.18);
}


[data-theme="dark"] .library-admin-quick .lib-btn-primary {
  background: var(--lib-accent);
  box-shadow: 0 4px 14px var(--lib-accent-glow);
}

[data-theme="dark"] .library-admin-quick .lib-btn-ghost {
  background: rgba(15, 23, 42, 0.82);
  color: var(--lib-accent);
  border-color: rgba(129, 140, 248, 0.2);
}


[data-theme="dark"] .library-search {
  background: rgba(15, 23, 42, 0.8);
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.25);
}

[data-theme="dark"] .library-search::placeholder {
  color: #64748b;
}

[data-theme="dark"] .library-search:focus {
  background: #0b1220;
  border-color: var(--lib-accent);
  box-shadow: 0 0 0 4px var(--lib-accent-glow);
}

[data-theme="dark"] .library-filter-select {
  background: rgba(15, 23, 42, 0.8) url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23818cf8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat left 0.9rem center;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.25);
}

[data-theme="dark"] .library-filter-select:focus {
  border-color: var(--lib-accent);
  box-shadow: 0 0 0 4px var(--lib-accent-glow);
  background-color: #0b1220;
}


[data-theme="dark"] .library-cat-chip {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.25);
  color: #94a3b8;
}

[data-theme="dark"] .library-cat-chip:hover {
  background: rgba(129, 140, 248, 0.12);
  border-color: rgba(129, 140, 248, 0.35);
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-cat-chip.is-active {
  background: linear-gradient(135deg, var(--lib-accent), var(--lib-accent-deep));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 6px 18px var(--lib-accent-glow);
}


[data-theme="dark"] .library-book-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.82));
  border-color: rgba(148, 163, 184, 0.18);
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.4);
}

[data-theme="dark"] .library-book-card:hover {
  border-color: rgba(129, 140, 248, 0.3);
  box-shadow: 0 20px 40px rgba(2, 6, 23, 0.5), 0 8px 16px rgba(129, 140, 248, 0.08);
}

[data-theme="dark"] .library-book-card::after {
  background: linear-gradient(135deg, rgba(129, 140, 248, 0.12), transparent 60%);
}

[data-theme="dark"] .library-book-cover {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] .library-book-cover-placeholder {
  background: linear-gradient(135deg, #312e81, #3730a3, #4f46e5);
}

[data-theme="dark"] .library-book-body {
  background: rgba(15, 23, 42, 0.88);
}

[data-theme="dark"] .library-book-title {
  color: #f1f5f9;
}

[data-theme="dark"] .library-book-card:hover .library-book-title {
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-book-author {
  color: #94a3b8;
}

[data-theme="dark"] .library-book-meta {
  border-top-color: rgba(148, 163, 184, 0.12);
  color: #94a3b8;
}

[data-theme="dark"] .library-book-availability.available {
  background: rgba(52, 211, 153, 0.12);
  color: #6ee7b7;
}

[data-theme="dark"] .library-book-availability.unavailable {
  background: rgba(251, 113, 133, 0.12);
  color: #fda4af;
}


[data-theme="dark"] .library-empty {
  border-color: rgba(148, 163, 184, 0.22);
  background: rgba(15, 23, 42, 0.6);
  color: #64748b;
}

[data-theme="dark"] .library-empty h3 {
  color: #e2e8f0;
}


[data-theme="dark"] .library-page-btn,
[data-theme="dark"] .page-btn {
  background: rgba(30, 41, 59, 0.9);
  border-color: rgba(129, 140, 248, 0.2);
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-page-btn:hover,
[data-theme="dark"] .page-btn:hover {
  background: rgba(129, 140, 248, 0.1);
  border-color: rgba(129, 140, 248, 0.35);
}


[data-theme="dark"] .library-detail-back {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(129, 140, 248, 0.2);
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-detail-back:hover {
  background: rgba(129, 140, 248, 0.1);
  border-color: rgba(129, 140, 248, 0.35);
}


[data-theme="dark"] .library-detail-hero::before {
  background: radial-gradient(circle, rgba(129, 140, 248, 0.15) 0%, transparent 60%);
}






[data-theme="dark"] .library-detail-meta-item:hover {
  background: rgba(15, 23, 42, 0.8);
}





[data-theme="dark"] .library-star-btn {
  color: rgba(251, 191, 36, 0.22);
}
[data-theme="dark"] .library-star-btn:hover,
[data-theme="dark"] .library-star-btn.is-preview {
  color: #fcd34d;
  background: rgba(245, 158, 11, 0.12);
}

[data-theme="dark"] .library-star-btn.is-filled {
  color: #fbbf24;
  filter: drop-shadow(0 2px 6px rgba(251, 191, 36, 0.25));
}

[data-theme="dark"] .library-star-value {
  color: #f1f5f9;
}

[data-theme="dark"] .library-star-count {
  color: #94a3b8;
}


[data-theme="dark"] .library-comments-section {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.84));
  border-color: rgba(148, 163, 184, 0.18);
  box-shadow: 0 20px 48px rgba(2, 6, 23, 0.45);
}

[data-theme="dark"] .library-comments-title {
  color: #f1f5f9;
}

[data-theme="dark"] .library-comment-textarea {
  background: #0b1220;
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.25);
}

[data-theme="dark"] .library-comment-textarea::placeholder {
  color: #64748b;
}

[data-theme="dark"] .library-comment-textarea:focus {
  border-color: var(--lib-accent);
  box-shadow: 0 0 0 4px var(--lib-accent-glow);
  background: #0b1220;
}

[data-theme="dark"] .library-comment-item {
  background: rgba(15, 23, 42, 0.5);
  border-color: rgba(148, 163, 184, 0.08);
}

[data-theme="dark"] .library-comment-item:hover {
  background: rgba(15, 23, 42, 0.7);
}

[data-theme="dark"] .library-comment-avatar {
  border-color: rgba(129, 140, 248, 0.25);
}

[data-theme="dark"] .library-comment-name {
  color: #f1f5f9;
}

[data-theme="dark"] .library-comment-date {
  color: #64748b;
}

[data-theme="dark"] .library-comment-text {
  color: #cbd5e1;
}

[data-theme="dark"] .library-comment-delete-btn {
  color: #64748b;
}

[data-theme="dark"] .library-comment-delete-btn:hover {
  color: #fda4af;
  background: rgba(244, 63, 94, 0.1);
}


[data-theme="dark"] .library-borrow-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.84));
  border-color: rgba(148, 163, 184, 0.18);
  box-shadow: 0 20px 48px rgba(2, 6, 23, 0.45);
}

[data-theme="dark"] .library-borrow-title {
  color: #f1f5f9;
}

[data-theme="dark"] .library-borrow-table-wrap {
  border-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .library-borrow-table th {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.95), rgba(15, 23, 42, 0.9));
  color: #cbd5e1;
  border-bottom-color: rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] .library-borrow-table td {
  border-bottom-color: rgba(148, 163, 184, 0.08);
  color: #e2e8f0;
}

[data-theme="dark"] .library-borrow-table tbody tr:hover td {
  background: rgba(129, 140, 248, 0.06);
}

[data-theme="dark"] .borrow-status-badge.borrowed {
  background: rgba(96, 165, 250, 0.18);
  color: #93c5fd;
}

[data-theme="dark"] .borrow-status-badge.returned {
  background: rgba(52, 211, 153, 0.18);
  color: #6ee7b7;
}

[data-theme="dark"] .borrow-status-badge.overdue {
  background: rgba(251, 113, 133, 0.18);
  color: #fda4af;
}


[data-theme="dark"] .library-fav-btn {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.25);
  color: #64748b;
}

[data-theme="dark"] .library-fav-btn:hover {
  border-color: rgba(244, 63, 94, 0.4);
  color: #fda4af;
  background: rgba(244, 63, 94, 0.08);
}

[data-theme="dark"] .library-fav-btn.is-favorited {
  color: #fb7185;
  background: rgba(244, 63, 94, 0.1);
  border-color: rgba(244, 63, 94, 0.3);
}


[data-theme="dark"] .library-manage-hero {
  background: linear-gradient(135deg, #312e81 0%, #3730a3 40%, #4f46e5 70%, #6366f1 100%);
  box-shadow: 0 20px 60px rgba(49, 46, 129, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .library-hero-back {
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.85);
}

[data-theme="dark"] .library-hero-back:hover {
  background: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .library-manage-stat {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.15);
}

[data-theme="dark"] .library-manage-stat:hover {
  background: rgba(255, 255, 255, 0.18);
}


[data-theme="dark"] .library-admin-tabs {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .library-admin-tab {
  color: #94a3b8;
}

[data-theme="dark"] .library-admin-tab:hover {
  background: rgba(129, 140, 248, 0.1);
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-admin-tab.is-active {
  background: linear-gradient(135deg, var(--lib-accent), var(--lib-accent-deep));
  color: #fff;
  box-shadow: 0 6px 18px var(--lib-accent-glow);
}

[data-theme="dark"] .tab-badge {
  background: rgba(129, 140, 248, 0.18);
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-admin-tab.is-active .tab-badge {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

[data-theme="dark"] .tab-badge-warn {
  background: rgba(245, 158, 11, 0.18);
  color: #fbbf24;
}

[data-theme="dark"] .library-admin-tab-add {
  background: rgba(16, 185, 129, 0.08);
  color: #6ee7b7;
}

[data-theme="dark"] .library-admin-tab-add:hover {
  background: rgba(16, 185, 129, 0.15);
  color: #a7f3d0;
}


[data-theme="dark"] .library-manage-card {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.95), rgba(15, 23, 42, 0.9));
  border-color: rgba(148, 163, 184, 0.18);
  box-shadow: 0 1px 3px rgba(2, 6, 23, 0.2), 0 8px 24px rgba(2, 6, 23, 0.3), 0 20px 48px rgba(2, 6, 23, 0.2);
}

[data-theme="dark"] .library-manage-card:hover {
  box-shadow: 0 1px 3px rgba(2, 6, 23, 0.2), 0 12px 28px rgba(2, 6, 23, 0.35), 0 24px 56px rgba(2, 6, 23, 0.25);
  border-color: rgba(148, 163, 184, 0.22);
}

[data-theme="dark"] .library-manage-card::before {
  background: linear-gradient(90deg, var(--lib-accent) 0%, var(--lib-accent-light) 40%, var(--lib-accent) 70%, var(--lib-accent-deep) 100%);
}

[data-theme="dark"] .library-manage-head {
  border-bottom-color: rgba(148, 163, 184, 0.1);
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.4) 0%, transparent 100%);
}

[data-theme="dark"] .library-manage-head-text h2 {
  color: #f1f5f9;
}

[data-theme="dark"] .library-manage-head-text h2 svg {
  color: var(--lib-accent);
}

[data-theme="dark"] .library-manage-head-text p {
  color: #94a3b8;
}

[data-theme="dark"] .head-count {
  background: linear-gradient(135deg, rgba(129, 140, 248, 0.18), rgba(129, 140, 248, 0.08));
  color: var(--lib-accent-light);
  border-color: rgba(129, 140, 248, 0.1);
}


[data-theme="dark"] .library-admin-search-wrap input {
  background: rgba(15, 23, 42, 0.7);
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.22);
}

[data-theme="dark"] .library-admin-search-wrap input::placeholder {
  color: #64748b;
}

[data-theme="dark"] .library-admin-search-wrap input:hover {
  border-color: rgba(148, 163, 184, 0.35);
  background: rgba(11, 18, 32, 0.9);
}

[data-theme="dark"] .library-admin-search-wrap input:focus {
  border-color: var(--lib-accent);
  box-shadow: 0 0 0 4px var(--lib-accent-glow);
  background: #0b1220;
}

[data-theme="dark"] .library-admin-search-wrap svg {
  color: #64748b;
}


[data-theme="dark"] .library-form-field label {
  color: #e2e8f0;
}

[data-theme="dark"] .library-form-field .required {
  color: #fda4af;
}

[data-theme="dark"] .library-form-field input,
[data-theme="dark"] .library-form-field select,
[data-theme="dark"] .library-form-field textarea {
  background: rgba(11, 18, 32, 0.7);
  border-color: rgba(148, 163, 184, 0.22);
  color: #e2e8f0;
}

[data-theme="dark"] .library-form-field input::placeholder,
[data-theme="dark"] .library-form-field textarea::placeholder {
  color: #64748b;
}

[data-theme="dark"] .library-form-field input:hover,
[data-theme="dark"] .library-form-field select:hover,
[data-theme="dark"] .library-form-field textarea:hover {
  border-color: rgba(148, 163, 184, 0.35);
  background: rgba(11, 18, 32, 0.9);
}

[data-theme="dark"] .library-form-field input:focus,
[data-theme="dark"] .library-form-field select:focus,
[data-theme="dark"] .library-form-field textarea:focus {
  border-color: var(--lib-accent);
  box-shadow: 0 0 0 4px var(--lib-accent-glow), 0 1px 2px rgba(129, 140, 248, 0.08);
  background: #0b1220;
}

[data-theme="dark"] .library-form-hint {
  color: #94a3b8;
}

[data-theme="dark"] .library-form-hint::before {
  background: var(--lib-accent);
}

[data-theme="dark"] .library-form-actions {
  border-top-color: rgba(148, 163, 184, 0.1);
}


[data-theme="dark"] .library-cat-add-form {
  background: linear-gradient(135deg, rgba(129, 140, 248, 0.04), rgba(124, 58, 237, 0.02));
  border-color: rgba(129, 140, 248, 0.18);
}


[data-theme="dark"] .library-table-wrap {
  border-color: rgba(148, 163, 184, 0.15);
  background: rgba(15, 23, 42, 0.85);
}

[data-theme="dark"] .library-table th {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.7), rgba(15, 23, 42, 0.6));
  color: #cbd5e1;
  border-bottom-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .library-table td {
  border-bottom-color: rgba(148, 163, 184, 0.06);
  color: #e2e8f0;
}

[data-theme="dark"] .library-table tbody tr:nth-child(even) td {
  background: rgba(30, 41, 59, 0.2);
}

[data-theme="dark"] .library-table tbody tr:hover td {
  background: rgba(129, 140, 248, 0.08);
}

[data-theme="dark"] .library-table tbody tr.is-overdue td {
  background: rgba(244, 63, 94, 0.05);
  border-inline-start-color: rgba(244, 63, 94, 0.35);
}

[data-theme="dark"] .library-table tbody tr.is-overdue:hover td {
  background: rgba(244, 63, 94, 0.1);
}

[data-theme="dark"] .library-table .col-id {
  color: #64748b;
}

[data-theme="dark"] .library-table-book-link {
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-table-book-link:hover {
  color: #a5b4fc;
}

[data-theme="dark"] .library-table-cat-badge {
  background: rgba(129, 140, 248, 0.12);
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-table-cat-name {
  color: #f1f5f9;
}

[data-theme="dark"] .library-table-muted {
  color: #64748b;
}

[data-theme="dark"] .library-copies-badge.is-available {
  background: rgba(52, 211, 153, 0.12);
  color: #6ee7b7;
}

[data-theme="dark"] .library-copies-badge.is-empty {
  background: rgba(251, 113, 133, 0.1);
  color: #fda4af;
}

[data-theme="dark"] .library-overdue-badge {
  color: #fda4af;
}


[data-theme="dark"] .library-action-btn {
  background: rgba(15, 23, 42, 0.8);
  border-color: rgba(148, 163, 184, 0.18);
  color: #94a3b8;
}

[data-theme="dark"] .library-action-btn:hover {
  background: rgba(30, 41, 59, 0.9);
  box-shadow: 0 2px 8px rgba(2, 6, 23, 0.3);
}

[data-theme="dark"] .library-action-edit:hover {
  color: var(--lib-accent-light);
  border-color: rgba(129, 140, 248, 0.3);
}

[data-theme="dark"] .library-action-delete:hover {
  color: #fda4af;
  border-color: rgba(248, 113, 113, 0.3);
  background: rgba(248, 113, 113, 0.1);
}


[data-theme="dark"] .library-btn-primary {
  background: linear-gradient(135deg, var(--lib-accent), var(--lib-accent-deep));
  box-shadow: 0 6px 16px var(--lib-accent-glow);
}

[data-theme="dark"] .library-btn-primary:hover {
  box-shadow: 0 10px 24px var(--lib-accent-glow);
}

[data-theme="dark"] .library-btn-ghost {
  background: rgba(15, 23, 42, 0.7);
  border-color: rgba(148, 163, 184, 0.3);
  color: #cbd5e1;
}

[data-theme="dark"] .library-btn-ghost:hover {
  background: rgba(129, 140, 248, 0.1);
  border-color: rgba(129, 140, 248, 0.35);
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-btn-success {
  background: rgba(16, 185, 129, 0.12);
  color: #6ee7b7;
  border-color: rgba(16, 185, 129, 0.2);
}

[data-theme="dark"] .library-btn-success:hover {
  background: rgba(16, 185, 129, 0.22);
  border-color: rgba(16, 185, 129, 0.4);
}


[data-theme="dark"] .library-modal-backdrop {
  background: rgba(2, 6, 23, 0.7);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

[data-theme="dark"] .library-modal-card {
  background: rgba(15, 23, 42, 0.96);
  border: 1px solid rgba(148, 163, 184, 0.2);
  box-shadow: 0 30px 70px rgba(2, 6, 23, 0.6);
}

[data-theme="dark"] .library-modal-head {
  border-bottom-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .library-modal-head h3 {
  color: #f1f5f9;
}

[data-theme="dark"] .library-modal-close {
  background: rgba(51, 65, 85, 0.8);
  border-color: rgba(148, 163, 184, 0.25);
  color: #94a3b8;
}

[data-theme="dark"] .library-modal-close:hover {
  background: rgba(244, 63, 94, 0.12);
  border-color: rgba(244, 63, 94, 0.35);
  color: #fda4af;
}

[data-theme="dark"] .library-modal-foot {
  border-top-color: rgba(148, 163, 184, 0.18);
}


[data-theme="dark"] .library-flash.success {
  background: rgba(16, 185, 129, 0.12);
  border-color: rgba(16, 185, 129, 0.25);
  color: #6ee7b7;
}

[data-theme="dark"] .library-flash.error {
  background: rgba(248, 113, 113, 0.12);
  border-color: rgba(248, 113, 113, 0.25);
  color: #fda4af;
}


[data-theme="dark"] .library-skeleton {
  background: linear-gradient(90deg, rgba(30, 41, 59, 0.6) 0%, rgba(51, 65, 85, 0.8) 50%, rgba(30, 41, 59, 0.6) 100%);
  background-size: 200% 100%;
}



[data-theme="dark"] .library-form-section {
  border-bottom-color: rgba(148, 163, 184, 0.1);
}

[data-theme="dark"] .library-form-section-head {
  border-bottom-color: rgba(129, 140, 248, 0.15);
}

[data-theme="dark"] .library-form-section-head svg {
  color: var(--lib-accent);
  filter: drop-shadow(0 2px 4px rgba(129, 140, 248, 0.2));
}

[data-theme="dark"] .library-form-section-head h3 {
  color: #f1f5f9;
}


[data-theme="dark"] .library-cover-preview {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.6), rgba(15, 23, 42, 0.4));
  border-color: rgba(148, 163, 184, 0.2);
}

[data-theme="dark"] .library-cover-preview-placeholder {
  color: #64748b;
}

[data-theme="dark"] .library-cover-preview-placeholder svg {
  opacity: 0.35;
}

[data-theme="dark"] .library-cover-preview.has-image {
  border-color: var(--lib-accent);
  box-shadow: 0 8px 20px rgba(2, 6, 23, 0.3), 0 0 0 3px var(--lib-accent-glow);
}


[data-theme="dark"] .library-cover-dropzone {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.6), rgba(30, 41, 59, 0.4));
  border-color: rgba(148, 163, 184, 0.25);
}

[data-theme="dark"] .library-cover-dropzone:hover,
[data-theme="dark"] .library-cover-dropzone.is-dragging {
  border-color: var(--lib-accent);
  background: linear-gradient(160deg, rgba(129, 140, 248, 0.08), rgba(99, 102, 241, 0.04));
  box-shadow: 0 0 0 3px var(--lib-accent-glow);
}

[data-theme="dark"] .library-cover-dropzone svg {
  color: var(--lib-accent);
}

[data-theme="dark"] .library-cover-drop-title {
  color: #e2e8f0;
}

[data-theme="dark"] .library-cover-drop-sub {
  color: #64748b;
}

[data-theme="dark"] .library-cover-drop-hint {
  color: var(--lib-accent-light);
}

[data-theme="dark"] .library-cover-file-name {
  color: var(--lib-accent-light);
}


[data-theme="dark"] .library-form-field label svg {
  color: var(--lib-accent);
}




[data-theme="dark"] .library-detail-page {
  color: #e2e8f0;
}

[data-theme="dark"] .library-detail-back {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(96, 165, 250, 0.32);
  color: #93c5fd;
}

[data-theme="dark"] .library-detail-back:hover {
  background: rgba(30, 64, 175, 0.22);
  border-color: rgba(96, 165, 250, 0.45);
  color: #bfdbfe;
  box-shadow: 0 4px 14px rgba(30, 64, 175, 0.22);
}


[data-theme="dark"] .library-spotlight {
  background: linear-gradient(135deg,
    rgba(var(--cat-color, 79 70 229), 0.08) 0%,
    rgba(15, 23, 42, 0.86) 50%,
    rgba(var(--cat-color, 79 70 229), 0.05) 100%);
  border-color: rgba(148, 163, 184, 0.22);
  box-shadow:
    0 1px 3px rgba(2, 6, 23, 0.4),
    0 12px 32px rgba(2, 6, 23, 0.55),
    0 30px 60px rgba(var(--cat-color, 79 70 229), 0.18);
}

[data-theme="dark"] .library-spotlight-cover-pages {
  background: linear-gradient(90deg, #cbd5e1 0%, #94a3b8 30%, #64748b 60%, #94a3b8 100%);
  box-shadow: inset -2px 0 0 rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .library-spotlight-cover-face {
  background: linear-gradient(135deg, #1e293b, #0f172a);
  box-shadow:
    inset 6px 0 8px rgba(0, 0, 0, 0.5),
    inset -1px 0 0 rgba(0, 0, 0, 0.3),
    0 18px 38px rgba(0, 0, 0, 0.6),
    0 6px 14px rgba(var(--cat-color, 79 70 229), 0.25);
}

[data-theme="dark"] .library-spotlight-cover-placeholder {
  background: linear-gradient(135deg, #4338ca 0%, #4f46e5 50%, #6366f1 100%);
}

[data-theme="dark"] .library-spotlight-title {
  color: #f8fafc;
}

[data-theme="dark"] .library-pill {
  background: rgba(var(--cat-color, 79 70 229), 0.18);
  border-color: rgba(var(--cat-color, 79 70 229), 0.32);
  color: rgb(var(--cat-color, 79 70 229));
}

[data-theme="dark"] .library-spotlight-author-avatar {
  background: linear-gradient(135deg, rgba(var(--cat-color, 79 70 229), 0.25), rgba(var(--cat-color, 79 70 229), 0.08));
  border-color: rgba(var(--cat-color, 79 70 229), 0.3);
  color: rgb(var(--cat-color, 79 70 229));
}

[data-theme="dark"] .library-spotlight-author-label {
  color: #64748b;
}

[data-theme="dark"] .library-spotlight-author-name {
  color: #f8fafc;
}

[data-theme="dark"] .library-rating-display {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.12), rgba(245, 158, 11, 0.04));
  border-color: rgba(245, 158, 11, 0.25);
}

[data-theme="dark"] .library-rating-meta {
  border-inline-start-color: rgba(245, 158, 11, 0.3);
}

[data-theme="dark"] .library-rating-meta strong {
  color: #f8fafc;
}

[data-theme="dark"] .library-rating-meta span {
  color: #fcd34d;
}

[data-theme="dark"] .library-spotlight-desc {
  color: #cbd5e1;
  border-inline-start-color: rgba(var(--cat-color, 79 70 229), 0.35);
}

[data-theme="dark"] .library-spotlight-quote {
  color: rgba(var(--cat-color, 79 70 229), 0.28);
}

[data-theme="dark"] .library-action-borrow {
  box-shadow:
    0 8px 20px rgba(var(--cat-color, 79 70 229), 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

[data-theme="dark"] .library-action-borrow:hover {
  box-shadow:
    0 12px 28px rgba(var(--cat-color, 79 70 229), 0.6),
    inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

[data-theme="dark"] .library-action-state--active {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.18), rgba(5, 150, 105, 0.08));
  color: #6ee7b7;
  border-color: rgba(16, 185, 129, 0.4);
}

[data-theme="dark"] .library-action-state--empty {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.16), rgba(225, 29, 72, 0.06));
  color: #fda4af;
  border-color: rgba(244, 63, 94, 0.4);
}

[data-theme="dark"] .library-fav-btn,
[data-theme="dark"] .library-share-btn {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.32);
  color: #94a3b8;
}

[data-theme="dark"] .library-fav-btn.is-favorited {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.18), rgba(225, 29, 72, 0.06));
  border-color: rgba(244, 63, 94, 0.5);
  color: #fda4af;
  box-shadow: 0 6px 14px rgba(244, 63, 94, 0.3);
}

[data-theme="dark"] .library-share-btn:hover {
  background: rgba(14, 165, 233, 0.18);
  border-color: rgba(14, 165, 233, 0.5);
  color: #38bdf8;
  box-shadow: 0 8px 18px rgba(14, 165, 233, 0.25);
}


[data-theme="dark"] .library-section-title {
  color: #f8fafc;
}

[data-theme="dark"] .library-section-title svg {
  color: #60a5fa;
}

[data-theme="dark"] .library-section-count {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.18), rgba(59, 130, 246, 0.08));
  border-color: rgba(96, 165, 250, 0.18);
  color: #93c5fd;
}


[data-theme="dark"] .library-bento-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.88));
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 6px 18px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .library-bento-card:hover {
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow:
    0 10px 22px rgba(2, 6, 23, 0.55),
    0 0 0 1px rgba(96, 165, 250, 0.12);
}

[data-theme="dark"] .library-bento-card::after {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.08) 0%, transparent 60%);
}

[data-theme="dark"] .library-bento-card-head h3 {
  color: #f8fafc;
}

[data-theme="dark"] .library-bento-card-head p {
  color: #94a3b8;
}

[data-theme="dark"] .library-bento-card-body strong {
  color: #f8fafc;
}

[data-theme="dark"] .library-bento-card-body span {
  color: #94a3b8;
}

[data-theme="dark"] .library-bento-icon--green {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.2), rgba(5, 150, 105, 0.08));
  color: #34d399;
}

[data-theme="dark"] .library-bento-icon--amber {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.2), rgba(217, 119, 6, 0.08));
  color: #fbbf24;
}

[data-theme="dark"] .library-bento-icon--blue {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.2), rgba(37, 99, 235, 0.08));
  color: #60a5fa;
}

[data-theme="dark"] .library-bento-icon--purple {
  background: linear-gradient(135deg, rgba(168, 85, 247, 0.2), rgba(124, 58, 237, 0.08));
  color: #a78bfa;
}

[data-theme="dark"] .library-bento-icon--teal {
  background: linear-gradient(135deg, rgba(20, 184, 166, 0.2), rgba(13, 148, 136, 0.08));
  color: #2dd4bf;
}

[data-theme="dark"] .library-availability-bar {
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.18), rgba(148, 163, 184, 0.12));
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .library-availability-bar-fill {
  background: linear-gradient(90deg, #059669 0%, #10b981 50%, #34d399 100%);
  box-shadow:
    0 0 12px rgba(16, 185, 129, 0.6),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .library-availability-bar-ticks span {
  background: rgba(255, 255, 255, 0.6);
}


[data-theme="dark"] .library-detail-grid {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.86));
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 12px 30px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .library-detail-tile {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.7), rgba(15, 23, 42, 0.5));
  border-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .library-detail-tile:hover {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.82));
  border-color: rgba(96, 165, 250, 0.35);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .library-detail-tile-icon {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.2), rgba(59, 130, 246, 0.08));
  color: #60a5fa;
}

[data-theme="dark"] .library-detail-tile-label {
  color: #64748b;
}

[data-theme="dark"] .library-detail-tile-value {
  color: #f8fafc;
}


[data-theme="dark"] .library-timeline-section {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.86));
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 12px 30px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .library-timeline::before {
  background: linear-gradient(180deg,
    rgba(96, 165, 250, 0.25) 0%,
    rgba(96, 165, 250, 0.15) 50%,
    rgba(148, 163, 184, 0.1) 100%);
}

[data-theme="dark"] .library-timeline-dot {
  border-color: #0f172a;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .library-timeline-item--borrowed .library-timeline-dot {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
}

[data-theme="dark"] .library-timeline-item--returned .library-timeline-dot {
  background: linear-gradient(135deg, #10b981, #047857);
}

[data-theme="dark"] .library-timeline-item--overdue .library-timeline-dot {
  background: linear-gradient(135deg, #f43f5e, #be123c);
}

[data-theme="dark"] .library-timeline-card {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.78), rgba(15, 23, 42, 0.6));
  border-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .library-timeline-card:hover {
  background: rgba(15, 23, 42, 0.95);
  border-color: rgba(96, 165, 250, 0.3);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);
}

[data-theme="dark"] .library-timeline-user {
  color: #f8fafc;
}

[data-theme="dark"] .library-timeline-user svg {
  color: #60a5fa;
}

[data-theme="dark"] .library-timeline-date {
  color: #94a3b8;
}

[data-theme="dark"] .library-timeline-field span {
  color: #64748b;
}

[data-theme="dark"] .library-timeline-field strong {
  color: #f8fafc;
}

[data-theme="dark"] .library-timeline-action {
  border-top-color: rgba(148, 163, 184, 0.15);
}

[data-theme="dark"] .borrow-status-badge.borrowed {
  background: rgba(59, 130, 246, 0.22);
  color: #93c5fd;
}

[data-theme="dark"] .borrow-status-badge.returned {
  background: rgba(16, 185, 129, 0.22);
  color: #6ee7b7;
}

[data-theme="dark"] .borrow-status-badge.overdue {
  background: rgba(244, 63, 94, 0.22);
  color: #fda4af;
}


[data-theme="dark"] .library-comments-section {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.86));
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 12px 30px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .library-comment-form {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.7), rgba(15, 23, 42, 0.5));
  border-color: rgba(96, 165, 250, 0.28);
}

[data-theme="dark"] .library-comment-form-avatar {
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .library-comment-form-meta strong {
  color: #f8fafc;
}

[data-theme="dark"] .library-comment-form-meta span {
  color: #94a3b8;
}

[data-theme="dark"] .library-comment-textarea {
  background: rgba(15, 23, 42, 0.85);
  color: #e2e8f0;
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .library-comment-textarea:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 4px rgba(96, 165, 250, 0.2);
  background: rgba(15, 23, 42, 0.95);
}

[data-theme="dark"] .library-comment-form-hint {
  color: #94a3b8;
}

[data-theme="dark"] .library-comment-item {
  background: rgba(15, 23, 42, 0.6);
  border-color: rgba(148, 163, 184, 0.1);
}

[data-theme="dark"] .library-comment-item:hover {
  background: rgba(15, 23, 42, 0.92);
  border-color: rgba(96, 165, 250, 0.25);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .library-comment-avatar {
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .library-comment-name {
  color: #f8fafc;
}

[data-theme="dark"] .library-comment-date {
  color: #64748b;
}

[data-theme="dark"] .library-comment-text {
  color: #cbd5e1;
}

[data-theme="dark"] .library-comment-delete-btn {
  color: #64748b;
}

[data-theme="dark"] .library-comment-delete-btn:hover {
  color: #fda4af;
  background: rgba(244, 63, 94, 0.18);
}

[data-theme="dark"] .library-empty--inline {
  background: rgba(15, 23, 42, 0.5);
  border-color: rgba(148, 163, 184, 0.25);
  color: #94a3b8;
}

[data-theme="dark"] .library-empty--inline h3 {
  color: #f8fafc;
}


[data-theme="dark"] .library-related-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.88));
  border-color: rgba(148, 163, 184, 0.24);
  box-shadow: 0 4px 14px rgba(2, 6, 23, 0.4);
}

[data-theme="dark"] .library-related-card:hover {
  border-color: rgba(96, 165, 250, 0.4);
  box-shadow:
    0 12px 24px rgba(2, 6, 23, 0.5),
    0 0 0 2px rgba(96, 165, 250, 0.12);
}

[data-theme="dark"] .library-related-cover {
  background: linear-gradient(135deg, #1e293b, #0f172a);
}

[data-theme="dark"] .library-related-cover-placeholder {
  background: linear-gradient(135deg, #4338ca 0%, #4f46e5 50%, #6366f1 100%);
}

[data-theme="dark"] .library-related-badge {
  background: rgba(244, 63, 94, 0.94);
  box-shadow: 0 2px 6px rgba(244, 63, 94, 0.4);
}

[data-theme="dark"] .library-related-title {
  color: #f8fafc;
}

[data-theme="dark"] .library-related-author {
  color: #94a3b8;
}

[data-theme="dark"] .library-related-meta {
  border-top-color: rgba(148, 163, 184, 0.1);
}

[data-theme="dark"] .library-related-rating {
  color: #fbbf24;
}

[data-theme="dark"] .library-related-borrows {
  color: #94a3b8;
}

[data-theme="dark"] .library-related-track::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.5);
}

[data-theme="dark"] .library-related-track::-webkit-scrollbar-thumb {
  background: rgba(96, 165, 250, 0.4);
}

[data-theme="dark"] .library-related-track::-webkit-scrollbar-thumb:hover {
  background: rgba(96, 165, 250, 0.6);
}


[data-theme="dark"] .library-btn-primary {
  box-shadow: 0 6px 16px rgba(59, 130, 246, 0.4);
}

[data-theme="dark"] .library-btn-ghost {
  border-color: rgba(148, 163, 184, 0.3);
  color: #cbd5e1;
}

[data-theme="dark"] .library-btn-ghost:hover {
  background: rgba(96, 165, 250, 0.15);
  border-color: rgba(96, 165, 250, 0.4);
  color: #93c5fd;
}

[data-theme="dark"] .library-btn-success {
  background: rgba(16, 185, 129, 0.18);
  color: #6ee7b7;
  border-color: rgba(16, 185, 129, 0.35);
}

[data-theme="dark"] .library-btn-success:hover {
  background: rgba(16, 185, 129, 0.28);
  border-color: rgba(16, 185, 129, 0.5);
}

[data-theme="dark"] .library-flash.success {
  background: rgba(16, 185, 129, 0.15);
  border-color: rgba(16, 185, 129, 0.3);
  color: #6ee7b7;
}

[data-theme="dark"] .library-flash.error {
  background: rgba(244, 63, 94, 0.15);
  border-color: rgba(244, 63, 94, 0.3);
  color: #fda4af;
}

[data-theme="dark"] .library-spotlight-author-avatar svg,
[data-theme="dark"] .library-related-cover-placeholder svg {
  color: inherit;
}



[data-theme="dark"] .library-rating-display {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.16) 0%, rgba(245, 158, 11, 0.06) 50%, rgba(236, 72, 153, 0.10) 100%) !important;
  border-color: rgba(245, 158, 11, 0.32) !important;
  box-shadow: 0 4px 14px rgba(2, 6, 23, 0.4), 0 0 0 1px rgba(245, 158, 11, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}
[data-theme="dark"] .library-rating-community-label,
[data-theme="dark"] .library-rating-user-label { color: #fbbf24 !important; }
[data-theme="dark"] .library-rating-score-value {
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
[data-theme="dark"] .library-rating-score-max { color: #fbbf24 !important; opacity: 0.7; }
[data-theme="dark"] .library-rating-star-readonly { color: rgba(251, 191, 36, 0.18); }
[data-theme="dark"] .library-rating-star-fill { color: #fbbf24; }
[data-theme="dark"] .library-rating-count { color: #fbbf24 !important; }
[data-theme="dark"] .library-rating-count strong { color: #fcd34d !important; }
[data-theme="dark"] .library-rating-divider {
  background: linear-gradient(180deg, transparent 0%, rgba(245, 158, 11, 0.32) 30%, rgba(245, 158, 11, 0.32) 70%, transparent 100%) !important;
}
[data-theme="dark"] .library-rating-user-badge {
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
  color: #422006 !important;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
[data-theme="dark"] .library-rating-user-unrated {
  background: rgba(245, 158, 11, 0.1) !important;
  color: #fcd34d !important;
  border-color: rgba(245, 158, 11, 0.24) !important;
}
[data-theme="dark"] .library-rating-user-hint { color: rgba(252, 211, 77, 0.75) !important; }
[data-theme="dark"] .library-star-btn { color: rgba(251, 191, 36, 0.22); }
[data-theme="dark"] .library-star-btn:hover,
[data-theme="dark"] .library-star-btn.is-preview {
  color: #fcd34d;
  background: rgba(245, 158, 11, 0.12);
}
[data-theme="dark"] .library-star-btn.is-filled { color: #fbbf24; }





[data-theme="dark"] .library-spotlight {
  background:
    linear-gradient(135deg,
      rgba(var(--cat-color, 79 70 229), 0.14) 0%,
      rgba(15, 23, 42, 0.88) 45%,
      rgba(var(--cat-color, 79 70 229), 0.08) 100%) !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
  box-shadow:
    0 1px 3px rgba(2, 6, 23, 0.4),
    0 12px 32px rgba(2, 6, 23, 0.5),
    0 40px 80px rgba(var(--cat-color, 79 70 229), 0.15) !important;
}
[data-theme="dark"] .library-spotlight::before {
  background: radial-gradient(circle, rgba(var(--cat-color, 79 70 229), 0.2) 0%, transparent 60%) !important;
  opacity: 0.9;
}
[data-theme="dark"] .library-spotlight::after {
  background: radial-gradient(circle, rgba(var(--cat-color, 79 70 229), 0.12) 0%, transparent 60%) !important;
}


[data-theme="dark"] .library-spotlight-cover-face {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 50%, #1e1b4b 100%) !important;
  box-shadow:
    inset 8px 0 12px rgba(0, 0, 0, 0.55),
    inset -1px 0 0 rgba(99, 102, 241, 0.25),
    0 18px 38px rgba(0, 0, 0, 0.65),
    0 6px 14px rgba(var(--cat-color, 79 70 229), 0.22) !important;
}
[data-theme="dark"] .library-spotlight-cover-pages {
  background: linear-gradient(90deg, #94a3b8 0%, #64748b 30%, #475569 60%, #64748b 100%) !important;
  box-shadow:
    inset -2px 0 0 rgba(0, 0, 0, 0.4),
    inset 0 0 0 1px rgba(0, 0, 0, 0.2) !important;
}
[data-theme="dark"] .library-spotlight-cover-spine {
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.15)) !important;
}
[data-theme="dark"] .library-spotlight-cover-shadow {
  background: radial-gradient(ellipse, rgba(0, 0, 0, 0.85) 0%, transparent 70%) !important;
}
[data-theme="dark"] .library-spotlight-cover-placeholder {
  background: linear-gradient(135deg, #4f46e5 0%, #6366f1 50%, #818cf8 100%) !important;
}


[data-theme="dark"] .library-pill {
  color: rgb(var(--cat-color, 79 70 229)) !important;
  background: rgba(var(--cat-color, 79 70 229), 0.18) !important;
  border-color: rgba(var(--cat-color, 79 70 229), 0.42) !important;
}
[data-theme="dark"] .library-pill svg {
  color: rgb(var(--cat-color, 79 70 229)) !important;
  opacity: 0.9;
}


[data-theme="dark"] .library-spotlight-author-label { color: #64748b !important; }
[data-theme="dark"] .library-spotlight-author-name { color: #f1f5f9 !important; }
[data-theme="dark"] .library-spotlight-author-avatar {
  background: linear-gradient(135deg, rgba(var(--cat-color, 79 70 229), 0.25), rgba(var(--cat-color, 79 70 229), 0.08)) !important;
  border-color: rgba(var(--cat-color, 79 70 229), 0.35) !important;
  color: rgb(var(--cat-color, 79 70 229)) !important;
}


[data-theme="dark"] .library-spotlight-desc {
  border-inline-start-color: rgba(var(--cat-color, 79 70 229), 0.5) !important;
  color: #cbd5e1 !important;
}
[data-theme="dark"] .library-spotlight-quote svg {
  color: rgba(var(--cat-color, 79 70 229), 0.22) !important;
}


[data-theme="dark"] .library-spotlight-title { color: #f8fafc !important; }


[data-theme="dark"] .library-action-borrow {
  background: linear-gradient(135deg, rgb(var(--cat-color, 79 70 229)), rgba(var(--cat-color, 79 70 229), 0.85)) !important;
  box-shadow:
    0 8px 20px rgba(var(--cat-color, 79 70 229), 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
}
[data-theme="dark"] .library-action-state--active {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.18), rgba(5, 150, 105, 0.08)) !important;
  color: #34d399 !important;
  border-color: rgba(16, 185, 129, 0.4) !important;
}
[data-theme="dark"] .library-action-state--empty {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.16), rgba(225, 29, 72, 0.06)) !important;
  color: #fb7185 !important;
  border-color: rgba(244, 63, 94, 0.35) !important;
}
[data-theme="dark"] .library-detail-back,
[data-theme="dark"] .library-fav-btn,
[data-theme="dark"] .library-share-btn {
  background: rgba(15, 23, 42, 0.85) !important;
  border-color: rgba(148, 163, 184, 0.3) !important;
  color: #cbd5e1 !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
[data-theme="dark"] .library-detail-back:hover {
  color: #93c5fd !important;
  border-color: rgba(96, 165, 250, 0.5) !important;
  background: rgba(30, 64, 175, 0.25) !important;
}
[data-theme="dark"] .library-fav-btn:hover {
  color: #fb7185 !important;
  border-color: rgba(244, 63, 94, 0.5) !important;
  background: rgba(244, 63, 94, 0.14) !important;
}
[data-theme="dark"] .library-fav-btn.is-favorited {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.22), rgba(225, 29, 72, 0.08)) !important;
  border-color: rgba(244, 63, 94, 0.5) !important;
  color: #fb7185 !important;
  box-shadow: 0 6px 16px rgba(244, 63, 94, 0.22) !important;
}
[data-theme="dark"] .library-share-btn:hover {
  color: #38bdf8 !important;
  border-color: rgba(56, 189, 248, 0.5) !important;
  background: rgba(14, 165, 233, 0.14) !important;
}


[data-theme="dark"] .library-bento-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.85)) !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
  box-shadow: 0 4px 14px rgba(2, 6, 23, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}
[data-theme="dark"] .library-bento-card:hover {
  border-color: rgba(96, 165, 250, 0.4) !important;
  box-shadow: 0 8px 24px rgba(2, 6, 23, 0.55), 0 0 0 1px rgba(96, 165, 250, 0.15) !important;
}
[data-theme="dark"] .library-bento-card::after {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.08) 0%, transparent 60%) !important;
  opacity: 1;
}
[data-theme="dark"] .library-bento-card-head h3 { color: #f1f5f9 !important; }
[data-theme="dark"] .library-bento-card-head p { color: #94a3b8 !important; }
[data-theme="dark"] .library-bento-card-body strong { color: #f8fafc !important; }
[data-theme="dark"] .library-bento-card-body span { color: #94a3b8 !important; }


[data-theme="dark"] .library-bento-icon--green { background: linear-gradient(135deg, rgba(16, 185, 129, 0.3), rgba(5, 150, 105, 0.12)) !important; color: #34d399 !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08),  0 0 0 rgba(0,0,0,0) !important; }
[data-theme="dark"] .library-bento-icon--amber { background: linear-gradient(135deg, rgba(245, 158, 11, 0.3), rgba(217, 119, 6, 0.12)) !important; color: #fbbf24 !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08),  0 0 0 rgba(0,0,0,0) !important; }
[data-theme="dark"] .library-bento-icon--blue { background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(37, 99, 235, 0.12)) !important; color: #60a5fa !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08),  0 0 0 rgba(0,0,0,0) !important; }
[data-theme="dark"] .library-bento-icon--purple { background: linear-gradient(135deg, rgba(168, 85, 247, 0.3), rgba(124, 58, 237, 0.12)) !important; color: #c4b5fd !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08),  0 0 0 rgba(0,0,0,0) !important; }
[data-theme="dark"] .library-bento-icon--teal { background: linear-gradient(135deg, rgba(20, 184, 166, 0.3), rgba(13, 148, 136, 0.12)) !important; color: #2dd4bf !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08),  0 0 0 rgba(0,0,0,0) !important; }


[data-theme="dark"] .library-availability-bar {
  background: linear-gradient(90deg, rgba(15, 23, 42, 0.7), rgba(15, 23, 42, 0.55)) !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.6) !important;
}
[data-theme="dark"] .library-availability-bar-ticks span { background: rgba(255, 255, 255, 0.28) !important; }


[data-theme="dark"] .library-detail-tile {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.7), rgba(15, 23, 42, 0.55)) !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
}
[data-theme="dark"] .library-detail-tile:hover {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.95), rgba(15, 23, 42, 0.85)) !important;
  border-color: rgba(96, 165, 250, 0.42) !important;
  box-shadow: 0 8px 20px rgba(2, 6, 23, 0.55) !important;
}
[data-theme="dark"] .library-detail-tile-icon {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(99, 102, 241, 0.08)) !important;
  color: #93c5fd !important;
}
[data-theme="dark"] .library-detail-tile-label { color: #64748b !important; }
[data-theme="dark"] .library-detail-tile-value { color: #e2e8f0 !important; }


[data-theme="dark"] .library-section-title { color: #f8fafc !important; }
[data-theme="dark"] .library-section-title svg { color: #60a5fa !important; }
[data-theme="dark"] .library-section-count {
  background: rgba(99, 102, 241, 0.2) !important;
  color: #a5b4fc !important;
  border-color: rgba(99, 102, 241, 0.3) !important;
}


[data-theme="dark"] .library-timeline::before {
  background: linear-gradient(180deg, rgba(96, 165, 250, 0.25) 0%, rgba(99, 102, 241, 0.18) 50%, rgba(148, 163, 184, 0.12) 100%) !important;
}
[data-theme="dark"] .library-timeline-dot {
  border-color: #0f172a !important;
}
[data-theme="dark"] .library-timeline-card {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.78), rgba(15, 23, 42, 0.6)) !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
}
[data-theme="dark"] .library-timeline-card:hover {
  background: rgba(15, 23, 42, 0.95) !important;
  border-color: rgba(96, 165, 250, 0.32) !important;
}
[data-theme="dark"] .library-timeline-user { color: #f1f5f9 !important; }
[data-theme="dark"] .library-timeline-field strong { color: #f1f5f9 !important; }
[data-theme="dark"] .library-timeline-field span { color: #64748b !important; }
[data-theme="dark"] .library-timeline-date { color: #94a3b8 !important; }


[data-theme="dark"] .library-comments-section {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.84)) !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
}
[data-theme="dark"] .library-comment-form {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.78), rgba(15, 23, 42, 0.6)) !important;
  border-color: rgba(96, 165, 250, 0.28) !important;
}
[data-theme="dark"] .library-comment-form-head strong { color: #f1f5f9 !important; }
[data-theme="dark"] .library-comment-form-head span { color: #94a3b8 !important; }
[data-theme="dark"] .library-comment-form-hint { color: #94a3b8 !important; }
[data-theme="dark"] .library-comment-textarea {
  background: #0b1220 !important;
  color: #e2e8f0 !important;
  border-color: rgba(148, 163, 184, 0.3) !important;
}
[data-theme="dark"] .library-comment-textarea:focus {
  border-color: #60a5fa !important;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22) !important;
}
[data-theme="dark"] .library-comment-item {
  background: rgba(15, 23, 42, 0.6) !important;
  border-color: rgba(148, 163, 184, 0.14) !important;
}
[data-theme="dark"] .library-comment-item:hover {
  background: rgba(30, 41, 59, 0.9) !important;
  border-color: rgba(96, 165, 250, 0.28) !important;
  box-shadow: 0 6px 16px rgba(2, 6, 23, 0.5) !important;
}
[data-theme="dark"] .library-comment-avatar { border-color: rgba(96, 165, 250, 0.4) !important; }
[data-theme="dark"] .library-comment-name { color: #f1f5f9 !important; }
[data-theme="dark"] .library-comment-date { color: #64748b !important; }
[data-theme="dark"] .library-comment-text { color: #cbd5e1 !important; }
[data-theme="dark"] .library-comment-delete-btn { color: #64748b !important; }
[data-theme="dark"] .library-comment-delete-btn:hover {
  color: #fb7185 !important;
  background: rgba(244, 63, 94, 0.15) !important;
}


[data-theme="dark"] .library-related-card {
  background: rgba(15, 23, 42, 0.94) !important;
  border-color: rgba(148, 163, 184, 0.2) !important;
  box-shadow: 0 6px 18px rgba(2, 6, 23, 0.55) !important;
}
[data-theme="dark"] .library-related-card:hover {
  border-color: rgba(96, 165, 250, 0.42) !important;
  box-shadow: 0 12px 28px rgba(2, 6, 23, 0.6), 0 0 0 2px rgba(96, 165, 250, 0.12) !important;
}
[data-theme="dark"] .library-related-cover { background: linear-gradient(135deg, #1e293b, #0f172a) !important; }
[data-theme="dark"] .library-related-cover-placeholder {
  background: linear-gradient(135deg, #4f46e5 0%, #6366f1 50%, #818cf8 100%) !important;
}
[data-theme="dark"] .library-related-title { color: #f1f5f9 !important; }
[data-theme="dark"] .library-related-author { color: #94a3b8 !important; }
[data-theme="dark"] .library-related-meta { border-top-color: rgba(148, 163, 184, 0.12) !important; }
[data-theme="dark"] .library-related-rating { color: #fbbf24 !important; }
[data-theme="dark"] .library-related-borrows { color: #94a3b8 !important; }
[data-theme="dark"] .library-related-badge { background: rgba(244, 63, 94, 0.94) !important; }


[data-theme="dark"] .library-empty,
[data-theme="dark"] .library-empty--inline {
  background: rgba(15, 23, 42, 0.78) !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
}
[data-theme="dark"] .library-empty h3,
[data-theme="dark"] .library-empty--inline h3 { color: #f1f5f9 !important; }
[data-theme="dark"] .library-empty--inline svg { color: #60a5fa !important; opacity: 0.6; }

[data-theme="dark"] .library-flash.success {
  background: rgba(16, 185, 129, 0.16) !important;
  border-color: rgba(16, 185, 129, 0.35) !important;
  color: #6ee7b7 !important;
}
[data-theme="dark"] .library-flash.error {
  background: rgba(244, 63, 94, 0.16) !important;
  border-color: rgba(248, 113, 113, 0.35) !important;
  color: #fda4af !important;
}


[data-theme="dark"] .borrow-status-badge.borrowed { background: rgba(59, 130, 246, 0.2); color: #93c5fd; }
[data-theme="dark"] .borrow-status-badge.returned { background: rgba(16, 185, 129, 0.2); color: #6ee7b7; }
[data-theme="dark"] .borrow-status-badge.overdue  { background: rgba(244, 63, 94, 0.2);  color: #fda4af; }



[data-theme="dark"] .library-bento-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 18px;
  background: radial-gradient(circle at 30% 0%, rgba(96, 165, 250, 0.18) 0%, transparent 55%);
  opacity: 0;
  transition: opacity 280ms ease;
  pointer-events: none;
  z-index: 0;
}
[data-theme="dark"] .library-bento-card:hover::before { opacity: 1; }
[data-theme="dark"] .library-bento-card > * { position: relative; z-index: 1; }



[data-theme="dark"] .hero-tod-pill,
[data-theme="dark"] .hero-date-pill,
[data-theme="dark"] .glance-card {
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  backdrop-filter: blur(8px) saturate(140%);
}
[data-theme="dark"] .bento-card {
  -webkit-backdrop-filter: blur(6px) saturate(160%);
  backdrop-filter: blur(6px) saturate(160%);
}





[data-theme="dark"] main.home-page .hero-premium {
  background:
    linear-gradient(135deg,
      rgba(15, 23, 42, 0.95) 0%,
      rgba(15, 23, 42, 0.88) 45%,
      rgba(30, 27, 75, 0.95) 100%),
    radial-gradient(800px 500px at 100% 0%, rgba(99, 102, 241, 0.16) 0%, transparent 60%),
    radial-gradient(700px 460px at 0% 100%, rgba(139, 92, 246, 0.10) 0%, transparent 60%) !important;
  border-color: rgba(99, 102, 241, 0.24) !important;
  box-shadow:
    0 1px 3px rgba(2, 6, 23, 0.4),
    0 14px 36px rgba(2, 6, 23, 0.55),
    inset 0 1px 0 rgba(148, 163, 184, 0.06) !important;
}

[data-theme="dark"] main.home-page .hero-shapes { opacity: 0.85; }
[data-theme="dark"] main.home-page .hero-shape { stroke: #93c5fd !important; opacity: 0.12; }
[data-theme="dark"] main.home-page .shape-atom   { stroke: #818cf8 !important; }
[data-theme="dark"] main.home-page .shape-pi     { stroke: #f472b6 !important; }
[data-theme="dark"] main.home-page .shape-book   { stroke: #6ee7b7 !important; }
[data-theme="dark"] main.home-page .shape-orbit  { stroke: #fbbf24 !important; }

[data-theme="dark"] main.home-page .hero-tod-pill,
[data-theme="dark"] main.home-page .hero-date-pill {
  background: rgba(15, 23, 42, 0.60) !important;
  border-color: rgba(148, 163, 184, 0.32) !important;
  color: #c7d2fe !important;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.4) !important;
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  backdrop-filter: blur(8px) saturate(140%);
}
[data-theme="dark"] main.home-page .hero-date-pill { color: #c7d2fe !important; }
[data-theme="dark"] main.home-page .hero-tod-pill.hero-tod-morning { color: #fbbf24 !important; border-color: rgba(245,158,11,0.40) !important; }
[data-theme="dark"] main.home-page .hero-tod-pill.hero-tod-noon    { color: #fb923c !important; border-color: rgba(249,115,22,0.40) !important; }
[data-theme="dark"] main.home-page .hero-tod-pill.hero-tod-evening { color: #d8b4fe !important; border-color: rgba(168,85,247,0.40) !important; }
[data-theme="dark"] main.home-page .hero-tod-pill.hero-tod-night   { color: #93c5fd !important; border-color: rgba(59,130,246,0.40) !important; }

[data-theme="dark"] main.home-page .hero-title-text { color: #f8fafc !important; }
[data-theme="dark"] main.home-page .hero-sparkle   { stroke: #fcd34d !important; fill: rgba(251, 191, 36, 0.24) !important; }
[data-theme="dark"] main.home-page .hero-sub       { color: #cbd5e1 !important; }

[data-theme="dark"] main.home-page .hero-cta {
  background: rgba(15, 23, 42, 0.85) !important;
  border-color: rgba(148, 163, 184, 0.32) !important;
  color: #e2e8f0 !important;
  box-shadow: 0 6px 14px rgba(2, 6, 23, 0.4) !important;
}
[data-theme="dark"] main.home-page .hero-cta--blue {
  background: linear-gradient(135deg, rgba(30, 58, 138, 0.65) 0%, rgba(15, 23, 42, 0.85) 100%) !important;
  color: #93c5fd !important;
  border-color: rgba(96, 165, 250, 0.45) !important;
}
[data-theme="dark"] main.home-page .hero-cta--indigo {
  background: linear-gradient(135deg, rgba(67, 56, 202, 0.65) 0%, rgba(15, 23, 42, 0.85) 100%) !important;
  color: #c4b5fd !important;
  border-color: rgba(139, 92, 246, 0.45) !important;
}
[data-theme="dark"] main.home-page .hero-cta--violet {
  background: linear-gradient(135deg, rgba(124, 58, 237, 0.55) 0%, rgba(15, 23, 42, 0.85) 100%) !important;
  color: #d8b4fe !important;
  border-color: rgba(168, 85, 247, 0.45) !important;
}
[data-theme="dark"] main.home-page .hero-cta:hover {
  box-shadow: 0 10px 22px rgba(2, 6, 23, 0.55), 0 0 0 1px rgba(148, 163, 184, 0.14) inset !important;
}
[data-theme="dark"] main.home-page .hero-cta--blue:hover   { background: linear-gradient(135deg, rgba(59, 130, 246, 0.55) 0%, rgba(15, 23, 42, 0.92) 100%) !important; }
[data-theme="dark"] main.home-page .hero-cta--indigo:hover { background: linear-gradient(135deg, rgba(99, 102, 241, 0.55) 0%, rgba(15, 23, 42, 0.92) 100%) !important; }
[data-theme="dark"] main.home-page .hero-cta--violet:hover { background: linear-gradient(135deg, rgba(168, 85, 247, 0.55) 0%, rgba(15, 23, 42, 0.92) 100%) !important; }


[data-theme="dark"] main.home-page .glance-card {
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.92) 0%, rgba(15, 23, 42, 0.96) 100%) !important;
  border-color: rgba(148, 163, 184, 0.26) !important;
  box-shadow: 0 6px 16px rgba(2, 6, 23, 0.4) !important;
  -webkit-backdrop-filter: blur(10px) saturate(150%);
  backdrop-filter: blur(10px) saturate(150%);
}
[data-theme="dark"] main.home-page .glance-card:hover {
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.96) 0%, rgba(15, 23, 42, 0.98) 100%) !important;
  border-color: rgba(129, 140, 248, 0.55) !important;
  box-shadow: 0 14px 26px rgba(2, 6, 23, 0.55), 0 0 0 3px rgba(99, 102, 241, 0.18) !important;
}
[data-theme="dark"] main.home-page .glance-card::before {
  background: linear-gradient(135deg, rgba(129, 140, 248, 0.5) 0%, rgba(99, 102, 241, 0) 50%, rgba(139, 92, 246, 0.4) 100%) !important;
}
[data-theme="dark"] main.home-page .glance-glow { background: radial-gradient(120% 80% at 0% 0%, rgba(99, 102, 241, 0.20) 0%, transparent 55%) !important; }
[data-theme="dark"] main.home-page .glance-icon {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.22) 0%, rgba(99, 102, 241, 0.06) 100%) !important;
  border-color: rgba(129, 140, 248, 0.40) !important;
}
[data-theme="dark"] main.home-page .glance-icon svg { stroke: #a5b4fc !important; }
[data-theme="dark"] main.home-page .glance-card--profile .glance-icon {
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.22) 0%, rgba(139, 92, 246, 0.06) 100%) !important;
  border-color: rgba(167, 139, 250, 0.40) !important;
}
[data-theme="dark"] main.home-page .glance-card--profile .glance-icon svg { stroke: #c4b5fd !important; }

[data-theme="dark"] main.home-page .glance-eye {
  background: rgba(30, 27, 75, 0.85) !important;
  color: #c7d2fe !important;
}
[data-theme="dark"] main.home-page .glance-card--profile .glance-eye {
  background: rgba(46, 16, 101, 0.85) !important;
  color: #d8b4fe !important;
}
[data-theme="dark"] main.home-page .glance-dot {
  background: #34d399 !important;
  box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.22) !important;
}
[data-theme="dark"] main.home-page .glance-stat-value { color: #f8fafc !important; }
[data-theme="dark"] main.home-page .glance-stat-label { color: #94a3b8 !important; }
[data-theme="dark"] main.home-page .glance-arrow {
  background: rgba(30, 27, 75, 0.85) !important;
  border-color: rgba(129, 140, 248, 0.40) !important;
  color: #c7d2fe !important;
}
[data-theme="dark"] main.home-page .glance-card--profile .glance-arrow {
  background: rgba(46, 16, 101, 0.85) !important;
  border-color: rgba(167, 139, 250, 0.40) !important;
  color: #d8b4fe !important;
}
[data-theme="dark"] main.home-page .glance-card:hover .glance-arrow { background: #6366f1 !important; color: #fff !important; }
[data-theme="dark"] main.home-page .glance-card--profile:hover .glance-arrow { background: #8b5cf6 !important; color: #fff !important; }


[data-theme="dark"] main.home-page .stat-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94) 0%, rgba(15, 23, 42, 0.88) 100%) !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  box-shadow: 0 8px 20px rgba(2, 6, 23, 0.4) !important;
}
[data-theme="dark"] main.home-page .stat-card:hover {
  border-color: var(--stat-accent) !important;
  box-shadow: 0 12px 24px rgba(2, 6, 23, 0.5) !important;
}
[data-theme="dark"] main.home-page .stat-icon {
  background: color-mix(in oklab, var(--stat-accent) 22%, #0f172a) !important;
  border-color: color-mix(in oklab, var(--stat-accent) 32%, #1e293b) !important;
}
[data-theme="dark"] main.home-page .stat-icon svg { stroke: var(--stat-accent) !important; }
[data-theme="dark"] main.home-page .stat-value { color: #f8fafc !important; }
[data-theme="dark"] main.home-page .stat-label { color: #94a3b8 !important; }
[data-theme="dark"] main.home-page .stat-trend.trend-up {
  background: rgba(6, 78, 59, 0.50) !important;
  color: #6ee7b7 !important;
  border-color: rgba(16, 185, 129, 0.40) !important;
}
[data-theme="dark"] main.home-page .stat-spark { stroke: var(--stat-accent) !important; opacity: 0.95; }
[data-theme="dark"] main.home-page .stat-foot  { color: var(--stat-accent) !important; border-top-color: rgba(148, 163, 184, 0.22) !important; }
[data-theme="dark"] main.home-page .stat-card .stat-blue   { --stat-halo: rgba(59, 130, 246, 0.18); }
[data-theme="dark"] main.home-page .stat-card .stat-green  { --stat-halo: rgba(16, 185, 129, 0.18); }
[data-theme="dark"] main.home-page .stat-card .stat-purple { --stat-halo: rgba(139, 92, 246, 0.18); }
[data-theme="dark"] main.home-page .stat-card .stat-amber  { --stat-halo: rgba(245, 158, 11, 0.18); }


[data-theme="dark"] main.home-page .news-premium {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94) 0%, rgba(15, 23, 42, 0.88) 100%) !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.4) !important;
}
[data-theme="dark"] main.home-page .news-card {
  background: rgba(15, 23, 42, 0.92) !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  box-shadow: 0 6px 14px rgba(2, 6, 23, 0.4) !important;
}
[data-theme="dark"] main.home-page .news-card:hover {
  border-color: rgba(99, 102, 241, 0.50) !important;
  box-shadow: 0 14px 26px rgba(2, 6, 23, 0.5) !important;
}
[data-theme="dark"] main.home-page .news-cover-icon {
  stroke: rgba(255, 255, 255, 0.95) !important;
  fill: rgba(255, 255, 255, 0.12) !important;
}
[data-theme="dark"] main.home-page .news-cover-tag {
  background: rgba(15, 23, 42, 0.88) !important;
  color: #e2e8f0 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
}
[data-theme="dark"] main.home-page .news-meta  { color: #94a3b8 !important; }
[data-theme="dark"] main.home-page .news-title { color: #f8fafc !important; }
[data-theme="dark"] main.home-page .news-cta   { color: #c7d2fe !important; }
[data-theme="dark"] main.home-page .section-heading h2 { color: #f8fafc !important; }
[data-theme="dark"] main.home-page .section-heading p { color: #94a3b8 !important; }
[data-theme="dark"] main.home-page .section-link {
  background: rgba(30, 27, 75, 0.85) !important;
  border-color: rgba(99, 102, 241, 0.40) !important;
  color: #c7d2fe !important;
}
[data-theme="dark"] main.home-page .section-link:hover {
  background: #6366f1 !important;
  color: #fff !important;
}
[data-theme="dark"] main.home-page .empty-state {
  background: rgba(15, 23, 42, 0.85) !important;
  border-color: rgba(148, 163, 184, 0.30) !important;
  color: #cbd5e1 !important;
}


[data-theme="dark"] main.home-page .bento-layout {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94) 0%, rgba(15, 23, 42, 0.86) 100%) !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.4) !important;
}
[data-theme="dark"] main.home-page .bento-card {
  background: linear-gradient(160deg, rgba(30, 41, 59, 0.88) 0%, rgba(15, 23, 42, 0.95) 100%) !important;
  border-color: rgba(148, 163, 184, 0.26) !important;
  box-shadow: 0 6px 14px rgba(2, 6, 23, 0.4) !important;
}
[data-theme="dark"] main.home-page .bento-card:hover {
  border-color: rgba(99, 102, 241, 0.50) !important;
  box-shadow: 0 14px 26px rgba(2, 6, 23, 0.5) !important;
}
[data-theme="dark"] main.home-page .bento-glow {
  background: radial-gradient(120% 80% at 0% 0%, rgba(99, 102, 241, 0.16) 0%, transparent 55%) !important;
}
[data-theme="dark"] main.home-page .bento-icon-wrap {
  background: rgba(99, 102, 241, 0.18) !important;
  border-color: rgba(99, 102, 241, 0.34) !important;
}
[data-theme="dark"] main.home-page .bento-icon-wrap svg { stroke: #c7d2fe !important; }
[data-theme="dark"] main.home-page .bento-feature.bento-blue .bento-icon-wrap {
  background: rgba(59, 130, 246, 0.22) !important;
  border-color: rgba(96, 165, 250, 0.40) !important;
}
[data-theme="dark"] main.home-page .bento-feature.bento-blue .bento-icon-wrap svg { stroke: #93c5fd !important; }
[data-theme="dark"] main.home-page .bento-kicker { color: #c7d2fe !important; }
[data-theme="dark"] main.home-page .bento-feature.bento-blue .bento-kicker { color: #93c5fd !important; }
[data-theme="dark"] main.home-page .bento-text h3 { color: #f8fafc !important; }
[data-theme="dark"] main.home-page .bento-text p { color: #94a3b8 !important; }
[data-theme="dark"] main.home-page .bento-arrow {
  background: rgba(30, 27, 75, 0.85) !important;
  border-color: rgba(99, 102, 241, 0.42) !important;
  color: #c7d2fe !important;
}
[data-theme="dark"] main.home-page .bento-card:hover .bento-arrow {
  background: #6366f1 !important;
  color: #fff !important;
}

[data-theme="dark"] main.home-page .bento-pill-icon {
  background: rgba(30, 41, 59, 0.85) !important;
  border-color: rgba(148, 163, 184, 0.28) !important;
}
[data-theme="dark"] main.home-page .bento-pill-icon svg { stroke: #cbd5e1 !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-rose   .bento-pill-icon { background: rgba(127, 29, 29, 0.50) !important; border-color: rgba(244,63,94,0.40) !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-rose   .bento-pill-icon svg { stroke: #fda4af !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-amber  .bento-pill-icon { background: rgba(120, 53, 15, 0.50) !important; border-color: rgba(245,158,11,0.40) !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-amber  .bento-pill-icon svg { stroke: #fcd34d !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-purple .bento-pill-icon { background: rgba(76, 29, 149, 0.50) !important; border-color: rgba(139,92,246,0.40) !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-purple .bento-pill-icon svg { stroke: #d8b4fe !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-red    .bento-pill-icon { background: rgba(127, 29, 29, 0.50) !important; border-color: rgba(239,68,68,0.40) !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-red    .bento-pill-icon svg { stroke: #fca5a5 !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-rose   { border-inline-start-color: #be123c !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-amber  { border-inline-start-color: #b45309 !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-purple { border-inline-start-color: #7c3aed !important; }
[data-theme="dark"] main.home-page .bento-pill.bento-red    { border-inline-start-color: #b91c1c !important; }
[data-theme="dark"] main.home-page .bento-pill-text h3 { color: #f8fafc !important; }
[data-theme="dark"] main.home-page .bento-pill-text p { color: #94a3b8 !important; }

[data-theme="dark"] main.home-page .bento-book-spine {
  background: linear-gradient(180deg, #6366f1, #312e81) !important;
}
[data-theme="dark"] main.home-page .bento-book-face {
  background: linear-gradient(135deg, #1e1b4b, #312e81) !important;
  border-color: rgba(99, 102, 241, 0.55) !important;
  box-shadow: 0 6px 14px rgba(2, 6, 23, 0.5) !important;
}
[data-theme=\"dark\"] main.home-page .bento-book-face svg { stroke: #c7d2fe !important; }

/* ── prefers-reduced-motion safety net ──────────────────────────────── */
[data-theme=\"dark\"] main.home-page .hero-shape,
[data-theme=\"dark\"] main.home-page .hero-sparkle,
[data-theme=\"dark\"] main.home-page .glance-dot {
  animation-duration: inherit;
}
@media (prefers-reduced-motion: reduce) {
  [data-theme=\"dark\"] main.home-page .hero-shape,
  [data-theme=\"dark\"] main.home-page .hero-sparkle,
  [data-theme=\"dark\"] main.home-page .glance-dot { animation: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  [data-theme="dark"] .library-timeline-item--overdue .library-timeline-dot {
    animation: none;
  }
}


/* === HERO GLASSMORPHISM ALPHA POLISH (saturate visibility) === */
[data-theme="dark"] main.home-page .glance-card {
  background: rgba(15, 23, 42, 0.55) !important;
  border-color: rgba(148, 163, 184, 0.32) !important;
  box-shadow: 0 6px 18px rgba(2, 6, 23, 0.45), 0 0 0 1px rgba(96, 165, 250, 0.12) inset !important;
}
[data-theme="dark"] main.home-page .bento-card {
  background: rgba(15, 23, 42, 0.55) !important;
  border-color: rgba(148, 163, 184, 0.28) !important;
  box-shadow: 0 12px 28px rgba(2, 6, 23, 0.45), 0 0 0 1px rgba(96, 165, 250, 0.10) inset !important;
}
[data-theme="dark"] main.home-page .hero-tod-pill,
[data-theme="dark"] main.home-page .hero-date-pill {
  background: rgba(15, 23, 42, 0.60) !important;
  border-color: rgba(148, 163, 184, 0.36) !important;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.35) !important;
}


/* ═══════════════════════════════════════════════════════════════
   PREMIUM NEWS PAGE — DARK MODE
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .news-premium-page {
  color: #e2e8f0;
}
[data-theme="dark"] .page-title,
[data-theme="dark"] .hero-body h2,
[data-theme="dark"] .sub-body h3,
[data-theme="dark"] .bento-title,
[data-theme="dark"] .news-empty-state h2 {
  color: #f8fafc;
}
[data-theme="dark"] .news-kicker,
[data-theme="dark"] .hero-kicker { color: #93c5fd; }
[data-theme="dark"] .hero-excerpt,
[data-theme="dark"] .bento-excerpt,
[data-theme="dark"] .news-empty-state p { color: #cbd5e1; }
[data-theme="dark"] .hero-meta,
[data-theme="dark"] .sub-meta,
[data-theme="dark"] .bento-meta,
[data-theme="dark"] .read-term { color: #94a3b8; }
[data-theme="dark"] .author-name { color: #cbd5e1; }

[data-theme="dark"] .glass-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.78) 0%, rgba(15, 23, 42, 0.6) 100%);
  border-color: rgba(96, 165, 250, 0.22);
  box-shadow: 0 10px 28px rgba(2, 6, 23, 0.5);
}
[data-theme="dark"] .glass-card:hover {
  border-color: rgba(96, 165, 250, 0.42);
  box-shadow: 0 16px 40px rgba(2, 6, 23, 0.6);
}
[data-theme="dark"] .glass-card::before {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.42) 0%, rgba(96, 165, 250, 0) 50%, rgba(96, 165, 250, 0.3) 100%);
}
[data-theme="dark"] .glass-bar {
  background: rgba(15, 23, 42, 0.78);
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 6px 20px rgba(2, 6, 23, 0.5);
}
[data-theme="dark"] .bento-compact {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.78), rgba(15, 23, 42, 0.92));
}

[data-theme="dark"] .hero-media,
[data-theme="dark"] .sub-media,
[data-theme="dark"] .bento-media {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] .hero-read-btn { background: rgba(96, 165, 250, 0.14); color: #93c5fd; }
[data-theme="dark"] .hero-main-card:hover .hero-read-btn { background: rgba(96, 165, 250, 0.22); }

[data-theme="dark"] .overlay-chip {
  background: rgba(15, 23, 42, 0.92);
  color: #93c5fd;
  border-color: rgba(96, 165, 250, 0.3);
}
[data-theme="dark"] .overlay-date {
  background: rgba(15, 23, 42, 0.92);
  color: #e2e8f0;
  box-shadow: 0 4px 10px rgba(2, 6, 23, 0.4);
}
[data-theme="dark"] .play-overlay {
  background: rgba(15, 23, 42, 0.75);
  border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .filter-chip { color: #cbd5e1; }
[data-theme="dark"] .filter-chip:hover { background: rgba(96, 165, 250, 0.14); color: #93c5fd; }
[data-theme="dark"] .filter-chip.is-active { background: rgba(96, 165, 250, 0.2); color: #93c5fd; border-color: rgba(96, 165, 250, 0.32); }
[data-theme="dark"] .filter-chip:focus-visible { outline-color: #60a5fa; }
[data-theme="dark"] .filter-chip[disabled] {
  opacity: 0.4;
  background: transparent;
  color: #64748b;
  border-color: transparent;
}
[data-theme="dark"] .filter-chip.is-static {
  background: rgba(96, 165, 250, 0.2);
  color: #93c5fd;
  border-color: rgba(96, 165, 250, 0.32);
  box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.08) inset;
}
[data-theme="dark"] .filter-soon-badge {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.14) 0%, rgba(168, 85, 247, 0.1) 100%);
  border-color: rgba(96, 165, 250, 0.28);
  color: #93c5fd;
  box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.08) inset;
}
[data-theme="dark"] .filter-soon-badge svg { color: #fbbf24; }

[data-theme="dark"] .count-chip {
  background: rgba(30, 41, 59, 0.82);
  border-color: rgba(148, 163, 184, 0.28);
  color: #cbd5e1;
}
[data-theme="dark"] .search-input {
  background: #0b1220;
  border-color: rgba(148, 163, 184, 0.32);
  color: #e2e8f0;
}
[data-theme="dark"] .search-input:focus { background: #0f172a; border-color: #60a5fa; }
[data-theme="dark"] .search-wrap svg { color: #64748b; }

[data-theme="dark"] .read-arrow {
  background: rgba(96, 165, 250, 0.15);
  color: #60a5fa;
}
[data-theme="dark"] .bento-card:hover .read-arrow { background: #3b82f6; color: #fff; }

[data-theme="dark"] .page-nav,
[data-theme="dark"] .page-num {
  background: rgba(30, 41, 59, 0.82);
  border-color: rgba(148, 163, 184, 0.28);
  color: #cbd5e1;
}
[data-theme="dark"] .page-num.is-active,
[data-theme="dark"] .page-num:hover,
[data-theme="dark"] .page-nav:not(.is-disabled):hover {
  background: #3b82f6;
  border-color: #3b82f6;
  color: #fff;
}
[data-theme="dark"] .premium-pagination { color: #cbd5e1; }

[data-theme="dark"] .news-empty-state {
  background: rgba(15, 23, 42, 0.78);
  border-color: rgba(148, 163, 184, 0.28);
}
[data-theme="dark"] .empty-icon {
  background: linear-gradient(135deg, rgba(30, 64, 175, 0.32) 0%, rgba(59, 130, 246, 0.22) 100%);
  color: #93c5fd;
  border-color: rgba(96, 165, 250, 0.3);
  box-shadow: 0 12px 24px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] .bento-link:focus-visible { outline-color: #60a5fa; }
[data-theme="dark"] .ripple { background: rgba(96, 165, 250, 0.3); }


/* ── Premium News: Page Lead-In (Dark) ── */
[data-theme="dark"] .page-lead-in {
  background: linear-gradient(135deg, rgba(30, 64, 175, 0.18) 0%, rgba(91, 33, 182, 0.12) 100%);
  border-color: rgba(96, 165, 250, 0.32);
  box-shadow: 0 6px 18px rgba(2, 6, 23, 0.4);
}
[data-theme="dark"] .page-lead-in:hover {
  border-color: rgba(96, 165, 250, 0.45);
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.5);
}
[data-theme="dark"] .lead-in-icon {
  background: linear-gradient(135deg, rgba(30, 64, 175, 0.4) 0%, rgba(67, 56, 202, 0.3) 100%);
  color: #93c5fd;
  border-color: rgba(96, 165, 250, 0.3);
  box-shadow: 0 6px 14px rgba(2, 6, 23, 0.5);
}
[data-theme="dark"] .lead-in-title { color: #f8fafc; }
[data-theme="dark"] .lead-in-sub { color: #94a3b8; }

/* ── Premium News: Bento Variant Accents (Dark) ── */
[data-theme="dark"] .glass-card.bento-wide {
  --accent-c: rgba(34, 211, 238, 0.32);
  --accent-c-end: rgba(34, 211, 238, 0.22);
  --accent-border: rgba(34, 211, 238, 0.45);
  --accent-shadow: rgba(34, 211, 238, 0.18);
}
[data-theme="dark"] .glass-card.bento-compact {
  --accent-c: rgba(16, 185, 129, 0.32);
  --accent-c-end: rgba(16, 185, 129, 0.22);
  --accent-border: rgba(16, 185, 129, 0.45);
  --accent-shadow: rgba(16, 185, 129, 0.18);
}
[data-theme="dark"] .glass-card:hover {
  box-shadow:
    0 18px 42px rgba(2, 6, 23, 0.6),
    0 4px 14px var(--accent-shadow);
}

/* ── Premium News: Filter chip dark adjustments ── */
[data-theme="dark"] .filter-chip:not(.is-static):not([disabled]):hover {
  background: rgba(96, 165, 250, 0.16);
  color: #bfdbfe;
}
[data-theme="dark"] .filter-chip[disabled] {
  background: rgba(30, 41, 59, 0.5);
  color: #64748b;
}
[data-theme="dark"] .filter-chip.is-active {
  background: linear-gradient(135deg, rgba(67, 56, 202, 0.4) 0%, rgba(79, 70, 229, 0.3) 100%);
  color: #c7d2fe;
  border-color: rgba(129, 140, 248, 0.5);
}
[data-theme="dark"] .filter-soon-badge {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.18) 0%, rgba(168, 85, 247, 0.14) 100%);
  border-color: rgba(99, 102, 241, 0.35);
  color: #c7d2fe;
}

/* ── Premium News: Read arrow dark hover ── */
[data-theme="dark"] .bento-card:hover .read-arrow {
  background: linear-gradient(135deg, #6366f1 0%, #818cf8 100%);
  color: #fff;
  box-shadow: 0 6px 14px rgba(99, 102, 241, 0.45);
}

/* ── Premium News: Hero read button dark hover ── */
[data-theme="dark"] .hero-main-card:hover .hero-read-btn {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.18) 0%, rgba(96, 165, 250, 0.08) 100%);
  color: #bfdbfe;
  box-shadow: 0 4px 12px rgba(96, 165, 250, 0.18);
}

/* ═══════════════════════════════════════════════════════════════════
   Editorial News (news.php redesign) — Dark Mode
   ═══════════════════════════════════════════════════════════════════ */

[data-theme="dark"] {
  --ed-primary: #818cf8;
  --ed-primary-2: #a78bfa;
  --ed-primary-soft: rgba(129, 140, 248, 0.14);
  --ed-primary-border: rgba(129, 140, 248, 0.3);
  --ed-accent: #fb7185;
  --ed-accent-2: #f43f5e;
  --ed-accent-soft: rgba(251, 113, 133, 0.14);
  --ed-bg: #0b1220;
  --ed-surface: rgba(15, 23, 42, 0.88);
  --ed-surface-2: rgba(30, 41, 59, 0.7);
  --ed-surface-3: rgba(15, 23, 42, 0.6);
  --ed-ink: #f1f5f9;
  --ed-ink-2: #e2e8f0;
  --ed-ink-soft: #94a3b8;
  --ed-ink-mute: #64748b;
  --ed-ink-faint: #475569;
  --ed-border: rgba(148, 163, 184, 0.22);
  --ed-border-2: rgba(148, 163, 184, 0.34);
  --ed-divider: rgba(148, 163, 184, 0.14);
  --ed-shadow-sm: 0 1px 2px rgba(2, 6, 23, 0.3);
  --ed-shadow: 0 4px 14px rgba(2, 6, 23, 0.4);
  --ed-shadow-lg: 0 14px 32px rgba(2, 6, 23, 0.5);
  --ed-shadow-xl: 0 24px 48px rgba(2, 6, 23, 0.6);
  --ed-glow-primary: 0 14px 36px rgba(129, 140, 248, 0.28);
  --ed-glow-accent: 0 14px 36px rgba(251, 113, 133, 0.22);
}

[data-theme="dark"] .page-editorial {
  background: transparent;
}

[data-theme="dark"] .ed-masthead {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.88));
  box-shadow: 0 14px 36px rgba(2, 6, 23, 0.5);
}
[data-theme="dark"] .ed-masthead::before {
  background:
    radial-gradient(circle at 18% 0%, rgba(129, 140, 248, 0.10), transparent 55%),
    radial-gradient(circle at 88% 100%, rgba(251, 113, 133, 0.08), transparent 55%);
}

/* Decorative rule colors in dark mode: use light hairline for visibility
   (both -webkit-mask AND standard mask for cross-browser, the mask uses
   background-color: #cbd5e1 as the fill so dark mode shows light hairlines) */
[data-theme="dark"] .ed-masthead-rule--top,
[data-theme="dark"] .ed-masthead-rule--mid,
[data-theme="dark"] .ed-masthead-rule--btm {
  background-image: none;
  background-color: #cbd5e1;
  -webkit-mask:
    linear-gradient(180deg, transparent 0, transparent 2px,
                    #000 2px, #000 3px,
                    transparent 3px, transparent 4px,
                    #000 4px, #000 5px);
  -webkit-mask-size: 100% 5px;
  -webkit-mask-repeat: no-repeat;
          mask:
    linear-gradient(180deg, transparent 0, transparent 2px,
                    #000 2px, #000 3px,
                    transparent 3px, transparent 4px,
                    #000 4px, #000 5px);
          mask-size: 100% 5px;
          mask-repeat: no-repeat;
}
[data-theme="dark"] .ed-masthead-rule--mid {
  -webkit-mask-size: 100% 4px;
          mask-size: 100% 4px;
}

/* Top metadata row */
[data-theme="dark"] .masthead-meta-left,
[data-theme="dark"] .masthead-meta-item {
  color: #cbd5e1;
}
[data-theme="dark"] .masthead-meta-item svg { color: #93c5fd; }
[data-theme="dark"] .masthead-meta-sep { background: #475569; }

/* Admin action buttons */
[data-theme="dark"] .m-action {
  background: rgba(15, 23, 42, 0.7);
  border-color: rgba(148, 163, 184, 0.22);
  color: #e2e8f0;
}
[data-theme="dark"] .m-action:hover {
  background: rgba(96, 165, 250, 0.12);
  border-color: rgba(96, 165, 250, 0.4);
  color: #93c5fd;
}
[data-theme="dark"] .m-action--primary {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  border-color: transparent;
  color: #fff;
}
[data-theme="dark"] .m-action--primary:hover {
  background: linear-gradient(135deg, #818cf8, #a78bfa);
  color: #fff;
}

/* Kicker + ornaments + title + subtitle in dark */
[data-theme="dark"] .masthead-kicker {
  color: #fb7185;
}
[data-theme="dark"] .kicker-ornament {
  color: #fb7185;
  opacity: 0.7;
}
[data-theme="dark"] .masthead-title {
  color: #f8fafc;
}
[data-theme="dark"] .masthead-sub {
  color: #94a3b8;
}


[data-theme="dark"] .ed-masthead::before {
  background:
    radial-gradient(circle at 20% 0%, rgba(129, 140, 248, 0.1), transparent 50%),
    radial-gradient(circle at 90% 100%, rgba(251, 113, 133, 0.08), transparent 50%);
}
[data-theme="dark"] .ed-masthead::after {
  background: linear-gradient(90deg, #818cf8, #a78bfa 50%, #fb7185);
}




[data-theme="dark"] .m-action {
  background: rgba(15, 23, 42, 0.7);
  border-color: rgba(148, 163, 184, 0.22);
  color: #e2e8f0;
}
[data-theme="dark"] .m-action:hover {
  background: rgba(96, 165, 250, 0.12);
  border-color: rgba(96, 165, 250, 0.4);
  color: #93c5fd;
}
[data-theme="dark"] .m-action--primary {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  border-color: transparent;
  color: #fff;
}
[data-theme="dark"] .m-action--primary:hover {
  background: linear-gradient(135deg, #818cf8, #a78bfa);
  color: #fff;
}

[data-theme="dark"] .masthead-kicker {
  color: #fb7185;
  background: rgba(251, 113, 133, 0.14);
}



[data-theme="dark"] .masthead-sub { color: #94a3b8; }

[data-theme="dark"] .breaking-ticker {
  background: linear-gradient(135deg, #020617 0%, #1e1b4b 100%);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 8px 24px rgba(2, 6, 23, 0.6);
}
[data-theme="dark"] .ticker-time { color: #fcd34d; }
[data-theme="dark"] .ticker-item a { color: #cbd5e1; }
[data-theme="dark"] .ticker-item a:hover { color: #fff; }
[data-theme="dark"] .ticker-ctrl {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.7);
}
[data-theme="dark"] .ticker-ctrl:hover {
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.28);
}

[data-theme="dark"] .ed-card {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.86));
  border-color: rgba(148, 163, 184, 0.2);
  box-shadow: 0 4px 14px rgba(2, 6, 23, 0.4);
}
[data-theme="dark"] .ed-card:hover {
  border-color: rgba(129, 140, 248, 0.4);
  box-shadow: 0 18px 40px rgba(2, 6, 23, 0.6), 0 0 0 1px rgba(129, 140, 248, 0.2);
}
[data-theme="dark"] .ed-card-media {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
}
[data-theme="dark"] .featured-scrim {
  background: linear-gradient(135deg, transparent 50%, rgba(2, 6, 23, 0.4) 100%);
}
[data-theme="dark"] .stamp-featured {
  background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%);
  box-shadow: 0 6px 16px rgba(217, 119, 6, 0.4);
}
[data-theme="dark"] .save-bookmark {
  background: rgba(15, 23, 42, 0.85);
  border-color: rgba(255, 255, 255, 0.1);
  color: #cbd5e1;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}
[data-theme="dark"] .save-bookmark:hover {
  background: rgba(30, 41, 59, 0.95);
  color: #fb7185;
}
[data-theme="dark"] .save-bookmark.is-saved {
  background: linear-gradient(135deg, #fb7185, #f43f5e);
  color: #fff;
  border-color: #fb7185;
}
[data-theme="dark"] .card-tag {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  box-shadow: 0 4px 10px rgba(99, 102, 241, 0.4);
}

[data-theme="dark"] .card-kicker {
  color: #93c5fd;
  background: rgba(129, 140, 248, 0.14);
}
[data-theme="dark"] .card-title { color: #f1f5f9; }
[data-theme="dark"] .card-title--quote { color: #e2e8f0; }
[data-theme="dark"] .card-excerpt { color: #94a3b8; }
[data-theme="dark"] .byline-name { color: #e2e8f0; }
[data-theme="dark"] .byline-sep { color: #475569; }
[data-theme="dark"] .byline-date { color: #94a3b8; }
[data-theme="dark"] .card-stats {
  border-top-color: rgba(148, 163, 184, 0.14);
  color: #94a3b8;
}
[data-theme="dark"] .stat svg { color: #64748b; }
[data-theme="dark"] .avatar {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.9);
}

[data-theme="dark"] .ed-sidebar {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.86));
  border-color: rgba(148, 163, 184, 0.2);
  box-shadow: 0 4px 14px rgba(2, 6, 23, 0.4);
}
[data-theme="dark"] .sidebar-title { color: #f1f5f9; }
[data-theme="dark"] .sidebar-rule {
  background: linear-gradient(90deg, #818cf8, transparent);
}
[data-theme="dark"] .sidebar-item { border-bottom-color: rgba(148, 163, 184, 0.12); }
[data-theme="dark"] .sidebar-link:hover .sidebar-title-sm { color: #93c5fd; }
[data-theme="dark"] .sidebar-title-sm { color: #e2e8f0; }
[data-theme="dark"] .sidebar-rank {
  background: rgba(30, 41, 59, 0.7);
  color: #93c5fd;
}
[data-theme="dark"] .sidebar-item:nth-child(1) .sidebar-rank { color: #fff; }
[data-theme="dark"] .sidebar-item:nth-child(2) .sidebar-rank { color: #fff; }
[data-theme="dark"] .sidebar-item:nth-child(3) .sidebar-rank { color: #fff; }
[data-theme="dark"] .sidebar-meta { color: #94a3b8; }
[data-theme="dark"] .dot { color: #475569; }

[data-theme="dark"] .ed-section-break { color: #f1f5f9; }
[data-theme="dark"] .break-title { color: #f1f5f9; }
[data-theme="dark"] .break-icon {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  box-shadow: 0 6px 16px rgba(99, 102, 241, 0.4);
}
[data-theme="dark"] .break-rule {
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.2), transparent);
}
[data-theme="dark"] .break-sub {
  background: rgba(30, 41, 59, 0.7);
  color: #94a3b8;
}

[data-theme="dark"] .ed-card--quote {
  background: linear-gradient(160deg, rgba(99, 102, 241, 0.14) 0%, rgba(15, 23, 42, 0.92) 60%);
  border-color: rgba(129, 140, 248, 0.28);
}
[data-theme="dark"] .quote-mark { color: #818cf8; opacity: 0.28; }
[data-theme="dark"] .quote-text { color: #e2e8f0; }
[data-theme="dark"] .break-sub {
  background: rgba(30, 41, 59, 0.7);
  border-color: rgba(148, 163, 184, 0.18);
  color: #cbd5e1;
}
[data-theme="dark"] .ed-card--featured {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.95), rgba(15, 23, 42, 0.95));
  border-color: rgba(148, 163, 184, 0.18);
}
[data-theme="dark"] .featured-scrim {
  background: linear-gradient(180deg,
    rgba(15, 23, 42, 0.20) 0%,
    rgba(15, 23, 42, 0.30) 30%,
    rgba(15, 23, 42, 0.70) 65%,
    rgba(2, 6, 23, 0.96) 100%);
}
[data-theme="dark"] .ed-card--featured .avatar {
  background: linear-gradient(135deg, #fbcfe8, #f472b6);
  color: #831843;
}

[data-theme="dark"] .ed-empty {
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.86));
  border-color: rgba(148, 163, 184, 0.2);
  box-shadow: 0 4px 14px rgba(2, 6, 23, 0.4);
}
[data-theme="dark"] .ed-empty h2 { color: #f1f5f9; }
[data-theme="dark"] .ed-empty p { color: #94a3b8; }
[data-theme="dark"] .ed-empty-cta {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  box-shadow: 0 6px 16px rgba(99, 102, 241, 0.4);
}
[data-theme="dark"] .ed-empty-cta:hover {
  background: linear-gradient(135deg, #818cf8, #a78bfa);
  box-shadow: 0 10px 22px rgba(99, 102, 241, 0.5);
}

[data-theme="dark"] .ed-pagination .pg-step,
[data-theme="dark"] .ed-pagination .pg-num {
  background: rgba(15, 23, 42, 0.88);
  border-color: rgba(148, 163, 184, 0.22);
  color: #cbd5e1;
}
[data-theme="dark"] .ed-pagination .pg-step svg { color: #94a3b8; }
[data-theme="dark"] .ed-pagination .pg-step:hover:not(.is-disabled),
[data-theme="dark"] .ed-pagination .pg-num:hover {
  background: rgba(96, 165, 250, 0.12);
  border-color: rgba(96, 165, 250, 0.4);
  color: #93c5fd;
  box-shadow: 0 6px 16px rgba(2, 6, 23, 0.4);
}
[data-theme="dark"] .ed-pagination .pg-step:hover:not(.is-disabled) svg { color: #93c5fd; }
[data-theme="dark"] .ed-pagination .pg-num.is-active {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 6px 16px rgba(99, 102, 241, 0.4);
}









[data-theme="dark"] .reading-progress-bar {
  background: linear-gradient(90deg, #818cf8 0%, #a78bfa 50%, #fb7185 100%);
  box-shadow: 0 2px 8px rgba(129, 140, 248, 0.5);
}

/* ═══════════════════════════════════════════════
   News Listing v2 — Dark Mode Overrides
   ═══════════════════════════════════════════════ */

[data-theme="dark"] main.news-page .news-page-toolbar {
  background: rgba(15, 23, 42, 0.82);
  border-color: rgba(148, 163, 184, 0.26);
  box-shadow: 0 6px 18px rgba(2, 6, 23, 0.4);
}

[data-theme="dark"] main.news-page .news-page-toolbar-pill {
  background: rgba(30, 41, 59, 0.7);
  border-color: rgba(148, 163, 184, 0.26);
  color: #cbd5e1;
}

[data-theme="dark"] main.news-page .news-page-toolbar-pill-primary {
  background: rgba(30, 64, 175, 0.28);
  border-color: rgba(96, 165, 250, 0.36);
  color: #bfdbfe;
}

[data-theme="dark"] main.news-page .news-page-card {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(15, 23, 42, 0.84));
  border-color: rgba(148, 163, 184, 0.26);
  box-shadow:
    0 1px 2px rgba(2, 6, 23, 0.4),
    0 8px 20px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] main.news-page .news-page-card:hover {
  border-color: var(--news-page-card-accent);
  box-shadow:
    0 14px 32px rgba(37, 99, 235, 0.22),
    0 22px 48px rgba(2, 6, 23, 0.6);
}

[data-theme="dark"] main.news-page .news-page-card:focus-within {
  border-color: #93c5fd;
  box-shadow:
    0 0 0 3px rgba(96, 165, 250, 0.22),
    0 14px 32px rgba(2, 6, 23, 0.6);
}

[data-theme="dark"] main.news-page .news-page-card-media {
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.9), rgba(15, 23, 42, 0.9));
}

[data-theme="dark"] main.news-page .news-page-card-media-placeholder {
  background:
    linear-gradient(135deg, rgba(30, 41, 59, 0.95) 0%, rgba(15, 23, 42, 0.92) 100%),
    repeating-linear-gradient(135deg, rgba(148, 163, 184, 0.06) 0 6px, transparent 6px 14px);
  color: rgba(148, 163, 184, 0.78);
}

[data-theme="dark"] main.news-page .news-page-card-media-overlay {
  background: linear-gradient(180deg, rgba(2, 6, 23, 0) 0%, rgba(2, 6, 23, 0) 50%, rgba(2, 6, 23, 0.55) 100%);
}

[data-theme="dark"] main.news-page .news-page-card-title {
  color: #f8fafc;
}

[data-theme="dark"] main.news-page .news-page-card:hover .news-page-card-title {
  color: #93c5fd;
}

[data-theme="dark"] main.news-page .news-page-card-meta-item,
[data-theme="dark"] main.news-page .news-page-card-meta {
  color: #94a3b8;
}

[data-theme="dark"] main.news-page .news-page-card-meta-divider {
  background: rgba(148, 163, 184, 0.5);
}

[data-theme="dark"] main.news-page .news-page-card-excerpt {
  color: #cbd5e1;
}

[data-theme="dark"] main.news-page .news-page-card-cta {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.16), rgba(99, 102, 241, 0.08));
  border-color: rgba(96, 165, 250, 0.36);
  color: #bfdbfe;
}

[data-theme="dark"] main.news-page .news-page-card:hover .news-page-card-cta {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.28), rgba(99, 102, 241, 0.16));
  border-color: rgba(96, 165, 250, 0.5);
  box-shadow: 0 8px 22px rgba(96, 165, 250, 0.22);
}

[data-theme="dark"] main.news-page .news-page-empty {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.92), rgba(15, 23, 42, 0.82));
  border-color: rgba(148, 163, 184, 0.34);
  color: #cbd5e1;
  box-shadow: 0 14px 30px rgba(2, 6, 23, 0.4);
}

[data-theme="dark"] main.news-page .news-page-empty-icon svg {
  stroke: rgba(148, 163, 184, 0.6);
}

[data-theme="dark"] main.news-page .news-page-empty-title {
  color: #f8fafc;
}

[data-theme="dark"] main.news-page .news-page-empty-text {
  color: #cbd5e1;
}

[data-theme="dark"] main.news-page .news-page-pagination-inner {
  background: rgba(15, 23, 42, 0.86);
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 10px 26px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] main.news-page .news-page-page-btn {
  background: rgba(15, 23, 42, 0.9);
  border-color: rgba(148, 163, 184, 0.3);
  color: #e2e8f0;
}

[data-theme="dark"] main.news-page .news-page-page-btn:hover {
  background: rgba(30, 64, 175, 0.32);
  border-color: rgba(96, 165, 250, 0.42);
  color: #bfdbfe;
  box-shadow: 0 12px 24px rgba(96, 165, 250, 0.2);
}

[data-theme="dark"] main.news-page .news-page-page-btn.is-active {
  background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
  color: #fff;
  box-shadow: 0 12px 24px rgba(59, 130, 246, 0.36);
}

[data-theme="dark"] main.news-page .news-page-page-btn.is-disabled {
  opacity: 0.34;
  background: rgba(15, 23, 42, 0.6);
  color: #64748b;
  border-color: rgba(51, 65, 85, 0.42);
}

[data-theme="dark"] main.news-page .news-page-page-ellipsis {
  color: #94a3b8;
}


/* Round-2 dark-mode parity: light-mode primary was retargeted to
   dark slate (#0f172a → #1e293b). In dark mode the navy hero
   surface (rgba(15,23,42,.96)) would swallow the same dark slate
   button invisible — so we INVERT to light surface with dark ink,
   identical pattern to .cal-pill-btn-primary dark inversion. */
[data-theme="dark"] main.news-page .news-pill-btn-primary {
  background: linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%);
  color: #0f172a;
  border-color: rgba(15, 23, 42, 0.12);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 4px 14px rgba(2, 6, 23, 0.45);
}

[data-theme="dark"] main.news-page .news-pill-btn-primary:hover {
  background: linear-gradient(180deg, #ffffff 0%, #f1f5f9 100%);
  border-color: rgba(15, 23, 42, 0.18);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 1) inset,
    0 0 0 3px rgba(96, 165, 250, 0.28),
    0 10px 26px rgba(2, 6, 23, 0.55);
}

[data-theme="dark"] main.news-page .news-pill-btn-secondary {
  background: rgba(15, 23, 42, 0.42);
  color: #e2e8f0;
  border-color: rgba(96, 165, 250, 0.32);
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  backdrop-filter: blur(14px) saturate(150%);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.06) inset,
    0 6px 18px rgba(2, 6, 23, 0.5);
}

[data-theme="dark"] main.news-page .news-pill-btn-secondary:hover {
  background: rgba(30, 64, 175, 0.4);
  color: #f1f5f9;
  border-color: rgba(96, 165, 250, 0.62);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.10) inset,
    0 0 0 3px rgba(96, 165, 250, 0.22),
    0 10px 26px rgba(2, 6, 23, 0.6);
}

[data-theme="dark"] main.news-page .news-pill-btn-primary:focus-visible,
[data-theme="dark"] main.news-page .news-pill-btn-secondary:focus-visible {
  outline-color: #60a5fa;
}

/* Dark-hero surface parity with .home dark hero. Without this the
   light navy ink colors (set in the light redesign) would be
   unreadable in dark mode. */
[data-theme="dark"] .news-page-hero {
  border: 1px solid rgba(148, 163, 184, 0.28);
  background:
    linear-gradient(145deg,
      rgba(11, 18, 32, 0.96) 0%,
      rgba(15, 23, 42, 0.92) 54%,
      rgba(15, 23, 42, 0.90) 100%);
  box-shadow:
    0 10px 30px rgba(2, 6, 23, 0.5),
    inset 0 1px 0 rgba(148, 163, 184, 0.06);
}
[data-theme="dark"] .news-page-hero-title { color: #f8fafc; }
[data-theme="dark"] .news-page-hero-sub  { color: #cbd5e1; }
[data-theme="dark"] .news-page-hero-title em {
  background: linear-gradient(120deg, #fbbf24 0%, #fb923c 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

[data-theme="dark"] .news-page-stat {
  background: rgba(15, 23, 42, 0.84);
  border-color: rgba(148, 163, 184, 0.24);
  color: var(--ink);
}
[data-theme="dark"] .news-page-stat:hover {
  background: rgba(30, 41, 59, 0.94);
  border-color: rgba(96, 165, 250, 0.42);
  box-shadow:
    0 14px 26px rgba(15, 23, 42, 0.4),
    0 0 0 3px rgba(96, 165, 250, 0.16);
}
[data-theme="dark"] .news-page-stat-icon {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.22) 0%, rgba(99, 102, 241, 0.06) 100%);
  border-color: rgba(96, 165, 250, 0.30);
}
[data-theme="dark"] .news-page-stat-icon svg { stroke: #93c5fd; }
[data-theme="dark"] .news-page-stat-value { color: #f8fafc; }
[data-theme="dark"] .news-page-stat-label { color: #94a3b8; }


/* Round-2 dark-mode cohesion for the news-page-eyebrow pill.
   The new light pill (rgba(255,255,255,0.78) bg + #3730a3 ink) on
   the new navy dark hero surface would read as a punch-through
   element — high contrast but breaks dark-mode visual cohesion.
   Invert to a dark glass pill with light indigo ink so the eyebrow
   sits calmly with the rest of the dark hero. */
[data-theme="dark"] .news-page-eyebrow {
  background: rgba(15, 23, 42, 0.78);
  border-color: rgba(99, 102, 241, 0.45);
  color: #c7d2fe;
  box-shadow: 0 4px 10px rgba(2, 6, 23, 0.4);
}
[data-theme="dark"] .news-page-eyebrow svg {
  stroke: #a5b4fc;
}
