/*
 * Advently — visitor calendar.
 *
 * Everything is scoped under .advently (the calendar) and .advently-modal (the
 * door card, moved to <body> by calendar.js), and themes are only sets of the
 * custom properties below. Store themes style bare buttons and inputs
 * aggressively, so every control here resets what it relies on.
 */

/* ------------------------------------------------------------------ tokens */

.advently,
.advently-modal {
	--adv-accent: #c8102e;
	--adv-accent-ink: #fff;
	--adv-radius: 12px;
	--adv-num-font: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
	--adv-num-weight: 400;
	--adv-ui-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	/* Board */
	--adv-board: #12372a;
	--adv-board-glow: #1f5643;
	--adv-board-ink: #f3efe2;
	--adv-board-muted: #a9c3b6;
	--adv-board-edge: rgba(255, 255, 255, 0.07);

	/* Doors: four alternating leaves */
	--adv-door-1: #1f5240;
	--adv-door-2: #8f1428;
	--adv-door-3: #285f4b;
	--adv-door-4: #a51a31;
	--adv-door-ink: #f1dfa6;
	--adv-door-ink-alt: #f1dfa6;
	--adv-door-panel: rgba(255, 255, 255, 0.09);
	--adv-door-knob: #d4a72c;
	--adv-ring: #d4a72c;
	--adv-inside: #071a12;
	--adv-inside-stripe: #0b2219;
	--adv-inside-ink: #f1dfa6;

	/* Card */
	--adv-card: #fff;
	--adv-card-ink: #1b2420;
	--adv-card-muted: #5d6a64;
	--adv-card-line: #d9e2dd;
	--adv-card-soft: #eef3f0;
	--adv-scrim: rgba(5, 20, 13, 0.62);
	--adv-confetti: #d4a72c, #c8102e, #ffffff, #3c8c6c;
	--adv-snow: rgba(255, 255, 255, 0.75);
}

/* Snowy Night: deep winter blue, frosted white leaves. */
.advently--snowy {
	--adv-board: #142441;
	--adv-board-glow: #27406b;
	--adv-board-ink: #f4f7fc;
	--adv-board-muted: #a9b9d4;
	--adv-door-1: #e7eef7;
	--adv-door-2: #2c4c80;
	--adv-door-3: #cfdcec;
	--adv-door-4: #375c95;
	--adv-door-ink: #1d3560;
	--adv-door-ink-alt: #f4f7fc;
	--adv-door-panel: rgba(255, 255, 255, 0.18);
	--adv-door-knob: #9fb6d8;
	--adv-ring: #ffffff;
	--adv-inside: #0b1528;
	--adv-inside-stripe: #101d36;
	--adv-inside-ink: #dfe8f6;
	--adv-card-ink: #17233a;
	--adv-card-muted: #5a6680;
	--adv-card-line: #d6dfeb;
	--adv-card-soft: #edf2f9;
	--adv-scrim: rgba(8, 15, 32, 0.6);
	--adv-confetti: #ffffff, #cfdcec, #9fb6d8, var(--adv-accent);
}

/* Minimal: paper and ink; the accent colour carries all the festivity. */
.advently--minimal {
	--adv-board: #ffffff;
	--adv-board-glow: #ffffff;
	--adv-board-ink: #1c1c1c;
	--adv-board-muted: #6b6b6b;
	--adv-board-edge: #e7e4df;
	--adv-door-1: #f7f5f1;
	--adv-door-2: #f7f5f1;
	--adv-door-3: #f7f5f1;
	--adv-door-4: #f7f5f1;
	--adv-door-ink: var(--adv-accent);
	--adv-door-ink-alt: var(--adv-accent);
	--adv-door-panel: #e4e0d9;
	--adv-door-knob: #c9c3b9;
	--adv-ring: var(--adv-accent);
	--adv-inside: #ece8e1;
	--adv-inside-stripe: #e6e1d9;
	--adv-inside-ink: #3a3a3a;
	--adv-card-ink: #1c1c1c;
	--adv-card-muted: #6b6b6b;
	--adv-card-line: #e2ded7;
	--adv-card-soft: #f4f2ee;
	--adv-scrim: rgba(28, 28, 28, 0.45);
	--adv-snow: rgba(120, 130, 140, 0.28);
	--adv-confetti: var(--adv-accent), #1c1c1c, #c9c3b9;
}

