/* ===================================================================
   brand.css — THE single source of the Vianney brand.
   -------------------------------------------------------------------
   Every value the brand is made of (colours, fonts, radii, shadow)
   lives here ONCE, as --brand-* custom properties. Every surface
   (the parish app's classic theme, the parishioner portal, the web
   forms, the baptism request, the funeral-home portal, the public
   Request-a-Mass page, and — via synced copies — the Management and
   Diocese consoles) links this file and maps its own local token
   names to these. So changing the brand is a ONE-LINE edit here:
   change --brand-oxblood and every button, tab, link, and badge
   across all surfaces follows.

   The consoles (mgmt/, diocese/) are independent apps, so each keeps
   an identical COPY of this file in its own static dir — keep the
   three copies in sync (v1/app/static, mgmt/static, diocese/static).
   VIA-86.
   =================================================================== */
:root {
  /* ---- core palette ---- */
  --brand-ink: #141c30;            /* dark ground, primary text, inverse panels */
  --brand-oxblood: #7e2a20;        /* THE action colour */
  --brand-oxblood-soft: #f4e7e2;   /* soft oxblood fill (active pill, highlight) */
  --brand-gold: #c9a24b;           /* secondary accent (seal, flourishes) */
  --brand-gold-soft: #f5ecd6;
  --brand-parchment: #f4f2ea;      /* warm page ground */
  --brand-surface: #ffffff;        /* cards / panels */
  --brand-surface-2: #f6f3ea;      /* subtle inset / hover */
  --brand-border: #e6e1d4;         /* hairline (warm) */
  --brand-muted: #515a6e;          /* muted text */
  --brand-faint: #9aa0ad;          /* faint text */
  --brand-on-inverse: #f4eee0;     /* text on the ink ground */
  --brand-nav-text: #6a6f7e;       /* resting nav text */

  /* ---- status (semantic; never used for "actionable") ---- */
  --brand-positive: #1d6b47;       --brand-positive-soft: #e6f1ea;
  --brand-warn: #9a7b33;           --brand-warn-soft: #f5ebd4;
  --brand-danger: #b3362c;         --brand-danger-soft: #fbeae7;

  /* ---- type ---- */
  --brand-font-display: 'Cinzel', Georgia, 'Times New Roman', serif;
  --brand-font-body: 'Archivo', -apple-system, 'Segoe UI', Roboto, sans-serif;
  --brand-font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  /* ---- radii + shadow ---- */
  --brand-radius-sm: 6px;
  --brand-radius-md: 9px;
  --brand-radius-lg: 13px;
  --brand-radius-pill: 99px;
  --brand-shadow: 0 1px 2px rgba(20,28,48,.05), 0 2px 10px rgba(20,28,48,.07);

  /* ---- spacing dials (padding / gaps; VIA-96) ----
     Named for the control they size, so "make the tabs roomier" or "tighten
     the buttons" is a one-line edit here and every control follows. Values are
     today's exact literals, so adding these changed nothing on screen. Each use
     site keeps the same literal as a var() fallback, so a missing token never
     collapses a control. (Corner radius lives in the radii block above.) */
  --brand-pad-btn: 7px 16px;       /* .btn interior */
  --brand-pad-btn-sm: 4px 10px;    /* .btn.sm (compact buttons) */
  --brand-pad-tab: 5px 13px;       /* .vtab — the view switcher pills */
  --brand-gap-tab: 4px;            /* gap between tabs in a row */
  --brand-pad-step: 5px 12px;      /* .vstep-btn — day/week stepper */
  --brand-gap-step: 8px;           /* gap across the stepper row */
  --brand-pad-chip: 2px 10px;      /* .chip toggle */
  --brand-pad-badge: 2px 9px;      /* .badge status pill */
  --brand-pad-card: 12px 14px;     /* card interior padding */
  --brand-gap-card: 10px;          /* vertical space between stacked cards */
  --brand-gap-controls: 6px;       /* inline gap inside a control (icon-to-label) */
  --brand-space-section: 16px;     /* breathing room above a tab/step row */
}