/* Accountants Factory — site-wide night mode.
   Activated by body.dark (js/night.js toggles it; choice stored in
   localStorage 'af-theme' and shared across all pages). */

body.dark{
  --tint:#1D332F;
  --line:#2A453F;
  --gold:#D9B45C;
  --ink:#ECF4F2;
  --body:#B9C9C5;
  --grey:#8FA5A0;
  --cream:#262117;
  --soft:#121F1C;
  --teal:#2FA79D;
  --teal-dark:#259087;
  background:#0E1917;
  color:var(--body);
}

/* nav + menus */
body.dark nav{background:rgba(14,25,23,.93);border-bottom-color:#1E312D}
body.dark .drop{background:rgba(18,31,28,.97);border-color:#2A453F}
body.dark .mnav{background:rgba(14,25,23,.97);border-bottom-color:#2A453F}
body.dark .mnav details{border-bottom-color:#1E312D}
body.dark .mnav .m-link{border-bottom-color:#1E312D}
body.dark .burger{color:#ECF4F2}

/* logo on dark: swap to the recoloured wordmark instead of boxing it in white.
   images/logo-night.png is the owner's own artwork with the ink recoloured
   (teal -> #5FBDB5, dark grey -> #ECF4F2); the shapes and alpha are untouched. */
img.logo-nite{display:none}
body.dark img.logo-day{display:none}
body.dark img.logo-nite{display:block}
body.dark .logo-img{background:none;padding:0;border-radius:0}
body.dark .top img{background:none;padding:0;border-radius:0}

/* white surfaces -> dark surfaces */
body.dark .hero,
body.dark .svc-hero{background:#0E1917}
body.dark .stat,
body.dark .step-card,
body.dark .feature-card,
body.dark .pricing-banner,
body.dark .track,
body.dark .card,
body.dark .q,
body.dark .p-card,
body.dark .table-card,
body.dark .calc-card,
body.dark .choice,
body.dark .form-card,
body.dark .off,
body.dark .route,
body.dark .faq,
body.dark .tbl-wrap,
body.dark .flow,
body.dark .mini,
body.dark .sc,
body.dark .tier,
body.dark .fee-wrap,
body.dark .nf-card,
body.dark .top{background:#152220;border-color:#2A453F}

/* entity chooser + comparison table */
body.dark .r-num{color:#2A453F}
body.dark .r-ans{border-top-color:#2A453F}
body.dark .r-foot{border-top-color:#1E312D}
body.dark .cmp th,body.dark .cmp td{border-bottom-color:#1E312D}
body.dark .cmp thead th,body.dark .cmp thead th:first-child{background:#1D332F;color:#ECF4F2}
body.dark .cmp tbody th{background:#101C1A;color:#ECF4F2}
body.dark .cmp td.no{color:#E0917F}
body.dark .r-fee{background:#241F16;border-color:#3A3122}
/* incorporation pages: process flow rows and the "we prepare it" note */
body.dark .fl{border-bottom-color:#1E312D}
body.dark .prep{background:#241F16;border-color:#3A3122}
body.dark .mini .m-fee{border-top-color:#1E312D}

/* outsourced accounting: scope columns and the two fee tiers */
body.dark .sc.keep{background:#241F16;border-color:#3A3122}
body.dark .sc li{background:#101C1A;border-color:#2A453F;color:#B9C9C5}
body.dark .sc.keep li{background:#1C1810;border-color:#3A3122}
body.dark .tier.deep{border-color:var(--teal)}
body.dark .tier-note{background:#152B27;border-color:#2A453F}

/* pricing: the one-time fee table */
body.dark table.fees th,body.dark table.fees td{border-bottom-color:#1E312D}
body.dark table.fees thead th{background:#1D332F;color:#ECF4F2}
body.dark table.fees tbody th{color:#ECF4F2}
body.dark table.fees tbody tr:hover{background:#101C1A}
body.dark .fee-band th{background:#101C1A;color:#ECF4F2}
body.dark .r-pts li.hl{background:#152B27;color:#BFE4DF}
body.dark .r-pts li.hl b{color:#8FD8CF}

/* FAQ blocks on dark */
body.dark .faq{background:#152220;border-color:#2A453F}
body.dark .faq summary{color:#ECF4F2}
body.dark .faq summary i{color:#5FBDB5}
body.dark .faq p{color:#8FA5A0}
body.dark .off.main{border-color:var(--teal)}

/* form controls. Kept here rather than on one page so any future form
   picks up night mode for free. */
body.dark .fld input,
body.dark .fld select,
body.dark .fld textarea{background:#0E1917;color:#ECF4F2;border-color:#2A453F}
body.dark .fld input::placeholder,
body.dark .fld textarea::placeholder{color:#6E837E}
body.dark .fld input:focus,
body.dark .fld select:focus,
body.dark .fld textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(47,167,157,.20)}
body.dark .form-ok{background:#142A26;border-color:#276B62}
body.dark .form-err{background:#2B1A17;border-color:#7A3B2E;color:#E8B4A6}
body.dark .btn-ghost{background:#152220;color:#ECF4F2;border-color:#2A453F}
body.dark .btn-ghost:hover{background:#1D332F;color:var(--teal)}
/* --teal is lifted to #2FA79D on dark so text keeps its contrast, but a large
   filled area at that brightness glares. Filled buttons get a dimmer teal. */
body.dark .btn-primary{background:#186F67;color:#fff;box-shadow:0 8px 20px rgba(0,0,0,.35)}
body.dark .btn-primary:hover{background:#1E837A}

/* section curves drawn as inline SVG */
body.dark .curve svg path{fill:#121F1C}

/* theme toggle button */
/* Bottom-LEFT, not right: the SalesIQ chat bubble occupies the bottom-right
   corner and the two would sit on top of each other. Chat belongs on the
   right because that is where people look for it, so the toggle moved. */
.mode-fab{position:fixed;bottom:20px;left:20px;z-index:120;width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line);background:#fff;color:var(--ink);font-size:1.05rem;cursor:pointer;display:grid;place-items:center;box-shadow:0 6px 18px rgba(19,36,32,.14);transition:.2s}
.mode-fab:hover{border-color:var(--teal);color:var(--teal)}
body.dark .mode-fab{background:#152220;border-color:#2A453F;color:#ECF4F2}

/* shared fixes (apply in both modes): pages whose inline CSS lacks the
   nav logo sizing rule (pricing, calculators) */
.logo-img{height:42px;width:auto;display:block;object-fit:contain}

/* light gradient surfaces -> dark */
body.dark .page-hero{background:linear-gradient(180deg,#0E1917 0%,#121F1C 100%)}
body.dark .featured{background:linear-gradient(180deg,#152220 0%,#172622 100%)}

/* the Start -> Run -> Build stepper on the stage pages. Its inline CSS sets a
   white pill, so without this the two inactive steps stay white at night.
   The .here rule has to be repeated because "body.dark .jst" outranks it. */
body.dark .jst{background:#152220;border-color:#2A453F;color:#9FB5B0}
body.dark .jst.here{background:var(--teal);border-color:var(--teal);color:#fff}

body.dark .zp-shot{background:#152220;border-color:#2A453F}
body.dark .zp-shot img{border-color:#2A453F}

/* tools: the calculator surfaces and the number/range inputs */
body.dark .cbox{background:#152220;border-color:#2A453F}
body.dark .kpi{background:#101C1A;border-color:#2A453F}
body.dark .sliders{border-top-color:#1E312D}
body.dark .unlock{background:#152B27;border-color:#2A453F}
body.dark .fldc input[type=number]{background:#0E1917;color:#ECF4F2;border-color:#2A453F}
body.dark .fldc input[type=number]:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(47,167,157,.20)}

/* The four legacy pages (404, cookie, privacy, terms) still load style-v2.css,
   which sets .btn-ghost with !important. That outranks specificity, so the
   nav's Client Login button stayed white at night. !important here is the only
   thing that wins it back, and it is scoped to body.dark so day mode is
   untouched. */
body.dark .btn-ghost{background:#152220 !important;color:#ECF4F2 !important;border-color:#2A453F !important}
body.dark .btn-ghost:hover{background:#1D332F !important;color:var(--teal) !important}