/* Gold: dark walnut box, champagne foil numbers. */
.advently--gold {
	--adv-board: #1c1711;
	--adv-board-glow: #33291b;
	--adv-board-ink: #f5ead3;
	--adv-board-muted: #b9a888;
	--adv-board-edge: rgba(232, 200, 114, 0.18);
	--adv-door-1: #2b2319;
	--adv-door-2: #3b301f;
	--adv-door-3: #31281b;
	--adv-door-4: #443622;
	--adv-door-ink: #e8c872;
	--adv-door-ink-alt: #e8c872;
	--adv-door-panel: rgba(232, 200, 114, 0.22);
	--adv-door-knob: #e8c872;
	--adv-ring: #e8c872;
	--adv-inside: #0e0b07;
	--adv-inside-stripe: #15110b;
	--adv-inside-ink: #e8c872;
	--adv-card: #fffdf8;
	--adv-card-ink: #2a2117;
	--adv-card-muted: #75664f;
	--adv-card-line: #e8dcc4;
	--adv-card-soft: #f6efe0;
	--adv-scrim: rgba(14, 11, 7, 0.66);
	--adv-snow: rgba(240, 216, 150, 0.55);
	--adv-confetti: #e8c872, #f7e3a3, #b8913c, #ffffff;
}

.advently--square,
.advently-modal.advently--square {
	--adv-radius: 3px;
}

.advently--font-modern,
.advently-modal.advently--font-modern {
	--adv-num-font: var(--adv-ui-font);
	--adv-num-weight: 700;
}

.advently--font-handwritten,
.advently-modal.advently--font-handwritten {
	--adv-num-font: "Segoe Print", "Bradley Hand", "Chalkboard SE", "Comic Neue", cursive;
	--adv-num-weight: 400;
}

/* ------------------------------------------------------------------- board */

.advently {
	box-sizing: border-box;
	/* Wide and full alignments still keep the whole calendar within one screen. */
	max-width: var(--adv-max-width, 880px);
	margin: 0 auto 1.5em;
	font-family: var(--adv-ui-font);
	-webkit-font-smoothing: antialiased;
}

.advently *,
.advently *::before,
.advently *::after {
	box-sizing: inherit;
}

.advently__board {
	position: relative;
	container-type: inline-size;
	isolation: isolate;
	padding: clamp(14px, 2.4vw, 22px);
	border-radius: calc(var(--adv-radius) + 8px);
	background: radial-gradient(120% 70% at 80% -20%, var(--adv-board-glow) 0%, transparent 60%), var(--adv-board);
	box-shadow: inset 0 0 0 1px var(--adv-board-edge), 0 30px 60px -36px rgba(0, 0, 0, 0.55);
	color: var(--adv-board-ink);
	overflow: hidden;
}

.advently--minimal .advently__board {
	box-shadow: inset 0 0 0 1px var(--adv-board-edge);
}

.advently--image .advently__board {
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.55)), var(--adv-image) center / cover no-repeat, var(--adv-board);
}

.advently__snow {
	position: absolute;
	inset: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.advently__head,
.advently__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 4px 16px;
}

.advently__head {
	padding: 2px 4px 14px;
}

.advently .advently__title {
	margin: 0;
	padding: 0;
	border: 0;
	font: var(--adv-num-weight) clamp(20px, 3.2cqi, 28px) / 1.15 var(--adv-num-font);
	letter-spacing: 0;
	text-transform: none;
	color: var(--adv-board-ink);
}

.advently .advently__progress,
.advently .advently__next {
	margin: 0;
	font-size: 14px;
	line-height: 1.4;
	color: var(--adv-board-muted);
	font-variant-numeric: tabular-nums;
}

.advently__foot {
	min-height: 20px;
	padding: 14px 4px 0;
}

.advently .advently__noscript {
	margin: 12px 0 0;
	font-size: 14px;
}

/* ------------------------------------------------------------------- doors */

.advently .advently__doors {
	display: grid;
	grid-template-columns: repeat(var(--adv-cols, 6), minmax(0, 1fr));
	gap: clamp(6px, 1.4cqi, 12px);
	margin: 0;
	padding: 0;
	list-style: none;
}

