/* ============================================================
   LAWFIRM PRO — DARK MODE
   Loaded when body.lf-dark-mode (manual) or automatically
   via @media (prefers-color-scheme: dark) when theme is set
   to "auto". Overrides CSS design tokens; all components
   inherit the new values automatically.
   ============================================================ */

/* ── Shared token overrides for auto (system) dark mode ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    /* Light surfaces → dark surfaces */
    --lf-bg:            #12141E;
    --lf-bg2:           #1A1C28;
    --lf-bg3:           #20222E;
    --lf-card:          rgba(26,28,40,0.88);
    --lf-card-solid:    #1A1C28;

    /* Dark surfaces stay (or deepen) */
    --lf-dark:          #090B14;
    --lf-dark2:         #111320;
    --lf-dark3:         #040508;

    /* Ink → inverted */
    --lf-ink:           #E8E4D8;
    --lf-ink2:          #A8A49A;
    --lf-ink3:          #66625A;
    --lf-ink-inv:       #12141E;

    /* Borders → subtle light */
    --lf-border:        rgba(255,255,255,0.08);
    --lf-border2:       rgba(255,255,255,0.04);
  }
}

/* ── Manual dark mode (body class) — same token set ── */
body.lf-dark-mode {
  --lf-bg:            #12141E;
  --lf-bg2:           #1A1C28;
  --lf-bg3:           #20222E;
  --lf-card:          rgba(26,28,40,0.88);
  --lf-card-solid:    #1A1C28;
  --lf-dark:          #090B14;
  --lf-dark2:         #111320;
  --lf-dark3:         #040508;
  --lf-ink:           #E8E4D8;
  --lf-ink2:          #A8A49A;
  --lf-ink3:          #66625A;
  --lf-ink-inv:       #12141E;
  --lf-border:        rgba(255,255,255,0.08);
  --lf-border2:       rgba(255,255,255,0.04);
}

