/* Design tokens shared by every tenant (ADR 0010).
   Structure (typography, shapes, spacing) and neutrals come from the mockup (docs/design/tokens.css).
   Brand values below are the NioFlo fallback: each tenant overrides them in themes/<tenant>/theme.css.
   A tenant theme must define every variable in the "Brand" section. */
:root {
  /* Brand — NioFlo fallback (logo colors; reds darkened for AA contrast with white text) */
  --color-primary: #1E3964;          /* headers, buttons, active nav */
  --color-primary-hover: #2E5490;
  --color-primary-soft: #E7ECF4;     /* icon background */
  --color-primary-muted: #C7D1E2;    /* image placeholders, source border */
  --color-on-primary: #FFFFFF;
  --color-on-primary-muted: #DCE3EF;

  --color-accent: #C4433D;           /* IMPORTANT badge, unread dot (white text: 4.98:1) */
  --color-accent-strong: #A8352F;    /* red text on white (6.53:1) */
  --color-accent-soft: #FBEDEC;
  --color-accent-border: #F2C9C6;

  --shadow-rgb: 30 57 100;           /* shadow tint, as "R G B" */

  /* Status */
  --color-success: #5BD08A;          /* "Membre actif" dot */

  /* Overlays (work on any dark primary) */
  --color-on-primary-overlay: rgb(255 255 255 / 0.12); /* icon buttons on primary */

  /* Neutrals */
  --color-bg: #F3F4F7;
  --color-surface: #FFFFFF;
  --color-text: #16181D;
  --color-text-2: #3A3F4A;
  --color-text-muted: #5A6070;
  --color-border: #E2E5EC;
  --color-border-input: #D3D8E2;
  --color-divider: #EEF0F4;

  /* Typography (mockup fonts for every tenant) */
  --font-display: 'Barlow', system-ui, sans-serif;     /* 600–700 */
  --font-body: 'Source Sans 3', system-ui, sans-serif; /* 400, 600 */
  --fs-h1-hero: 30px; --fs-h1: 28px; --fs-h2: 20px; --fs-h3: 18px;
  --fs-body: 15px; --fs-sm: 14px; --fs-xs: 13px; --fs-caption: 12px; --fs-nav: 11px;

  /* Shapes */
  --radius-card: 14px; --radius-btn: 10px; --radius-input: 12px;
  --radius-pill: 999px; --radius-member-card: 18px;
  --shadow-card: 0 6px 20px rgb(var(--shadow-rgb) / 0.14);
  --shadow-fab: 0 4px 12px rgb(var(--shadow-rgb) / 0.3);

  /* Spacing */
  --space-page: 16px; --gap-section: 20px; --gap-card: 14px;
  --touch-min: 44px; --nav-height: 76px; --app-bar-height: 64px; /* app bar, without the top safe area */
}