/**
 * VerifyAge frontend styles.
 */

#verifyage-root,
.verifyage-gate {
	--verifyage-font: inherit;
	position: fixed;
	inset: 0;
	z-index: var(--verifyage-z, 999999);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--verifyage-font), system-ui, -apple-system, Segoe UI, sans-serif;
	font-size: var(--verifyage-font-size, 16px);
	color: var(--verifyage-description, #444);
	text-align: var(--verifyage-align, center);
}

.verifyage-gate[hidden] {
	display: none !important;
}

.verifyage-backdrop {
	position: absolute;
	inset: 0;
	background-color: var(--verifyage-backdrop, #000);
	opacity: var(--verifyage-backdrop-opacity, 0.85);
	backdrop-filter: blur(var(--verifyage-backdrop-blur, 0));
	-webkit-backdrop-filter: blur(var(--verifyage-backdrop-blur, 0));
}

.verifyage-mode-full_screen .verifyage-backdrop,
.verifyage-mode-center_card .verifyage-backdrop {
	background-color: var(--verifyage-bg, #111);
	background-image: var(--verifyage-bg-image, none);
	background-size: var(--verifyage-bg-size, cover);
	background-position: var(--verifyage-bg-position, center center);
	background-repeat: var(--verifyage-bg-repeat, no-repeat);
	opacity: 1;
}

.verifyage-dialog {
	position: relative;
	z-index: 2;
	width: min(100%, var(--verifyage-card-max, 520px));
	padding: 16px;
	outline: none;
}

.verifyage-card {
	background: var(--verifyage-card-bg, #fff);
	padding: var(--verifyage-card-pad, 32px);
	border-radius: var(--verifyage-card-radius, 12px);
	border: var(--verifyage-card-border-w, 0) solid var(--verifyage-card-border-c, #ddd);
	box-shadow: var(--verifyage-shadow, 0 10px 30px rgba(0, 0, 0, 0.18));
}

.verifyage-logo {
	margin-bottom: 16px;
}

.verifyage-logo img {
	display: inline-block;
	height: auto;
	max-width: 100%;
}

.verifyage-site-title {
	margin: 0 0 8px;
	font-weight: 600;
}

.verifyage-heading {
	margin: 0 0 12px;
	color: var(--verifyage-heading, #111);
	font-size: var(--verifyage-heading-size, 28px);
	line-height: 1.2;
}

.verifyage-description {
	margin: 0 0 20px;
	color: var(--verifyage-description, #444);
	line-height: 1.5;
}

.verifyage-disclaimer {
	margin-top: 20px;
	color: var(--verifyage-disclaimer, #666);
	font-size: 0.875em;
	line-height: 1.4;
}

.verifyage-live:empty {
	display: none;
}

.verifyage-live {
	margin-bottom: 12px;
	color: #b32d2e;
}

.verifyage-button-row,
.verifyage-checkbox-wrap,
.verifyage-dob {
	display: flex;
	flex-direction: column;
	gap: var(--verifyage-btn-gap, 12px);
}

.verifyage-button-row {
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
}

.verifyage-btn {
	appearance: none;
	border: 0;
	cursor: pointer;
	min-height: var(--verifyage-btn-height, 48px);
	padding: 0 18px;
	border-radius: var(--verifyage-btn-radius, 8px);
	font-size: var(--verifyage-button-size, 16px);
	font-weight: 600;
	line-height: 1.2;
	transition: background-color 0.2s ease, opacity 0.2s ease;
}

.verifyage-btn:focus-visible {
	outline: 3px solid #2271b1;
	outline-offset: 2px;
}

.verifyage-btn:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.verifyage-btn.is-loading {
	opacity: 0.7;
	pointer-events: none;
}

.verifyage-btn-enter {
	background: var(--verifyage-enter-bg, #111);
	color: var(--verifyage-enter-color, #fff);
}

.verifyage-btn-enter:hover:not(:disabled) {
	background: var(--verifyage-enter-hover, #333);
}

.verifyage-btn-leave {
	background: var(--verifyage-leave-bg, #eee);
	color: var(--verifyage-leave-color, #111);
}

.verifyage-btn-leave:hover:not(:disabled) {
	background: var(--verifyage-leave-hover, #ddd);
}

.verifyage-checkbox-label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	text-align: left;
	cursor: pointer;
}

.verifyage-dob-native,
.verifyage-dob-fallback {
	text-align: left;
}

.verifyage-dob-selects {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
}

.verifyage-dob label,
.verifyage-dob legend {
	display: block;
	margin-bottom: 6px;
	font-weight: 600;
}

.verifyage-dob input[type="date"],
.verifyage-dob select {
	width: 100%;
	min-height: 40px;
	padding: 6px 8px;
	border: 1px solid #c3c4c7;
	border-radius: 6px;
	background: #fff;
}

.verifyage-dob-fallback {
	border: 0;
	padding: 0;
	margin: 0;
}

body.verifyage-locked {
	overflow: hidden !important;
}

/* Animations */
.verifyage-anim-fade .verifyage-dialog {
	animation: verifyage-fade 0.28s ease;
}

.verifyage-anim-fade_up .verifyage-dialog {
	animation: verifyage-fade-up 0.32s ease;
}

.verifyage-anim-zoom .verifyage-dialog {
	animation: verifyage-zoom 0.28s ease;
}

@keyframes verifyage-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes verifyage-fade-up {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: translateY(0); }
}

@keyframes verifyage-zoom {
	from { opacity: 0; transform: scale(0.96); }
	to { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
	.verifyage-anim-fade .verifyage-dialog,
	.verifyage-anim-fade_up .verifyage-dialog,
	.verifyage-anim-zoom .verifyage-dialog {
		animation: none;
	}
}

@media (max-width: 600px) {
	.verifyage-button-row {
		flex-direction: column;
	}

	.verifyage-gate.verifyage-fullwidth-mobile .verifyage-btn,
	body.verifyage-pending .verifyage-btn {
		width: 100%;
	}

	.verifyage-dob-selects {
		grid-template-columns: 1fr;
	}
}

/* Hide native date if unsupported fallback needed via JS class */
.verifyage-dob.use-fallback .verifyage-dob-native {
	display: none;
}

.verifyage-dob:not(.use-fallback) .verifyage-dob-fallback {
	display: none;
}

/* RTL */
.rtl .verifyage-checkbox-label,
.rtl .verifyage-dob-native,
.rtl .verifyage-dob-fallback {
	text-align: right;
}