/* ═══════════════════════════════════════════
   GLOBAL BODY BACKGROUND IN DARK
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body,
  body.lf-dark-mode {
    background: var(--lf-bg);
    color: var(--lf-ink);
  }
}
body.lf-dark-mode {
  background: var(--lf-bg);
  color: var(--lf-ink);
}

/* ═══════════════════════════════════════════
   HEADER
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .lf-header { background: var(--lf-dark2); border-bottom-color: rgba(255,255,255,0.06); } }
body.lf-dark-mode .lf-header { background: var(--lf-dark2); border-bottom-color: rgba(255,255,255,0.06); }

@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .lf-top-bar { background: var(--lf-dark3); border-bottom-color: rgba(255,255,255,0.05); } }
body.lf-dark-mode .lf-top-bar { background: var(--lf-dark3); border-bottom-color: rgba(255,255,255,0.05); }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lf-nav__menu > li > a { color: var(--lf-ink2); }
  :root:not([data-theme="light"]) .lf-nav__menu > li > a:hover { background: rgba(255,255,255,0.06); color: var(--lf-ink); }
  :root:not([data-theme="light"]) .lf-nav__menu > li.current-menu-item > a { color: var(--lf-accent2); }
  :root:not([data-theme="light"]) .lf-nav__menu .sub-menu { background: var(--lf-dark2); border-color: rgba(255,255,255,0.08); }
}
body.lf-dark-mode .lf-nav__menu > li > a { color: var(--lf-ink2); }
body.lf-dark-mode .lf-nav__menu > li > a:hover { background: rgba(255,255,255,0.06); color: var(--lf-ink); }
body.lf-dark-mode .lf-nav__menu > li.current-menu-item > a { color: var(--lf-accent2); }
body.lf-dark-mode .lf-nav__menu .sub-menu { background: var(--lf-dark2); border-color: rgba(255,255,255,0.08); }

/* ═══════════════════════════════════════════
   SECTIONS
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lf-section { background: var(--lf-bg); }
  :root:not([data-theme="light"]) .lf-section--alt { background: var(--lf-bg2); }
  :root:not([data-theme="light"]) .lf-section__title { color: var(--lf-ink); }
  :root:not([data-theme="light"]) .lf-section__text  { color: var(--lf-ink2); }
  :root:not([data-theme="light"]) .lf-section__eyebrow { color: var(--lf-accent2); }
}
body.lf-dark-mode .lf-section { background: var(--lf-bg); }
body.lf-dark-mode .lf-section--alt { background: var(--lf-bg2); }
body.lf-dark-mode .lf-section__title { color: var(--lf-ink); }
body.lf-dark-mode .lf-section__text  { color: var(--lf-ink2); }
body.lf-dark-mode .lf-section__eyebrow { color: var(--lf-accent2); }

/* ═══════════════════════════════════════════
   CARDS — Service / Attorney / Testimonial / Blog
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lf-service-card,
  :root:not([data-theme="light"]) .lf-attorney-card,
  :root:not([data-theme="light"]) .lf-blog-card {
    background: var(--lf-card-solid);
    border-color: var(--lf-border);
  }
  :root:not([data-theme="light"]) .lf-service-card__title,
  :root:not([data-theme="light"]) .lf-attorney-card__name a,
  :root:not([data-theme="light"]) .lf-blog-card__title a { color: var(--lf-ink); }
  :root:not([data-theme="light"]) .lf-service-card__desc,
  :root:not([data-theme="light"]) .lf-attorney-card__excerpt,
  :root:not([data-theme="light"]) .lf-blog-card__excerpt { color: var(--lf-ink2); }
  :root:not([data-theme="light"]) .lf-attorney-card__specialty { color: var(--lf-accent2); }
  :root:not([data-theme="light"]) .lf-testimonial-card {
    background: var(--lf-card-solid); border-color: var(--lf-border);
  }
  :root:not([data-theme="light"]) .lf-testimonial-card__text { color: var(--lf-ink2); }
  :root:not([data-theme="light"]) .lf-testimonial-card__name { color: var(--lf-ink); }
  :root:not([data-theme="light"]) .lf-attorney-card__placeholder {
    background: var(--lf-bg3); color: var(--lf-ink3);
  }
}
body.lf-dark-mode .lf-service-card,
body.lf-dark-mode .lf-attorney-card,
body.lf-dark-mode .lf-blog-card { background: var(--lf-card-solid); border-color: var(--lf-border); }
body.lf-dark-mode .lf-service-card__title,
body.lf-dark-mode .lf-attorney-card__name a,
body.lf-dark-mode .lf-blog-card__title a { color: var(--lf-ink); }
body.lf-dark-mode .lf-service-card__desc,
body.lf-dark-mode .lf-attorney-card__excerpt,
body.lf-dark-mode .lf-blog-card__excerpt { color: var(--lf-ink2); }
body.lf-dark-mode .lf-attorney-card__specialty { color: var(--lf-accent2); }
body.lf-dark-mode .lf-testimonial-card { background: var(--lf-card-solid); border-color: var(--lf-border); }
body.lf-dark-mode .lf-testimonial-card__text { color: var(--lf-ink2); }
body.lf-dark-mode .lf-testimonial-card__name { color: var(--lf-ink); }

/* ═══════════════════════════════════════════
   FORMS
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lf-form-group label { color: var(--lf-ink3); }
  :root:not([data-theme="light"]) .lf-form-group input,
  :root:not([data-theme="light"]) .lf-form-group textarea,
  :root:not([data-theme="light"]) .lf-form-group select {
    background: var(--lf-bg3);
    border-color: var(--lf-border);
    color: var(--lf-ink);
  }
  :root:not([data-theme="light"]) .lf-form-group input:focus,
  :root:not([data-theme="light"]) .lf-form-group textarea:focus {
    border-color: rgba(var(--lf-accent-rgb),0.6);
    box-shadow: 0 0 0 3px rgba(var(--lf-accent-rgb),0.15);
  }
  :root:not([data-theme="light"]) .lf-form-group input::placeholder,
  :root:not([data-theme="light"]) .lf-form-group textarea::placeholder { color: var(--lf-ink3); }
}
body.lf-dark-mode .lf-form-group label { color: var(--lf-ink3); }
body.lf-dark-mode .lf-form-group input,
body.lf-dark-mode .lf-form-group textarea,
body.lf-dark-mode .lf-form-group select { background: var(--lf-bg3); border-color: var(--lf-border); color: var(--lf-ink); }
body.lf-dark-mode .lf-form-group input:focus,
body.lf-dark-mode .lf-form-group textarea:focus { border-color: rgba(var(--lf-accent-rgb),0.6); box-shadow: 0 0 0 3px rgba(var(--lf-accent-rgb),0.15); }
body.lf-dark-mode .lf-form-group input::placeholder,
body.lf-dark-mode .lf-form-group textarea::placeholder { color: var(--lf-ink3); }

/* ═══════════════════════════════════════════
   STATS BAR
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lf-stats { background: var(--lf-dark2); border-color: rgba(255,255,255,0.05); }
  :root:not([data-theme="light"]) .lf-stats__label { color: var(--lf-ink3); }
}
body.lf-dark-mode .lf-stats { background: var(--lf-dark2); border-color: rgba(255,255,255,0.05); }
body.lf-dark-mode .lf-stats__label { color: var(--lf-ink3); }

/* ═══════════════════════════════════════════
   WHY US / FEATURES
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lf-why { background: var(--lf-bg); }
  :root:not([data-theme="light"]) .lf-why__feature-title { color: var(--lf-ink); }
  :root:not([data-theme="light"]) .lf-why__feature-desc  { color: var(--lf-ink2); }
}
body.lf-dark-mode .lf-why { background: var(--lf-bg); }
body.lf-dark-mode .lf-why__feature-title { color: var(--lf-ink); }
body.lf-dark-mode .lf-why__feature-desc  { color: var(--lf-ink2); }

/* ═══════════════════════════════════════════
   SIDEBAR CTA
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lf-sidebar-cta { background: var(--lf-dark); }
}
body.lf-dark-mode .lf-sidebar-cta { background: var(--lf-dark); }

/* ═══════════════════════════════════════════
   PAGINATION / TAGS
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lf-pagination .page-numbers {
    background: var(--lf-bg2); border-color: var(--lf-border); color: var(--lf-ink2);
  }
  :root:not([data-theme="light"]) .lf-tag { background: var(--lf-bg2); border-color: var(--lf-border); color: var(--lf-ink2); }
}
body.lf-dark-mode .lf-pagination .page-numbers { background: var(--lf-bg2); border-color: var(--lf-border); color: var(--lf-ink2); }
body.lf-dark-mode .lf-tag { background: var(--lf-bg2); border-color: var(--lf-border); color: var(--lf-ink2); }

/* ═══════════════════════════════════════════
   BREADCRUMB
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lf-breadcrumb a { color: var(--lf-ink3); }
  :root:not([data-theme="light"]) .lf-breadcrumb li.active { color: var(--lf-ink3); }
}
body.lf-dark-mode .lf-breadcrumb a { color: var(--lf-ink3); }
body.lf-dark-mode .lf-breadcrumb li.active { color: var(--lf-ink3); }

/* ═══════════════════════════════════════════
   SEARCH
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .search-field { background: var(--lf-bg3); border-color: var(--lf-border); color: var(--lf-ink); }
  :root:not([data-theme="light"]) .search-submit { background: var(--lf-bg2); color: var(--lf-accent); border-color: var(--lf-border); }
}
body.lf-dark-mode .search-field { background: var(--lf-bg3); border-color: var(--lf-border); color: var(--lf-ink); }
body.lf-dark-mode .search-submit { background: var(--lf-bg2); color: var(--lf-accent); border-color: var(--lf-border); }

/* ═══════════════════════════════════════════
   DARK TOGGLE BUTTON  (injected by JS)
═══════════════════════════════════════════ */
.lf-dark-toggle {
  position: fixed; bottom: 80px;
  left: 1.5rem; /* RTL: left side */
  z-index: 999;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--lf-card-solid, #1A1C28);
  border: 1px solid var(--lf-border, rgba(255,255,255,0.1));
  box-shadow: 0 4px 16px rgba(0,0,0,0.3);
  cursor: pointer; font-size: 1.2rem;
  display: flex; align-items: center; justify-content: center;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.lf-dark-toggle:hover { transform: scale(1.1); box-shadow: 0 6px 20px rgba(0,0,0,0.4); }