/**
 * Pages légales : mentions, CGV, confidentialité, cookies, retours, livraison.
 * Voir inc/pages-legales.php.
 *
 * Tout est portée par la classe `glow-page-legale` posée sur le body, et rien
 * ne sort de ces six pages. Les sélecteurs commencent par `body` pour passer
 * devant les règles du thème et de Complianz, qui sont souvent aussi
 * spécifiques. Palette : le taupe de charte et ses dilutions, jamais de gris.
 */

body.glow-page-legale {
	/*
	 * Seule ligne qui change d'un site du réseau à l'autre : le surtitre de
	 * l'en-tête, dans la langue du site. Tous les autres libellés du module
	 * sont générés en PHP (voir glow_legale_textes()).
	 */
	--glow-legale-surtitre: "Juridisk information";
	--glow-taupe: #a2907b;
	--glow-taupe-fond: rgba(162, 144, 123, 0.11);
	--glow-taupe-filet: rgba(162, 144, 123, 0.3);
	--glow-taupe-appui: rgba(162, 144, 123, 0.55);
	--glow-legale-encre: #2a2521;
	--glow-legale-encre-forte: #1f1c18;
	--glow-legale-second: #766b5d;
	--glow-legale-largeur: 850px;
	--glow-legale-mesure: 560px;
	--glow-legale-serif: "ivypresto-display", "Times New Roman", serif;
	--glow-legale-sans: "neue-haas-unica", sans-serif;
}

/* ------------------------------------------------------------------ Cadre */

/*
 * Ces pages déclarent une colonne latérale que personne n'a jamais remplie :
 * elle amputait la page de 15 % de sa largeur pour ne rien afficher.
 */
body.glow-page-legale #secondary.widget-area {
	display: none;
}

body.glow-page-legale .content-area {
	float: none;
	width: 100%;
}

body.glow-page-legale .site-content {
	padding-bottom: 4rem;
}

body.glow-page-legale .archive-header {
	margin-bottom: 0.5rem;
}

body.glow-page-legale .archive-header .col-full {
	padding-right: 0;
	padding-left: 0;
}

body.glow-page-legale .rank-math-breadcrumb p {
	max-width: var(--glow-legale-largeur);
	margin: 0 auto;
	color: var(--glow-legale-second);
	font-size: 12px;
	letter-spacing: 0.04em;
}

/* ------------------------------------------------------- En-tête de la page */

body.glow-page-legale.page-template-default .entry-header {
	max-width: var(--glow-legale-largeur);
	margin: 0 auto 2.8rem;
	padding-bottom: 1.7rem;
	border-bottom: 1px solid var(--glow-taupe-filet);
}

