/* ---------------- */
/* ---------------- */
/* -- MODE CLAIR -- */
/* ---------------- */
/* ---------------- */

/*
DESCRIPTION :

Adaptation des styles pour le thème clair.
*/


/* --------------- */
/* --------------- */
/* -- VARIABLES -- */
/* --------------- */
/* --------------- */

/* -------------------------- */
/* -------------------------- */
/* -- Variables ordinaires -- */

:root[data-theme="clair"] {
   --couleur-claire: #0F0E0A;
   --couleur-legere: #6d6434;
   --couleur-moyenne: #998C40;
   --couleur-sombre: #FFEA80;
   --couleur-eteinte: #000000;
   --couleur-brillance-totale: #00000000;
   --couleur-brillance-forte: #00000000;
   --couleur-brillance-moyenne: #00000000;
   --couleur-brillance-faible: #00000000;
   --couleur-effet-lignesH-claire: #FFEA8009;
   --couleur-effet-lignesH-sombre: #100F0A14;
   --couleur-effet-lignesV-claire: #FFEA8004;
   --couleur-effet-lignesV-sombre: #100F0A04;
}


/* ---------------- */
/* ---------------- */
/* -- Animations -- */

@keyframes --allumer-theme-clair {

   0%,
   50% {
      background: var(--couleur-eteinte);
   }

   60% {
      background: var(--couleur-sombre);
   }

   62% {
      background: var(--couleur-moyenne);
   }

   88%,
   100% {
      background: var(--couleur-sombre);
   }
}



/* --------------------- */
/* --------------------- */
/* -- STYLES GÉNÉRAUX -- */
/* --------------------- */
/* --------------------- */

/* ----------------------- */
/* ----------------------- */
/* -- Styles d'éléments -- */

:root[data-theme="clair"] *::selection,
:root[data-theme="clair"] .clair *.surligne::selection {
   background-color: var(--couleur-claire);
   color: var(--couleur-sombre);
}

:root[data-theme="clair"] .clair *::selection,
:root[data-theme="clair"] *.surligne::selection {
   background-color: var(--couleur-moyenne);
   color: var(--couleur-claire);
}


/* ------------------------ */
/* ------------------------ */
/* -- Styles de sections -- */

html[data-theme="clair"]:not(:has(.conteneur_defilement)) {
   scrollbar-color: var(--couleur-sombre) var(--couleur-claire);
}



/* ------------------------ */
/* ------------------------ */
/* -- STYLES SPÉCIFIQUES -- */
/* ------------------------ */
/* ------------------------ */

/* ------------------------ */
/* ------------------------ */
/* -- Styles de sections -- */

/* ---------------------------------- */
/* -- Zone de saisie de la console -- */
:root[data-theme="clair"] #zone_saisie:hover,
:root[data-theme="clair"] #zone_saisie:focus-within {
   background: var(--couleur-legere);
   color: var(--couleur-sombre);
}

:root[data-theme="clair"] #zone_saisie:hover #saisie::selection,
:root[data-theme="clair"] #zone_saisie:focus-within #saisie::selection {
   background-color: var(--couleur-sombre);
   color: var(--couleur-claire);
}

/* ----------------------------- */
:root[data-theme="clair"] #saisie {
   color: inherit;
}

/* ---------------- */
/* -- Section CV -- */
:root[data-theme="clair"] .cv .portrait {
   background: var(--couleur-sombre);
   outline: var(--bordure);
}



/* --------------------- */
/* --------------------- */
/* -- EFFETS SPÉCIAUX -- */
/* --------------------- */
/* --------------------- */

/* ------------------------ */
/* ------------------------ */
/* -- Styles de sections -- */

/* -------------------------- */
/* -- Encart de chargement -- */
:root[data-theme="clair"] #chargement {
   animation-name: --allumer-theme-clair, --dissimuler;
}