/* © 2026 INFONEXIS. Tous droits réservés. Logiciel propriétaire : voir le fichier LICENSE. */
/**
 * Thèmes nex-wss : une feuille par thème dans css/themes/ (<nom>.css, ou la feuille de son groupe : sport.css), chargée
 * seulement pour le thème actif, juste avant ce fichier (wss_theme_feuille()). Ce fichier : réglages communs à tous les thèmes
 * (Mon profil > Thème), chargés après la feuille du thème pour garder la main à égalité de priorité.
 * NeX Origine : valeurs de base de nex-layout.css (origine.css : mode sombre).
 */

/* ================================================================ Réglages du thème (Mon profil > Thème)
   Valeurs déclarées par chaque thème (WSS_THEMES 'reglages', WSS_THEME_REGLAGES) ; <html data-nex-menu | data-nex-entete |
   data-nex-cartes="valeur"> seulement quand la valeur diffère du rendu d'origine du thème. Couleurs calculées à partir du thème
   (fond des cartes, texte, inverse) et de la couleur principale : un réglage reste assorti quelle que soit la couleur choisie.
   Formules --nex-r-* posées sur <html> (aussi lues par les aperçus du profil, nex.css) ; menu et en-tête : variables redéfinies
   sur l'élément lui-même, <html> garde celles du thème (aperçu « d'origine »). Un thème peut affiner une valeur :
   :root[data-nex-theme=x][data-nex-menu=gris] .nex-sidebar { ... }. Valeur « theme » (Style du thème) : rendu d'origine seulement,
   aucune règle ici ; un thème dont les en-têtes de carte ont un style propre le limite à :root[data-nex-theme=x]:not([data-nex-cartes]). */
