/*
 * Armeria 3S Marketing - popups (SPEC-v1.1 §5.1). Theme tokens with fallbacks; fixed positioning only (no layout
 * shift); z-index 6000 for non-modal layouts (modal ones live in the browser top layer); reduced motion = no animation.
 * Per-popup variables (inline style): --a3s-popup-w, --a3s-popup-bg, --a3s-popup-text, --a3s-popup-overlay.
 */

.a3s-popup {
	box-sizing: border-box;
	width: min(var(--a3s-popup-w, 560px), calc(100% - 32px));
	max-width: none;
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: var(--a3s-radius-lg, 4px);
	background: var(--a3s-popup-bg, var(--a3s-color-bg, #fff));
	color: var(--a3s-popup-text, var(--a3s-color-text, #231f20));
	font-family: var(--a3s-font-body, inherit);
	box-shadow: 0 12px 40px rgba(0, 0, 0, .28);
	overflow: auto;
	overscroll-behavior: contain;
	z-index: 6000;
}

.a3s-popup:not([open]) {
	display: none;
}

.a3s-popup::backdrop {
	background: var(--a3s-popup-overlay, rgba(35, 31, 32, .6));
}

.a3s-popup *,
.a3s-popup *::before,
.a3s-popup *::after {
	box-sizing: border-box;
}

.a3s-popup__box {
	position: relative;
	padding: 36px 24px 24px;
}

.a3s-popup__content > :first-child {
	margin-top: 0;
}

.a3s-popup__content > :last-child {
	margin-bottom: 0;
}

.a3s-popup__content img,
.a3s-popup__content video,
.a3s-popup__content iframe {
	max-width: 100%;
}

.a3s-popup__content img {
	height: auto;
}

.a3s-popup__close {
	position: absolute;
	top: 2px;
	right: 2px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: inherit;
	cursor: pointer;
	line-height: 1;
}

.a3s-popup__close:hover {
	background: rgba(127, 127, 127, .15);
}

.a3s-popup__close:focus-visible,
.a3s-popup :focus-visible {
	outline: 2px solid var(--a3s-color-primary, #e95e1b);
	outline-offset: 2px;
}

/* Slide-in (corner) and bars: non-modal, fixed ------------------------- */
.a3s-popup--slide,
.a3s-popup--bar-top,
.a3s-popup--bar-bottom {
	position: fixed;
	inset: auto;
	margin: 0;
}

.a3s-popup--slide {
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
}

.a3s-popup--br { right: 16px; bottom: 16px; }
.a3s-popup--bl { left: 16px; bottom: 16px; }
.a3s-popup--tr { right: 16px; top: 16px; }
.a3s-popup--tl { left: 16px; top: 16px; }

.a3s-popup--bar-top,
.a3s-popup--bar-bottom {
	left: 0;
	right: 0;
	width: 100%;
	max-height: 60vh;
	border-radius: 0;
	box-shadow: 0 0 16px rgba(0, 0, 0, .2);
}

.a3s-popup--bar-top { top: 0; }
.a3s-popup--bar-bottom { bottom: 0; }

.a3s-popup--bar-top .a3s-popup__box,
.a3s-popup--bar-bottom .a3s-popup__box {
	max-width: var(--a3s-container, 1340px);
	margin: 0 auto;
	padding: 12px 56px 12px 16px;
}

.a3s-popup--bar-top .a3s-popup__close,
.a3s-popup--bar-bottom .a3s-popup__close {
	top: 50%;
	margin-top: -22px;
}

.a3s-popup--bar-top .a3s-popup__content,
.a3s-popup--bar-bottom .a3s-popup__content {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 16px;
}

.a3s-popup--bar-top .a3s-popup__content > *,
.a3s-popup--bar-bottom .a3s-popup__content > * {
	margin: 0;
}

/* Full screen ------------------------------------------------------------ */
.a3s-popup--fullscreen {
	width: 100%;
	height: 100%;
	max-height: 100%;
	margin: 0;
	border-radius: 0;
	box-shadow: none;
}

.a3s-popup--fullscreen::backdrop {
	background: var(--a3s-popup-overlay, rgba(35, 31, 32, .6));
}

.a3s-popup--fullscreen .a3s-popup__box {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: min(var(--a3s-popup-w, 560px), 100%);
	min-height: 100%;
	margin: 0 auto;
	padding: 56px 16px 32px;
	position: static;
}

.a3s-popup--fullscreen .a3s-popup__close {
	position: fixed;
	top: 8px;
	right: 8px;
}

/* Small screens ---------------------------------------------------------- */
@media (max-width: 575px) {
	.a3s-popup__box {
		padding: 36px 16px 16px;
	}

	.a3s-popup--slide {
		left: 8px;
		right: 8px;
		width: auto;
	}

	.a3s-popup--br,
	.a3s-popup--bl { bottom: 8px; }
	.a3s-popup--tr,
	.a3s-popup--tl { top: 8px; }

	.a3s-popup--bar-top .a3s-popup__box,
	.a3s-popup--bar-bottom .a3s-popup__box {
		padding: 12px 52px 12px 12px;
	}
}

/* Motion (transform/opacity only: no layout shift) ----------------------- */
@keyframes a3s-popup-in {
	from { opacity: 0; transform: translateY(12px); }
	to { opacity: 1; transform: none; }
}

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

@keyframes a3s-popup-up {
	from { transform: translateY(100%); }
	to { transform: none; }
}

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

.a3s-popup[open] {
	animation: a3s-popup-in .25s ease-out;
}

.a3s-popup--bar-top[open] {
	animation-name: a3s-popup-down;
}

.a3s-popup--bar-bottom[open] {
	animation-name: a3s-popup-up;
}

.a3s-popup--fullscreen[open],
.a3s-popup[open]::backdrop {
	animation: a3s-popup-fade .25s ease-out;
}

@media (prefers-reduced-motion: reduce) {
	.a3s-popup[open],
	.a3s-popup[open]::backdrop {
		animation: none;
	}
}

/* Popup button ([a3s_popup_button], Elementor "Popup button") ------------- */
.a3s-popup-button {
	min-height: 44px;
	cursor: pointer;
}

.a3s-popup-missing {
	padding: 8px 12px;
	border: 1px dashed var(--a3s-color-border, #dcd9d5);
	color: var(--a3s-color-muted, #5f5859);
	font-size: 14px;
}