/* Adblock Detector — front-end styles
 * Editorial, warm, on-brand with the FidelityHouse crimson.
 */

.adbd-notice,
.adbd-notice * {
	box-sizing: border-box;
}

.adbd-notice {
	/* Core tokens carry a hex fallback for browsers without OKLCH. */
	--adbd-brand: #d2235b;
	--adbd-brand: oklch( 0.557 0.198 8.5 );
	--adbd-brand-dark: #a8164a;
	--adbd-brand-dark: oklch( 0.458 0.176 9 );
	--adbd-ink: #1d1420;
	--adbd-ink: oklch( 0.215 0.018 12 );
	--adbd-muted: #6f6675;
	--adbd-muted: oklch( 0.515 0.018 12 );
	--adbd-paper: #fdfcfc;
	--adbd-paper: oklch( 0.992 0.004 20 );
	--adbd-surface: #f5eef1;
	--adbd-surface: oklch( 0.965 0.007 12 );

	/* Decorative, OKLCH-only. */
	--adbd-brand-bright: oklch( 0.745 0.135 6 );
	--adbd-badge-from: oklch( 0.955 0.018 9 );
	--adbd-badge-to: oklch( 0.905 0.045 8 );
	--adbd-ring: oklch( 0.557 0.198 8.5 / 0.42 );
	--adbd-halo: oklch( 0.557 0.198 8.5 / 0.14 );
	--adbd-shadow: oklch( 0.458 0.176 9 / 0.42 );
	--adbd-scrim: oklch( 0.18 0.03 12 / 0.55 );

	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
}

/* ---------- Modal ---------- */

.adbd-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: var(--adbd-scrim);
	-webkit-backdrop-filter: blur( 8px ) saturate( 120% );
	backdrop-filter: blur( 8px ) saturate( 120% );
	animation: adbd-fade 0.32s ease both;
}

.adbd-modal .adbd-box {
	position: relative;
	width: 100%;
	max-width: 432px;
	max-height: calc( 100vh - 48px );
	overflow-y: auto;
	padding: 42px 36px 34px;
	background: var(--adbd-paper);
	border-radius: 18px;
	text-align: center;
	box-shadow:
		0 1px 0 oklch( 1 0 0 / 0.7 ) inset,
		0 20px 54px -14px oklch( 0.18 0.03 12 / 0.5 ),
		0 6px 16px -6px oklch( 0.18 0.03 12 / 0.28 );
	animation: adbd-pop 0.46s cubic-bezier( 0.16, 1, 0.3, 1 ) 0.05s both;
}

/* Programmatic focus lands on the box; no outline needed there. */
.adbd-modal .adbd-box:focus {
	outline: none;
}

/* Crimson accent strip pinned to the top edge of the card. */
.adbd-modal .adbd-box::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient( 90deg, var(--adbd-brand), var(--adbd-brand-bright) );
	border-radius: 18px 18px 0 0;
}

/* Icon badge */
.adbd-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 70px;
	height: 70px;
	margin: 0 auto 20px;
	border-radius: 50%;
	background: radial-gradient( circle at 50% 36%, var(--adbd-badge-from), var(--adbd-badge-to) );
	box-shadow: 0 0 0 9px var(--adbd-halo);
}

.adbd-icon svg {
	width: 32px;
	height: 32px;
	fill: var(--adbd-brand);
	transform-origin: 50% 55%;
	/* One welcoming beat on arrival, then rest. */
	animation: adbd-beat 1.15s ease 0.5s 1 both;
}

/* Title */
.adbd-title {
	margin: 0 0 12px;
	font-family: "Hoefler Text", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
	font-size: 25px;
	line-height: 1.24;
	font-weight: 600;
	letter-spacing: -0.012em;
	color: var(--adbd-ink);
}

/* Message */
.adbd-modal .adbd-message {
	margin: 0 auto;
	max-width: 34ch;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--adbd-muted);
}

