/**
 * Pop Commerce builder: pc-base.css (F2 base layer, R5).
 * Contract: docs/forms-builder/F2-contracts.md section 5.1, 5.9 (G3, G4).
 *
 * Structure lives in :where() (specificity 0,0,0) so instance rules always win.
 * The control reset (section 2) is exactly 0,2,0 and beats theme leaks.
 */

/* 1. Box model and structure (0,0,0) */
:where(.pc-popup, .pc-popup *, .pc-popup *::before, .pc-popup *::after, .pc-bar, .pc-bar *, .pc-bar *::before, .pc-bar *::after) {
	box-sizing: border-box;
}

:where(.pc-popup) {
	position: fixed;
	inset: 0;
	display: none;
	z-index: 9999998;
	overflow-x: hidden;
	overflow-y: auto;
}

:where(.pc-popup.is-visible) {
	display: flex;
}

:where(.pc-b-card) {
	position: relative;
	transform-origin: center center;
}

:where(.pc-b-section) {
	display: flex;
	flex-direction: row;
}

:where(.pc-b-column, .pc-b-form, .pc-b-success) {
	display: flex;
	flex-direction: column;
}

:where(.pc-b-form > *, .pc-b-success > *) {
	flex-shrink: 0; /* Content taller than the fixed-height form overflows like legacy instead of squeezing its items. */
}

:where(.pc-b-column) {
	min-width: 0;
}

/* Views: only form is hidden in success, form_error only in general-error (section 3.4). */
:where(.pc-b-success, .pc-b-form_error) {
	display: none;
}

:where(.pc-popup[data-pc-view="success"] .pc-b-form) {
	display: none;
}

:where(.pc-popup[data-pc-view="success"] .pc-b-success) {
	display: flex;
}

:where(.pc-popup[data-pc-view="general-error"] .pc-b-form_error) {
	display: block;
}

:where(.pc-b-image) {
	position: relative;
	overflow: hidden;
}

:where(.pc-img-link) {
	display: block;
	width: 100%;
	height: 100%;
}

:where(.pc-img) {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	object-fit: cover;
}

:where(.pc-b-close) {
	position: absolute;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

:where(.pc-b-close > svg) {
	width: 16px;
	height: 16px;
	fill: currentcolor;
	pointer-events: none;
}

:where(.pc-b-button) {
	position: relative;
	display: block;
	flex-shrink: 0;
	overflow: hidden;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	transition: all 0.3s ease;
}

:where(.pc-b-button:disabled) {
	cursor: not-allowed;
}

:where(.pc-b-icon) {
	display: inline-flex;
	flex-shrink: 0;
}

:where(.pc-b-icon > svg, .pc-b-icon > img) {
	width: 100%;
	height: 100%;
	fill: currentcolor;
}

/* Bar icon: legacy gift-icon hover (transform .3s ease, scale 1.2 on bar hover). */
:where(.pc-bar .pc-b-icon) {
	transition: transform 0.3s ease;
}

:where(.pc-bar:hover .pc-b-icon) {
	transform: scale(1.2);
}

/* Bar: fixed to the bottom, hidden until is-visible (fail-closed). */
:where(.pc-bar) {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 99999;
	display: none;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	cursor: pointer;
	width: 100%;
	max-height: 30vh;
}

:where(.pc-bar.is-visible) {
	display: flex;
}

:where(.pc-bar:focus-visible) {
	outline: 2px solid currentcolor;
	outline-offset: -2px;
}

/* safeArea (contract 2.5 pt 14): the bar clears the home indicator; 0 where there is none, so pixel neutral. */
:where(.pc-bar-safe) {
	padding-bottom: env(safe-area-inset-bottom, 0);
}

/* G3 (img, svg cap; bar width 100% above) and G4 (bar max-height 30vh above): pixel neutral for Air Essence. */
:where(.pc-popup img, .pc-popup svg, .pc-bar img, .pc-bar svg) {
	max-width: 100%;
}

/* Background <picture> of a section or column (BgPicture): fills the host behind its children, like background-size. */
:where(.pc-bgpic-host) {
	position: relative;
	isolation: isolate;
}

:where(.pc-bgpic) {
	position: absolute;
	inset: 0;
	z-index: -1;
	display: block;
	border-radius: inherit;
	pointer-events: none;
}

:where(.pc-bgpic > img) {
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	border-radius: inherit;
	object-fit: cover;
}

/* Visually hidden (the only !important in the base). */
:where(.pc-sr) {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* 2. Control reset: exactly 0,2,0, zeroes theme leaks. */
.pc-popup .pc-input,
.pc-popup .pc-ms-btn,
.pc-popup .pc-b-button,
.pc-popup .pc-b-close {
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0 none;
	border-radius: 0;
	box-shadow: none;
	background: none;
	font: inherit;
	line-height: normal;
	letter-spacing: normal;
	text-transform: none;
	appearance: none;
}

.pc-popup .pc-b-heading,
.pc-popup .pc-b-text {
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0 none;
	border-radius: 0;
	box-shadow: none;
	background: none;
	font: inherit;
	line-height: normal;
	letter-spacing: normal;
	text-transform: none;
	text-wrap: wrap;
	color: inherit;
	width: auto;
}

/* Close button: Flatsome sets button position: relative, which puts it in the card flow. */
.pc-popup .pc-b-close {
	position: absolute;
}

/* Survey toggle: themes (Flatsome) give button inline-block and centred text. */
.pc-popup .pc-ms-btn {
	display: flex;
	text-align: left;
}

/* Block margins of theme ul/li/form rules (Flatsome: ul 1.3em, li 0.6em). */
.pc-popup .pc-b-form,
.pc-popup .pc-perks-list,
.pc-popup .pc-perk {
	margin: 0;
	list-style: none;
}

/* Consent label: same reset against the theme label rules. */
.pc-popup .pc-consent {
	margin: 0;
	padding: 0;
	font-weight: inherit;
	letter-spacing: normal;
	text-transform: none;
}

/* Reduced motion: keep non-geometric transitions only (F7-D15). */
@media (prefers-reduced-motion: reduce) {
	:where(.pc-b-button) {
		transition-property: color, background-color, border-color, box-shadow, opacity;
	}

	:where(.pc-bar .pc-b-icon) {
		transition: none;
	}
}