body.glow-page-legale .entry-header::before {
	display: block;
	margin-bottom: 0.9rem;
	color: var(--glow-taupe);
	font-family: var(--glow-legale-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.2em;
	line-height: 1.2;
	text-transform: uppercase;
	content: var(--glow-legale-surtitre, "");
}

body.glow-page-legale .entry-header .entry-title {
	margin: 0;
	color: var(--glow-legale-encre-forte);
	font-family: var(--glow-legale-serif);
	font-size: clamp(30px, 1.4rem + 2.2vw, 46px);
	font-style: normal;
	font-weight: 100;
	letter-spacing: -0.005em;
	/* `blog.css` impose `line-height: normal !important` à tous les titres. */
	line-height: 1.1 !important;
}

/* ------------------------------------------------------------- La grille */

body.glow-page-legale .glow-legale {
	max-width: var(--glow-legale-largeur);
	margin: 0 auto;
}

body.glow-page-legale .glow-legale__corps {
	max-width: var(--glow-legale-mesure);
}

@media only screen and (min-width: 1060px) {

	body.glow-page-legale .glow-legale--sommaire {
		display: grid;
		grid-template-columns: 220px minmax(0, 1fr);
		column-gap: 70px;
		align-items: start;
	}
}

/* ----------------------------------------------------------- Le sommaire */

body.glow-page-legale .glow-legale__sommaire {
	margin: 0 0 2.6rem;
	padding: 1.1rem 0 0;
	border-top: 1px solid var(--glow-taupe-filet);
}

body.glow-page-legale .glow-legale__sommaire-titre {
	margin: 0 0 0.9rem;
	color: var(--glow-taupe);
	font-family: var(--glow-legale-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	line-height: 1.2;
	text-transform: uppercase;
}

body.glow-page-legale .glow-legale__sommaire-liste {
	max-height: 210px;
	margin: 0;
	padding: 0;
	overflow-y: auto;
	list-style: none;
}

body.glow-page-legale .glow-legale__sommaire-entree {
	margin: 0;
	padding: 0;
	list-style: none;
}

body.glow-page-legale .glow-legale__sommaire-entree + .glow-legale__sommaire-entree {
	border-top: 1px solid var(--glow-taupe-filet);
}

/*
 * Chaque entrée porte déjà son filet de séparation : un soulignement par-dessus
 * empilerait deux traits. Au repos le lien n'est donc pas souligné, et c'est le
 * survol qui l'annonce, doublé d'un changement de couleur. Le focus clavier
 * garde un contour franc, il ne doit jamais reposer sur la seule couleur.
 */
body.glow-page-legale .glow-legale__sommaire .glow-legale__sommaire-entree a {
	display: block;
	padding: 8px 0;
	color: var(--glow-legale-second);
	font-family: var(--glow-legale-sans);
	font-size: 12.5px;
	font-weight: 400;
	line-height: 1.45;
	text-decoration: none;
	transition: color 0.2s ease;
}

body.glow-page-legale .glow-legale__sommaire .glow-legale__sommaire-entree a:hover {
	color: var(--glow-taupe);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

body.glow-page-legale .glow-legale__sommaire .glow-legale__sommaire-entree a:focus-visible {
	color: var(--glow-legale-encre-forte);
	outline: 2px solid var(--glow-taupe);
	outline-offset: 2px;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

@media only screen and (min-width: 1060px) {

	body.glow-page-legale .glow-legale__sommaire {
		position: sticky;
		top: 96px;
		margin-bottom: 0;
	}

	body.glow-page-legale .glow-legale__sommaire-liste {
		max-height: calc(100vh - 190px);
		padding-right: 6px;
	}
}

/* ----------------------------------------------------- La colonne de texte */

body.glow-page-legale .entry-content {
	color: var(--glow-legale-encre);
	font-family: var(--glow-legale-sans);
	font-size: 17px;
	font-weight: 300;
	line-height: 1.72;
}

body.glow-page-legale .glow-legale__maj {
	margin: 0 0 2.4rem;
	color: var(--glow-legale-second);
	font-size: 12px;
	font-weight: 400;
	letter-spacing: 0.08em;
	line-height: 1.4;
	text-transform: uppercase;
}

body.glow-page-legale .entry-content p {
	margin: 0 0 1.15em;
	font-size: 17px;
	line-height: 1.72;
}

body.glow-page-legale .entry-content p:last-child {
	margin-bottom: 0;
}

body.glow-page-legale .entry-content a {
	color: var(--glow-taupe);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

body.glow-page-legale .entry-content a:hover,
body.glow-page-legale .entry-content a:focus {
	color: var(--glow-legale-encre-forte);
}

body.glow-page-legale .entry-content strong,
body.glow-page-legale .entry-content b {
	color: var(--glow-legale-encre-forte);
	font-weight: 500;
}

/* --------------------------------------------------------- La hiérarchie */

/*
 * Un filet fin ouvre chaque section : c'est ce qui donne le rythme vertical du
 * document, sans avoir à peser sur la taille des titres.
 */
body.glow-page-legale .glow-legale__corps h2,
body.glow-page-legale .entry-content #cmplz-document > h2 {
	margin: 3.2rem 0 1.1rem;
	padding-top: 1.7rem;
	padding-bottom: 0;
	border-top: 1px solid var(--glow-taupe-filet);
	border-bottom: 0;
	color: var(--glow-legale-encre-forte);
	font-family: var(--glow-legale-serif);
	font-size: clamp(22px, 1rem + 1.1vw, 28px);
	font-style: normal;
	font-weight: 100;
	letter-spacing: -0.005em;
	line-height: 1.22 !important;
	text-align: left;
	text-transform: none;
	scroll-margin-top: 96px;
}

/*
 * Le titre qui ouvre le document n'a rien à séparer de ce qui précède : la
 * classe est posée en PHP, seulement lorsque aucun texte ne vient avant lui.
 */
body.glow-page-legale .glow-legale__corps h2.glow-legale__titre--premier,
body.glow-page-legale .entry-content #cmplz-document h2.glow-legale__titre--premier {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

/*
 * Les titres de rang 3 étaient rendus exactement comme les titres de rang 2 :
 * même famille, même corps, même graisse. Ils deviennent une étiquette en
 * capitales, nettement différenciée du serif des sections.
 */
body.glow-page-legale .glow-legale__corps h3,
body.glow-page-legale .entry-content #cmplz-document h3 {
	margin: 2.1rem 0 0.7rem;
	padding-bottom: 0;
	border-bottom: 0;
	color: var(--glow-legale-encre-forte);
	font-family: var(--glow-legale-sans);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.11em;
	line-height: 1.45 !important;
	text-align: left;
	text-transform: uppercase;
	scroll-margin-top: 96px;
}

body.glow-page-legale .glow-legale__corps h4,
body.glow-page-legale .entry-content #cmplz-document h4 {
	margin: 1.4rem 0 0.45rem;
	color: var(--glow-legale-second);
	font-family: var(--glow-legale-sans);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.45 !important;
	text-transform: uppercase;
}

/* -------------------------------------------------------------- Listes */

body.glow-page-legale .glow-legale__corps ul,
body.glow-page-legale .glow-legale__corps ol {
	margin: 0 0 1.15em;
	padding-left: 1.1em;
}

body.glow-page-legale .glow-legale__corps li {
	margin: 0 0 0.45em;
	padding-left: 0.3em;
	line-height: 1.7;
}

body.glow-page-legale .glow-legale__corps li::marker {
	color: var(--glow-taupe);
}

/* ------------------------------------------------------------- Encadrés */

body.glow-page-legale .glow-legale__encadre {
	margin: 1.8rem 0 2rem;
	padding: 1.5rem 1.7rem 1.6rem;
	border-left: 2px solid var(--glow-taupe-appui);
	background: var(--glow-taupe-fond);
}

body.glow-page-legale .glow-legale__encadre p {
	margin: 0 0 0.75em;
	font-size: 15px;
	line-height: 1.7;
}

body.glow-page-legale .glow-legale__encadre p:last-child {
	margin-bottom: 0;
}

/* Filet de sécurité si un bloc de code subsiste malgré le filtre PHP. */
body.glow-page-legale .glow-legale__corps pre,
body.glow-page-legale .glow-legale__corps pre code {
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font-family: var(--glow-legale-sans);
	font-size: 15px;
	line-height: 1.7;
	white-space: pre-wrap;
	word-break: normal;
	overflow-x: visible;
}

/* ----------------------------------- Documents Complianz : cookies et RGPD */

body.glow-page-legale .entry-content #cmplz-document {
	max-width: 100%;
	margin: 0;
}

body.glow-page-legale .entry-content #cmplz-document > p > i,
body.glow-page-legale .entry-content #cmplz-document > p:first-child i {
	display: inline-block;
	color: var(--glow-legale-second);
	font-size: 13px;
	font-style: normal;
	letter-spacing: 0.02em;
	line-height: 1.6;
}

