@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    /* --- MODE CLAIR --- */
    --bg-paper: 248 250 252;
    --bg-surface: 255 255 255;
    --text-main: 15 23 42;
    --text-muted: 71 85 105;
    --border-line: 226 232 240;

    /* BADGE : TRAITÉ / CLÔTURÉ (Gris perle) */
    --badge-done-bg: 241 245 249;
    --badge-done-border: 226 232 240;
    --badge-done-text: 71 85 105;
    --badge-done-num: 0 64 128;

    /* BADGE : EN COURS / ACTIF */
    --badge-active-bg: 204 243 255;    /* Fond cyan très clair */
    --badge-active-border: 0 204 255;  /* Bordure cyan */
    --badge-active-text: 0 34 68;      /* Texte Bleu profond (Brassdeep) */

    /* BADGE : EN RETARD */
    --badge-late-bg: 254 226 226;      /* Fond rouge clair */
    --badge-late-border: 252 165 165;
    --badge-late-text: 153 27 27;      /* Texte rouge foncé */
  }

  .dark {
    /* --- MODE SOMBRE ENTREPRISE --- */
    --bg-paper: 9 14 23;
    --bg-surface: 15 23 42;
    --text-main: 248 250 252;
    --text-muted: 148 163 184;
    --border-line: 30 41 59;

    /* BADGE : TRAITÉ / CLÔTURÉ (Ardoise furtif) */
    --badge-done-bg: 30 41 59;
    --badge-done-border: 51 65 85;
    --badge-done-text: 148 163 184;
    --badge-done-num: 0 204 255;

    /* BADGE : EN COURS / ACTIF (Le correctif de lisibilité) */
    --badge-active-bg: 8 47 73;        /* Fond Bleu Nuit profond */
    --badge-active-border: 12 74 110;
    --badge-active-text: 56 189 248;   /* Texte Cyan lumineux ultra-lisible ! */

    /* BADGE : EN RETARD */
    --badge-late-bg: 69 10 10;         /* Fond rouge très sombre */
    --badge-late-border: 127 29 29;
    --badge-late-text: 248 113 113;    /* Texte rouge clair pastel */
  }
}

/* Scrollbars */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(148, 163, 184, 0.3); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(148, 163, 184, 0.6); }

html.dark input, html.dark select, html.dark textarea { color: #F8FAFC !important; }