/* WPOF storefront — theme vars via CSS chain + optional PHP --wpof-theme-* overrides */

#product-addons-total.wpof-product-fields,
.wpof-checkout-fields {
	--wpof-canvas: var(
		--wpof-theme-canvas,
		var(--wd-main-bgcolor, var(--bgcolor-white, var(--wp--preset--color--base, #fff)))
	);
	--wpof-accent: var(
		--wpof-theme-accent,
		--wd-primary-color,
		--theme-palette-color-1,
		--ast-global-color-0,
		--global-palette1,
		--global-palette-highlight,
		--e-global-color-primary,
		--wp--preset--color--primary,
		--woocommerce,
		--accent-color,
		--primary-color,
		--ocean-primary-color,
		--wd-link-color,
		currentColor
	);
	--wpof-panel-bg: var(
		--wpof-theme-panel-bg,
		--btn-default-bgcolor,
		color-mix(in srgb, var(--wpof-accent) 11%, var(--wpof-canvas))
	);
	--wpof-field-bg: var(
		--wpof-theme-field-bg,
		--wd-form-bg,
		color-mix(in srgb, var(--wpof-accent) 5%, var(--wpof-canvas))
	);
	--wpof-line: var(
		--wd-form-brd-color,
		var(--brdcolor-gray-300, color-mix(in srgb, var(--wpof-accent) 16%, transparent))
	);
	--wpof-line-focus: var(--wd-form-brd-color-focus, var(--wpof-accent));
	--wpof-label-color: var(
		--wd-entities-title-color,
		var(--wd-title-color, var(--color-gray-900, var(--color-gray-800, #333)))
	);
	--wpof-text-color: var(--wd-text-color, var(--color-gray-600, #666));
	--wpof-input-color: var(--color-gray-800, var(--wpof-label-color, #333));
	--wpof-placeholder-color: var(--wd-form-placeholder-color, var(--color-gray-500, #767676));
	--wpof-radius: var(--wd-form-brd-radius, var(--wd-brd-radius, 0.5em));
	--wpof-brd-width: var(--wd-form-brd-width, 1px);
	margin: 0 0 1.618em;
	clear: both;
	font: inherit;
	color: var(--wpof-text-color);
}

#product-addons-total.wpof-product-fields {
	padding: 1.15em 1.25em 1.25em;
	border: var(--wpof-brd-width) solid var(--wpof-line);
	border-radius: var(--wpof-radius);
	background-color: var(--wpof-panel-bg);
	box-shadow: 0 1px 2px color-mix(in srgb, var(--wpof-accent) 8%, transparent);
	color: var(--wpof-text-color);
}

#product-addons-total .product-addon-heading,
.wpof-checkout-title {
	margin: 0 0 0.85em;
	padding: 0 0 0.65em;
	font: inherit;
	font-size: 1.05em;
	font-weight: 700;
	line-height: 1.35;
	color: var(--wpof-heading-color, var(--wpof-label-color));
	border-bottom: 1px solid var(--wpof-line);
}

#product-addons-total .wpof-panel__notes {
	margin: -0.15em 0 0.95em;
	font-size: 0.875em;
}

#product-addons-total .wpof-panel__notes > summary {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	cursor: pointer;
	list-style: none;
	font-weight: 600;
	color: var(--wpof-label-color);
	opacity: 0.9;
}

#product-addons-total .wpof-panel__notes > summary:hover {
	opacity: 1;
}

#product-addons-total .wpof-panel__notes > summary::-webkit-details-marker {
	display: none;
}

#product-addons-total .wpof-panel__notes > summary::before {
	content: "";
	width: 0;
	height: 0;
	border-top: 0.28em solid transparent;
	border-bottom: 0.28em solid transparent;
	border-inline-start: 0.38em solid currentColor;
	opacity: 0.65;
	transition: transform 0.15s ease;
}

#product-addons-total .wpof-panel__notes[open] > summary::before {
	transform: rotate(90deg);
}

#product-addons-total .product-addon-description,
#product-addons-total .wpof-panel__desc,
.wpof-checkout-desc {
	margin: 0.55em 0 0;
	padding: 0.65em 0.75em;
	font-size: 0.875em;
	line-height: 1.65;
	color: var(--wpof-text-color);
	border-radius: calc(var(--wpof-radius) - 2px);
	background: var(--wpof-canvas);
	border-inline-start: 3px solid var(--wpof-accent);
}

#product-addons-total .product-addon,
.wpof-checkout-fields .wpof-field {
	margin: 0 0 15px;
	padding: 0;
}

#product-addons-total .product-addon:last-child,
.wpof-checkout-fields .wpof-field:last-child {
	margin-bottom: 0;
}

#product-addons-total .wpof-field-label-row label,
.wpof-checkout-fields .wpof-field-label-row label {
	display: inline;
	margin: 0;
	font-size: var(--wd-text-font-size, 0.92em);
	font-weight: var(--wd-entities-title-font-weight, 600);
	line-height: 1.35;
	color: var(--wpof-label-color);
}

#product-addons-total .wpof-field-label-row,
.wpof-checkout-fields .wpof-field-label-row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.35em;
	margin: 0 0 8px;
}

#product-addons-total abbr.required,
.wpof-checkout-fields abbr.required {
	text-decoration: none;
	border: 0;
	color: var(--wpof-accent);
	font-weight: 700;
}

#product-addons-total .wpof-help-trigger {
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	display: inline-grid;
	place-items: center;
	flex-shrink: 0;
	width: 1.125rem;
	height: 1.125rem;
	min-width: 1.125rem;
	min-height: 1.125rem;
	margin: 0;
	padding: 0;
	border: 1px solid color-mix(in srgb, var(--wpof-accent) 35%, transparent);
	border-radius: 50%;
	background: color-mix(in srgb, var(--wpof-accent) 12%, transparent);
	color: var(--wpof-accent);
	font-family: inherit;
	font-size: 0.68rem;
	font-weight: 700;
	line-height: 1;
	cursor: help;
}

#product-addons-total .wpof-help-trigger:hover,
#product-addons-total .wpof-help-trigger:focus,
#product-addons-total .wpof-help-trigger[aria-expanded="true"] {
	outline: none;
	background: color-mix(in srgb, var(--wpof-accent) 22%, transparent);
}

#product-addons-total .wpof-field-help {
	margin: -0.25em 0 8px;
	padding: 0.55em 0.7em;
	font-size: 0.82em;
	font-weight: 400;
	line-height: 1.6;
	color: var(--wpof-text-color);
	border-radius: calc(var(--wpof-radius) - 2px);
	background: var(--wpof-canvas);
	border-inline-start: 3px solid var(--wpof-accent);
}

#product-addons-total .wpof-field-help[hidden] {
	display: none !important;
}