/* Complianz impose 14 px à son corps de texte : on le remet à la mesure du site. */
body.glow-page-legale .entry-content #cmplz-document p,
body.glow-page-legale .entry-content #cmplz-document li {
	font-size: 17px;
	line-height: 1.72;
}

body.glow-page-legale .entry-content #cmplz-document li {
	margin: 0 0 0.45em;
}

body.glow-page-legale .entry-content #cmplz-document li::marker {
	color: var(--glow-taupe);
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown {
	margin: 0 0 6px;
	border: 1px solid var(--glow-taupe-filet);
	background-color: transparent;
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown[open] {
	padding-bottom: 10px;
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown summary {
	margin: 0;
	padding: 12px 16px;
	background-color: var(--glow-taupe-fond);
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown summary h3 {
	margin: 0;
	padding: 0;
	font-size: 12.5px;
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown summary p {
	margin: 0;
	color: var(--glow-legale-second);
	font-size: 12px;
	line-height: 1.5;
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown p,
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown a {
	font-size: 14.5px;
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown p,
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown h4,
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown ul {
	padding-right: 16px;
	padding-left: 16px;
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cmplz-service-description,
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cmplz-sharing-data {
	padding: 0 0 12px;
}

/*
 * Le tableau des cookies arrivait dans les gris froids du plugin (#dadada,
 * #f7f7f7) : mêmes filets, même zébrage, mais en dilutions de taupe.
 */
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose {
	margin: 0 16px 14px;
	border: 1px solid var(--glow-taupe-filet);
	background-color: var(--glow-taupe-filet);
	grid-gap: 1px;
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose div {
	padding: 11px 14px;
	background-color: #fff;
	font-size: 13.5px;
	line-height: 1.55;
	overflow-wrap: anywhere;
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose .purpose,
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose .name-header,
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose .retention-header,
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose .function-header,
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n+2),
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n+3),
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n+4),
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n+5),
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n+6),
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose div:nth-child(12n+7) {
	background-color: var(--glow-taupe-fond);
}

body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose h4,
body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose h5 {
	margin: 0;
	padding: 0;
	color: var(--glow-legale-second);
	font-family: var(--glow-legale-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.5 !important;
	text-transform: uppercase;
}

/*
 * Le gestionnaire de consentement est injecté en JavaScript au milieu de la
 * politique de cookies, avec les mêmes gris froids : mêmes corrections.
 */
body.glow-page-legale #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category {
	margin-bottom: 6px;
	border: 1px solid var(--glow-taupe-filet);
	background-color: transparent;
}

body.glow-page-legale #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header {
	padding: 10px 16px;
	background-color: var(--glow-taupe-fond);
}

body.glow-page-legale #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header h2 {
	margin: 0;
	padding: 0;
	border: 0;
	color: var(--glow-legale-encre-forte);
	font-family: var(--glow-legale-sans);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.11em;
	line-height: 1.45 !important;
	text-transform: uppercase;
}

body.glow-page-legale #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-title {
	color: var(--glow-legale-encre-forte);
	font-family: var(--glow-legale-sans);
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}

body.glow-page-legale #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-description {
	padding: 12px 16px;
}

