/* Event popup (inc/popup.php): festive maroon-to-navy card with zari-gold trim, after the event posters. */
.btc-popup {
	--popup-gold: #c29a45;
	--popup-gold-light: #ecd08f;
	--popup-cream: #f8efdd;
	--popup-wine: #3a0b16;
	--popup-navy: #1b2140;
	width: min(30rem, calc(100vw - 2rem));
	max-width: none;
	max-height: calc(100dvh - 2rem);
	padding: 0;
	border: 0;
	background: transparent;
	overflow: visible;
}
.btc-popup::backdrop { background: rgba(33, 6, 13, .78); backdrop-filter: blur(3px); }
.btc-popup[open] { animation: btc-popup-in .35s ease-out; }
@keyframes btc-popup-in { from { opacity: 0; transform: translateY(12px) scale(.97); } }

.btc-popup__card {
	position: relative;
	max-height: calc(100dvh - 2rem);
	overflow: hidden auto;
	padding: 2.4rem 1.5rem 1.4rem;
	border: 1px solid var(--popup-gold);
	border-radius: 18px;
	color: var(--popup-cream);
	text-align: center;
	font-family: var(--wp--preset--font-family--body, system-ui, sans-serif);
	background:
		radial-gradient(circle at 12% 30%, rgba(236, 208, 143, .55) 0 1px, transparent 2px),
		radial-gradient(circle at 88% 22%, rgba(236, 208, 143, .5) 0 1.5px, transparent 2.5px),
		radial-gradient(circle at 80% 62%, rgba(236, 208, 143, .4) 0 1px, transparent 2px),
		radial-gradient(circle at 18% 78%, rgba(236, 208, 143, .45) 0 1.5px, transparent 2.5px),
		radial-gradient(circle at 92% 90%, rgba(236, 208, 143, .4) 0 1px, transparent 2px),
		radial-gradient(ellipse at 50% 0%, rgba(194, 154, 69, .22), transparent 60%),
		linear-gradient(150deg, #751428 0%, var(--popup-wine) 55%, var(--popup-navy) 100%);
	box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .65);
}
/* Inner gold frame. */
.btc-popup__card::before {
	content: "";
	position: absolute;
	inset: 7px;
	border: 1px solid rgba(194, 154, 69, .45);
	border-radius: 13px;
	pointer-events: none;
}

/* String of fairy lights along the top. */
.btc-popup__lights {
	position: absolute;
	inset: 0 0 auto;
	height: 26px;
	background: radial-gradient(circle, #fff2c9 0 2px, rgba(255, 214, 130, .55) 3px, transparent 7px) 8px 60% / 32px 26px repeat-x;
	animation: btc-popup-twinkle 2.4s ease-in-out infinite alternate;
}
@keyframes btc-popup-twinkle { to { opacity: .55; } }

.btc-popup__close {
	position: absolute;
	top: .75rem;
	right: .75rem;
	z-index: 1;
	width: 2.25rem;
	height: 2.25rem;
	border: 1px solid rgba(194, 154, 69, .6);
	border-radius: 50%;
	background: rgba(33, 6, 13, .6);
	color: var(--popup-cream);
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
}
.btc-popup__close:hover, .btc-popup__close:focus-visible { background: var(--popup-gold); color: var(--popup-wine); }

.btc-popup__logo { display: block; width: 7rem; height: auto; margin: 0 auto .4rem; }
.btc-popup__org {
	margin: 0;
	color: var(--popup-gold-light);
	font-family: var(--wp--preset--font-family--heading, serif);
	font-size: 1.05rem;
	letter-spacing: .02em;
}
.btc-popup__title {
	margin: .35rem 0 0;
	color: #fff;
	font-family: var(--wp--preset--font-family--heading, serif);
	font-size: clamp(1.9rem, 7.5vw, 2.6rem);
	font-weight: 700;
	line-height: 1.2;
	text-shadow: 0 2px 0 rgba(140, 100, 30, .55), 0 0 22px rgba(236, 208, 143, .35);
}
.btc-popup__subtitle {
	margin: .35rem 0 0;
	color: var(--popup-gold-light);
	font-family: var(--wp--preset--font-family--heading, serif);
	font-size: 1.1rem;
	font-variant: small-caps;
	letter-spacing: .08em;
}
.btc-popup__subtitle::before, .btc-popup__subtitle::after { content: "✦"; margin: 0 .5em; font-size: .7em; color: var(--popup-gold); }

.btc-popup__chips {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(6rem, 1fr));
	gap: .6rem;
	margin: 1.4rem 0 0;
	padding: 0;
	list-style: none;
}
.btc-popup__chips li {
	padding: .7rem .4rem;
	border: 1px solid var(--popup-gold);
	border-radius: 12px;
	background: rgba(27, 33, 64, .85);
	box-shadow: inset 0 0 0 3px rgba(194, 154, 69, .12);
}
.btc-popup__chips li:nth-child(even) { background: rgba(117, 20, 40, .85); }
.btc-popup__chips strong { display: block; color: var(--popup-gold-light); font-size: 1.1rem; line-height: 1.3; }
.btc-popup__chips span { display: block; margin-top: .15rem; font-size: .9rem; opacity: .9; }

/* Gold ribbon with the date, time and venue. */
.btc-popup__info {
	margin: 1.4rem -1.5rem 0;
	padding: .8rem 1.5rem;
	border-block: 1px solid #f6e2ad;
	background: linear-gradient(90deg, #b8893a, #f1d79a 30%, #f6e2ad 50%, #f1d79a 70%, #b8893a);
	color: var(--popup-wine);
	font-weight: 700;
}
.btc-popup__info p { margin: 0; line-height: 1.45; }
.btc-popup__info p + p { margin-top: .2rem; font-size: .95rem; }

.btc-popup__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5rem 1.25rem; margin: 1.4rem 0 0; }
.btc-popup__cta {
	display: inline-block;
	padding: .8rem 1.6rem;
	border: 1px solid #f6e2ad;
	border-radius: 999px;
	background: linear-gradient(180deg, #f1d79a, #c29a45);
	color: var(--popup-wine);
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: .03em;
	text-decoration: none;
	box-shadow: 0 6px 18px -6px rgba(236, 208, 143, .6);
}
.btc-popup__cta:hover, .btc-popup__cta:focus-visible { background: linear-gradient(180deg, #f6e2ad, #d6ae58); color: var(--popup-wine); }
.btc-popup__more { color: var(--popup-cream); font-weight: 600; text-underline-offset: 3px; }
.btc-popup__more:hover, .btc-popup__more:focus-visible { color: var(--popup-gold-light); }
.btc-popup :focus-visible { outline: 2px solid var(--popup-gold-light); outline-offset: 2px; }

.btc-popup__message { margin: 1.1rem 0 0; color: var(--popup-gold-light); font-size: .95rem; font-weight: 600; }

.btc-popup .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

@media (max-width: 480px) {
	.btc-popup__card { padding: 2.2rem 1.1rem 1.2rem; }
	.btc-popup__info { margin-inline: -1.1rem; padding-inline: 1.1rem; }
	.btc-popup__chips { grid-template-columns: repeat(3, 1fr); gap: .4rem; }
	.btc-popup__chips strong { font-size: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
	.btc-popup[open], .btc-popup__lights { animation: none; }
}
