/* ==========================================================================
   Demain, outil de rappel de rendez-vous du cabinet a rendez-vous.
   jetons.css : les jetons de design, et rien d'autre.

   Ce fichier est la seule source des couleurs, des tailles, des espacements
   et des rayons. Le code de production l'importe tel quel. Aucun composant
   n'est defini ici (voir composants.css).

   Regle de couleur, non negociable : les quatre couleurs d'etat d'appel
   (confirme, a deplacer, annule, sans reponse) ne servent qu'aux etats
   d'appel, nulle part ailleurs dans l'outil. Un refus de validation, une
   alerte ou un succes n'utilisent jamais ces couleurs.

   Theme clair uniquement. Aucun theme sombre n'est prevu.
   ========================================================================== */

:root {

  /* --- Accent : encre violette -------------------------------------------
     Ni le vert cyan de Local Booster, ni le bleu des grands agendas
     medicaux, ni le vert d'hopital. Un violet d'encre, calme et adulte.
     --accent-600 donne 7,2 pour 1 en texte sur blanc et en blanc sur aplat,
     il sert donc aux deux usages sans exception a gerer. */
  --accent-900: #2E2650;
  --accent-800: #3B3168;
  --accent-700: #4A3D7C;
  --accent-600: #5B4B96;
  --accent-400: #8C7EBE;
  --accent-200: #CFC7E6;
  --accent-100: #EDEAF6;
  --accent-050: #F6F4FB;

  /* --- Neutres ------------------------------------------------------------
     L'ossature de l'outil. Fond clair, contraste fort, lisible debout. */
  --encre:      #1A1D23;  /* texte principal, 15,8 pour 1 sur blanc */
  --encre-2:    #414753;  /* texte secondaire, 9,1 pour 1 sur blanc */
  --encre-3:    #5D6472;  /* legendes, 6,1 pour 1 sur blanc */
  --trait:      #D6DAE1;  /* filets et bordures */
  --trait-fort: #A9B0BC;  /* bordures de champs et de cartes actives */
  --fond:       #F4F5F8;  /* fond d'application */
  --surface:    #FFFFFF;  /* cartes, tableaux, panneaux */
  --surface-2:  #EDEFF3;  /* bandeaux, en-tetes de tableau, zones calmes */

  /* --- Les quatre etats d'appel, et eux seuls -----------------------------
     Chaque etat porte aussi un mot et une icone : aucun sens ne repose sur
     la couleur seule. */
  --etat-confirme-texte:  #16643F;
  --etat-confirme-fond:   #E6F2EB;
  --etat-confirme-trait:  #9BC9B3;

  --etat-deplacer-texte:  #82530A;
  --etat-deplacer-fond:   #FBF0DB;
  --etat-deplacer-trait:  #E0C288;

  --etat-annule-texte:    #9E2129;
  --etat-annule-fond:     #FBE9EA;
  --etat-annule-trait:    #EBAFB3;

  --etat-silence-texte:   #454B58;
  --etat-silence-fond:    #EDEFF3;
  --etat-silence-trait:   #BFC5D0;

  /* Cinquieme cas, qui n'est pas un etat d'appel : la conversation n'a pas
     permis de trancher. Traitement neutre, sans emprunter aux quatre. */
  --etat-preciser-texte:  #3B3168;
  --etat-preciser-fond:   #FFFFFF;
  --etat-preciser-trait:  #8C7EBE;

  /* --- Refus, verrou, attente --------------------------------------------
     Aucune de ces situations n'emprunte une couleur d'etat d'appel.
     Le refus se signale par un liseré epais d'encre et un pictogramme. */
  --refus-trait:  #1A1D23;
  --refus-fond:   #EDEFF3;
  --verrou-fond:  #F6F4FB;
  --verrou-trait: #8C7EBE;

  /* --- Typographie --------------------------------------------------------
     Aucune police distante. Pile systeme, chiffres a chasse fixe partout ou
     un nombre doit s'aligner. */
  --police: ui-sans-serif, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --police-chiffres: ui-sans-serif, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --taille-legende: 0.8125rem;  /* 13 px */
  --taille-petit:   0.9375rem;  /* 15 px */
  --taille-base:    1.0625rem;  /* 17 px, lisible sans se pencher */
  --taille-moyen:   1.25rem;    /* 20 px */
  --taille-grand:   1.5rem;     /* 24 px */
  --taille-titre:   2rem;       /* 32 px */
  --taille-heros:   4.5rem;     /* 72 px, chiffre heros ordinateur */
  --taille-heros-tel: 3.5rem;   /* 56 px, chiffre heros telephone */

  --graisse-normale: 400;
  --graisse-moyenne: 600;
  --graisse-forte:   700;

  --interligne-serre: 1.15;
  --interligne:       1.55;

  /* --- Espacements --------------------------------------------------------
     Echelle de 4. Rien entre deux valeurs. */
  --e1: 4px;
  --e2: 8px;
  --e3: 12px;
  --e4: 16px;
  --e5: 24px;
  --e6: 32px;
  --e7: 48px;
  --e8: 64px;

  /* --- Rayons -------------------------------------------------------------
     Sobres. Un outil de cabinet, pas une vitrine. */
  --rayon-petit:  6px;
  --rayon:        10px;
  --rayon-grand:  16px;
  --rayon-pilule: 999px;

  /* --- Ombres -------------------------------------------------------------
     Deux niveaux, pas trois. */
  --ombre-1: 0 1px 2px rgba(26, 29, 35, 0.06), 0 1px 1px rgba(26, 29, 35, 0.04);
  --ombre-2: 0 4px 16px rgba(26, 29, 35, 0.10);

  /* --- Cibles tactiles ----------------------------------------------------
     Manipule debout, souvent d'une seule main. Rien en dessous de 44 px. */
  --cible-min: 44px;
  --cible-large: 56px;

  /* --- Mesures de lecture -------------------------------------------------- */
  --largeur-texte: 62ch;
  --largeur-page:  1120px;

  /* --- Mouvement ----------------------------------------------------------
     Court. Une rédaction apparait en moins de trois secondes ; au dela,
     l'interface montre une attente honnete, jamais un ecran fige. */
  --duree-courte: 120ms;
  --duree:        220ms;
  --courbe: cubic-bezier(0.2, 0, 0.2, 1);
}

/* Le papier fait partie de l'interface : memes jetons, adaptes a l'encre.
   Fond blanc, accent assombri, filets plus fins. */
@media print {
  :root {
    --fond: #FFFFFF;
    --surface: #FFFFFF;
    --surface-2: #FFFFFF;
    --accent-600: #3B3168;
    --accent-100: #FFFFFF;
    --accent-050: #FFFFFF;
    --trait: #9AA0AA;
    --ombre-1: none;
    --ombre-2: none;
    --taille-base: 11pt;
    --taille-petit: 10pt;
    --taille-legende: 9pt;
    --taille-heros: 28pt;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duree-courte: 0ms;
    --duree: 0ms;
  }
}