body.glow-page-legale #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-always-active {
	color: var(--glow-taupe);
}

/* --------------------------------------------- Rappel des autres documents */

body.glow-page-legale .glow-legale__liens {
	margin-top: 3.4rem;
	padding-top: 1.7rem;
	border-top: 1px solid var(--glow-taupe-filet);
}

body.glow-page-legale .glow-legale__liens-titre {
	margin: 0 0 0.9rem;
	color: var(--glow-taupe);
	font-family: var(--glow-legale-sans);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	line-height: 1.2;
	text-transform: uppercase;
}

body.glow-page-legale .glow-legale__liens-liste {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 26px;
	margin: 0;
	padding: 0;
	list-style: none;
}

body.glow-page-legale .glow-legale__liens-liste li {
	margin: 0;
	padding: 0;
	list-style: none;
}

body.glow-page-legale .glow-legale__liens-liste a {
	color: var(--glow-legale-second);
	font-family: var(--glow-legale-sans);
	font-size: 13.5px;
	font-weight: 400;
	text-decoration: none;
	border-bottom: 1px solid var(--glow-taupe-filet);
	padding-bottom: 2px;
	transition: color 0.2s ease, border-color 0.2s ease;
}

body.glow-page-legale .glow-legale__liens-liste a:hover,
body.glow-page-legale .glow-legale__liens-liste a:focus {
	color: var(--glow-taupe);
	border-bottom-color: var(--glow-taupe);
	text-decoration: none;
}

/* -------------------------------------------------------------- Mobile */

@media only screen and (max-width: 767px) {

	body.glow-page-legale .entry-content,
	body.glow-page-legale .entry-content p,
	body.glow-page-legale .entry-content #cmplz-document p,
	body.glow-page-legale .entry-content #cmplz-document li {
		font-size: 15.5px;
		line-height: 1.72;
	}

	body.glow-page-legale.page-template-default .entry-header {
		margin-bottom: 2rem;
		padding-bottom: 1.3rem;
	}

	/*
	 * La taille de base du document est plus grande sur mobile : la borne haute
	 * du clamp y donnerait un titre de près de 40 px, qui passerait sur trois
	 * lignes. On la fixe.
	 */
	body.glow-page-legale .entry-header .entry-title {
		font-size: 30px;
	}

	body.glow-page-legale .glow-legale__corps h2,
	body.glow-page-legale .entry-content #cmplz-document > h2 {
		margin-top: 2.5rem;
		padding-top: 1.4rem;
	}

	body.glow-page-legale .glow-legale__encadre {
		padding: 1.2rem 1.2rem 1.3rem;
	}

	body.glow-page-legale .entry-content #cmplz-document .cmplz-dropdown .cookies-per-purpose {
		margin-right: 0;
		margin-left: 0;
	}
}
