/* =====================================================================
   DispoWork — THEME CENTRAL (identité visuelle « Clair Corporate »)
   ---------------------------------------------------------------------
   Source de vérité du design. Importé par styles.css et par les pages.
   Tu veux changer l'ambiance ? Ne touche QUE les variables ci-dessous.
   Univers clair bleu / cyan, police Plus Jakarta Sans, cartes blanches
   à ombres douces. (Issu de la Proposition B.)
   ===================================================================== */

/* --- Une seule police pour tout : Plus Jakarta Sans --- */
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

:root {
  /* ---------------------------------------------------------------
     1) COULEURS DE BASE (palette « Clair Corporate »)
     --------------------------------------------------------------- */
  --bg:        #F2F6FC;   /* fond général bleu très pâle              */
  --surface:   #FFFFFF;   /* fond des cartes (blanc franc)            */
  --surface-2: #E8F0FA;   /* survol / fonds doux                      */
  --border:    #DCE6F2;   /* bordures discrètes                       */
  --border-hi: #C5D6EC;   /* bordures accentuées                      */
  --text:      #0E1B33;   /* texte principal (encre marine)          */
  --text-dim:  #3A4D6B;   /* texte secondaire                        */
  --text-soft: #6B7D9A;   /* texte tertiaire / placeholder           */

  /* Couleurs décoratives (dégradé signature bleu → cyan) */
  --c1: #0B47A0;  /* bleu profond */
  --c2: #1565D8;  /* bleu franc   */
  --c3: #17A9E0;  /* cyan         */
  --c4: #1BC6F0;  /* cyan clair   */

  /* ---------------------------------------------------------------
     2) COULEURS SÉMANTIQUES (statuts, validations, erreurs)
        Pensées pour rester lisibles sur fond clair.
     --------------------------------------------------------------- */
  --ok:        #16B07E;  /* succès / disponible / pourvu (vert)        */
  --warn:      #F0A93B;  /* en attente (orange)                        */
  --danger:    #E5484D;  /* erreur / en poste / échec (rouge)          */
  --info:      #17A9E0;  /* ouvert / info (= c3 cyan)                  */

  /* ---------------------------------------------------------------
     3) POLICES (une seule famille, graisses différentes)
     --------------------------------------------------------------- */
  --display: 'Plus Jakarta Sans', sans-serif;  /* titres (800)        */
  --body:    'Plus Jakarta Sans', sans-serif;  /* corps de texte      */

  /* ---------------------------------------------------------------
     4) FORMES, VERRE, OMBRES
     --------------------------------------------------------------- */
  --radius:       22px;   /* arrondi des cartes                        */
  --radius-sm:    14px;   /* arrondi des champs / petits éléments      */
  --radius-pill:  999px;  /* boutons et badges en pilule               */
  --blur:         blur(14px);          /* flou de la barre collante    */
  --blur-soft:    blur(10px);          /* flou léger                   */
  --shadow:       0 18px 50px rgba(17,52,110,.10);  /* ombre carte     */
  --shadow-sm:    0 8px 24px rgba(17,52,110,.08);   /* ombre douce     */
  --shadow-glow:  0 14px 32px rgba(21,101,216,.32); /* glow bleu (CTA) */

  /* Dégradé signature (titres en couleur, marques, accents) */
  --gradient:      linear-gradient(120deg, var(--c2), var(--c1));
  --gradient-mark: conic-gradient(from 0deg, var(--c4), var(--c3), var(--c2), var(--c1), var(--c4));

  /* ---------------------------------------------------------------
     5) HALO DE FOND DISCRET (pour les écrans d'app, pas la landing)
     --------------------------------------------------------------- */
  --app-glow:
    radial-gradient(55% 45% at 12% -5%, rgba(23,169,224,.14), transparent 60%),
    radial-gradient(45% 40% at 98% 0%,  rgba(21,101,216,.10), transparent 58%);

  /* ===============================================================
     6) ALIAS RÉTRO-COMPAT — anciens noms FR utilisés dans le HTML/JS
        existant (inline styles). On les pointe vers les nouveaux
        tokens pour que rien ne casse. Ne pas réutiliser pour du neuf.
     =============================================================== */
  --couleur-marque:        var(--c2);
  --couleur-marque-foncee: var(--c1);
  --couleur-accent:        var(--ok);
  --couleur-danger:        var(--danger);
  --couleur-alerte:        var(--warn);
  --fond-page:    var(--bg);
  --fond-carte:   var(--surface);
  --texte:        var(--text);
  --texte-doux:   var(--text-dim);
  --bordure:      var(--border);
  --arrondi:      var(--radius);
  --arrondi-petit: var(--radius-sm);
  --ombre:        var(--shadow);
  --police:       var(--body);
}

/* --- Reset minimal commun --- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--body);
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
::selection { background: rgba(21,101,216,.18); color: var(--c1); }