#product-addons-total .product-addon .input-text,
#product-addons-total .product-addon select,
#product-addons-total .product-addon textarea,
.wpof-checkout-fields .wpof-input {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	margin: 0;
	font: inherit;
	font-size: var(--wd-text-font-size, inherit);
	color: var(--wpof-input-color);
	background-color: var(--wpof-field-bg);
	border: var(--wpof-brd-width) solid var(--wpof-line);
	border-radius: var(--wpof-radius);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#product-addons-total .product-addon .input-text::placeholder,
#product-addons-total .product-addon textarea::placeholder,
.wpof-checkout-fields .wpof-input::placeholder {
	color: var(--wpof-placeholder-color);
	opacity: 1;
}

#product-addons-total .product-addon textarea {
	min-height: 3.25em;
	resize: vertical;
}

#product-addons-total .product-addon .input-text:focus,
#product-addons-total .product-addon select:focus,
#product-addons-total .product-addon textarea:focus,
.wpof-checkout-fields .wpof-input:focus {
	outline: none;
	border-color: var(--wpof-line-focus) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--wpof-accent) 18%, transparent);
}

.wpof-input--invalid,
#product-addons-total .input-text.wpof-input--invalid {
	border-color: var(--wpof-error-color, var(--woocommerce-error, #a00)) !important;
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--woocommerce-error, #a00) 25%, transparent);
}

.wpof-error {
	display: block;
	margin-top: 0.35em;
	font-size: 0.85em;
	font-weight: 600;
	line-height: 1.4;
	color: var(--wpof-error-color, var(--woocommerce-error, #a00));
}

.wpof-error[hidden] {
	display: none !important;
}

.wpof-checkout-fields small.description,
.wpof-checkout-fields .wpof-help {
	display: block;
	margin-top: 0.35em;
	font-size: 0.85em;
	line-height: 1.45;
	opacity: 0.82;
}

.wpof-radio-group {
	display: flex;
	flex-direction: column;
	gap: 0.45em;
}

.wpof-choice {
	display: flex;
	align-items: flex-start;
	gap: 0.45em;
	font-size: 0.92em;
	cursor: pointer;
}

.wpof-choice input {
	margin-top: 0.15em;
	flex-shrink: 0;
	accent-color: var(--wpof-accent);
}

.wpof-password-wrap {
	position: relative;
	display: block;
}

.wpof-password-wrap .wpof-input,
.wpof-password-wrap .input-text {
	padding-inline-end: 3.5em;
}

.wpof-toggle-pass {
	position: absolute;
	inset-inline-end: 0.55em;
	top: 50%;
	transform: translateY(-50%);
	border: 0;
	background: transparent;
	padding: 0.2em 0.35em;
	font: inherit;
	font-size: 0.78em;
	font-weight: 600;
	cursor: pointer;
	color: var(--wpof-accent);
	opacity: 0.85;
}

.wpof-toggle-pass:hover,
.wpof-toggle-pass:focus {
	opacity: 1;
	outline: none;
}

.wpof-checkout-fields {
	padding: 1.15em 1.25em;
	margin-top: 1em;
	border: var(--wpof-brd-width) solid var(--wpof-line);
	border-radius: var(--wpof-radius);
	background-color: var(--wpof-panel-bg);
}

.wpof-checkout-line + .wpof-checkout-line {
	margin-top: 1em;
	padding-top: 1em;
	border-top: 1px solid var(--wpof-line);
}

.wpof-checkout-product {
	font-weight: 700;
	margin: 0 0 0.65em;
	color: inherit;
}

.wpof-product-fields.is-empty {
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
}

.wpof-product-fields.is-empty .product-addon-heading,
.wpof-product-fields.is-empty .wpof-panel__notes,
.wpof-product-fields.is-empty .wpof-fields-mount {
	display: none;
}

@supports not (background: color-mix(in srgb, red 50%, blue)) {
	#product-addons-total.wpof-product-fields,
	.wpof-checkout-fields {
		--wpof-panel-bg: var(--wpof-theme-panel-bg, var(--btn-default-bgcolor, #e8f0fe));
		--wpof-field-bg: var(--wpof-theme-field-bg, var(--wd-form-bg, #f6f6f6));
	}
}