/* ============================================================
   The Circle of Care — theme tokens  (R0.9 · "Calm Clinic")
   Healing teal leads (trust), warm coral carries the heart,
   soft cream keeps it human. Full light + dark, WCAG-AA,
   senior-legible. Harmonizes with the terracotta/teal logo.
   ============================================================ */

:root {
  /* Surfaces */
  --bg:          #F6F2EA;  /* warm cream */
  --surface:     #FFFFFF;
  --surface-2:   #EFE8DB;  /* warm sand */
  --tint-teal:   #E2F0EC;  /* healing wash */
  --tint-sky:    #E7EDF6;  /* calm periwinkle wash */
  --tint-warm:   #F6E7E1;  /* gentle coral wash */

  --ink:         #26201B;
  --muted:       #6A5E53;

  /* Brand + supporting hues */
  --primary:     #2C7A6B;  /* healing teal (AA on white) */
  --primary-strong:#216155;
  --on-primary:  #FFFFFF;
  --accent:      #C05A43;  /* warm coral — the heart */
  --accent-strong:#A84A35;
  --on-accent:   #FFFFFF;
  --info:        #3F6AA6;  /* calm periwinkle-blue */
  --on-info:     #FFFFFF;
  --gold:        #C6892F;  /* honey highlight */

  --ok:          #2C7A6B;
  --warn:        #B5771F;
  --danger:      #C05A43;

  --line:        #E6DCCC;
  --ring:        rgba(44,122,107,.40);
  --shadow:      0 1px 2px rgba(38,32,27,.05), 0 10px 28px rgba(38,32,27,.09);
  --shadow-soft: 0 1px 2px rgba(38,32,27,.04), 0 4px 14px rgba(38,32,27,.06);

  /* Type */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body:    "Hanken Grotesk", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Scale — senior-friendly base */
  --fs-base: 18px;
  --radius: 16px;
  --radius-sm: 11px;
  --tap: 48px;
  --maxw: 1080px;
  --gutter: 16px;
}

/* ---- Dark palette ---- */
:root[data-theme="dark"],
:root:not([data-theme="light"]) {
  --dk-bg:        #14100C;
  --dk-surface:   #1E1812;
  --dk-surface-2: #29211A;
  --dk-tint-teal: #16261F;
  --dk-tint-sky:  #171E29;
  --dk-tint-warm: #2A1A14;
  --dk-ink:       #F3ECE0;
  --dk-muted:     #B7A895;
  --dk-primary:   #5FB6A3;
  --dk-primary-strong:#73C5B3;
  --dk-on-primary:#0E1A16;
  --dk-accent:    #E58A6F;
  --dk-accent-strong:#EC9C84;
  --dk-on-accent: #231A15;
  --dk-info:      #7CA2DA;
  --dk-on-info:   #0E1724;
  --dk-gold:      #E0B266;
  --dk-line:      #352A20;
  --dk-ring:      rgba(95,182,163,.45);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:var(--dk-bg);--surface:var(--dk-surface);--surface-2:var(--dk-surface-2);
    --tint-teal:var(--dk-tint-teal);--tint-sky:var(--dk-tint-sky);--tint-warm:var(--dk-tint-warm);
    --ink:var(--dk-ink);--muted:var(--dk-muted);
    --primary:var(--dk-primary);--primary-strong:var(--dk-primary-strong);--on-primary:var(--dk-on-primary);
    --accent:var(--dk-accent);--accent-strong:var(--dk-accent-strong);--on-accent:var(--dk-on-accent);
    --info:var(--dk-info);--on-info:var(--dk-on-info);--gold:var(--dk-gold);
    --line:var(--dk-line);--ring:var(--dk-ring);
    --ok:var(--dk-primary);--warn:var(--dk-gold);--danger:var(--dk-accent);
    --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 32px rgba(0,0,0,.5);
    --shadow-soft:0 1px 2px rgba(0,0,0,.35),0 6px 18px rgba(0,0,0,.4);
  }
}
:root[data-theme="dark"] {
  --bg:var(--dk-bg);--surface:var(--dk-surface);--surface-2:var(--dk-surface-2);
  --tint-teal:var(--dk-tint-teal);--tint-sky:var(--dk-tint-sky);--tint-warm:var(--dk-tint-warm);
  --ink:var(--dk-ink);--muted:var(--dk-muted);
  --primary:var(--dk-primary);--primary-strong:var(--dk-primary-strong);--on-primary:var(--dk-on-primary);
  --accent:var(--dk-accent);--accent-strong:var(--dk-accent-strong);--on-accent:var(--dk-on-accent);
  --info:var(--dk-info);--on-info:var(--dk-on-info);--gold:var(--dk-gold);
  --line:var(--dk-line);--ring:var(--dk-ring);
  --ok:var(--dk-primary);--warn:var(--dk-gold);--danger:var(--dk-accent);
  --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 32px rgba(0,0,0,.5);
  --shadow-soft:0 1px 2px rgba(0,0,0,.35),0 6px 18px rgba(0,0,0,.4);
}

/* Senior view: larger, roomier */
:root[data-senior="on"] {
  --fs-base: 21px;
  --tap: 56px;
  --radius: 18px;
}