/*
 * TamilAccounting public site — dark mode.
 * html[data-theme="dark"] is set before first paint by the inline script in header.php:
 * the visitor's saved choice (toggle in the navbar) or, failing that, the device setting.
 * Tokens flip first; the rules after them cover the few places that hard-code light colours.
 */
html[data-theme="dark"] {
  color-scheme: dark;
  --ta-page: #0b1120;
  --ta-surface: #0f1729;
  --ta-card: #141d31;
  --ta-border: #233049;
  --ta-heading: #e8eefa;
  --ta-body: #c3cddf;
  --ta-muted: #93a1ba;
  --ta-primary: #5274d4;
  --ta-primary-dark: #3f61c2;
  --ta-primary-light: rgba(82,116,212,.16);
  --ta-accent: #2fc28f;
  --ta-accent-dark: #22a578;
  --ta-accent-light: rgba(47,194,143,.14);
  --ta-shadow-card: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.25);
  --ta-shadow-lift: 0 14px 40px rgba(0,0,0,.45);
  --ta-danger-soft: rgba(220,38,38,.14);
  --ta-danger-ink: #fca5a5;
  --ta-ok-soft: rgba(47,194,143,.14);
  --ta-ok-ink: #6ee7b7;

  /* design-system aliases used across style.css */
  --fg-heading: var(--ta-heading);
  --fg-body: var(--ta-body);
  --fg-muted: var(--ta-muted);
  --bg-page: var(--ta-page);
  --bg-subtle: var(--ta-surface);
  --bg-muted: #16203a;
  --border-default: var(--ta-border);
  --border-strong: #2e3c59;
  --dark: #e8eefa;
  --dark-2: #c3cddf;
  --dark-3: #a9b5cb;
  --slate: var(--ta-muted);
  --light: #16203a;
  --lighter: var(--ta-surface);
  --white: var(--ta-card);
  --border: var(--ta-border);
  --primary-l: var(--ta-primary-light);
  --green-l: rgba(16,185,129,.14);
  --amber-l: rgba(245,158,11,.14);
  --color-neutral-50: var(--ta-surface);
  --color-neutral-100: #16203a;
  --color-neutral-200: var(--ta-border);
  --color-primary-50: var(--ta-primary-light);
  --color-accent-50: var(--ta-accent-light);
}

html[data-theme="dark"] body { background: var(--ta-page); color: var(--ta-body); }

/* Surfaces that hard-code white in style.css */
html[data-theme="dark"] :is(
  .ta-navbar, .ta-card, .ta-card-sm, .ta-testimonial, .ta-stats-bar, .ta-tab.active, .ta-blog-card,
  .ta-module-feature-card, .ta-pricing-card, .ta-search, .ta-dash-card, .ta-flow-step, .ta-module-btn,
  .ta-why-card, .ta-about-stat,
  .home-module-card, .feature-list-item, .pricing, .browser-frame, .addr, .plan-feature-card,
  .enterprise-card, .country-card-lg, .capability-card, .step-card, .app-card, .value-card,
  .search-form-inline, .blog-card, .contact-info-card, .contact-form-wrap, .contact-location-card,
  .testimonial-card, .doc-index-card, .search-form form, .ta-docs-mobile-bar, .ta-docs-sidebar-wrap,
  .ta-docs-index-card, .ta-docs-page-nav, .ta-docs-nav-link.active, .ta-docs-search, .ta-extra-card,
  .ta-highlight-card, .ta-mm-feature.is-preview, .blog-related-card, .faq-item,
  .ta-accordion-item, .dropdown-menu, .card, .modal-content, .list-group-item, .bg-white, .bg-light
) {
  background-color: var(--ta-card) !important;
  border-color: var(--ta-border) !important;
  color: var(--ta-body);
}
/* Full-width sections that hard-code white take the page colour, not the card colour */
html[data-theme="dark"] :is(.feature-block, .feature-block.procurement, .mod-hero, .stats-bar) { background-color: var(--ta-page) !important; border-color: var(--ta-border) !important; }
html[data-theme="dark"] .ta-navbar { background-color: rgba(11,17,32,.92) !important; backdrop-filter: saturate(140%) blur(10px); }
html[data-theme="dark"] .ta-navbar.scrolled { box-shadow: 0 1px 0 var(--ta-border), 0 8px 24px rgba(0,0,0,.35); }
html[data-theme="dark"] .ta-navbar .navbar-collapse { background: transparent; }
html[data-theme="dark"] .ta-mm-ico { background: rgba(255,255,255,.06) !important; }
html[data-theme="dark"] .ta-mm-item:hover { background: rgba(255,255,255,.04); }
html[data-theme="dark"] .navbar-toggler span { color: var(--ta-heading) !important; }
html[data-theme="dark"] .btn-ta-login { color: var(--ta-heading) !important; border-color: var(--ta-border) !important; }

