/*
 * Le bandeau cookies de Complianz, aux couleurs du site (Will, 16/10 : « gros,
 * pas beau »). Complianz règle son bandeau par des variables CSS : on les
 * remplace par nos jetons. Ses classes ne sont pas les nôtres : on les vise
 * par attribut ([class~="…"]), sans les reprendre comme classes du thème.
 * Sur mobile, le bandeau se resserre : Accepter et Refuser côte à côte, les
 * préférences en lien, les documents sur une ligne.
 */

body [class~="cmplz-cookiebanner"] {
	--cmplz_banner_background_color: var(--pel-blanc);
	--cmplz_banner_border_color: var(--pel-lin);
	--cmplz_banner_border_radius: var(--pel-radius-l);
	--cmplz_text_color: var(--pel-encre);
	--cmplz_hyperlink_color: var(--pel-terre-foncee);
	--cmplz_text_font_size: var(--pel-fs-small);
	--cmplz_link_font_size: var(--pel-fs-small);
	--cmplz_button_font_size: var(--pel-fs-champ);
	--cmplz_button_border_radius: var(--pel-radius-pill);
	--cmplz_button_accept_background_color: var(--pel-terre-cuite);
	--cmplz_button_accept_border_color: var(--pel-terre-cuite);
	--cmplz_button_accept_text_color: var(--pel-blanc);
	--cmplz_button_deny_background_color: var(--pel-blanc);
	--cmplz_button_deny_border_color: var(--pel-terre-foncee);
	--cmplz_button_deny_text_color: var(--pel-terre-foncee);
	--cmplz_button_settings_background_color: var(--pel-blanc);
	--cmplz_button_settings_border_color: var(--pel-lin);
	--cmplz_button_settings_text_color: var(--pel-encre-douce);
	--cmplz_slider_active_color: var(--pel-terre-cuite);
	box-shadow: var(--pel-shadow-m);
	font-family: var(--pel-font-texte);
}

body [class~="cmplz-cookiebanner"] [class~="cmplz-btn"] {
	min-height: var(--pel-cible);
	font-family: var(--pel-font-texte);
	font-weight: 600;
}

@media (max-width: 767px) {
	body [class~="cmplz-cookiebanner"] {
		padding: var(--pel-space-s);
		row-gap: var(--pel-space-xs);
	}

	body [class~="cmplz-cookiebanner"] [class~="cmplz-message"] {
		line-height: var(--pel-lh-texte);
	}

	/* Accepter et Refuser sur une rangée, à poids égal ; les préférences dessous, en lien. */
	body [class~="cmplz-cookiebanner"] [class~="cmplz-buttons"] {
		display: flex;
		flex-flow: row wrap;
		gap: var(--pel-space-xs);
	}

	/* Plus précis que « .cmplz-cookiebanner .cmplz-buttons .cmplz-btn » de Complianz, chargé après. */
	body [class~="cmplz-cookiebanner"] [class~="cmplz-buttons"] [class~="cmplz-btn"][class~="cmplz-accept"],
	body [class~="cmplz-cookiebanner"] [class~="cmplz-buttons"] [class~="cmplz-btn"][class~="cmplz-deny"] {
		flex: 1 1 0;
		width: auto;
		margin: 0;
	}

	body [class~="cmplz-cookiebanner"] [class~="cmplz-buttons"] [class~="cmplz-btn"][class~="cmplz-view-preferences"],
	body [class~="cmplz-cookiebanner"] [class~="cmplz-buttons"] [class~="cmplz-btn"][class~="cmplz-save-preferences"] {
		flex: 1 1 100%;
		min-height: var(--pel-cible);
		margin: 0;
		border-color: transparent;
		background: transparent;
		text-decoration: underline;
	}

	/* Les documents sur une ligne, en petit. */
	body [class~="cmplz-cookiebanner"] [class~="cmplz-links"] ul,
	body [class~="cmplz-cookiebanner"] [class~="cmplz-documents"] {
		display: flex;
		flex-wrap: wrap;
		gap: var(--pel-space-2xs) var(--pel-space-s);
		margin: 0;
	}

	body [class~="cmplz-cookiebanner"] [class~="cmplz-links"] a {
		line-height: var(--pel-lh-titre);
	}
}