/**
 * BiznizCard — dark / light theme for panel routes (dashboard, builder, checkout, admin, account).
 * Loaded after navbar.css. Requires html[data-theme="light"|"dark"] (see js/panel-theme-boot.js).
 * @version 20260520-final — dark mode + mobile drawer (locked; do not change light theme)
 */

html[data-theme="dark"] {
  color-scheme: dark;
}

/* --- Shared tokens (navbar / readable contrast) --- */
html[data-theme="dark"] {
  --nav-ink: #ffffff;
  --nav-muted: #ffffff;
  --nav-line: rgba(248, 250, 252, 0.14);
  --nav-shadow: 0 22px 46px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .header-inner--unified {
  background: rgba(18, 20, 26, 0.92);
  border-color: rgba(248, 250, 252, 0.12);
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .site-header.is-scrolled .header-inner--unified {
  box-shadow:
    0 14px 40px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] .site-nav__link {
  color: var(--nav-muted);
}

html[data-theme="dark"] .site-nav__link:hover {
  color: var(--nav-ink);
}

html[data-theme="dark"] .nav-toggle-btn__bar {
  background: #ffffff;
}

html[data-theme="dark"] .nav-backdrop {
  background: rgba(0, 0, 0, 0.65);
}

html[data-theme="dark"] .site-nav-panel.is-open,
html[data-theme="dark"] .site-header.nav-open .site-nav-panel {
  background: rgba(18, 20, 26, 0.98);
  border-color: rgba(248, 250, 252, 0.12);
}

html[data-theme="dark"] .site-nav-panel__close-row {
  background: rgba(18, 20, 26, 0.98);
  border-bottom-color: rgba(248, 250, 252, 0.12);
}

html[data-theme="dark"] .nav-drawer-close-btn {
  background: rgba(248, 250, 252, 0.08);
  border-color: rgba(248, 250, 252, 0.16);
  color: #ffffff;
}

html[data-theme="dark"] .nav-drawer-close-btn:hover {
  background: rgba(248, 250, 252, 0.12);
  border-color: rgba(248, 250, 252, 0.22);
}

html[data-theme="dark"] .profile-trigger {
  background: #141416 !important;
  border-color: rgba(248, 250, 252, 0.18) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .profile-dropdown {
  background: #141416 !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] .profile-dropdown a,
html[data-theme="dark"] .profile-dropdown button {
  color: #ffffff !important;
}

html[data-theme="dark"] .profile-dropdown a:hover,
html[data-theme="dark"] .profile-dropdown button:hover {
  background: rgba(99, 102, 241, 0.18) !important;
  color: #fff !important;
}

/* Navbar ghost / menu — navbar.css uses light-surface hex colors (desktop dark looked “broken”) */
html[data-theme="dark"] .nav-btn-ghost {
  background: rgba(248, 250, 252, 0.09) !important;
  border-color: rgba(248, 250, 252, 0.2) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .nav-btn-ghost:hover {
  background: rgba(248, 250, 252, 0.15) !important;
  border-color: rgba(248, 250, 252, 0.3) !important;
  color: #fff !important;
}

html[data-theme="dark"] .nav-toggle-btn {
  background: rgba(248, 250, 252, 0.08);
  border-color: rgba(248, 250, 252, 0.18);
}

html[data-theme="dark"] .nav-toggle-btn:hover {
  background: rgba(248, 250, 252, 0.14);
  border-color: rgba(248, 250, 252, 0.26);
}

/* Display mode — labeled Light / Dark switch (navbar) */
.panel-theme-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
  margin-right: 0.35rem;
}

.panel-theme-switch__label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--nav-muted, #64748b);
  white-space: nowrap;
}

.panel-theme-switch__track {
  display: inline-flex;
  align-items: stretch;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: rgba(241, 245, 249, 0.95);
  padding: 3px;
  gap: 2px;
}

.panel-theme-switch__btn {
  appearance: none;
  margin: 0;
  min-width: 3.35rem;
  min-height: 34px;
  padding: 0.35rem 0.65rem;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: var(--nav-muted, #64748b);
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.panel-theme-switch__btn:hover {
  color: var(--nav-ink, #0f172a);
}

.panel-theme-switch__btn.is-active {
  background: #fff;
  color: var(--nav-ink, #0f172a);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12);
}

.panel-theme-switch__btn:focus-visible {
  outline: 2px solid #6366f1;
  outline-offset: 2px;
}

html[data-theme="dark"] .panel-theme-switch__label {
  color: #ffffff;
}

html[data-theme="dark"] .panel-theme-switch__track {
  border-color: rgba(248, 250, 252, 0.2);
  background: rgba(24, 26, 32, 0.95);
}

html[data-theme="dark"] .panel-theme-switch__btn {
  color: #ffffff;
}

html[data-theme="dark"] .panel-theme-switch__btn:hover {
  color: #ffffff;
}

html[data-theme="dark"] .panel-theme-switch__btn.is-active {
  background: rgba(79, 70, 229, 0.35);
  color: #ffffff;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08) inset;
}

@media (max-width: 820px) {
  .site-nav-panel .panel-theme-switch {
    width: 100%;
    justify-content: space-between;
    padding: 0.35rem 0;
    margin-right: 0;
    border-bottom: 1px solid rgba(148, 163, 184, 0.2);
    margin-bottom: 0.35rem;
  }

  html[data-theme="dark"] .site-nav-panel .panel-theme-switch {
    border-bottom-color: rgba(248, 250, 252, 0.1);
  }

  .site-nav-panel .panel-theme-switch__track {
    flex: 1;
    justify-content: stretch;
    max-width: 220px;
  }

  .site-nav-panel .panel-theme-switch__btn {
    flex: 1;
    min-height: 44px;
  }
}

/* --- Footer on panel pages (client: black bar + white type) --- */
html[data-theme="dark"] .site-footer {
  background: #000000 !important;
  background-image: none !important;
  color: #ffffff !important;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .site-footer a {
  color: #ffffff !important;
}

html[data-theme="dark"] .site-footer a:hover {
  color: #ffffff !important;
}

html[data-theme="dark"] .site-footer p,
html[data-theme="dark"] .site-footer li,
html[data-theme="dark"] .site-footer span,
html[data-theme="dark"] .site-footer small,
html[data-theme="dark"] .site-footer .footer-bottom,
html[data-theme="dark"] .site-footer .footer-bottom__text,
html[data-theme="dark"] .site-footer .footer-contact,
html[data-theme="dark"] .site-footer .footer-nav li,
html[data-theme="dark"] .site-footer .footer-col--brand {
  color: #ffffff !important;
}

html[data-theme="dark"] .site-footer .logo,
html[data-theme="dark"] .site-footer .logo--footer,
html[data-theme="dark"] .site-footer .create-footer-logo__biz,
html[data-theme="dark"] .site-footer .create-footer-logo__card {
  color: #ffffff !important;
}

html[data-theme="dark"] .site-footer svg {
  color: #ffffff !important;
  fill: currentColor;
}

/* Social circles: inherit light footer link color + landing --bg-elevated (#fff) → washed / unreadable */
html[data-theme="dark"] .site-footer a.footer-social__btn {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .site-footer a.footer-social__btn:hover {
  background: rgba(99, 102, 241, 0.45) !important;
  border-color: rgba(165, 180, 252, 0.55) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .footer-label {
  color: #ffffff !important;
}

html[data-theme="dark"] .footer-eyebrow,
html[data-theme="dark"] .footer-tagline {
  color: #ffffff !important;
}

/* Panel routes: logo PNG reads dark-on-dark — lighten mark (homepage uses separate homepage-only rules). */
html[data-theme="dark"] body.panel-page .site-nav-brand__mark {
  filter: brightness(0) invert(1);
}

/* --- Generic panel body --- */
html[data-theme="dark"] body.panel-page {
  background: #0a0a0a !important;
  background-image: none !important;
  color: #ffffff !important;
  /* Inline dashboard/account styles use var(--muted); define so prose stays readable on dark surfaces */
  --muted: #ffffff;
  --line: rgba(248, 250, 252, 0.12);
  /* Shared landing footer / chips use :root --bg-elevated (#fff); align for dark panel routes */
  --bg-elevated: #1a1a1f;
  --accent-strong: #a5b4fc;
}

/* --- Dashboard --- */
html[data-theme="dark"] body.panel-page .dash-header,
html[data-theme="dark"] body.panel-page .hero,
html[data-theme="dark"] body.panel-page .cards-panel {
  background: #121212 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45) !important;
}

/* Do not set global body.panel-page h1/h2 to white !important — it paints card section titles and
   light-surface modals (e.g. dashboard delete dialog) white-on-white. Panel chrome uses body color
   inheritance plus scoped rules (.builder-flow-hero h1, .panel-title, .hero, etc.). */

/* Card preview shells: isolate from body.panel-page { color: #fff } so link/icon hovers stay visible. */
html[data-theme="dark"] body.panel-page .preview-card-wrap,
html[data-theme="dark"] body.panel-page .preview-card-wrap .tpl-preview-wrap,
html[data-theme="dark"] body.panel-page .preview-card-wrap .bc-card,
html[data-theme="dark"] body.panel-page .preview-card-wrap .pub-card,
html[data-theme="dark"] body.panel-page #previewMount.preview-card-wrap,
html[data-theme="dark"] body.panel-page #previewMount .bc-card,
html[data-theme="dark"] body.panel-page #previewMount .pub-card,
html[data-theme="dark"] body.panel-page #publish-card-preview,
html[data-theme="dark"] body.panel-page #publish-card-preview .pub-card,
html[data-theme="dark"] body.panel-page #publish-card-preview .bc-card,
html[data-theme="dark"] body.step3-page .preview-floating-inner .bc-card,
html[data-theme="dark"] body.step3-page .preview-floating-inner .pub-card {
  color: var(--tpl-text, var(--bc-t4-ink, var(--bc-t3-ink, #0f172a))) !important;
}

/* Card preview typography: use picker font (--tpl-font), not panel UI (Plus Jakarta). */
body.panel-page .preview-card-wrap,
body.panel-page .preview-card-wrap .tpl-preview-wrap,
body.panel-page .preview-card-wrap .bc-card,
body.panel-page .preview-card-wrap .pub-card,
body.panel-page #previewMount.preview-card-wrap,
body.panel-page #previewMount .bc-card,
body.panel-page #previewMount .pub-card,
body.panel-page #publish-card-preview,
body.panel-page #publish-card-preview .pub-card,
body.panel-page #publish-card-preview .bc-card,
body.step3-page .preview-floating-inner .bc-card,
body.step3-page .preview-floating-inner .pub-card {
  font-family: var(--tpl-font, var(--tpl-font-contact, var(--bc-t4-font-contact, var(--bc-t3-font-contact, inherit)))) !important;
}

html[data-theme="dark"] body.panel-page .preview-card-wrap a.tpl-row__link:hover,
html[data-theme="dark"] body.panel-page .preview-card-wrap .tpl-t02-contact-item:hover,
html[data-theme="dark"] body.panel-page .preview-card-wrap .tpl-t03-contact-item:hover,
html[data-theme="dark"] body.panel-page #previewMount a.tpl-row__link:hover,
html[data-theme="dark"] body.panel-page #publish-card-preview a.tpl-row__link:hover,
html[data-theme="dark"] body.panel-page #publish-card-preview .bc-t3-btn-item:hover,
html[data-theme="dark"] body.panel-page #publish-card-preview .bc-t4-btn-item:hover,
html[data-theme="dark"] body.panel-page .preview-card-wrap .bc-t3-btn-item:hover,
html[data-theme="dark"] body.panel-page .preview-card-wrap .bc-t4-btn-item:hover,
html[data-theme="dark"] body.panel-page .preview-card-wrap .tpl-card-action-btn:hover,
html[data-theme="dark"] body.panel-page #previewMount .tpl-card-action-btn:hover {
  opacity: 1 !important;
  visibility: visible !important;
}

html[data-theme="dark"] body.panel-page .sub,
html[data-theme="dark"] body.panel-page #dash-hero-sub,
html[data-theme="dark"] body.panel-page .profile-email {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .profile-name {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .card-item {
  background: #141414 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4) !important;
}

html[data-theme="dark"] body.panel-page .card-meta-title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .card-thumb {
  background: linear-gradient(135deg, #1e1b4b 0%, #0f172a 100%) !important;
  border-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page .btn.btn-subtle,
html[data-theme="dark"] body.panel-page .btn.btn-ghost {
  background: #1a1a1a !important;
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.2) !important;
}

html[data-theme="dark"] body.panel-page .dash-empty-visual {
  background: linear-gradient(165deg, rgba(49, 46, 129, 0.35) 0%, rgba(15, 23, 42, 0.9) 100%) !important;
  border-color: rgba(129, 140, 248, 0.25) !important;
}

html[data-theme="dark"] body.panel-page .dash-empty-visual p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .dash-payment-banner {
  background: rgba(30, 27, 75, 0.45) !important;
  border-color: rgba(129, 140, 248, 0.25) !important;
}

html[data-theme="dark"] body.panel-page .dash-payment-banner__msg {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .dash-payment-banner__title {
  color: #e0e7ff !important;
}

html[data-theme="dark"] body.panel-page .dash-payment-banner--paid .dash-payment-banner__title {
  color: #6ee7b7 !important;
}

html[data-theme="dark"] body.panel-page .dash-payment-banner--warn .dash-payment-banner__title {
  color: #fcd34d !important;
}

/* Dashboard: secondary controls + pills (charcoal, not bright white) */
html[data-theme="dark"] body.panel-page.dashboard-page .mini-btn {
  background: #2a2a2f !important;
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .mini-btn.primary {
  background: rgba(99, 102, 241, 0.28) !important;
  color: #e0e7ff !important;
  border-color: rgba(129, 140, 248, 0.45) !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .mini-btn.danger {
  background: rgba(127, 29, 29, 0.28) !important;
  color: #fecaca !important;
  border-color: rgba(248, 113, 113, 0.38) !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .template-pill {
  background: rgba(99, 102, 241, 0.18) !important;
  color: #c7d2fe !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .muted {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .profile-trigger {
  background: #2a2a2f !important;
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .profile-dropdown {
  background: #161616 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .profile-dropdown a,
html[data-theme="dark"] body.panel-page.dashboard-page .profile-dropdown button {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .profile-dropdown a:hover,
html[data-theme="dark"] body.panel-page.dashboard-page .profile-dropdown button:hover {
  background: rgba(99, 102, 241, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .card-rename-trigger {
  background: #2a2a2f !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .card-item .card-thumb__badge:not(.card-thumb__badge--draft) {
  background: rgba(15, 23, 42, 0.78) !important;
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .dash-link-chip {
  background: rgba(99, 102, 241, 0.14) !important;
  border-color: rgba(129, 140, 248, 0.35) !important;
  color: #e0e7ff !important;
}

/* Dashboard tool cards (Referral / Loan Calculator) — no light gradients on dark */
html[data-theme="dark"] body.panel-page .dash-tool-card,
html[data-theme="dark"] body.panel-page .dash-tool-card--muted {
  background: #121212 !important;
  background-image: none !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.4) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .dash-tool-card__eyebrow {
  color: #a5b4fc !important;
}

html[data-theme="dark"] body.panel-page .dash-tool-card__title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .dash-tool-card__text {
  color: rgba(248, 250, 252, 0.78) !important;
}

html[data-theme="dark"] body.panel-page .dash-referral-panel__eyebrow {
  color: #a5b4fc !important;
}

html[data-theme="dark"] body.panel-page .dash-referral-panel h2,
html[data-theme="dark"] body.panel-page .dash-referral-panel__lead,
html[data-theme="dark"] body.panel-page .dash-referral-panel__lead strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.dashboard-page .hero .cards-panel--in-hero {
  background: rgba(22, 22, 24, 0.94) !important;
  border-color: rgba(248, 250, 252, 0.1) !important;
}

/* --- Checkout --- */
html[data-theme="dark"] body.panel-page .co-card {
  background: #121212 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] body.panel-page .co-summary {
  background: linear-gradient(180deg, #161616 0%, #121212 100%) !important;
  border-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page .co-head {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page input,
html[data-theme="dark"] body.panel-page textarea,
html[data-theme="dark"] body.panel-page select {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .co-email {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .co-email strong {
  color: #ffffff !important;
}

/* Checkout — inline checkout.html uses dark slate on labels/prices; force white on black panels */
html[data-theme="dark"] body.panel-page.checkout-page .co-head h1,
html[data-theme="dark"] body.panel-page.checkout-page .co-summary-name,
html[data-theme="dark"] body.panel-page.checkout-page .co-price,
html[data-theme="dark"] body.panel-page.checkout-page .co-desc,
html[data-theme="dark"] body.panel-page.checkout-page .co-includes,
html[data-theme="dark"] body.panel-page.checkout-page .co-includes li,
html[data-theme="dark"] body.panel-page.checkout-page .co-label,
html[data-theme="dark"] body.panel-page.checkout-page .co-label-note,
html[data-theme="dark"] body.panel-page.checkout-page .co-help,
html[data-theme="dark"] body.panel-page.checkout-page .co-badge,
html[data-theme="dark"] body.panel-page.checkout-page #checkout-multi-note,
html[data-theme="dark"] body.panel-page.checkout-page #checkout-msg,
html[data-theme="dark"] body.panel-page.checkout-page #checkout-login-row,
html[data-theme="dark"] body.panel-page.checkout-page #checkout-login-row a {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.checkout-page .co-btn--ghost {
  background: #1a1a1a !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

html[data-theme="dark"] body.panel-page.checkout-page .co-summary,
html[data-theme="dark"] body.panel-page.checkout-page .co-form {
  background: #121212 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

/* --- Builder flow pages --- */
html[data-theme="dark"] body.panel-page.builder-flow-page {
  background: #0a0a0a !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-hero {
  border-color: rgba(248, 250, 252, 0.12) !important;
  background: #121212 !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-hero h1 {
  color: #ffffff !important;
}

/* Stepper: override light-theme CSS vars + active item (else #1e293b on dark bg) */
html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-stepper {
  --stepper-active: #818cf8;
  --stepper-active-strong: #6366f1;
  --stepper-muted: #ffffff;
  --stepper-text: #ffffff;
  --stepper-done-text: #ffffff;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-stepper__item {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-stepper__item.active {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-stepper__item:not(.done):not(.active) .builder-flow-stepper__dot {
  background: #1f1f23 !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.42) !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-sub,
html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-offer {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-step {
  background: rgba(30, 32, 38, 0.95) !important;
  border-color: rgba(248, 250, 252, 0.18) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-hint {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .group {
  background: #121212 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .group h2 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .group h2 .group-ico,
html[data-theme="dark"] body.panel-page.builder-flow-page .group:hover h2 .group-ico {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .field label {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .field-head > label {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .country-item {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .error.show {
  color: #fecaca !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .toggle {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .disclaimer,
html[data-theme="dark"] body.panel-page.builder-flow-page .disclaimer > span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .disclaimer a {
  color: #e0e7ff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .disclaimer a:hover {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .site-nav__link,
html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .nav-btn-ghost,
html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .site-nav__cta,
html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .site-nav__link--panel-pill,
html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .profile-trigger,
html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .panel-nav-user__name,
html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .site-nav__btn-logout,
html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .logo,
html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .panel-theme-switch__label,
html[data-theme="dark"] body.panel-page.builder-flow-page #site-header .panel-theme-switch__btn {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .builder-flow-icon-btn {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .upload-card {
  background: linear-gradient(180deg, #3a3a40 0%, #2d2d32 100%) !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .upload-card:hover {
  background: linear-gradient(180deg, #43434a 0%, #35353c 100%) !important;
  border-color: rgba(129, 140, 248, 0.55) !important;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.22) !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .group:hover {
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.45) !important;
  border-color: rgba(129, 140, 248, 0.35) !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .upload-content {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .upload-help,
html[data-theme="dark"] body.panel-page.builder-flow-page .upload-print-hint {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
html[data-theme="dark"] body.panel-page.builder-flow-page textarea,
html[data-theme="dark"] body.panel-page.builder-flow-page select {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page input::placeholder,
html[data-theme="dark"] body.panel-page.builder-flow-page textarea::placeholder {
  color: rgba(255, 255, 255, 0.78) !important;
}

/* Create wizard — phone row: match dark input fill (country picker is a button, not an input) */
html[data-theme="dark"] body.panel-page.builder-flow-page .phone-row .country-trigger {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .phone-row .country-trigger:hover {
  background: #222222 !important;
  border-color: rgba(99, 102, 241, 0.45) !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .phone-row .country-trigger:focus-visible {
  border-color: rgba(99, 102, 241, 0.58) !important;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.22) !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .phone-row .country-trigger-arrow {
  color: #ffffff !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .phone-row #phoneNumber,
html[data-theme="dark"] body.panel-page.builder-flow-page .phone-row #step3-phoneNumber {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .phone-row #phoneNumber::placeholder,
html[data-theme="dark"] body.panel-page.builder-flow-page .phone-row #step3-phoneNumber::placeholder {
  color: rgba(255, 255, 255, 0.78) !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-sheet {
  background: #141414 !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55) !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-search {
  background: #0a0a0a !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-search::placeholder {
  color: rgba(255, 255, 255, 0.78) !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-item-main {
  color: #ffffff !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-item-meta {
  color: #ffffff !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-item:hover {
  background: rgba(99, 102, 241, 0.14) !important;
  border-color: rgba(99, 102, 241, 0.28) !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-item.active {
  background: rgba(99, 102, 241, 0.2) !important;
  border-color: rgba(129, 140, 248, 0.45) !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-list {
  scrollbar-color: rgba(99, 102, 241, 0.5) rgba(30, 32, 38, 0.9);
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-list::-webkit-scrollbar-track {
  background: rgba(30, 32, 38, 0.95) !important;
}
html[data-theme="dark"] body.panel-page.builder-flow-page .country-list::-webkit-scrollbar-thumb {
  background: rgba(99, 102, 241, 0.45) !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .template-card {
  background: #141414 !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
}

html[data-theme="dark"] body.panel-page .wrap .builder-flow-hero .builder-flow-sub {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .card {
  background: #121212 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

/* builder-flow-header.css */
html[data-theme="dark"] body.builder-flow-page {
  background: #0a0a0a !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .publish-grid .preview,
html[data-theme="dark"] body.panel-page #publish-preview-host {
  border-color: rgba(248, 250, 252, 0.1);
}

html[data-theme="dark"] body.panel-page.builder-flow-page {
  --ink: #ffffff;
  --muted: #ffffff;
  --line: rgba(248, 250, 252, 0.12);
  --bg-elevated: #161616;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .card {
  background: #121212 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .preview {
  background: #161616 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .share,
html[data-theme="dark"] body.panel-page.builder-flow-page .qr-card {
  background: #141414 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page .btn-secondary,
html[data-theme="dark"] body.panel-page.builder-flow-page .btn-ghost {
  background: #1a1a1a !important;
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.18) !important;
}

html[data-theme="dark"] body.panel-page.builder-flow-page #qr {
  background: #fff !important;
}

html[data-theme="dark"] body.panel-page .admin-main {
  color: #ffffff;
}

html[data-theme="dark"] body.panel-page .admin-hero {
  background: linear-gradient(135deg, #161616 0%, #12121a 50%, #141418 100%) !important;
  border: 1px solid rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page .admin-hero h1 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-hero p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-hero-eyebrow-prefix,
html[data-theme="dark"] body.panel-page .admin-hero-eyebrow-role {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-hero-eyebrow strong {
  background: rgba(99, 102, 241, 0.28) !important;
  color: #e0e7ff !important;
}

html[data-theme="dark"] body.panel-page .admin-hero-status-card {
  background: rgba(22, 22, 26, 0.96) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] body.panel-page .admin-hero-status-card strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-hero-status-card small {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-nav a {
  color: #ffffff !important;
}

/* Sidebar uses <button.admin-nav-item>, not anchors — fix inactive row contrast */
html[data-theme="dark"] body.panel-page .admin-nav-item {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-nav-ico {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-nav-item:hover {
  background: #2563eb !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-nav-item:hover .admin-nav-ico {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-nav-item.is-active {
  background: #2563eb !important;
  color: #ffffff !important;
  box-shadow: 0 2px 10px rgba(37, 99, 235, 0.35) !important;
}

html[data-theme="dark"] body.panel-page .admin-nav-item.is-active .admin-nav-ico {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-nav-item.is-active:hover .admin-nav-ico {
  color: #ffffff !important;
}

/* Admin mobile shortcut grid — site blue + white on every shortcut */
html[data-theme="dark"] body.panel-page .admin-mobile-nav__btn {
  background: #2563eb !important;
  border-color: #1d4ed8 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-mobile-nav__btn:hover,
html[data-theme="dark"] body.panel-page .admin-mobile-nav__btn:focus-visible {
  background: #1d4ed8 !important;
  border-color: #1e40af !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-mobile-nav__btn.is-active {
  background: #1d4ed8 !important;
  border-color: #ffffff !important;
  color: #ffffff !important;
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.45),
    0 4px 14px rgba(37, 99, 235, 0.35) !important;
}

html[data-theme="dark"] body.panel-page .admin-mobile-logout-btn {
  background: linear-gradient(180deg, rgba(127, 29, 29, 0.55) 0%, rgba(91, 17, 17, 0.72) 100%) !important;
  border-color: rgba(248, 113, 113, 0.35) !important;
  color: #fecaca !important;
}

html[data-theme="dark"] body.panel-page .admin-nav-sep {
  border-top-color: rgba(248, 250, 252, 0.12) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page section.admin-panel {
  background: #141414 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  color: #ffffff !important;
}

/* --- Carddesign editor (step 3) --- */
html[data-theme="dark"] body.step3-page .step3-panel {
  background: #121212 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.step3-page .preview-toggle-btn {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.18) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .builder-section-title,
html[data-theme="dark"] body.step3-page .editor-panel label,
html[data-theme="dark"] body.step3-page .preview-panel label {
  color: #ffffff !important;
}

/* Step 3 builder: force charcoal surfaces so light text (above) stays readable */
html[data-theme="dark"] body.step3-page .editor-panel .editor-collapsible-block,
html[data-theme="dark"] body.step3-page .editor-panel .personal-info-card,
html[data-theme="dark"] body.step3-page .editor-panel .personal-style-panel,
html[data-theme="dark"] body.step3-page .editor-panel .advanced-style-panel,
html[data-theme="dark"] body.step3-page .editor-panel .social-style-panel,
html[data-theme="dark"] body.step3-page .editor-panel .tri-suite-optional-panel,
html[data-theme="dark"] body.step3-page .editor-panel .tri-suite-contact-form-panel,
html[data-theme="dark"] body.step3-page .editor-panel .template-picker-modern,
html[data-theme="dark"] body.step3-page .editor-panel .builder-section-card,
html[data-theme="dark"] body.step3-page .editor-panel .builder-sections-nav,
html[data-theme="dark"] body.step3-page .editor-panel .step3-optional-block,
html[data-theme="dark"] body.step3-page .editor-panel .step3-rgb-detail,
html[data-theme="dark"] body.step3-page .editor-panel .optional-feature-fields,
html[data-theme="dark"] body.step3-page .editor-panel .payment-panel,
html[data-theme="dark"] body.step3-page .editor-panel .payment-field,
html[data-theme="dark"] body.step3-page .editor-panel .payment-bank-field,
html[data-theme="dark"] body.step3-page .editor-panel .contact-extra-card,
html[data-theme="dark"] body.step3-page .editor-panel .section-collapsible-body,
html[data-theme="dark"] body.step3-page .editor-panel .section-header-line,
html[data-theme="dark"] body.step3-page .editor-panel .step3-advanced-media__body,
html[data-theme="dark"] body.step3-page .editor-panel .file-dropzone__box,
html[data-theme="dark"] body.step3-page .editor-panel .field-picker,
html[data-theme="dark"] body.step3-page .editor-panel .gallery-grid-picker__popover,
html[data-theme="dark"] body.step3-page .editor-panel .optional-feature-block {
  background: #16161c !important;
  background-image: none !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .advanced-style-panel > div,
html[data-theme="dark"] body.step3-page .editor-panel .social-style-panel > div {
  background: #1a1a22 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .personal-info-card__head {
  background: #1a1d26 !important;
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .section-title,
html[data-theme="dark"] body.step3-page .editor-panel .section-subtitle,
html[data-theme="dark"] body.step3-page .editor-panel .panel-title,
html[data-theme="dark"] body.step3-page .editor-panel .personal-style-panel__title,
html[data-theme="dark"] body.step3-page .editor-panel .template-picker-modern__label {
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .brand-color-modern label,
html[data-theme="dark"] body.step3-page .editor-panel .color-controls-inline label {
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .preview-panel .panel-title {
  color: #ffffff !important;
}

/* Live preview mount: faint frame when empty so a failed render isn’t a “void” on dark UI */
html[data-theme="dark"] body.step3-page #previewMount.preview-card-wrap:empty {
  min-height: 200px;
  border: 1px dashed rgba(248, 250, 252, 0.14);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
}

html[data-theme="dark"] body.step3-page .preview-panel .helper {
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .helper,
html[data-theme="dark"] body.step3-page .editor-panel .builder-flow-hint,
html[data-theme="dark"] body.step3-page .editor-panel .builder-section-hint,
html[data-theme="dark"] body.step3-page .editor-panel .optional-feature-fields__hint,
html[data-theme="dark"] body.step3-page .editor-panel .payment-panel__hint,
html[data-theme="dark"] body.step3-page .editor-panel .gallery-grid-picker__intro,
html[data-theme="dark"] body.step3-page .editor-panel .helper-top {
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .optional-feature-fields__heading,
html[data-theme="dark"] body.step3-page .editor-panel .optional-feature-fields .optional-feature-fields__heading.section-title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .row--toggle {
  background: #1a1a22 !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .btn-add-more {
  background: rgba(99, 102, 241, 0.28) !important;
  border-color: rgba(165, 180, 252, 0.55) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .template-thumb-btn {
  background: #1e1e26 !important;
  border-color: rgba(248, 250, 252, 0.16) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .template-thumb-btn.is-active {
  color: #e0e7ff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .template-thumb-btn__preview {
  background: linear-gradient(145deg, #252530, #1a1a22) !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .builder-sections-nav button {
  background: #1e1e26 !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel .builder-sections-nav button:hover {
  color: #ffffff !important;
  border-color: rgba(129, 140, 248, 0.45) !important;
}

html[data-theme="dark"] body.step3-page .editor-panel input:focus,
html[data-theme="dark"] body.step3-page .editor-panel textarea:focus,
html[data-theme="dark"] body.step3-page .editor-panel select:focus {
  background-color: #1c1c24 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .editor-panel input:not([type="color"]),
html[data-theme="dark"] body.step3-page .editor-panel textarea,
html[data-theme="dark"] body.step3-page .editor-panel select {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.step3-page .btn {
  color: #fff !important;
}

html[data-theme="dark"] body.step3-page .builder-top-actions .btn.btn-subtle,
html[data-theme="dark"] body.step3-page .builder-top-actions .btn:not(.btn-primary) {
  background: #1f1f1f !important;
  color: #ffffff !important;
  border: 1px solid rgba(248, 250, 252, 0.18) !important;
}

html[data-theme="dark"] body.step3-page .builder-flow-icon-btn {
  background: linear-gradient(180deg, #4f46e5 0%, #4338ca 100%) !important;
  border-color: rgba(99, 102, 241, 0.45) !important;
  color: #ffffff !important;
}

/* --- Publish (step 4) --- */
html[data-theme="dark"] body.step4-page .builder-top-actions .btn.btn-secondary {
  background: #1f1f1f !important;
  color: #ffffff !important;
  border: 1px solid rgba(248, 250, 252, 0.18) !important;
}

html[data-theme="dark"] body.step4-page .builder-flow-icon-btn {
  background: linear-gradient(180deg, #4f46e5 0%, #4338ca 100%) !important;
  border-color: rgba(99, 102, 241, 0.45) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.step5-page .builder-top-actions .btn.btn-secondary {
  background: #1f1f1f !important;
  color: #ffffff !important;
  border: 1px solid rgba(248, 250, 252, 0.18) !important;
}

html[data-theme="dark"] body.step5-page .builder-flow-icon-btn {
  background: linear-gradient(180deg, #4f46e5 0%, #4338ca 100%) !important;
  border-color: rgba(99, 102, 241, 0.45) !important;
  color: #ffffff !important;
}

/* --- Admin --- */
html[data-theme="dark"] body.panel-page .admin-page-title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-page-sub,
html[data-theme="dark"] body.panel-page .admin-section-hint {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-inner {
  background: linear-gradient(180deg, #141414 0%, #101010 100%) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow:
    0 12px 40px rgba(0, 0, 0, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-brand {
  color: #ffffff !important;
  border-bottom-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-user {
  background: linear-gradient(165deg, rgba(49, 46, 129, 0.4) 0%, rgba(15, 23, 42, 0.95) 100%) !important;
  border-color: rgba(129, 140, 248, 0.25) !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-user-name {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-user-email {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-photo-hit {
  color: #e0e7ff !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-role-badge {
  color: #e0e7ff !important;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.38), rgba(129, 140, 248, 0.22)) !important;
  border-color: rgba(165, 180, 252, 0.35) !important;
}

html[data-theme="dark"] body.panel-page .admin-page-header h1 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-page-header p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-stat-card,
html[data-theme="dark"] body.panel-page .admin-card {
  background: linear-gradient(180deg, #1a1a1e 0%, #141416 100%) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow:
    0 8px 28px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

html[data-theme="dark"] body.panel-page .admin-stat-value,
html[data-theme="dark"] body.panel-page #overview-panel .admin-stat-value,
html[data-theme="dark"] body.panel-page .admin-kpi-tiles .admin-stat-value {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-stat-label,
html[data-theme="dark"] body.panel-page #overview-panel .admin-stat-label,
html[data-theme="dark"] body.panel-page .admin-kpi-tiles .admin-stat-label {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-stat-hint,
html[data-theme="dark"] body.panel-page #overview-panel .admin-stat-hint,
html[data-theme="dark"] body.panel-page .admin-stat-card small {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-surface-card {
  background: #161616 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] body.panel-page .admin-surface-card h3 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-period-btn {
  background: #1f1f23 !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-period-btn.is-active {
  background: #2563eb !important;
  color: #ffffff !important;
  border-color: #2563eb !important;
}

html[data-theme="dark"] body.panel-page #overview-panel .admin-action-btn {
  background: linear-gradient(180deg, #1e1e22 0%, #18181b 100%) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] body.panel-page #overview-panel .admin-action-btn:hover {
  background: #252528 !important;
  border-color: rgba(129, 140, 248, 0.35) !important;
}

html[data-theme="dark"] body.panel-page #overview-panel .admin-action-btn__icon {
  background: linear-gradient(145deg, rgba(79, 70, 229, 0.35), rgba(99, 102, 241, 0.2)) !important;
  color: #c7d2fe !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

html[data-theme="dark"] body.panel-page .admin-card-header h3 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-card-header p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-mini-list li {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page .admin-mini-list .admin-mini-main {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-mini-list .admin-mini-sub,
html[data-theme="dark"] body.panel-page .admin-mini-list .admin-mini-meta {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-summary-list div,
html[data-theme="dark"] body.panel-page .admin-health-list div {
  border-bottom-color: rgba(248, 250, 252, 0.08) !important;
}

html[data-theme="dark"] body.panel-page .admin-summary-list div > span:first-child:not(.admin-metric-label),
html[data-theme="dark"] body.panel-page .admin-health-list div > span:first-child:not(.admin-metric-label) {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-summary-list div > strong:not(.admin-health-ok):not(.admin-health-warn):not(.admin-data-source-pill),
html[data-theme="dark"] body.panel-page .admin-health-list div > strong:not(.admin-health-ok):not(.admin-health-warn):not(.admin-data-source-pill) {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-summary-list .admin-metric-label__text,
html[data-theme="dark"] body.panel-page .admin-health-list .admin-metric-label__text {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-metric-ico {
  background: linear-gradient(145deg, #27272a, #1f1f23) !important;
  color: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

html[data-theme="dark"] body.panel-page .admin-panel-header h1,
html[data-theme="dark"] body.panel-page .admin-panel-head h2 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-panel-header p,
html[data-theme="dark"] body.panel-page .admin-panel-head p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .adm-metric-hint {
  color: #ffffff !important;
  border-top-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page .admin-shell--sidebar-open .admin-sidebar {
  background: rgba(14, 14, 16, 0.98) !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-close {
  background: rgba(248, 250, 252, 0.1) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-secondary-btn {
  background: #1f1f23 !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

html[data-theme="dark"] body.panel-page .admin-secondary-btn:hover:not(:disabled) {
  background: #2a2a2f !important;
  border-color: rgba(248, 250, 252, 0.22) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-secondary-btn .admin-secondary-btn__ico {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-secondary-btn:hover:not(:disabled) .admin-secondary-btn__ico {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-secondary-btn:disabled {
  background: #18181b !important;
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.08) !important;
}

html[data-theme="dark"] body.panel-page .admin-mini-row {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page .admin-mini-row strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-mini-row span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-mini-row--head {
  border-bottom-color: rgba(248, 250, 252, 0.14) !important;
}

html[data-theme="dark"] body.panel-page .admin-mini-row--head span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-empty-state {
  background: rgba(30, 30, 33, 0.9) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-status-pill {
  background: #27272a !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-alert-list div {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page .adm-analytics-range label {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-open {
  background: #1f1f23 !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-user-card,
html[data-theme="dark"] body.panel-page .admin-card-tile {
  background: #141414 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="dark"] body.panel-page .admin-user-card .email,
html[data-theme="dark"] body.panel-page .admin-card-tile .meta {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-user-card .name,
html[data-theme="dark"] body.panel-page .admin-card-tile .title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-empty {
  background: rgba(18, 18, 18, 0.9) !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .adm-metric {
  background: linear-gradient(165deg, #161616 0%, #121212 100%) !important;
  border-color: rgba(248, 250, 252, 0.1) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 28px rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="dark"] body.panel-page .adm-metric-value {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .adm-metric-label {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .admin-btn--muted {
  background: #1a1a1a !important;
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.18) !important;
}

html[data-theme="dark"] body.panel-page .admin-btn--danger {
  background: #1a1a1a !important;
  color: #fca5a5 !important;
  border-color: rgba(248, 113, 113, 0.35) !important;
}

html[data-theme="dark"] body.panel-page .admin-cards-toolbar select,
html[data-theme="dark"] body.panel-page .admin-select--role {
  background: #1a1a1a !important;
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root table,
html[data-theme="dark"] body.panel-page .admin-table-wrap {
  color: #ffffff;
}

html[data-theme="dark"] body.panel-page #admin-panel-root th {
  background: #1c1c1f !important;
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root td {
  color: #ffffff !important;
  border-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root td.cell-title,
html[data-theme="dark"] body.panel-page #admin-panel-root .admin-table .cell-title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root td.cell-muted,
html[data-theme="dark"] body.panel-page #admin-panel-root .admin-table .cell-muted {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-table tbody tr:hover {
  background: rgba(99, 102, 241, 0.12) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root tr:nth-child(even) td {
  background: rgba(255, 255, 255, 0.03);
}

/* Light table wraps / stacked mobile rows stayed white while body text went light — fix contrast */
html[data-theme="dark"] body.panel-page #admin-panel-root .admin-table-wrap {
  background: #161616 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-table-wrap {
  background: #161616 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.32) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-muted {
  color: #ffffff !important;
}

@media (max-width: 768px) {
  html[data-theme="dark"] body.panel-page #users-panel .admin-users-table tbody tr,
  html[data-theme="dark"] body.panel-page #cards-panel .admin-cards-table tbody tr {
    background: rgba(22, 22, 26, 0.96) !important;
    border-color: rgba(248, 250, 252, 0.14) !important;
  }

  html[data-theme="dark"] body.panel-page #users-panel .admin-users-table tbody td::before,
  html[data-theme="dark"] body.panel-page #cards-panel .admin-cards-table tbody td::before {
    color: #ffffff !important;
  }
}

html[data-theme="dark"] body.panel-page #users-panel .admin-users-table tbody tr:hover td {
  background: rgba(99, 102, 241, 0.14) !important;
}

/* Users — modals & lists (grid uses strong/span; body color is !important) */
html[data-theme="dark"] body.panel-page #users-panel .admin-modal-card {
  background: linear-gradient(180deg, #1c1c21 0%, #141416 100%) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 24px 56px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-modal-header h3 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-modal-header p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-user-view-grid div {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-user-view-grid span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-user-view-grid strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-user-card-row {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-user-card-row strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-user-card-row span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-users-empty {
  background: rgba(30, 30, 33, 0.9) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-icon-btn {
  background: #27272a !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-modal-actions {
  border-top-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-user-name {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-user-subtext {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-search-field span,
html[data-theme="dark"] body.panel-page #users-panel .admin-filter-field span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-search-field input,
html[data-theme="dark"] body.panel-page #users-panel .admin-filter-field select {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-copy-btn {
  background: #1a1a1e !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #users-panel .admin-copy-btn:hover {
  background: #27272a !important;
}

/* Cards — detail modal + sections (view grid rules assume dark surface) */
html[data-theme="dark"] body.panel-page #cards-panel .admin-modal-card {
  background: linear-gradient(180deg, #1c1c21 0%, #141416 100%) !important;
  border: 1px solid rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 24px 56px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-modal-header h3 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-modal-header p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-icon-btn {
  background: #27272a !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-icon-btn:hover {
  background: #3f3f46 !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-modal-actions {
  border-top-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-template-picker label {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-template-picker .admin-card-template-hint {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-template-select {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-modal-section {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-modal-section-title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-view-grid div {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-owner-box {
  background: rgba(22, 22, 26, 0.92) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-owner-box.is-empty {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-empty-state {
  background: rgba(22, 22, 28, 0.85) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-summary-pill {
  background: rgba(39, 39, 42, 0.95) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-summary-pill strong {
  color: #ffffff !important;
}

/* Templates — same white-modal issue */
html[data-theme="dark"] body.panel-page #templates-panel .admin-modal-card {
  background: linear-gradient(180deg, #1c1c21 0%, #141416 100%) !important;
  border: 1px solid rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 24px 56px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] body.panel-page #templates-panel .admin-modal-header h3 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #templates-panel .admin-modal-header p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #templates-panel .admin-icon-btn {
  background: #27272a !important;
  color: #ffffff !important;
}

/* Analytics — div-based “tables” (Top Owners, Low Performing Cards, etc.) */
html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-template-row,
html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-owner-row,
html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-card-row {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-template-row strong,
html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-owner-row strong,
html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-card-row strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-template-row span,
html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-owner-row span,
html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-card-row span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-card-row > div:not(:first-child) strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-bar-row span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-bar-row strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-bar-track {
  background: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-list-row {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-list-row strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-list-row span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-rank {
  background: linear-gradient(180deg, rgba(14, 165, 233, 0.28) 0%, rgba(14, 165, 233, 0.14) 100%) !important;
  color: #bae6fd !important;
  border-color: rgba(125, 211, 252, 0.35) !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-breakdown-row {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-breakdown-row span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-breakdown-row strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-table-tools input,
html[data-theme="dark"] body.panel-page #analytics-panel .admin-analytics-table-tools select {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-insight-item h4 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #analytics-panel .admin-insight-item p {
  color: #ffffff !important;
}

/* Wrapped analytics / security tables */
html[data-theme="dark"] body.panel-page #admin-panel-root .adm-ga-table-wrap,
html[data-theme="dark"] body.panel-page #admin-panel-root .adm-sec-table-wrap {
  background: #161616 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .adm-ga-table td,
html[data-theme="dark"] body.panel-page #admin-panel-root .adm-sec-table td {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .adm-ga-table th,
html[data-theme="dark"] body.panel-page #admin-panel-root .adm-sec-table th {
  background: #1c1c1f !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-detail-card-scroll {
  background: #161616 !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-detail-card-table th {
  background: #1c1c1f !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-detail-card-table td {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-detail-support {
  background: linear-gradient(165deg, #1a1a1e 0%, #161616 100%) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-detail-support-row {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-detail-support-row span:first-child {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-detail-support-row span:last-child {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-dl dd {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .adm-tpl-table td,
html[data-theme="dark"] body.panel-page #admin-panel-root .adm-tpl-table th {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .adm-tpl-table thead th {
  background: #1c1c1f !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-invite-panel {
  background: linear-gradient(165deg, #1a1a1e 0%, #161616 100%) !important;
  border-color: rgba(129, 140, 248, 0.22) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-invite-title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-invite-hint {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-card-preview {
  background: #1c1c1f !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root td a {
  color: #93c5fd !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root td a:hover {
  color: #bfdbfe !important;
}

html[data-theme="dark"] body.panel-page #admin-panel-root .admin-page-kicker {
  color: #93c5fd !important;
}

/* Cards panel — list tiles & preview (not real <table>) */
html[data-theme="dark"] body.panel-page #cards-panel .admin-card-name,
html[data-theme="dark"] body.panel-page #cards-panel .admin-card-owner,
html[data-theme="dark"] body.panel-page #cards-panel .admin-card-metric,
html[data-theme="dark"] body.panel-page #cards-panel .admin-card-view-grid strong {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-subtext,
html[data-theme="dark"] body.panel-page #cards-panel .admin-card-owner-subtext,
html[data-theme="dark"] body.panel-page #cards-panel .admin-card-view-grid span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-thumb {
  background: rgba(37, 99, 235, 0.22) !important;
  color: #93c5fd !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-view-grid div {
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-preview-box {
  background: linear-gradient(135deg, rgba(30, 58, 138, 0.28), #161616 55%) !important;
  border-color: rgba(129, 140, 248, 0.22) !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-preview-box h4 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-preview-box p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-search-field span,
html[data-theme="dark"] body.panel-page #cards-panel .admin-filter-field span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-search-field input,
html[data-theme="dark"] body.panel-page #cards-panel .admin-filter-field input,
html[data-theme="dark"] body.panel-page #cards-panel .admin-filter-field select {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #cards-panel .admin-card-status-badge.is-draft {
  background: #27272a !important;
  color: #ffffff !important;
}

/* --- Admin: payment package modal --- */
html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-modal-card.admin-package-modal-card {
  background: linear-gradient(180deg, #1c1c21 0%, #141416 100%) !important;
  border: 1px solid rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 24px 56px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-modal-card .admin-modal-header h3 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-modal-lede,
html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-modal-card .admin-modal-header p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-section {
  background: rgba(22, 22, 26, 0.92) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-section__title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-section__hint {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-form .admin-user-form-field > span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-form .admin-user-form-field input,
html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-form .admin-user-form-field select,
html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-form .admin-user-form-field textarea {
  background: #1a1a1e !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-form .admin-user-form-field input:focus,
html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-form .admin-user-form-field select:focus,
html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-form .admin-user-form-field textarea:focus {
  border-color: #818cf8 !important;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.28) !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-highlight-card {
  background: rgba(79, 70, 229, 0.12) !important;
  border-color: rgba(165, 180, 252, 0.38) !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-form .admin-checkbox-field {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #subscriptions-panel .admin-package-modal-footer {
  border-top-color: rgba(248, 250, 252, 0.1) !important;
}

/* --- Admin: free / comp grant --- */
html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-card .admin-card-header p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-field > span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-field input,
html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-field select {
  background: #1a1a1e !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-field input:focus,
html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-field select:focus {
  border-color: #818cf8 !important;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.28) !important;
}

html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-actions {
  border-top-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-tips {
  background: rgba(22, 22, 28, 0.92) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-tips-list {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #free-comp-cards-panel .admin-free-comp-tips-list strong {
  color: #ffffff !important;
}

/* --- Admin: discount code modal --- */
html[data-theme="dark"] body.panel-page #discount-codes-panel #admin-discount-code-modal .admin-modal-card.admin-discount-modal-card {
  background: linear-gradient(180deg, #1c1c21 0%, #141416 100%) !important;
  border: 1px solid rgba(248, 250, 252, 0.12) !important;
  box-shadow: 0 24px 56px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel #admin-discount-code-modal .admin-modal-header h3 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-modal-lede,
html[data-theme="dark"] body.panel-page #discount-codes-panel #admin-discount-code-modal .admin-modal-header p {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-section {
  background: rgba(22, 22, 26, 0.92) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-section__title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-section__hint {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-field > span {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-field input,
html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-field select,
html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-field textarea {
  background: #1a1a1e !important;
  border-color: rgba(248, 250, 252, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-field input:focus,
html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-field select:focus,
html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-field textarea:focus {
  border-color: #818cf8 !important;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.28) !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-hint {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #discount-codes-panel .admin-discount-modal-footer {
  border-top-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page #profile-panel .admin-password-toggle {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page #profile-panel .admin-password-toggle:hover {
  color: #ffffff !important;
  background: rgba(99, 102, 241, 0.18) !important;
}

/* --- Account --- */
html[data-theme="dark"] {
  --acc-ink: #ffffff;
  --acc-muted: #ffffff;
  --acc-line: rgba(248, 250, 252, 0.12);
  --acc-surface: rgba(18, 18, 18, 0.96);
  --acc-shadow: 0 4px 7px rgba(0, 0, 0, 0.3), 0 18px 38px rgba(0, 0, 0, 0.45);
  --acc-shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.35), 0 28px 64px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] body.panel-page.account-page .acc-sidebar {
  background: linear-gradient(168deg, #161616 0%, #121212 100%) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 10px 40px rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-sidebar-brand,
html[data-theme="dark"] body.panel-page.account-page .acc-sidebar-title {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-sidebar-mail {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-side-nav__link {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-side-nav__ico {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-side-nav__link:hover .acc-side-nav__ico {
  color: #a5b4fc !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-panel {
  background: var(--acc-surface) !important;
  border-color: rgba(248, 250, 252, 0.12) !important;
  box-shadow: var(--acc-shadow-lg) !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-panel h2 {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-panel .hint {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.account-page input:not([type="color"]),
html[data-theme="dark"] body.panel-page.account-page textarea,
html[data-theme="dark"] body.panel-page.account-page select {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-mobile-bar {
  background: rgba(12, 12, 12, 0.92) !important;
  border-bottom-color: rgba(248, 250, 252, 0.1) !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-mobile-bar a {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page.account-page .acc-burger {
  background: #1a1a1a !important;
  border-color: rgba(248, 250, 252, 0.15) !important;
  color: #ffffff !important;
}

/* Mobile site menu (hamburger): same drawer structure as light mode on panel routes */
@media (max-width: 820px) {
  /* navbar.css open drawer uses #fff !important — restore dark shell when menu is open */
  html[data-theme="dark"] .site-header.nav-open .site-nav-panel {
    background:
      radial-gradient(circle at 92% 4%, rgba(99, 102, 241, 0.14) 0, rgba(99, 102, 241, 0) 34%),
      linear-gradient(180deg, rgba(18, 20, 26, 0.98) 0%, rgba(12, 14, 20, 0.99) 100%) !important;
    border-top-color: rgba(248, 250, 252, 0.12) !important;
    box-shadow:
      0 18px 44px rgba(0, 0, 0, 0.45),
      inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  }

  html[data-theme="dark"] .site-header.nav-open .header-inner--unified {
    background: rgba(18, 20, 26, 0.94) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html[data-theme="dark"] .site-header.nav-open .site-nav-panel__close-row {
    background: rgba(18, 20, 26, 0.98) !important;
    border-bottom-color: rgba(248, 250, 252, 0.12) !important;
  }

  /* Signed-in: hide desktop center row + profile tools; show workspace pills + website block */
  html[data-theme="dark"] .site-header--authed .site-nav-panel > .site-nav--center.site-nav--panel-app,
  html[data-theme="dark"] .header-inner--panel-app .site-nav-panel > .site-nav--center.site-nav--panel-app {
    display: none !important;
  }

  html[data-theme="dark"] .site-header--authed .site-nav-panel > .site-nav--desktop-tools,
  html[data-theme="dark"] .header-inner--panel-app .site-nav-panel > .site-nav--desktop-tools {
    display: none !important;
  }

  html[data-theme="dark"] .site-header--authed .site-nav-panel > .site-nav--drawer-mobile,
  html[data-theme="dark"] .header-inner--panel-app .site-nav-panel > .site-nav--drawer-mobile {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 0.35rem;
    width: 100%;
    padding: 0.35rem 0.3rem 0.85rem;
    margin-bottom: 0.65rem;
    border-bottom: 1px solid rgba(248, 250, 252, 0.12);
    background: transparent !important;
    border-radius: 0;
  }

  html[data-theme="dark"] .site-nav-panel .site-nav--more.site-nav--drawer-only {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 0.28rem;
    width: 100%;
    padding: 0.35rem 0.3rem 0.85rem;
    margin-bottom: 0.55rem;
    border-bottom: 1px solid rgba(248, 250, 252, 0.12);
    background: transparent !important;
    border-radius: 0;
  }

  html[data-theme="dark"] .site-nav-panel .site-nav__drawer-label {
    color: rgba(248, 250, 252, 0.55) !important;
  }

  /* Drawer link/pill colors: canonical rules live in navbar.css (site-header--authed) */
}

html[data-theme="dark"] body.panel-page .header-inner--panel-flat .panel-nav-user,
html[data-theme="dark"] body.panel-page .header-inner--panel-app .panel-nav-user {
  background: rgba(248, 250, 252, 0.07) !important;
  border-color: rgba(248, 250, 252, 0.16) !important;
}

html[data-theme="dark"] body.panel-page .header-inner--panel-flat .panel-nav-user__name,
html[data-theme="dark"] body.panel-page .header-inner--panel-app .panel-nav-user__name {
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .header-inner--panel-flat .site-nav__link--panel-pill,
html[data-theme="dark"] body.panel-page .header-inner--panel-app .site-nav__link--panel-pill {
  background: rgba(22, 24, 30, 0.92) !important;
  border-color: rgba(248, 250, 252, 0.18) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.panel-page .header-inner--panel-flat .site-nav__link--panel-pill:hover,
html[data-theme="dark"] body.panel-page .header-inner--panel-app .site-nav__link--panel-pill:hover {
  background: rgba(79, 70, 229, 0.26) !important;
  border-color: rgba(165, 180, 252, 0.38) !important;
  color: #fff !important;
}

html[data-theme="dark"] body.panel-page .header-inner--panel-flat .site-nav__link--panel-pill.is-active,
html[data-theme="dark"] body.panel-page .header-inner--panel-app .site-nav__link--panel-pill.is-active {
  background: linear-gradient(135deg, rgba(79, 70, 229, 0.42), rgba(49, 46, 129, 0.32)) !important;
  border-color: rgba(165, 180, 252, 0.42) !important;
  color: #e0e7ff !important;
}

html[data-theme="dark"] body.panel-page .header-inner--panel-flat .site-nav__btn-logout,
html[data-theme="dark"] body.panel-page .header-inner--panel-app .site-nav__btn-logout {
  background: rgba(127, 29, 29, 0.5) !important;
  border-color: rgba(248, 113, 113, 0.38) !important;
  color: #fecaca !important;
}

html[data-theme="dark"] body.panel-page .admin-sidebar-logout-btn {
  background: linear-gradient(180deg, rgba(127, 29, 29, 0.85), rgba(91, 18, 18, 0.92)) !important;
  border-color: rgba(248, 113, 113, 0.35) !important;
  color: #fecaca !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] body.panel-page.account-page .acc-sidebar-logout-btn {
  background: linear-gradient(180deg, rgba(127, 29, 29, 0.85), rgba(91, 18, 18, 0.92)) !important;
  border-color: rgba(248, 113, 113, 0.35) !important;
  color: #fecaca !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.35);
}

/* Builder link labels — client PNG icons match white stroke icons */
body.panel-page .label-ico .brand-ico-mask.brand-ico--client,
body.panel-page .label-ico img.brand-ico--client {
  filter: brightness(0) invert(1);
  opacity: 0.92;
}