/* ============================================================
   Variables CSS — tokens globaux
   À surcharger par projet dans un fichier de thème.
   ============================================================ */

:root {
    /* Couleurs */
    --primary:       #2563eb;
    --primary-dark:  #1d4ed8;
    --danger:        #dc2626;
    --danger-dark:   #b91c1c;
    --success:       #16a34a;
    --warning:       #d97706;

    /* Texte */
    --text:          #1e293b;
    --text-muted:    #64748b;
    --text-light:    #94a3b8;

    /* Surfaces */
    --bg:            #ffffff;
    --bg-alt:        #f8fafc;
    --surface:       #ffffff;
    --border:        #e2e8f0;

    /* Typographie */
    --font-base:     system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-mono:     ui-monospace, 'Courier New', monospace;
    --font-size:     16px;
    --line-height:   1.6;

    /* Espacements */
    --space-xs:      .25rem;   /*  4px */
    --space-sm:      .5rem;    /*  8px */
    --space-md:      1rem;     /* 16px */
    --space-lg:      1.5rem;   /* 24px */
    --space-xl:      2rem;     /* 32px */
    --space-2xl:     3rem;     /* 48px */

    /* Mise en page */
    --max-w:         1200px;
    --sidebar-w:     240px;
    --radius:        6px;
    --radius-lg:     12px;
    --gap:           1.5rem;

    /* Ombres */
    --shadow-sm:     0 1px 3px rgba(0,0,0,.08);
    --shadow-md:     0 4px 12px rgba(0,0,0,.08);
    --shadow-lg:     0 8px 24px rgba(0,0,0,.12);

    /* Transitions */
    --transition:    .15s ease;
}

/*
   Breakpoints (référence — à utiliser directement dans les media queries)
   --bp-sm:   480px   mobile large
   --bp-md:   768px   tablette
   --bp-lg:   1024px  desktop
   --bp-xl:   1280px  large desktop
*/