/*--------------------------------------------
 * Couleurs selon la langue de la page
 *
 * Remplace spip_ufe_fr.css et spip_ufe_eo.css.
 * La langue est lue sur <html lang="...">, écrit par chaque squelette avec #LANG.
 * - html[lang="fr"]       : français
 * - html:not([lang="fr"]) : espéranto (et toute autre langue, comme avant :
 *                           head.html chargeait spip_ufe_eo.css pour tout ce qui n'était pas fr)
 *
 * Les règles propres à une seule langue sont écrites avec :where(html[...]),
 * qui n'ajoute aucune priorité : elles pèsent exactement comme dans les anciens fichiers.
 *--------------------------------------------
*/

/* Couleurs : français */
html {
	--langue-accent: var(--rose);              /* intertitres, filets, barre de navigation */
	--langue-clair: #FF7373;                   /* filet du chapo, encadré flottant */
	--langue-fond-tableau: #FDE7E7;            /* lignes impaires du trombinoscope */
	--langue-lien: var(--bleu);                /* liens des compléments */
	--langue-lien-actif: var(--vert);          /* lien des compléments au clic */
	--langue-archives: var(--rose);            /* titres et clic dans les archives */
	--langue-nav-survol: var(--bleu);          /* barre de navigation au survol */
	--langue-nav-actif: var(--vert);           /* barre de navigation et sous-menu au clic */
	--langue-menu: var(--rose);                /* menu de gauche, niveau 1 */
	--langue-traductions: var(--vert);         /* bloc des traductions */
	--langue-traductions-lien: var(--bleu);
	--langue-traductions-survol: #006363;
}

/* Couleurs : espéranto */
html:not([lang="fr"]) {
	--langue-accent: var(--vert);
	--langue-clair: #5CCCCC;
	--langue-fond-tableau: #5CCCCC;
	--langue-lien: #006363;
	--langue-lien-actif: #1D7373;
	--langue-archives: #1D7373;
	--langue-nav-survol: #5CCCCC;
	--langue-nav-actif: #33CCCC;
	--langue-menu: var(--bleu);
	--langue-traductions: #BF3030;
	--langue-traductions-lien: #BF3030;
	--langue-traductions-survol: #FF4040;
}

div.intertitre {color: var(--langue-accent);}
.chapo hr.spip {color: var(--langue-clair);}
/*--------------------------------------------
 * tableaux
 *--------------------------------------------
*/
:where(html[lang="fr"]) table.trombi {
	border:1px solid #FDE7E7;
}
table.trombi tr.impair td {
	background-color: var(--langue-fond-tableau);
}
/*--------------------------------------------
 * compléments de l'article
 *--------------------------------------------
*/
div.complements {
	border-top:1px dashed var(--langue-accent);
}
.complements p.titre {color: var(--langue-accent);}
.complements p.titre:before {background-color: var(--langue-accent);}
.complements ul {color: var(--langue-lien);}
.complements a {color: var(--langue-lien);}
:where(html[lang="fr"]) .complements a:hover {text-decoration: underline;}
:where(html:not([lang="fr"])) .complements a:hover {color: var(--vert);}
.complements a:active {color: var(--langue-lien-actif);}
/*--------------------------------------------
 * liste des articles de la rubrique archives
 *--------------------------------------------
*/
.archives h2 {
	color: var(--langue-archives);
}
.archives a:hover {
	color: var(--vert);
}
.archives a:active {
	color: var(--langue-archives);
}

/*--------------------------------------------
 * encadré
 *--------------------------------------------
*/
div.encadre {
	background-color:#CFF76F;
	border:1px dashed #86B32D;
}
/*--------------------------------------------
 * encadré flottant à droite pour page article
 *--------------------------------------------
*/
div.cadredroite {
	border:1px dashed var(--langue-accent);
}
div.cadredroite h3 {
	background-color: var(--langue-clair);
}
div.bordgauche {
	border-left:3px solid var(--langue-clair);
}

/*--------------------------------------------
 * barre de navigation
 *--------------------------------------------
*/

div#barrenav {
	background-color: var(--langue-accent);
}
div#barrenav ul.nav a {
	background-color: var(--langue-accent);
}
div#barrenav ul.nav a:hover {
	text-decoration:none;
	background-color: var(--langue-nav-survol);
}
div#barrenav ul.nav a:active {
	background-color: var(--langue-nav-actif);
}
/*--------------------------------------------
 * menu
 *--------------------------------------------
*/
#menu ul.niv1 > li > a {color: var(--langue-menu);}
:where(html:not([lang="fr"])) #menu ul.niv1 > li > a {font-weight: 600;}
#menu ul.niv1 > li > a:hover {
	background-color: var(--langue-menu);
	color:#FFF;
}
#menu ul.niv1 > li > a:active {
	background-color:var(--vert);
	color:#FFF;
}
#menu ul.niv2 > li > a:hover {color: var(--langue-accent);}
#menu ul.niv2 > li > a:active {color: var(--langue-nav-actif);}

/*--------------------------------------------
 * corps de page : lien vers l'article ou la rubrique (espéranto seulement)
 *--------------------------------------------
*/
:where(html:not([lang="fr"])) a.suite:hover {
	color:#FFF;
	background-color:#33CCCC;
}
:where(html:not([lang="fr"])) a.suite:active {
	color:#FFF;
	background-color:var(--vert);
}
/*--------------------------------------------
 * impression (espéranto seulement)
 *--------------------------------------------
*/
:where(html:not([lang="fr"])) .impression a:hover {
	color:#FFF;
	background-color:#33CCCC;
}
/* Corrigée le 1er novembre 2026 : l'ancien spip_ufe_eo.css écrivait « :acrive », que le
   navigateur ignorait. Cette règle s'applique donc pour la première fois. */
:where(html:not([lang="fr"])) .impression a:active {
	color:#FFF;
	background-color:var(--vert);
}

/*--------------------------------------------
 * traduction
 *--------------------------------------------
*/

.traductions {
	background-color:#FFF;
	color: var(--langue-traductions);
}

.traductions a {
	background-color:#FFF;
	color: var(--langue-traductions-lien);
	text-decoration:underline;
}
.traductions a:hover {
	color: var(--langue-traductions-survol);
}
.traductions a:active {
	color: var(--langue-traductions-survol);
}