@container (max-width: 560px) {
	.advently .advently__doors {
		grid-template-columns: repeat(var(--adv-cols-phone, 4), minmax(0, 1fr));
	}
}

.advently .advently__door {
	position: relative;
	margin: 0;
	padding: 0;
	aspect-ratio: 1 / 1.1;
	perspective: 700px;
	list-style: none;
}

.advently .advently__door::before,
.advently .advently__door::marker {
	content: none;
}

.advently__inside {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	padding: 8px 6px 8px 16%;
	border-radius: var(--adv-radius);
	background: repeating-linear-gradient(135deg, var(--adv-inside) 0 6px, var(--adv-inside-stripe) 6px 12px);
	box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.45);
	overflow: hidden;
}

.advently--minimal .advently__inside {
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.12);
}

.advently__inside-label {
	font-size: clamp(10px, 1.9cqi, 13px);
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	color: var(--adv-inside-ink);
	overflow-wrap: anywhere;
}

/* The leaf: a real button that swings open on its left hinge. */
.advently .advently__leaf {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: clamp(6px, 1.4cqi, 11px) clamp(8px, 1.6cqi, 12px);
	border: 0;
	border-radius: var(--adv-radius);
	background: var(--leaf-bg);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 10px 22px -14px rgba(0, 0, 0, 0.6);
	color: var(--leaf-ink);
	font: var(--adv-num-weight) clamp(17px, 4.2cqi, 30px) / 1 var(--adv-num-font);
	letter-spacing: 0;
	text-align: left;
	text-transform: none;
	text-shadow: none;
	cursor: pointer;
	transform-origin: left center;
	transform: rotateY(0);
	transition: transform 0.9s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.3s, opacity 0.3s;
	backface-visibility: hidden;
	-webkit-tap-highlight-color: transparent;
	appearance: none;
}

.advently--minimal .advently__leaf {
	box-shadow: inset 0 0 0 1px var(--adv-door-panel);
}

/* Leaf colours: data-tone is worked out per grid by the renderer (a checkerboard). */
.advently .advently__door {
	--leaf-bg: var(--adv-door-1);
	--leaf-ink: var(--adv-door-ink);
}

.advently [data-tone="2"] {
	--leaf-bg: var(--adv-door-2);
	--leaf-ink: var(--adv-door-ink-alt);
}

.advently [data-tone="3"] {
	--leaf-bg: var(--adv-door-3);
}

.advently [data-tone="4"] {
	--leaf-bg: var(--adv-door-4);
	--leaf-ink: var(--adv-door-ink-alt);
}

@container (max-width: 560px) {
	.advently [data-tone-phone] {
		--leaf-bg: var(--adv-door-1);
		--leaf-ink: var(--adv-door-ink);
	}

	.advently [data-tone-phone="2"] {
		--leaf-bg: var(--adv-door-2);
		--leaf-ink: var(--adv-door-ink-alt);
	}

	.advently [data-tone-phone="3"] {
		--leaf-bg: var(--adv-door-3);
	}

	.advently [data-tone-phone="4"] {
		--leaf-bg: var(--adv-door-4);
		--leaf-ink: var(--adv-door-ink-alt);
	}
}

/* A raised panel and a brass knob make each leaf read as a door, not a tile. */
.advently .advently__leaf::before,
.advently .advently__leaf::after {
	/* Themes hide button pseudo-elements (Storefront does); these are the door's panel and knob. */
	display: block;
}

.advently .advently__leaf::before {
	content: "";
	position: absolute;
	/* Starts below the number (em = the number's size), whatever the door size. */
	inset: calc(1em + 2 * clamp(6px, 1.4cqi, 11px)) 19% 12% 11%;
	border-radius: max(2px, calc(var(--adv-radius) - 6px));
	/* Drawn in the leaf's own ink, so it shows on light and dark leaves alike. */
	box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 24%, transparent);
	pointer-events: none;
}

/* Minimal keeps ink for the numbers only; the panel stays a quiet neutral. */
.advently--minimal .advently__leaf::before {
	box-shadow: inset 0 0 0 1px var(--adv-door-panel);
}