/* Text that hard-codes slate ink */
html[data-theme="dark"] :is(.ta-feat-list li, .ta-pricing-feat, .text-dark, .text-black) { color: var(--ta-body) !important; }
html[data-theme="dark"] .text-muted { color: var(--ta-muted) !important; }
html[data-theme="dark"] :is(h1, h2, h3, h4, h5, h6) { color: var(--ta-heading); }
html[data-theme="dark"] :is(.ta-badge-warning, .discount-badge, .ta-docs-callout-warning) { background: rgba(245,158,11,.14) !important; color: #fcd34d !important; }

/* Forms */
html[data-theme="dark"] :is(input, select, textarea, .form-control, .form-select) {
  background-color: #0f1729 !important; color: var(--ta-heading) !important; border-color: var(--ta-border) !important;
}
html[data-theme="dark"] ::placeholder { color: #6f7d96 !important; }

/* Tables */
html[data-theme="dark"] .table { color: var(--ta-body); border-color: var(--ta-border); --bs-table-bg: transparent; --bs-table-striped-bg: rgba(255,255,255,.03); --bs-table-hover-bg: rgba(255,255,255,.05); }
html[data-theme="dark"] .table > :not(caption) > * > * { border-bottom-color: var(--ta-border); color: inherit; }
html[data-theme="dark"] :is(table th) { color: var(--ta-heading); }

/* Inline styles in older templates — catch the common light backgrounds and dark inks */
html[data-theme="dark"] :is([style*="background:#fff"], [style*="background: #fff"], [style*="background:#FFF"],
  [style*="background:white"], [style*="background: white"], [style*="background-color:#fff"],
  [style*="background:#f8fafc"], [style*="background:#F8FAFC"], [style*="background:#f1f5f9"],
  [style*="background:#eef2fb"], [style*="background:var(--white)"], [style*="background:#fafbfc"]) {
  background: var(--ta-card) !important;
}
html[data-theme="dark"] :is([style*="color:#0f172a"], [style*="color:#0F172A"], [style*="color:#1e293b"],
  [style*="color:#334155"], [style*="color:#111"], [style*="color:#222"], [style*="color:#333"],
  [style*="color:var(--dark)"], [style*="color:#475569"]) {
  color: var(--ta-body) !important;
}
html[data-theme="dark"] :is([style*="border:1px solid #e2e8f0"], [style*="border-color:#e2e8f0"], [style*="border:1px solid #E2E8F0"]) {
  border-color: var(--ta-border) !important;
}

/* Media and imagery */
html[data-theme="dark"] :is(.mod-tx-section img, .mod-tx-shot, .mod-tx-hero-shot) { box-shadow: 0 24px 60px rgba(0,0,0,.45); }
html[data-theme="dark"] .mod-tx-section img, html[data-theme="dark"] .mod-tx-hero-shot img { filter: brightness(.92); }
html[data-theme="dark"] .ta-vid-frame, html[data-theme="dark"] .ta-short { background: #050912; }
html[data-theme="dark"] .ta-mock-bar span { background: #2e3c59; }
html[data-theme="dark"] .ta-chip--warn { background: rgba(245,158,11,.14); color: #fcd34d; }
html[data-theme="dark"] .ta-growth-card .ta-growth-num { color: transparent; -webkit-text-stroke: 1px #3f5fae; }
html[data-theme="dark"] .ta-compare td.good { background: rgba(47,194,143,.06); }

/* Sections that are already dark stay as they are */
html[data-theme="dark"] :is(.countries-section, .ta-footer, .mod-cta, .cta-strip) { filter: none; }
html[data-theme="dark"] .ta-footer { background: #070b16; border-top: 1px solid var(--ta-border); }
html[data-theme="dark"] .countries-section { background: #0a1122; }
html[data-theme="dark"] .contact-trial-panel { background: linear-gradient(135deg, rgba(82,116,212,.16), rgba(47,194,143,.12)) !important; border-color: var(--ta-border) !important; }
html[data-theme="dark"] :is(.rsl-cmp td.rsl-cmp-us) { background: rgba(217,119,6,.14) !important; color: #fcd34d !important; }
html[data-theme="dark"] .rsl-cmp tbody tr:hover { background: rgba(255,255,255,.03) !important; }

/* AI Concierge page and the home feature panels keep page-specific light surfaces */
html[data-theme="dark"] .aic-bench { background: linear-gradient(180deg, var(--ta-surface), var(--ta-page)) !important; }
html[data-theme="dark"] .aic-chat { border-color: var(--ta-border) !important; }
html[data-theme="dark"] .aic-chat-body { background: var(--ta-surface) !important; }
html[data-theme="dark"] .aic-chat-foot { border-top-color: var(--ta-border) !important; color: var(--ta-muted) !important; }
html[data-theme="dark"] .aic-actbtn { background: var(--ta-primary-light) !important; border-color: var(--ta-border) !important; color: #a9bdf0 !important; }
html[data-theme="dark"] .ta-feature-img { background: var(--ta-surface) !important; }