:root {
	--nex-r-menu-clair: var(--nex-card-bg);
	--nex-r-menu-gris: color-mix(in srgb, var(--bs-body-color) 9%, var(--nex-card-bg));
	--nex-r-menu-sombre: #24292e;   /* anthracite neutre (l'inverse de certains thèmes est teinté : aubergine, bleu nuit...) */
	--nex-r-menu-degrade: linear-gradient(to bottom, #fcfcfc, color-mix(in srgb, var(--nex-primary) 14%, #fcfcfc));
	--nex-r-menu-teinte: color-mix(in srgb, var(--nex-primary) 24%, #0e1217);
	--nex-r-menu-couleur: color-mix(in srgb, var(--nex-primary) 86%, #000);
	--nex-r-entete-teinte: color-mix(in srgb, var(--nex-primary) 30%, #0e1217);
	--nex-r-entete-couleur: color-mix(in srgb, var(--nex-primary) 82%, #000);
	--nex-r-lisere: var(--nex-card-bg);
	--nex-r-lisere-gris: color-mix(in srgb, var(--bs-body-color) 6%, var(--nex-card-bg));
	--nex-r-lisere-teinte: color-mix(in srgb, var(--nex-primary) 10%, var(--nex-card-bg));
	--nex-r-lisere-sombre: color-mix(in srgb, var(--nex-inverse) 94%, #000);
	--nex-r-lisere-texte: var(--bs-body-color);
	--nex-lisere-epaisseur: 3px;
}
:root[data-bs-theme=dark] {
	--nex-r-menu-gris: color-mix(in srgb, #fff 7%, var(--nex-card-bg));
	--nex-r-menu-degrade: linear-gradient(to bottom, var(--nex-card-bg), color-mix(in srgb, var(--nex-primary) 12%, var(--nex-card-bg)));
	--nex-r-menu-sombre: color-mix(in srgb, var(--nex-content-bg) 55%, #000);
	--nex-r-menu-teinte: color-mix(in srgb, var(--nex-primary) 16%, #0b0e12);
	--nex-r-menu-couleur: color-mix(in srgb, var(--nex-primary) 55%, #000);
	--nex-r-entete-teinte: color-mix(in srgb, var(--nex-primary) 20%, #0b0e12);
	--nex-r-entete-couleur: color-mix(in srgb, var(--nex-primary) 60%, #000);
	--nex-r-lisere-gris: color-mix(in srgb, #fff 5%, var(--nex-card-bg));
	--nex-r-lisere-teinte: color-mix(in srgb, var(--nex-primary) 16%, var(--nex-card-bg));
	--nex-r-lisere-sombre: color-mix(in srgb, var(--nex-content-bg) 60%, #000);
}

/* ---------------------------------------------------------------- Menu latéral (et barre de droite, même fond) */
:root:is([data-nex-menu=clair], [data-nex-menu=gris], [data-nex-menu=degrade]) :is(.nex-sidebar, .nex-barre-droite) {
	--nex-sidebar-color: color-mix(in srgb, var(--bs-body-color) 82%, transparent);
	--nex-sidebar-hover-color: var(--bs-body-color);
	--nex-sidebar-hover-bg: color-mix(in srgb, var(--bs-body-color) 7%, transparent);
	--nex-sidebar-active-color: var(--bs-body-color);
	--nex-sidebar-active-bg: color-mix(in srgb, var(--nex-primary) 14%, transparent);
	--nex-sidebar-header-color: var(--bs-secondary-color);
	--nex-sidebar-border: var(--bs-border-color-translucent);
	--nex-sidebar-shadow: 1px 0 0 var(--bs-border-color-translucent);
	--nex-menu-marker: var(--nex-primary);
}
:root:is([data-nex-menu=sombre], [data-nex-menu=teinte], [data-nex-menu=couleur]) :is(.nex-sidebar, .nex-barre-droite) {
	--nex-sidebar-color: rgba(255, 255, 255, .7);
	--nex-sidebar-hover-color: #fff;
	--nex-sidebar-hover-bg: rgba(255, 255, 255, .08);
	--nex-sidebar-active-color: #fff;
	--nex-sidebar-active-bg: color-mix(in srgb, var(--nex-primary) 30%, transparent);
	--nex-sidebar-header-color: rgba(255, 255, 255, .45);
	--nex-sidebar-border: rgba(255, 255, 255, .1);
	--nex-sidebar-shadow: none;
	--nex-menu-marker: var(--nex-primary);
}
:root[data-nex-menu=clair] :is(.nex-sidebar, .nex-barre-droite) { --nex-sidebar-bg: var(--nex-r-menu-clair); }
:root[data-nex-menu=gris] :is(.nex-sidebar, .nex-barre-droite) { --nex-sidebar-bg: var(--nex-r-menu-gris); }
:root[data-nex-menu=degrade] :is(.nex-sidebar, .nex-barre-droite) { --nex-sidebar-bg: var(--nex-r-menu-degrade); }
:root[data-nex-menu=sombre] :is(.nex-sidebar, .nex-barre-droite) { --nex-sidebar-bg: var(--nex-r-menu-sombre); }
:root[data-nex-menu=teinte] :is(.nex-sidebar, .nex-barre-droite) { --nex-sidebar-bg: var(--nex-r-menu-teinte); }
/* couleur du thème : élément actif en voile blanc, repère blanc (la couleur se confondrait avec le fond) */
:root[data-nex-menu=couleur] :is(.nex-sidebar, .nex-barre-droite) {
	--nex-sidebar-bg: var(--nex-r-menu-couleur); --nex-sidebar-active-bg: rgba(255, 255, 255, .18); --nex-menu-marker: #fff;
	--nex-sidebar-color: rgba(255, 255, 255, .8); --nex-sidebar-header-color: rgba(255, 255, 255, .55);
}
/* NeX Code : la barre d'état du bas du menu reste visible sur un menu de la couleur du thème */
:root[data-nex-theme=code][data-nex-menu=couleur] .nex-sidebar-footer { background: rgba(0, 0, 0, .2); }

/* ---------------------------------------------------------------- En-tête de l'application */
:root[data-nex-entete=sombre] .nex-header { --nex-header-bg: var(--nex-r-menu-sombre); }
:root[data-nex-entete=teinte] .nex-header { --nex-header-bg: var(--nex-r-entete-teinte); }
:root[data-nex-entete=couleur] .nex-header { --nex-header-bg: var(--nex-r-entete-couleur); }
/* icône du thème (couleur par défaut du thème) : blanche sur un en-tête de couleur */
:root[data-nex-entete=couleur] .nex-header-actions .nex-header-theme > i { color: #fff; }

/* ---------------------------------------------------------------- En-têtes des cartes : liseré de la couleur du thème en haut
   En-têtes par défaut et bg-primary ; un en-tête d'une autre couleur (bg-success...) ou nex-entete-neutre garde la sienne.
   Bordures de la carte redessinées sur les côtés (l'en-tête recouvre la bordure de la carte). */
:root[data-nex-cartes=lisere] { --nex-r-lisere-fond: var(--nex-r-lisere); }
:root[data-nex-cartes=lisere_gris] { --nex-r-lisere-fond: var(--nex-r-lisere-gris); }
:root[data-nex-cartes=lisere_teinte] { --nex-r-lisere-fond: var(--nex-r-lisere-teinte); }
:root[data-nex-cartes=lisere_sombre] { --nex-r-lisere-fond: var(--nex-r-lisere-sombre); --nex-r-lisere-texte: #fff; }
:root[data-nex-cartes^=lisere] .card > .card-header:is(:not([class*="bg-"]):not(.nex-entete-neutre), .bg-primary) {
	background-color: var(--nex-r-lisere-fond) !important; background-image: none !important;
	color: var(--nex-r-lisere-texte) !important; --bs-card-cap-color: var(--nex-r-lisere-texte) !important; --nex-primary-contrast: var(--nex-r-lisere-texte) !important;
	border-bottom: 1px solid var(--nex-card-border) !important;
	box-shadow: inset 0 var(--nex-lisere-epaisseur) 0 var(--nex-primary), inset 1px 0 0 var(--nex-card-border), inset -1px 0 0 var(--nex-card-border);
}
:root[data-nex-cartes=lisere_sombre] .card > .card-header:is(:not([class*="bg-"]):not(.nex-entete-neutre), .bg-primary) { border-bottom-color: transparent !important; }
[data-nex-theme=code] { --nex-lisere-epaisseur: 2px; }   /* rendu d'origine de Code : fin */
/* épaisseur du liseré (réglage « lisere ») */
:root[data-nex-lisere=fin] { --nex-lisere-epaisseur: 2px; }
:root[data-nex-lisere=normal] { --nex-lisere-epaisseur: 3px; }
:root[data-nex-lisere=epais] { --nex-lisere-epaisseur: 4px; }