.advently .advently__leaf::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 6.5%;
	width: 6px;
	height: 6px;
	margin-top: -3px;
	border-radius: 50%;
	background: var(--adv-door-knob);
	opacity: 0.85;
}

.advently .advently__num {
	position: relative;
	z-index: 1;
	font-variant-numeric: lining-nums;
}

.advently--gold .advently__num {
	background: linear-gradient(170deg, #f7e3a3 10%, #c9a14a 55%, #f0d58a 90%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.advently .advently__leaf:hover,
.advently .advently__leaf:focus {
	background: var(--leaf-bg);
	color: var(--leaf-ink);
	text-decoration: none;
}

.advently .advently__leaf:focus {
	outline: none;
}

.advently .advently__leaf:focus-visible {
	outline: 3px solid var(--adv-ring);
	outline-offset: 2px;
	z-index: 2;
}

/* Today's door glows and gives a little when you hover it. */
.advently .is-today .advently__leaf {
	box-shadow: inset 0 0 0 2px var(--adv-ring), 0 10px 22px -14px rgba(0, 0, 0, 0.6);
	animation: advently-glow 2.6s ease-in-out infinite;
}

/* Hover is on the door, not the leaf: a swinging leaf would slip out from under the pointer. */
.advently .is-today:not(.is-opened):not(.is-busy):hover .advently__leaf {
	transform: rotateY(-16deg);
}

@keyframes advently-glow {
	50% {
		box-shadow: inset 0 0 0 2px var(--adv-ring), 0 0 0 6px color-mix(in srgb, var(--adv-ring) 25%, transparent), 0 10px 22px -14px rgba(0, 0, 0, 0.6);
	}
}

.advently .is-locked .advently__leaf,
.advently .is-ended .advently__leaf,
.advently .is-missed .advently__leaf {
	cursor: default;
}

/* Days to come sit back a little, so today and the doors still open stand out. */
.advently .is-locked .advently__leaf {
	filter: saturate(0.8) brightness(0.9);
}

.advently--minimal .is-locked .advently__leaf {
	filter: none;
	opacity: 1;
	color: var(--adv-board-muted);
}

/* Closed for good: muted with a filter, not opacity, so the inside never shows through. */
.advently .is-missed .advently__leaf,
.advently .is-ended:not(.is-opened) .advently__leaf {
	filter: saturate(0.35) brightness(0.8);
}

.advently .is-opening .advently__leaf,
.advently .is-opened .advently__leaf {
	transform: rotateY(-108deg);
	box-shadow: none;
	animation: none;
}

/* Doors whose leaf swung open stay clickable through the opening. */
.advently .advently__door {
	cursor: pointer;
}

.advently .is-locked,
.advently .is-ended:not(.is-opened),
.advently .is-missed {
	cursor: default;
}

.advently .is-busy .advently__leaf {
	cursor: progress;
}

/* ---------------------------------------------------------- owner preview */

.advently .advently-preview-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 12px;
	margin: 0 0 10px;
	padding: 10px 14px;
	border: 1px dashed #c9a14a;
	border-radius: 10px;
	background: #fffaf0;
	color: #4a3b1c;
	font: 400 13px/1.4 var(--adv-ui-font);
}

.advently .advently-preview-bar label {
	font-weight: 600;
}

.advently .advently-preview-bar select {
	width: auto;
	max-width: 100%;
	margin: 0;
	padding: 6px 28px 6px 10px;
	border: 1px solid #d8c9a6;
	border-radius: 6px;
	background-color: #fff;
	color: #2a2117;
	font: 500 13px/1.3 var(--adv-ui-font);
}

.advently .advently-preview-bar span {
	flex-basis: 100%;
	color: #75664f;
	font-size: 12px;
}

/* -------------------------------------------------------------------- tip */

.advently .advently__tip {
	position: absolute;
	z-index: 5;
	left: 0;
	top: 0;
	max-width: min(260px, 80%);
	margin: 0;
	padding: 8px 12px;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 10px 24px -10px rgba(0, 0, 0, 0.45);
	color: #1b2420;
	font-size: 13px;
	line-height: 1.35;
	opacity: 0;
	transform: translateY(4px);
	transition: opacity 0.15s, transform 0.15s;
	pointer-events: none;
}

.advently .advently__tip.is-shown {
	opacity: 1;
	transform: none;
}

/* ------------------------------------------------------------------ modal */

.advently-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: grid;
	place-items: center;
	padding: 16px;
	font-family: var(--adv-ui-font);
	-webkit-font-smoothing: antialiased;
}

