/* AdvisorPPC brand tokens — the advisorppc.com palette for pages that do not
 * load the app shell (static/app.css carries the same tokens for the signed-in
 * dashboard). Linked by /pricing and the marketing pages AFTER their own
 * sheets so these :root values win.
 *
 * Light values are the site's globals.css @theme; dark values are the site's
 * advisor-theme.css .advisor-theme-dark (aluminum accent). Keep the two files
 * in step: tests/test_design_system_parity.py asserts it.
 */
:root {
  color-scheme: light;

  --paper: #ffffff;
  --ink: #000000;
  --muted: #706f68;
  --line: #e8e8e1;
  --line-strong: #8d8b83;
  --card: #fbfaf7;
  --elevated: #f4f2ec;
  --pos: #1dbf73;
  --neg: #d1483a;
  --accent: #111111;
  --accent-deep: #000000;
  --accent-wash: #f1f3ef;
  --on-accent: #ffffff;
  --focus-ring: #111111;
  --brand: #111111;

  --font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
               Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Fraunces", ui-serif, Georgia, "Times New Roman", serif;

  /* Names the older pages use. */
  --brand-muted: var(--muted);
  --brand-line: var(--line);
  --bg: var(--paper);
  --surface: var(--card);
  --soft: var(--muted);
  --accent-hover: var(--accent-deep);
  --accent-ink: var(--on-accent);
  --accent-soft: var(--accent-wash);
  --hover-bg: var(--elevated);
  --ok: #0f5c3a;
  --ok-soft: #e7f1ec;
  --ok-line: #b9dccb;
  --warn: #7a4e00;
  --warn-soft: #f7efdf;
  --warn-line: #e6d4ad;
  --danger: #9b2c2c;
  --danger-soft: #f8e9e9;
  --danger-line: #e9c5c5;
  --info: #5d5c56;
  --info-soft: #f0efe9;
  --radius-sm: 0.5rem;
  --sp-2: 8px;
  --sp-3: 12px;
  --tap: 44px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper: #090909;
    --ink: #f5f4ef;
    --muted: #a6a6a0;
    --line: #30302c;
    --line-strong: #6a6a64;
    --card: #1b1b19;
    --elevated: #262624;
    --pos: #68bd89;
    --neg: #f2908f;
    --accent: #f7f7f2;
    --accent-deep: #ffffff;
    --accent-wash: rgb(255 255 255 / 8%);
    --on-accent: #171411;
    --focus-ring: #f7f7f2;
    --brand: #f7f7f2;
    --ok: #6bd99d;
    --ok-soft: #182320;
    --ok-line: #24453a;
    --warn: #e5b567;
    --warn-soft: #241f16;
    --warn-line: #4a3d1c;
    --danger: #f2908f;
    --danger-soft: #261a1a;
    --danger-line: #4d2626;
    --info: #a6a6a0;
    --info-soft: #232321;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #090909;
  --ink: #f5f4ef;
  --muted: #a6a6a0;
  --line: #30302c;
  --line-strong: #6a6a64;
  --card: #1b1b19;
  --elevated: #262624;
  --pos: #68bd89;
  --neg: #f2908f;
  --accent: #f7f7f2;
  --accent-deep: #ffffff;
  --accent-wash: rgb(255 255 255 / 8%);
  --on-accent: #171411;
  --focus-ring: #f7f7f2;
  --brand: #f7f7f2;
  --ok: #6bd99d;
  --ok-soft: #182320;
  --ok-line: #24453a;
  --warn: #e5b567;
  --warn-soft: #241f16;
  --warn-line: #4a3d1c;
  --danger: #f2908f;
  --danger-soft: #261a1a;
  --danger-line: #4d2626;
  --info: #a6a6a0;
  --info-soft: #232321;
}

/* Logo lockup used by the pricing and marketing headers. */
.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
}
.brand-logo { width: 28px; height: 28px; border-radius: 7px; display: block; flex: 0 0 auto; }
/* The marketing pages do not load the web fonts, so the lockup keeps its
   sans wordmark there; /pricing (which does) sets the serif in its own sheet. */
.brand-wordmark {
  font-size: 18px;
  font-weight: 780;
  letter-spacing: -0.035em;
  line-height: 1;
}
.brand-wordmark strong { color: var(--pos); font-weight: 800; }
:root[data-theme="dark"] .brand-logo,
:root:not([data-theme="light"]) .brand-logo { box-shadow: 0 0 0 1px var(--line); }
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .brand-logo { box-shadow: none; }
}

/* Google's sign-in button keeps Google's light styling in every theme. */
:root[data-theme="dark"] .google-login-btn,
:root:not([data-theme="light"]) .google-login-btn {
  background: #ffffff;
  color: #1f1f1f;
  border-color: #dadce0;
}

/* Theme toggle control. */
.theme-toggle {
  display: grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
}
.theme-toggle:hover { background: var(--elevated); }
.theme-toggle svg { grid-area: 1 / 1; width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle .icon-moon { visibility: hidden; }
:root[data-theme="dark"] .theme-toggle .icon-sun { visibility: hidden; }
:root[data-theme="dark"] .theme-toggle .icon-moon { visibility: visible; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-toggle .icon-sun { visibility: hidden; }
  :root:not([data-theme="light"]) .theme-toggle .icon-moon { visibility: visible; }
}
.auth-theme-toggle {
  display: flex;
  justify-content: flex-end;
  margin: calc(var(--sp-3) * -1) calc(var(--sp-2) * -1) calc(var(--sp-3) * -1) 0;
}
