/**
 * Medikor Premium — Source de vérité unique pour le thème de l'app.
 *
 * Phase 2 Session 1 — Fondation. Ce fichier définit toutes les
 * variables CSS consommées par les composants React et les surfaces
 * publiques (booking, pages légales, etc.).
 *
 * Pour les surfaces qui NE SUPPORTENT PAS les variables CSS (PDF
 * @react-pdf/renderer, e-mails transactionnels), un module JS jumeau
 * expose les MÊMES valeurs hex : src/lib/theme-tokens.js
 *
 * Toute modification d'une valeur hex ici DOIT être répercutée dans
 * theme-tokens.js (et vice-versa). Une vérification de cohérence est
 * disponible via scripts/verify-theme-tokens.mjs.
 *
 * RAPPEL CRITIQUE : pas de box-shadow dans Medikor Premium.
 * La profondeur vient du contraste de fonds (warm-white vs white)
 * et de bordures fines. Aucune variable --shadow-* n'est définie ici
 * — c'est volontaire.
 */

:root {
  /* ────────────────────────────────────────────────────────────
   * PALETTE — Couleur principale
   * ──────────────────────────────────────────────────────────── */
  --mk-teal-deep: #2C5F5D;       /* CTA primaire, accents, highlights, état actif */
  --mk-teal-pale: #E8EFED;       /* Background badges réguliers, fond jour actif */

  /* ────────────────────────────────────────────────────────────
   * PALETTE — Accents chauds sémantiques
   * ──────────────────────────────────────────────────────────── */
  --mk-terracotta: #A45F42;      /* Suivis, fidélité, type event "suivi" */
  --mk-terracotta-pale: #FBF2E8; /* Background badges "3e visite" + events suivi */
  --mk-amber: #B5772D;           /* Nouveautés, premières fois, événements marquants */
  --mk-amber-pale: #FDF4E7;      /* Background badges "Nouvelle" + events 1ère consult */
  --mk-steel: #4A7A8C;           /* Téléconsultation, digital, distance */
  --mk-steel-pale: #ECF1F4;      /* Background events téléconsultation */

  /* ────────────────────────────────────────────────────────────
   * PALETTE — Sémantiques système
   * ──────────────────────────────────────────────────────────── */
  --mk-success: #4A8266;         /* Validations, état OK */
  --mk-warning: #C8893E;         /* Alerte douce, avertissements non-bloquants */
  --mk-critical: #A23E3E;        /* Erreurs, suppressions, état critique */

  /* ────────────────────────────────────────────────────────────
   * PALETTE — Évolutivité event types (futurs ajouts)
   * ──────────────────────────────────────────────────────────── */
  --mk-sage: #5A8C7C;            /* Massage, médecine douce, wellness */
  --mk-plum: #7A5A8C;            /* Atelier de groupe, formation collective */
  --mk-brick: #8C5A4A;           /* Soins post-op, pathologie chronique */

  /* ────────────────────────────────────────────────────────────
   * NEUTRES
   * ──────────────────────────────────────────────────────────── */
  --mk-anthracite: #0F2A2E;      /* Texte principal, titres */
  --mk-gray-dark: #6B7572;       /* Texte secondaire, labels, légendes */
  --mk-gray-border: #E5E7E5;     /* Bordures, séparateurs */
  --mk-warm-white: #FCFCFB;      /* Fond principal de l'app */
  --mk-white: #FFFFFF;           /* Fond cartes, sidebar, surfaces élevées */

  /* ────────────────────────────────────────────────────────────
   * ALIAS SÉMANTIQUES (utilisés par les composants)
   * ──────────────────────────────────────────────────────────── */
  --bg-page: var(--mk-warm-white);
  --bg-card: var(--mk-white);
  --bg-input: var(--mk-white);
  --text-primary: var(--mk-anthracite);
  --text-secondary: var(--mk-gray-dark);
  --text-muted: var(--mk-gray-dark);
  --border: var(--mk-gray-border);
  --border-input: var(--mk-gray-border);
  --border-focus: var(--mk-teal-deep);
  --accent: var(--mk-teal-deep);
  --accent-pale: var(--mk-teal-pale);

  /* ────────────────────────────────────────────────────────────
   * RADIUS
   * ──────────────────────────────────────────────────────────── */
  --radius-sm: 4px;              /* Chips compacts, tags petits */
  --radius-md: 6px;              /* Inputs, selects, textareas */
  --radius-lg: 8px;              /* Cartes, modales, KPI cards, boutons */
  --radius-pill: 12px;           /* Badges, pills */
  --radius-circle: 50%;          /* Avatars patients */

  /* ────────────────────────────────────────────────────────────
   * TYPOGRAPHIE — Tailles
   * ──────────────────────────────────────────────────────────── */
  --text-xs: 10px;               /* Captions très petits */
  --text-sm: 11px;               /* Labels uppercase */
  --text-base: 12px;             /* Texte secondaire */
  --text-md: 13px;               /* Texte standard */
  --text-lg: 16px;               /* Titre H3 (card) */
  --text-xl: 20px;               /* Titre H2 (section) */
  --text-2xl: 22px;              /* KPI grand */
  --text-3xl: 28px;              /* Titre H1 (page) */

  /* ────────────────────────────────────────────────────────────
   * TYPOGRAPHIE — Poids
   * ──────────────────────────────────────────────────────────── */
  --weight-regular: 400;
  --weight-medium: 500;

  /* ────────────────────────────────────────────────────────────
   * TYPOGRAPHIE — Familles
   * ──────────────────────────────────────────────────────────── */
  --font-body: 'DM Sans', system-ui, -apple-system, sans-serif;
  --font-heading: 'Outfit', 'DM Sans', system-ui, sans-serif;

  /* ────────────────────────────────────────────────────────────
   * BORDURES
   * ──────────────────────────────────────────────────────────── */
  --border-width-thin: 0.5px;
  --border-width-default: 1px;
  --border-width-emphasis: 1.5px;
  --border-width-event: 2px;
}