.advently-modal[hidden] {
	display: none;
}

.advently-modal *,
.advently-modal *::before,
.advently-modal *::after {
	box-sizing: border-box;
}

.advently-modal__scrim {
	position: absolute;
	inset: 0;
	background: var(--adv-scrim);
	backdrop-filter: blur(3px);
	opacity: 0;
	transition: opacity 0.3s;
}

.advently-modal__confetti {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.advently-modal__card {
	position: relative;
	width: min(420px, 100%);
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	overflow: auto;
	overscroll-behavior: contain;
	padding: 26px 24px 22px;
	border-radius: calc(var(--adv-radius) + 6px);
	background: var(--adv-card);
	box-shadow: 0 30px 70px -20px rgba(0, 0, 0, 0.5);
	color: var(--adv-card-ink);
	font-size: 15px;
	line-height: 1.5;
	opacity: 0;
	transform: translateY(16px) scale(0.97);
	transition: transform 0.45s cubic-bezier(0.2, 0.9, 0.25, 1.15), opacity 0.25s;
}

.advently-modal__card:focus {
	outline: none;
}

.advently-modal.is-shown .advently-modal__scrim,
.advently-modal.is-shown .advently-modal__card {
	opacity: 1;
}

.advently-modal.is-shown .advently-modal__card {
	transform: none;
}

/* On phones the card is a bottom sheet, within reach of the thumb. */
@media (max-width: 560px) {
	.advently-modal {
		place-items: end stretch;
		padding: 0;
	}

	.advently-modal__card {
		width: 100%;
		max-height: 92vh;
		max-height: 92dvh;
		padding: 24px 20px calc(20px + env(safe-area-inset-bottom));
		border-radius: calc(var(--adv-radius) + 8px) calc(var(--adv-radius) + 8px) 0 0;
		transform: translateY(40px);
	}
}

.advently-modal .advently-modal__close {
	position: absolute;
	top: 10px;
	right: 10px;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	box-shadow: none;
	color: var(--adv-card-muted);
	cursor: pointer;
}

.advently-modal .advently-modal__close:hover {
	background: var(--adv-card-soft);
	color: var(--adv-card-ink);
}

.advently-modal .advently-modal__close svg {
	width: 18px;
	height: 18px;
}

.advently-modal .advently-card__door {
	margin: 0 0 4px;
	font-size: 14px;
	color: var(--adv-card-muted);
}

.advently-modal .advently-card__title {
	margin: 0 44px 10px 0;
	padding: 0;
	font: var(--adv-num-weight) clamp(26px, 7vw, 34px) / 1.08 var(--adv-num-font);
	letter-spacing: 0;
	text-transform: none;
	color: var(--adv-accent);
	text-wrap: balance;
}

.advently-modal.advently--snowy .advently-card__title,
.advently-modal.advently--gold .advently-card__title {
	color: var(--adv-card-ink);
}

.advently-modal p {
	margin: 0 0 12px;
	color: inherit;
}

.advently-modal .advently-card__muted {
	color: var(--adv-card-muted);
	font-size: 14px;
}

/* The ticket: notched sides cut with a mask, so it works on any card colour. */
.advently-modal .advently-ticket {
	--notch: 9px;
	margin: 14px 0 12px;
	padding: 14px 14px 12px;
	border-radius: 10px;
	background: var(--adv-card-soft);
	-webkit-mask: radial-gradient(circle var(--notch) at 0 50%, transparent 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--notch) at 100% 50%, transparent 98%, #000) right / 51% 100% no-repeat;
	mask: radial-gradient(circle var(--notch) at 0 50%, transparent 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle var(--notch) at 100% 50%, transparent 98%, #000) right / 51% 100% no-repeat;
}

.advently-modal .advently-code {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 8px 8px 14px;
	border: 2px dashed var(--adv-card-line);
	border-radius: 8px;
	background: var(--adv-card);
}

.advently-modal .advently-code__value {
	font: 700 clamp(15px, 4.4vw, 19px) / 1.2 ui-monospace, "SF Mono", Menlo, Consolas, monospace;
	letter-spacing: 0.06em;
	color: var(--adv-card-ink);
	user-select: all;
	overflow-wrap: anywhere;
}

.advently-modal .advently-ticket__meta {
	margin: 10px 2px 0;
	font-size: 13px;
	line-height: 1.45;
	color: var(--adv-card-muted);
}

.advently-modal .advently-ticket__meta span {
	display: block;
}

/* Buttons */
.advently-modal .advently-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	min-height: 46px;
	margin: 0;
	padding: 12px 18px;
	border: 2px solid transparent;
	border-radius: 999px;
	background: var(--adv-accent);
	box-shadow: none;
	color: var(--adv-accent-ink);
	font: 600 15px / 1.1 var(--adv-ui-font);
	letter-spacing: 0;
	text-align: center;
	text-decoration: none;
	text-transform: none;
	cursor: pointer;
	transition: filter 0.15s, transform 0.15s, background-color 0.15s;
}

.advently-modal .advently-btn:hover {
	filter: brightness(0.92);
	color: var(--adv-accent-ink);
	text-decoration: none;
}

.advently-modal .advently-btn:active {
	transform: translateY(1px);
}

.advently-modal .advently-btn--quiet {
	border-color: var(--adv-card-line);
	background: transparent;
	color: var(--adv-card-ink);
}

.advently-modal .advently-btn--quiet:hover {
	background: var(--adv-card-soft);
	color: var(--adv-card-ink);
	filter: none;
}

.advently-modal .advently-btn--small {
	min-height: 36px;
	padding: 8px 14px;
	font-size: 14px;
	white-space: nowrap;
}

.advently-modal .advently-btn[disabled],
.advently-modal .advently-btn[aria-busy="true"] {
	opacity: 0.6;
	cursor: progress;
}

.advently-modal .advently-btn:focus {
	outline: none;
}

.advently-modal .advently-btn:focus-visible,
.advently-modal .advently-modal__close:focus-visible,
.advently-modal a:focus-visible,
.advently-modal input:focus-visible {
	outline: 3px solid var(--adv-accent);
	outline-offset: 2px;
}

.advently-modal .advently-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 4px;
}

