/*
* Framework U20 - VARIABLES
* Couleurs equivalentes a la biblio Photoshop
*/

:root {
  --bg: #3b3b46;
  --bg-fonce: #1c1d1f;
  --blanc: #ffffff;
  --blancgris: #f3f3f3;
  --blancmoyen: #f8f8fa;
  --blancpale: #fcfcfc;
  --noir: #1d1e21;

  /* Lien */
  --lien: #006534;
  --lien-hover: #024122;
  --lien-active: #00e486;

  /* Contour */
  --contour: #ccd2db;
  --contour-focus: #00e486;
  --contour-hover: #b5b9bf;

  /* Boutons - etats et surfaces claires */
  --primaire-uqtr-hover: #013d20;
  --secondaire-uqtr-hover: #3b3b44;
  --fond-clair: #f5f6f9;
  --fond-clair-hover: #d6d6d6;
  --contour-clair-hover: #8f9092;

  /* Menu */
  --dropdown-button: var(--texte);
  --dropdown-button-active: var(--lien);
  --dropdown-button-hover: var(--noir);

  /* Footer */
  --lignes-footer: #d6d8de;

  /* Fontes - une seule famille aujourd'hui, deux roles distincts */
  --font-normal: "Montserrat", sans-serif; /* texte courant, champs */
  --font-deco: "Montserrat", sans-serif; /* titres, boutons, menu */
  --font-montserrat: var(--font-normal); /* alias historique */

  /* Gris */
  --gris: #8f939c;
  --grisfonce: #3b3b46;
  --grismoyen: #6a6c75;
  --grispale: #dbdbe5;
  --grispale2: #eeeff2;

  /* Couleurs */
  --primaire-uqtr: #006534;
  --secondaire-uqtr: #545460;
  --vert: #009f6e;
  --vert-accent: #00b173;
  --vert-fonce: #006534;
  --vert-hover: #00b47d;
  --vert-pale: #1cda98;
  --vert-pale2: #79ffc8;
  --jaune: #ffcc2f;
  --jaune-pale: #ffdc88;
  --orange: #d43c30;
  --orange-pale: #ff7b71;
  --rose: #ff6e6c;
  --rose-pale: #ff96a4;
  --rouge: #b50027;
  --rouge-pale: #ff8383;
  --mauve: #5d43ce;
  --mauve-pale: #6f65ed;
  --bleu: #2c5ce5;
  --bleu-pale: #3976ff;

  /* Degrades pour Boutons ou Background */
  --degrade-blanc-blancpale: linear-gradient(
    to bottom,
    #ffffff 0%,
    #fcfcfc 100%
  );
  --degrade-blanc-gris: linear-gradient(to bottom, #ffffff 0%, #f6f6f6 100%);
  --degrade-gris-fonce: linear-gradient(135deg, #3b3b46 0%, #1d1e21 100%);
  --degrade-gris-pale: linear-gradient(to bottom, #f4f4f8 0%, #fcfcfc 100%);

  --degrade-jaune: linear-gradient(135deg, #ffcc2f 0%, #ffdc88 100%);
  --degrade-jaune-hover: linear-gradient(135deg, #ffdc88 0%, #ffdc88 100%);
  --degrade-mauve: linear-gradient(135deg, #3e1bb2 0%, #6a3aff 100%);
  --degrade-mauve-hover: linear-gradient(135deg, #6a3aff 0%, #6a3aff 100%);
  --degrade-bleu: linear-gradient(135deg, #2c5ce5 0%, #3976ff 100%);
  --degrade-bleu-hover: linear-gradient(135deg, #3976ff 0%, #3976ff 100%);
  --degrade-orange: linear-gradient(135deg, #ff9423 0%, #fc575e 100%);
  --degrade-orange-hover: linear-gradient(135deg, #ff5f5f 0%, #ff5f5f 100%);
  --degrade-rouge: linear-gradient(135deg, #ee3143 0%, #ff5565 90%);
  --degrade-rouge-hover: linear-gradient(135deg, #ff5565 0%, #ff5565 100%);
  --degrade-vert: linear-gradient(
    135deg,
    var(--vert-accent) 0%,
    #097168 100%
  );
  --degrade-vert-hover: linear-gradient(
    135deg,
    var(--vert-accent) 0%,
    var(--vert-accent) 100%
  );
  --degrade-vert2: linear-gradient(135deg, #49e9a9 0%, #0cfc8a 100%);
  --degrade-vert2-hover: linear-gradient(135deg, #49e9a9 0%, #48e9a9 100%);

  /* Composantes - Helpers */
  --texte-pale: #6f7082;
  --texte: #40414b;
  --texte-fonce: #2a2c33;

  --icone: #969ba8;
  --iconefonce: #3b3b46;

  --radius: 3px;
  --radius100: 100px;

  --shadow1: 0 0 0 1px rgba(0, 0, 0, 0.1); /* Juste une bordure */
  --shadow2: 0 3px 10px -1px rgba(0, 0, 0, 0.1);
  --shadow3: 0 6px 20px -1px rgba(0, 0, 0, 0.1);
  --shadow4: 0 10px 30px -3px rgba(0, 0, 0, 0.1);
}
/* Fin Variables */