/**
 * Bandeau de consentement.
 *
 * Posé en bas de page plutôt qu'en plein écran : il laisse le site lisible,
 * ce qui évite la fenêtre bloquante que les visiteurs referment au hasard.
 *
 * « Tout refuser » et « Tout accepter » ont volontairement le même poids
 * visuel : même taille, même graisse, même surface, et deux fonds pleins de
 * contraste équivalent. Le refus doit être aussi simple que l'accord, et un
 * bouton effacé en face d'un bouton de couleur ne respecte pas cette règle —
 * c'est le motif de plusieurs sanctions européennes.
 */

.ow-consentement {
	position: fixed;
	inset: auto 0 0 0;
	z-index: 99999;
	padding: 1rem;
	background: rgba( 17, 24, 39, 0.97 );
	box-shadow: 0 -4px 24px rgba( 0, 0, 0, 0.25 );
	color: #f3f4f6;
	font-size: 15px;
	line-height: 1.55;
}

.ow-consentement[hidden] {
	display: none;
}

.ow-consentement__boite {
	max-width: 1100px;
	margin: 0 auto;
}

.ow-consentement__titre {
	margin: 0 0 0.35rem;
	color: #fff;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.3;
}

.ow-consentement__texte {
	margin: 0 0 0.9rem;
	max-width: 70ch;
	color: #d1d5db;
}

.ow-consentement__texte a {
	color: #fff;
	text-decoration: underline;
}

.ow-consentement__details {
	margin: 0 0 0.9rem;
	padding: 0.85rem 1rem;
	border-radius: 6px;
	background: rgba( 255, 255, 255, 0.06 );
}

.ow-consentement__categorie {
	display: flex;
	gap: 0.65rem;
	align-items: flex-start;
	padding: 0.45rem 0;
	cursor: pointer;
}

.ow-consentement__categorie input {
	flex: 0 0 auto;
	margin-top: 0.3rem;
	width: 1.05rem;
	height: 1.05rem;
	accent-color: #2563eb;
}

.ow-consentement__categorie input:disabled {
	cursor: not-allowed;
	opacity: 0.65;
}

.ow-consentement__categorie span {
	color: #d1d5db;
	font-size: 0.92rem;
}

.ow-consentement__categorie strong {
	display: block;
	color: #fff;
	font-weight: 600;
}

.ow-consentement__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	align-items: center;
}

.ow-consentement__bouton {
	flex: 0 1 auto;
	min-width: 170px;
	padding: 0.7rem 1.4rem;
	border: 1px solid transparent;
	border-radius: 4px;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
}

/*
 * Les états sont répétés avec le conteneur en préfixe : le thème repeint
 * « button:hover » et « button:focus » en orange, et sans cette spécificité
 * il effacerait la distinction entre refuser et accepter au premier survol.
 */
.ow-consentement .ow-consentement__bouton--refus,
.ow-consentement .ow-consentement__bouton--refus:link,
.ow-consentement .ow-consentement__bouton--refus:visited,
.ow-consentement .ow-consentement__bouton--refus:focus,
.ow-consentement .ow-consentement__bouton--refus:active {
	background: #f3f4f6;
	color: #111827;
}

.ow-consentement .ow-consentement__bouton--refus:hover {
	background: #fff;
	color: #111827;
}

.ow-consentement .ow-consentement__bouton--accord,
.ow-consentement .ow-consentement__bouton--choix,
.ow-consentement .ow-consentement__bouton--accord:focus,
.ow-consentement .ow-consentement__bouton--choix:focus,
.ow-consentement .ow-consentement__bouton--accord:active,
.ow-consentement .ow-consentement__bouton--choix:active {
	background: #2563eb;
	color: #fff;
}

.ow-consentement .ow-consentement__bouton--accord:hover,
.ow-consentement .ow-consentement__bouton--choix:hover {
	background: #1d4ed8;
	color: #fff;
}

.ow-consentement .ow-consentement__lien,
.ow-consentement .ow-consentement__lien:focus,
.ow-consentement .ow-consentement__lien:active {
	padding: 0.7rem 0.4rem;
	border: 0;
	background: none;
	color: #d1d5db;
	font-family: inherit;
	font-size: 0.92rem;
	text-decoration: underline;
	cursor: pointer;
}

.ow-consentement .ow-consentement__lien:hover {
	background: none;
	color: #fff;
}

.ow-consentement :focus-visible {
	outline: 2px solid #93c5fd;
	outline-offset: 2px;
}

/*
 * Bouton de réouverture, destiné au pied de page et à la page de politique.
 *
 * Il doit se fondre dans le texte qui l'entoure, aussi bien sur le fond sombre
 * du pied de page que sur le fond clair d'une page. « color: inherit » dit
 * exactement cela, mais le thème impose aux boutons un gris foncé qui le rend
 * invisible sur le pied de page. Comme cet élément doit rester lisible quel que
 * soit le thème — et qu'un moyen de retirer son consentement qu'on ne voit pas
 * n'en est pas un — les quelques propriétés concernées sont imposées.
 */
button.ow-consentement-rouvrir,
button.ow-consentement-rouvrir:hover,
button.ow-consentement-rouvrir:focus,
button.ow-consentement-rouvrir:active {
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	color: inherit !important;
	font: inherit !important;
	text-transform: none !important;
	text-decoration: underline !important;
	line-height: inherit !important;
	cursor: pointer;
}

@media ( max-width: 600px ) {
	.ow-consentement {
		padding: 0.9rem;
		font-size: 14px;
	}

	.ow-consentement__bouton {
		flex: 1 1 100%;
		min-width: 0;
	}

	.ow-consentement__lien {
		flex: 1 1 100%;
		text-align: center;
	}
}