.advently-modal .advently-actions > * {
	flex: 1 1 160px;
}

.advently-modal .advently-status {
	margin: 10px 0 0;
	font-size: 14px;
	min-height: 1px;
}

.advently-modal .advently-status.is-error {
	color: #b42318;
}

.advently-modal .advently-status.is-ok {
	color: #18794e;
}

/* Content block under the coupon (or alone). */
.advently-modal .advently-content {
	margin-top: 18px;
	padding-top: 18px;
	border-top: 1px solid var(--adv-card-line);
}

.advently-modal .advently-content--alone {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.advently-modal .advently-content__image {
	display: block;
	width: 100%;
	height: auto;
	max-height: 240px;
	margin: 0 0 14px;
	border-radius: 10px;
	object-fit: cover;
}

.advently-modal .advently-content__title {
	margin: 0 0 6px;
	padding: 0;
	font: 600 18px / 1.25 var(--adv-ui-font);
	letter-spacing: 0;
	text-transform: none;
	color: var(--adv-card-ink);
}

.advently-modal .advently-content__body {
	color: var(--adv-card-ink);
}

.advently-modal .advently-content__body > :last-child {
	margin-bottom: 0;
}

.advently-modal .advently-content__body a {
	color: var(--adv-accent);
}

.advently-modal .advently-content .advently-actions {
	margin-top: 14px;
}

.advently-modal .advently-product {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 14px 0 0;
	padding: 8px;
	border: 1px solid var(--adv-card-line);
	border-radius: 10px;
	color: var(--adv-card-ink);
	text-decoration: none;
}

.advently-modal .advently-product:hover {
	border-color: var(--adv-card-muted);
	color: var(--adv-card-ink);
}

.advently-modal .advently-product__image {
	flex: none;
	width: 56px;
	height: 56px;
	border-radius: 6px;
	object-fit: cover;
}

.advently-modal .advently-product__text {
	display: grid;
	gap: 2px;
}

.advently-modal .advently-product__name {
	font-weight: 600;
	line-height: 1.3;
}

.advently-modal .advently-product__price {
	color: var(--adv-card-muted);
	font-size: 14px;
}

/* Email and login steps */
.advently-modal .advently-form label {
	display: block;
	margin: 0 0 6px;
	font-size: 14px;
	font-weight: 600;
	color: var(--adv-card-ink);
}

.advently-modal .advently-form input[type="email"] {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 0 12px;
	padding: 12px 14px;
	border: 1.5px solid var(--adv-card-line);
	border-radius: 10px;
	background: var(--adv-card);
	box-shadow: none;
	color: var(--adv-card-ink);
	font: 500 16px / 1.3 var(--adv-ui-font);
}

.advently-modal .advently-form input[type="email"]:focus {
	border-color: var(--adv-accent);
	outline: none;
}

.advently-modal .advently-form input[aria-invalid="true"] {
	border-color: #b42318;
}

.advently-modal .advently-form .advently-form__note {
	margin: -4px 0 14px;
	color: var(--adv-card-muted);
	font-size: 12px;
	line-height: 1.45;
}

.advently-modal .advently-form__note a {
	color: inherit;
	text-decoration: underline;
}

.advently-modal .advently-consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0 0 16px;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--adv-card-muted);
	cursor: pointer;
}