.adbd-message a {
	color: var(--adbd-brand);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Actions */
.adbd-actions {
	margin-top: 28px;
}

.adbd-reload {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 210px;
	min-height: 48px;
	padding: 13px 28px;
	border: 0;
	border-radius: 12px;
	background: linear-gradient( 180deg, var(--adbd-brand), var(--adbd-brand-dark) );
	color: #fff;
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.01em;
	cursor: pointer;
	box-shadow:
		0 1px 0 oklch( 1 0 0 / 0.28 ) inset,
		0 10px 22px -8px var(--adbd-shadow);
	transition: transform 0.18s cubic-bezier( 0.22, 1, 0.36, 1 ),
		box-shadow 0.18s ease, filter 0.18s ease;
}

.adbd-reload:hover {
	transform: translateY( -2px );
	filter: brightness( 1.06 );
	box-shadow:
		0 1px 0 oklch( 1 0 0 / 0.28 ) inset,
		0 14px 28px -8px var(--adbd-shadow);
}

.adbd-reload:active {
	transform: translateY( 0 );
	filter: brightness( 0.98 );
}

/* Light gap + crimson ring stays visible on the crimson button. */
.adbd-reload:focus-visible {
	outline: none;
	box-shadow:
		0 0 0 3px var(--adbd-paper),
		0 0 0 5.5px var(--adbd-brand),
		0 10px 22px -8px var(--adbd-shadow);
}

/* Close button — 44px hit area for touch */
.adbd-close {
	position: absolute;
	top: 10px;
	right: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--adbd-muted);
	cursor: pointer;
	transition: background 0.16s ease, color 0.16s ease;
}

.adbd-close:hover {
	background: var(--adbd-surface);
	color: var(--adbd-ink);
}

.adbd-close:focus-visible {
	outline: 2px solid var(--adbd-brand);
	outline-offset: -2px;
}

.adbd-close svg {
	width: 17px;
	height: 17px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.4;
	stroke-linecap: round;
}

/* ---------- Banner ---------- */

.adbd-banner {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 99999;
	animation: adbd-slide-down 0.42s cubic-bezier( 0.16, 1, 0.3, 1 ) both;
}

.adbd-banner .adbd-box {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px 16px;
	padding: 14px 56px;
	background: linear-gradient( 180deg, oklch( 0.26 0.03 350 ), oklch( 0.2 0.025 350 ) );
	border-bottom: 3px solid var(--adbd-brand);
	color: oklch( 0.96 0.006 20 );
	font-size: 14.5px;
	line-height: 1.45;
	text-align: center;
}

.adbd-banner .adbd-message {
	color: inherit;
}

.adbd-banner .adbd-actions {
	margin: 0;
}

.adbd-banner .adbd-reload {
	min-width: 0;
	min-height: 0;
	padding: 9px 18px;
	font-size: 13.5px;
	border-radius: 9px;
}

/* ---------- Motion ---------- */

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

@keyframes adbd-pop {
	from { opacity: 0; transform: translateY( 18px ) scale( 0.96 ); }
	to   { opacity: 1; transform: none; }
}

@keyframes adbd-slide-down {
	from { transform: translateY( -100% ); }
	to   { transform: none; }
}

@keyframes adbd-beat {
	0%, 100% { transform: scale( 1 ); }
	18%      { transform: scale( 1.16 ); }
	36%      { transform: scale( 1 ); }
	54%      { transform: scale( 1.09 ); }
	70%      { transform: scale( 1 ); }
}

@media ( prefers-reduced-motion: reduce ) {
	.adbd-modal,
	.adbd-modal .adbd-box,
	.adbd-banner,
	.adbd-icon svg {
		animation: none !important;
	}
	.adbd-reload {
		transition: none;
	}
}

/* ---------- Small screens ---------- */

@media ( max-width: 480px ) {
	.adbd-modal {
		padding: 16px;
	}
	.adbd-modal .adbd-box {
		max-height: calc( 100vh - 32px );
		padding: 36px 22px 28px;
	}
	.adbd-title {
		font-size: 22px;
	}
	.adbd-reload {
		width: 100%;
	}
	.adbd-banner .adbd-box {
		padding: 12px 44px;
	}
}