/* ============================================================
   PassionBits — Design Tokens
   Color system modeled on Substack (Mobbin reference): monochrome
   ink ramp on pure-white surfaces, with a SINGLE saturated accent.
   Hierarchy comes from type weight + hairlines, not background tints.
   Variable names are kept stable so every screen updates at once.
   ============================================================ */
:root {
  /* ---- Ink ramp (was navy/label) — near-black, no hue ---- */
  --pb-navy:        #1A1A1A; /* primary ink: headings, values, names */
  --pb-orange:      #FF6719; /* THE accent — Substack orange. Primary action only. */
  --pb-label:       #6B6B6B; /* secondary / field labels */

  /* ---- Surfaces: pure white base, two neutral grays, no warm tint ---- */
  --pb-cream:       #F5F5F5; /* surface-1: inputs, chips, icon buttons, seg/stepper */
  --pb-peach:       #F0F0F0; /* surface-2: emphasis cards / totals (slightly deeper) */
  --pb-white:       #FFFFFF;

  /* ---- Derived / supporting ---- */
  --pb-navy-60:     #6B6B6B; /* secondary text (meta, summaries) */
  --pb-placeholder: #A0A0A0; /* input placeholders / tertiary captions */
  --pb-line:        #E7E7E7; /* hairline dividers + borders (the Substack separator) */
  --pb-orange-soft: #FFF0E9; /* faint accent tint for selected rows / active states */
  --pb-blue-soft:   #FFF0E9; /* (legacy name) now folded into the single accent */
  --pb-blue-soft-2: #FFE4D6;
  --pb-success:     #1A8F57; /* "Paid" — text only, no filled chip */
  --pb-warn:        #B7791F; /* "Sent / Pending" — text only */
  --pb-bg:          #FFFFFF; /* app canvas */

  /* ---- Typography ---- */
  --pb-font: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --pb-fw-medium: 500;
  --pb-fw-semibold: 600;
  --pb-fw-bold: 700;

  /* type scale (mobile) */
  --pb-fs-display: 24px; /* screen titles */
  --pb-fs-h2:      18px; /* section headers (Bill To) */
  --pb-fs-body:    15px; /* input values */
  --pb-fs-label:   13px; /* field labels */
  --pb-fs-small:   12px; /* helper / captions */

  /* ---- Radius / spacing / shadow ---- */
  --pb-r-sm: 8px;
  --pb-r-md: 12px;
  --pb-r-lg: 16px;
  --pb-r-pill: 999px;

  --pb-sp-1: 4px;
  --pb-sp-2: 8px;
  --pb-sp-3: 12px;
  --pb-sp-4: 16px;
  --pb-sp-5: 20px;
  --pb-sp-6: 24px;

  /* Substack is near-flat: hierarchy is type + hairlines, not elevation. */
  --pb-shadow-sheet: 0 -10px 30px rgba(0, 0, 0, 0.10);
  --pb-shadow-card:  0 1px 2px rgba(0, 0, 0, 0.04);
  --pb-shadow-fab:   none; /* primary buttons stay flat — no colored glow */

  /* mobile frame */
  --pb-screen-w: 390px;
  --pb-screen-h: 844px;
}