.advently-modal .advently-form .advently-consent {
	display: flex;
	margin: 0 0 16px;
	font-size: 13px;
	font-weight: 400;
	color: var(--adv-card-muted);
}

.advently-modal .advently-consent input {
	flex: none;
	width: 18px;
	height: 18px;
	margin: 1px 0 0;
	accent-color: var(--adv-accent);
}

.advently-modal .advently-consent a {
	color: inherit;
	text-decoration: underline;
}

.advently-modal .advently-form .advently-btn {
	width: 100%;
}

/* ------------------------------------------------------------------ badge */

.advently-badge {
	position: fixed;
	bottom: 18px;
	z-index: 99990;
	display: flex;
	align-items: center;
	border-radius: 999px;
	background: var(--adv-accent);
	box-shadow: 0 12px 30px -12px rgba(0, 0, 0, 0.5);
	color: var(--adv-accent-ink);
	font: 600 14px/1 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

.advently-badge[hidden] {
	display: none;
}

.advently-badge--right {
	right: 18px;
}

.advently-badge--left {
	left: 18px;
}

.advently-badge .advently-badge__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 6px 12px 16px;
	color: inherit;
	text-decoration: none;
}

.advently-badge .advently-badge__link:hover {
	color: inherit;
	text-decoration: underline;
}

.advently-badge .advently-badge__close {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	margin: 0 6px 0 2px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	box-shadow: none;
	color: inherit;
	opacity: 0.8;
	cursor: pointer;
}

.advently-badge .advently-badge__close:hover {
	opacity: 1;
	background: rgba(255, 255, 255, 0.15);
}

.advently-badge a:focus-visible,
.advently-badge button:focus-visible {
	outline: 3px solid currentColor;
	outline-offset: 2px;
	border-radius: 999px;
}

/* WooCommerce's store notice sits at the bottom of the screen: stay above it. */
.woocommerce-demo-store .advently-badge {
	bottom: 72px;
}

@media (max-width: 560px) {
	.advently-badge {
		bottom: 12px;
	}

	.woocommerce-demo-store .advently-badge {
		bottom: 88px;
	}

	.advently-badge--right {
		right: 12px;
	}

	.advently-badge--left {
		left: 12px;
	}
}

/* ------------------------------------------------------------ calm motion */

@media (prefers-reduced-motion: reduce) {
	.advently .advently__leaf,
	.advently-modal__card,
	.advently-modal__scrim,
	.advently .advently__tip {
		transition: none;
	}

	.advently .is-today .advently__leaf {
		animation: none;
	}

	.advently .is-today:not(.is-opened):not(.is-busy):hover .advently__leaf {
		transform: none;
	}

	.advently .advently__snow {
		display: none;
	}
}