/*
 * Divi DigiMart: the header banner, the promo popup and the cookie notice.
 *
 * Loads while any of the three is on. The banner's height is reserved here, before any
 * script, so it causes no layout shift; Divi's fixed #main-header is pushed below it by
 * --qndm-banner-now, which frontend-notices.js lowers as the banner scrolls away.
 */

/* ==========================================================================
   Header banner
   ========================================================================== */

body.qndm-has-banner {
	--qndm-banner-now: var(--qndm-banner-h);
}

html.qndm-banner-off body.qndm-has-banner {
	--qndm-banner-now: 0px;
}

.qndm-banner {
	position: relative;
	z-index: var(--qndm-z-sticky);
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: var(--qndm-banner-h);
	padding: 0 var(--qndm-sp-8);
	background: var(--qndm-banner-bg);
	font-size: var(--qndm-fs-md);
	line-height: var(--qndm-lh-base);
	text-align: center;
}

.qndm-banner--light {
	color: var(--qndm-surface);
}

.qndm-banner--dark {
	color: var(--qndm-heading);
}

html.qndm-banner-off .qndm-banner {
	display: none;
}

.qndm-banner-inner {
	width: 100%;
}

.qndm-banner-inner p {
	margin: 0;
	padding: 0;
}

.qndm-banner a {
	color: inherit;
}

.qndm-banner-link {
	display: block;
	text-decoration: none;
}

.qndm-banner-link:hover,
.qndm-banner-link:focus-visible {
	text-decoration: underline;
}

.qndm-banner-close {
	position: absolute;
	top: 50%;
	right: var(--qndm-sp-2);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--qndm-sp-8);
	height: var(--qndm-sp-8);
	padding: 0;
	border: 0;
	border-radius: var(--qndm-r-circle);
	background: transparent;
	color: inherit;
	cursor: pointer;
	opacity: .8;
	transform: translateY(-50%);
	transition: opacity var(--qndm-dur-fast) var(--qndm-ease);
}

.qndm-banner-close:hover,
.qndm-banner-close:focus-visible {
	opacity: 1;
}

.qndm-banner-close svg,
.qndm-promo-close svg {
	width: var(--qndm-icon-sm);
	height: var(--qndm-icon-sm);
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
}

/* Divi's fixed header sits below the banner; the script keeps it there while the banner scrolls away. */
@media not all and (max-width: 980px) {
	body.qndm-has-banner.et_fixed_nav #main-header,
	body.qndm-has-banner.et_fixed_nav #top-header {
		margin-top: var(--qndm-banner-now);
	}
}

@media (max-width: 980px) {
	body.qndm-has-banner {
		--qndm-banner-now: var(--qndm-banner-h-t);
	}

	.qndm-banner {
		min-height: var(--qndm-banner-h-t);
	}
}

@media (max-width: 767px) {
	body.qndm-has-banner {
		--qndm-banner-now: var(--qndm-banner-h-p);
	}

	.qndm-banner {
		min-height: var(--qndm-banner-h-p);
		padding: 0 var(--qndm-sp-6) 0 var(--qndm-sp-3);
		font-size: var(--qndm-fs-sm);
	}
}

/* ==========================================================================
   Promo popup
   ========================================================================== */

.qndm-promo {
	width: min(var(--qndm-promo-w), calc(100vw - 2 * var(--qndm-sp-4)));
	max-height: calc(100vh - 2 * var(--qndm-sp-4));
	padding: var(--qndm-promo-pad);
	overflow: auto;
	border: 0;
	border-radius: var(--qndm-r-lg);
	background: var(--qndm-promo-bg);
	box-shadow: var(--qndm-sh-lg);
}

.qndm-promo--light {
	color: var(--qndm-surface);
}

.qndm-promo--dark {
	color: var(--qndm-heading);
}

.qndm-promo[open] {
	animation: qndm-pop-in var(--qndm-dur-base) var(--qndm-ease);
}

.qndm-promo::backdrop {
	background: rgba(0, 0, 0, .55);
	background: color-mix( in srgb, var(--qndm-heading) 55%, transparent );
}

.qndm-promo-close {
	position: absolute;
	top: var(--qndm-sp-2);
	right: var(--qndm-sp-2);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--qndm-sp-8);
	height: var(--qndm-sp-8);
	padding: 0;
	border: 0;
	border-radius: var(--qndm-r-circle);
	background: transparent;
	color: inherit;
	cursor: pointer;
	z-index: var(--qndm-z-base);
}

.qndm-promo-close:hover,
.qndm-promo-close:focus-visible {
	background: var(--qndm-tint-25);
}

.qndm-promo-body > :last-child {
	margin-bottom: 0;
}

@keyframes qndm-pop-in {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
}

/* ==========================================================================
   Cookie notice
   ========================================================================== */

.qndm-cookies {
	position: fixed;
	right: var(--qndm-sp-4);
	bottom: var(--qndm-sp-4);
	left: var(--qndm-sp-4);
	z-index: var(--qndm-z-sticky);
	display: flex;
	align-items: center;
	gap: var(--qndm-sp-4);
	max-width: 760px;
	margin: 0 auto;
	padding: var(--qndm-sp-3) var(--qndm-sp-4);
	border: 1px solid var(--qndm-border);
	border-radius: var(--qndm-r-md);
	background: var(--qndm-surface);
	box-shadow: var(--qndm-sh-lg);
	color: var(--qndm-body);
	font-size: var(--qndm-fs-sm);
	line-height: var(--qndm-lh-base);
}

.qndm-cookies[hidden] {
	display: none;
}

.qndm-cookies-text {
	flex: 1;
	min-width: 0;
}

.qndm-cookies-more {
	color: var(--qndm-primary);
	font-weight: var(--qndm-fw-semibold);
}

.qndm-cookies-ok {
	flex: none;
	min-height: var(--qndm-sp-8);
	padding: 0 var(--qndm-sp-4);
	border: 0;
	border-radius: var(--qndm-r-sm);
	background: var(--qndm-primary);
	color: var(--qndm-surface);
	font-size: var(--qndm-fs-sm);
	font-weight: var(--qndm-fw-semibold);
	cursor: pointer;
	transition: filter var(--qndm-dur-fast) var(--qndm-ease);
}

.qndm-cookies-ok:hover,
.qndm-cookies-ok:focus-visible {
	filter: brightness(.92);
}

@media (max-width: 767px) {
	.qndm-cookies {
		flex-direction: column;
		align-items: stretch;
		text-align: center;
	}
}