/* ==================================================================
   BANDEAU DE CONSENTEMENT
   Aux couleurs du club : fond bleu nuit, filet et blason dores, bouton
   principal or. Pose en bas d ecran, jamais en travers du contenu.
   ================================================================== */

.otb-cookies {
	position: fixed;
	z-index: 200;
	inset: auto 0 0 0;
	padding: var(--otb-e-s) var(--otb-marge) calc(var(--otb-e-s) + env(safe-area-inset-bottom, 0px));
	pointer-events: none;
}

.otb-cookies[hidden] {
	display: none !important;
}

.otb-cookies__carte {
	pointer-events: auto;
	max-width: var(--otb-largeur);
	margin-inline: auto;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--otb-e-m);
	padding: var(--otb-e-m) var(--otb-e-l);
	border: 1px solid var(--otb-filet);
	border-top: 2px solid var(--otb-or);
	border-radius: var(--otb-r-l);
	background: linear-gradient(160deg, var(--otb-surface-haute), var(--otb-nuit));
	box-shadow: var(--otb-ombre);
	animation: otb-cookies-entree var(--otb-lent) var(--otb-courbe) both;
}

@keyframes otb-cookies-entree {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: none; }
}

.otb-cookies__blason {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	flex: none;
}

.otb-cookies__blason svg {
	width: 100%;
	height: 100%;
}
/* Le titre est un paragraphe (pas un h2, pour ne pas polluer le plan de la page) : la regle doit primer sur celle des paragraphes du bandeau. */
.otb-cookies__texte .otb-cookies__titre,
.otb-cookies__titre {
	margin: 0 0 4px;
	font-family: var(--otb-titre);
	font-weight: 700;
	font-size: var(--otb-t-normal);
	color: var(--otb-or);
	letter-spacing: 0.01em;
}

.otb-cookies__texte p {
	margin: 0;
	color: var(--otb-blanc);
	font-size: 0.9rem;
	line-height: 1.55;
	max-width: 74ch;
}

.otb-cookies__texte a {
	color: var(--otb-or-clair);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.otb-cookies__texte a:hover,
.otb-cookies__texte a:focus-visible {
	color: var(--otb-blanc);
}

.otb-cookies__actions {
	display: flex;
	gap: var(--otb-e-s);
	flex: none;
}

.otb-cookies__actions .otb-btn {
	white-space: nowrap;
}

@media (max-width: 900px) {
	.otb-cookies__carte {
		grid-template-columns: auto minmax(0, 1fr);
		gap: var(--otb-e-s) var(--otb-e-m);
	}

	.otb-cookies__actions {
		grid-column: 1 / -1;
	}

	.otb-cookies__actions .otb-btn {
		flex: 1 1 auto;
		justify-content: center;
		text-align: center;
	}
}

@media (max-width: 560px) {
	.otb-cookies__blason {
		display: none;
	}

	.otb-cookies__carte {
		grid-template-columns: minmax(0, 1fr);
		padding: var(--otb-e-m);
	}
}

@media (prefers-reduced-motion: reduce) {
	.otb-cookies__carte {
		animation: none;
	}
}