/* ═══════════════════════════════════════════════════════════════════════════
   Bondora — Design Tokens  |  Source unique de vérité pour les variables CSS
   Importé depuis base.html avant tout fichier de page.
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  /* ── Couleurs brand ───────────────────────────────────────────────────── */
  --color-primary:           #b5fe4d;   /* vert Bondora principal            */
  --color-primary-hover:     #83c41e;   /* vert survol                       */
  --color-primary-dark:      #99df2b;   /* vert foncé / btn secondaire       */
  --color-primary-pale:      #e6f7ce;   /* vert très pâle (fonds, badges)    */

  --color-secondary:         #2b8ddb;   /* bleu Bondora principal            */
  --color-secondary-mid:     #448dbf;   /* bleu intermédiaire                */
  --color-secondary-pale:    #eaf4fd;   /* bleu très pâle (fonds, badges)    */
  --color-secondary-pale-alt:#cae3f4;   /* variante bleue (dégradés)         */

  /* ── Dégradé brand ───────────────────────────────────────────────────── */
  --color-grad-brand: linear-gradient(270deg, #e6f7ce 0%, #cae3f4 100%);

  /* ── Texte ───────────────────────────────────────────────────────────── */
  --color-text-dark:  #101828;
  --color-text-mid:   #475467;
  --color-text-light: #667085;
  --color-text-muted: #98a2b3;

  /* ── Surfaces & bordures ─────────────────────────────────────────────── */
  --color-white:      #ffffff;
  --color-bg-light:   #f9fafb;
  --color-surface-2:  #f2f4f7;
  --color-border:     #e4e7ec;
  --color-border-alt: #e0e0e0;

  /* ── Sémantique ─────────────────────────────────────────────────────── */
  --color-success: #079455;
  --color-error:   #d32f2f;
  --color-danger:  #d92d20;

  /* ── Typographie ─────────────────────────────────────────────────────── */
  --font-brand: 'Sora', sans-serif;   /* police unique Corporate Trust       */
  --font-mono:  ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* ── Ombres ──────────────────────────────────────────────────────────── */
  --shadow-xs: 0 1px 3px  rgba(16, 24, 40, 0.08);
  --shadow-sm: 0 2px 12px rgba(16, 24, 40, 0.06);
  --shadow-md: 0 10px 32px rgba(16, 24, 40, 0.08);
  --shadow-lg: 0 22px 56px rgba(16, 24, 40, 0.10);

  /* ── Rayons ──────────────────────────────────────────────────────────── */
  --radius-sm:   0.5rem;
  --radius:      1rem;
  --radius-lg:   2rem;
  --radius-full: 9999px;

  /* ── Espacements ─────────────────────────────────────────────────────── */
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2rem;
  --space-xl:  3rem;
  --space-xxl: 5rem;

  /* ── Mise en page ────────────────────────────────────────────────────── */
  --max-w: 1088px;

  /* ── Aliases backward-compat (noms historiques utilisés dans base.css) ─ */
  /* Permet à base.css et aux fichiers banking de référencer ces vars       */
  /* sans modifier chaque occurrence de var(--primary), var(--dark), etc.  */
  --primary:          var(--color-primary);
  --primary-hover:    var(--color-primary-hover);
  --primary-alt:      #7ec3f8;   /* bleu clair : CTA alternatif (unique)    */
  --primary-alt-hover:#5eb0f0;
  --secondary:        var(--color-secondary);
  --dark:             var(--color-text-dark);
  --gray:             var(--color-text-mid);
  --light-gray:       var(--color-text-muted);
  --light-blue:       var(--color-secondary-pale);
  --bg-light:         var(--color-bg-light);
  --white:            var(--color-white);
}