/* ==========================================================================
   darkmode.css — Dark theme refinements beyond base tokens
   Activated by :root[data-theme="dark"] (set by js/darkmode.js,
   defaults to system preference via prefers-color-scheme)
   ========================================================================== */

:root[data-theme="dark"] {
  --shadow-sm: 0 2px 8px rgba(0,0,0,.35);
  --shadow-md: 0 8px 24px rgba(0,0,0,.4);
  --shadow-lg: 0 20px 48px rgba(0,0,0,.5);
}

:root[data-theme="dark"] .card,
:root[data-theme="dark"] .toc,
:root[data-theme="dark"] .form-field input,
:root[data-theme="dark"] .form-field textarea,
:root[data-theme="dark"] .form-field select {
  background: var(--color-surface-alt);
  border-color: var(--color-border);
}

:root[data-theme="dark"] .service-card__media,
:root[data-theme="dark"] .blog-card__media { background: #060c12; }

:root[data-theme="dark"] .eyebrow { background: rgba(234,90,42,.16); color: var(--color-accent-400); }

:root[data-theme="dark"] .feature-card__icon,
:root[data-theme="dark"] .info-tile__icon,
:root[data-theme="dark"] .faq-item__icon,
:root[data-theme="dark"] .chip { background: rgba(74,138,184,.16); color: var(--color-primary-300); }

:root[data-theme="dark"] .blog-card__category { background: rgba(13,22,32,.9); color: var(--color-primary-200); }

:root[data-theme="dark"] .btn--ghost { color: var(--color-text); border-color: var(--color-border); }
:root[data-theme="dark"] .btn--ghost:hover { background: rgba(255,255,255,.06); }

:root[data-theme="dark"] .list-check li svg { color: #34c98f; }

:root[data-theme="dark"] .mobile-nav__panel { background: var(--color-surface); }
:root[data-theme="dark"] .mobile-nav__close { background: rgba(255,255,255,.08); }
:root[data-theme="dark"] .mobile-nav__link { border-color: var(--color-border); }

:root[data-theme="dark"] ::-webkit-scrollbar-thumb { background: var(--color-ink-500); border-color: var(--color-surface); }
:root[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: var(--color-ink-400); }

:root[data-theme="dark"] img { filter: brightness(.94) contrast(1.02); }