/*
 * Rapport.church — design tokens
 * The sixth .church surface. Amber is Rapport's OWN chrome only; thread cards
 * carry their source product's hue (that's the wayfinding). Token names ship as
 * --amber* / --rapport-* and never rename for a rebrand (family precedent).
 *
 * White text never sits on --amber (fails WCAG); it goes on --amber-d (AA).
 * Semantic status colors are never overridden by brand amber.
 */
:root {
  /* Rapport brand — amber */
  --amber:        #e0912f; /* accent: borders, icons, tints, links, the mark */
  --amber-d:      #8a520f; /* action fill: solid controls carrying white text (AA) */
  --amber-h:      #6f420b; /* action fill hover */
  --amber-t:      #faf0e0; /* tint background */
  --amber-tt:     #7a460c; /* text/labels on amber tint */

  /* .church-parent neutral chrome (Rapport is connective tissue) */
  --ink:          #1c1c1e;
  --bg:           #f2f1ec; /* warm off-white — never pure white */
  --card:         #ffffff;
  --line:         #e4e2da;
  --muted:        #6c6a63;
  --faint:        #9a988f;

  /* Source-product hues — the color rail on every thread card */
  --src-prepare:      #7c3aed; --src-prepare-d:  #5b21b6; --src-prepare-t:  #f5f0ff;
  --src-maintain:     #3a6ea5; --src-maintain-d: #2a5480; --src-maintain-t: #eaf1f8;
  --src-steady:       #f2506e; --src-steady-d:   #c81e4a; --src-steady-t:   #fdeef1;
  --src-unison:       #2e7d5b; --src-unison-d:   #1f5a40; --src-unison-t:   #e9f4ee;
  --src-whiteboard:   #00a896; --src-whiteboard-d:#006760; --src-whiteboard-t:#e2f4f1;
  --src-note:         #7d7b74; --src-note-d:     #4a4a45; --src-note-t:     #efeee8;

  /* Semantic status — never replaced by brand amber */
  --ok:      #15803d;
  --warn:    #b45309;
  --danger:  #dc2626;

  /* Type, spacing, shape */
  --font: 'Outfit', system-ui, -apple-system, sans-serif;
  --radius:      8px;
  --radius-card: 12px;
  --radius-tile: 7.5px; /* app-icon corner (32px tile) */
  --tap-min:     44px;  /* DR-14: minimum tap target */
  --text-min:    16px;  /* DR-14: minimum long-form size */
  --gap-xs: 4px; --gap-sm: 8px; --gap-md: 12px; --gap-lg: 16px; --gap-xl: 24px;

  --theme-color: #e0912f; /* PWA / status bar */
}
