/* ============================================================
   AGE GATE — habillage du plugin age-gate à la DA G2
   (éditorial doux « Porn for Women »)
   ============================================================
   Le plugin (v3.7.x) se style via des custom properties --ag-*
   (cf. wp-content/plugins/age-gate/dist/raw/main.css). On les
   redéfinit sur .age-gate__wrapper (plus spécifique que le
   :root inline du plugin, donc prioritaire quel que soit
   l'ordre de chargement), + quelques règles ciblées pour la
   typo et les 2 boutons (couleurs différenciées Yes/No). */

.age-gate__wrapper {
	/* Fond plein écran : cream opaque */
	--ag-background-color: var(--g2-cream, #F6EFEA);
	--ag-background-opacity: 1;
	--ag-blur: 0px;

	/* Card centrale : paper, arrondie, ombre douce burgundy */
	--ag-form-background: var(--g2-paper, #ffffff);
	--ag-form-border: 1px solid var(--g2-line, #f0e7e0);
	--ag-form-border-width: 1px;
	--ag-form-radius: var(--g2-radius-bigcard, 26px);
	--ag-form-shadow: var(--g2-shadow-soft, 0 14px 40px rgba(81, 22, 25, 0.07));
	--ag-form-padding: 52px 44px;
	--ag-form-max-width: 520px;

	/* Texte */
	--ag-text-color: var(--g2-ink, #511619);
	--ag-text-heading-size: 38px;
	--ag-text-heading-weight: 800;
	--ag-text-heading-margin: 0 0 8px;

	/* Boutons (base commune ; couleurs par bouton plus bas) */
	--ag-button-radius: var(--g2-radius-pill, 999px);
	--ag-button-padding: 15px 42px;
	--ag-button-size: 15px;
	--ag-button-weight: 700;
	--ag-button-gap: 14px;

	/* Divers */
	--ag-remember-size: 13px;
	--ag-text-error-color: var(--g2-accent, #E84C5E);
	--ag-text-error-weight: 700;
	--ag-loader-color: var(--g2-accent, #E84C5E);
}

/* Logo du site au-dessus du titre */
.age-gate__wrapper .age-gate__heading::before {
	content: "";
	display: block;
	width: 64px;
	height: 64px;
	margin: 0 auto 18px;
	background: url("../images/logo-bed.png") center / contain no-repeat;
}

/* Titre "Porn for Women" : wordmark Bricolage + point dégradé */
.age-gate__wrapper .age-gate__heading-title {
	font-family: var(--wp--preset--font-family--display, "Bricolage Grotesque", sans-serif);
	letter-spacing: -0.02em;
	line-height: 1.05;
	color: var(--g2-ink, #511619);
}

.age-gate__wrapper .age-gate__heading-title::after {
	content: ".";
	background: var(--g2-grad, linear-gradient(100deg, #FF3D6E, #FF8A3D));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

/* Question : Hanken, ton doux */
.age-gate__wrapper .age-gate__challenge {
	font-family: var(--wp--preset--font-family--body, "Hanken Grotesk", sans-serif);
	font-size: 19px;
	font-weight: 500;
	line-height: 1.4;
	margin: 0 0 30px;
	color: var(--g2-body-alt, #6B4540);
}

/* Boutons : pills. Yes = dégradé rose→orange, No = contour discret. */
.age-gate button.age-gate__submit--yes,
.age-gate button.age-gate__submit--no {
	font-family: var(--wp--preset--font-family--body, "Hanken Grotesk", sans-serif);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.age-gate button.age-gate__submit--yes {
	background: var(--g2-grad, linear-gradient(100deg, #FF3D6E, #FF8A3D));
	border: 0;
	color: #fff;
	box-shadow: var(--g2-shadow-card, 0 4px 14px rgba(81, 22, 25, 0.04));
}

.age-gate button.age-gate__submit--no {
	background: var(--g2-paper, #ffffff);
	border: 1px solid var(--g2-line, #f0e7e0);
	color: var(--g2-ink-soft, #5C3A38);
	box-shadow: none;
}

.age-gate button.age-gate__submit--yes:hover,
.age-gate button.age-gate__submit--yes:focus,
.age-gate button.age-gate__submit--yes:active {
	background: var(--g2-grad, linear-gradient(100deg, #FF3D6E, #FF8A3D));
	border: 0;
	color: #fff;
	transform: translateY(-2px);
	box-shadow: var(--g2-shadow-hover, 0 12px 28px rgba(81, 22, 25, 0.10));
}

.age-gate button.age-gate__submit--no:hover,
.age-gate button.age-gate__submit--no:focus,
.age-gate button.age-gate__submit--no:active {
	background: var(--g2-cream, #F6EFEA);
	border: 1px solid var(--g2-line, #f0e7e0);
	color: var(--g2-ink, #511619);
	transform: translateY(-2px);
	box-shadow: var(--g2-shadow-card, 0 4px 14px rgba(81, 22, 25, 0.04));
}

/* Remember me */
.age-gate__wrapper .age-gate__remember {
	font-family: var(--wp--preset--font-family--body, "Hanken Grotesk", sans-serif);
	color: var(--g2-muted, #8a786f);
}

.age-gate__wrapper .age-gate__remember-field {
	accent-color: var(--g2-accent, #E84C5E);
}

/* Message d'erreur */
.age-gate__wrapper .age-gate__errors {
	font-family: var(--wp--preset--font-family--body, "Hanken Grotesk", sans-serif);
}

@media (max-width: 480px) {
	.age-gate__wrapper {
		--ag-form-padding: 38px 26px;
		--ag-text-heading-size: 29px;
		--ag-button-padding: 14px 30px;
		--ag-form-max-width: calc(100vw - 32px);
	}

	.age-gate__wrapper .age-gate__challenge {
		font-size: 17px;
	}

	.age-gate__wrapper .age-gate__heading::before {
		width: 54px;
		height: 54px;
	}
}
