/*
 * Pozeme — alternate product page layout.
 * Editorial two-column layout: large media grid + sticky buy panel.
 * Desktop >= 992px; below that — single column with swipe gallery
 * and a sticky full-width add-to-cart bar pinned to the viewport bottom.
 * Uses the active theme palette via CSS variables.
 */

:root {
	--pz-accent: var(--theme-primary-color, #7266f3);
	--pz-accent-dark: color-mix(in srgb, var(--pz-accent) 85%, #000);
	--pz-ink: #1f1f1f;
	--pz-muted: #7a7a7a;
	--pz-line: #e6e6e6;
	--pz-tile: #f5f5f5;
	--pz-gap: 8px;
}

.pz {
	margin: 0 0 48px;
	color: var(--pz-ink);
}

.pz__layout {
	display: grid;
	grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
	gap: 48px 0;
	align-items: start;
}

/* ============ Media ============ */

.pz__media {
	position: relative;
}

.pz__badges {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 3;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.pz__slides {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--pz-gap);
	background: var(--pz-tile);
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.pz__slide {
	margin: 0;
	background: white;
	padding: 2rem;
	scroll-snap-align: start;
}

.pz__slide-link {
	display: block;
}

.pz__slide img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: contain;
}

.pz__dots {
	display: none;
	justify-content: center;
	gap: 8px;
	margin-top: 12px;
}

.pz__dot {
	width: 8px;
	height: 8px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #cfcfcf;
	cursor: pointer;
	transition: background 0.2s;
}

.pz__dot.is-active {
	background: var(--pz-ink);
}

.pz__overlay {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 3;
	display: none;
	flex-direction: column;
	gap: 8px;
}

.pz__overlay .ui-btn {
	background: #fff;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

/* ============ Buy panel ============ */

.pz__panel {
	position: sticky;
	top: 96px;
	padding: 2.5rem;
}

.pz__brand {
	display: inline-block;
	margin-bottom: 6px;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--pz-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.pz__brand:hover {
	color: var(--pz-accent-dark);
}

.pz__title {
	margin: 0 0 8px;
	font-size: 30px;
	font-weight: 600;
	line-height: 1.2;
}

.pz__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 16px;
	margin-bottom: 6px;
	color: var(--pz-muted);
	font-size: 14px;
}

.pz__stock--true {
	color: #1e9e56;
}

.pz__stock--false {
	color: #d0483e;
}

.pz__rating {
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	margin-bottom: 16px;
	font-size: 14px;
	color: var(--pz-ink);
	text-decoration: none;
}

.pz__rating-star {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-weight: 600;
}

.pz__rating:hover .pz__rating-counter {
	text-decoration: underline;
}

.pz__price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 10px;
	margin-bottom: 4px;
}

.pz__price ins,
.pz__price-regular {
	font-size: 26px;
	font-weight: 700;
	text-decoration: none;
}

.pz__price del {
	font-size: 18px;
	color: var(--pz-muted);
}

.pz__price--disabled {
	opacity: 0.5;
}

.pz__economy {
	display: inline-block;
	margin-bottom: 8px;
	font-size: 13px;
	color: #1e9e56;
}

.pz__price-notes {
	margin: 0 0 8px;
	font-size: 13px;
	color: var(--pz-muted);
}

.pz__price-notes span {
	display: inline-block;
	margin-right: 12px;
}

/* --- Options --- */

.pz__settings {
	margin: 16px 0;
}

.pz__opt {
	margin-bottom: 18px;
}

.pz__opt-head {
	display: flex;
	align-items: baseline;
	gap: 12px;
	margin-bottom: 8px;
}

.pz__opt-label {
	font-weight: 600;
	font-size: 14px;
}

.pz__opt-label--required::after {
	content: ' *';
	color: #d0483e;
}

.pz__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pz__chip-input {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.pz__chip-box {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 69px;
	padding: 12px 24px;
	border: 1px solid var(--pz-line);
	border-radius: 14px;
	background: #fff;
	font-size: 21px;
	cursor: pointer;
	text-align: center;
	transition: border-color 0.15s, box-shadow 0.15s;
}

.pz__chip-box:hover {
	border-color: var(--pz-accent);
}

.pz__chip-input:checked + .pz__chip-box {
	border: 2px solid var(--pz-ink);
	padding: 11px 23px;
	font-weight: 600;
}

.pz__chip-input:focus-visible + .pz__chip-box {
	box-shadow: 0 0 0 2px var(--pz-accent);
}

.pz__chip-price {
	color: var(--pz-muted);
}

.pz__sizeguide {
	display: block;
	margin: 4px 0 16px;
	text-align: center;
	font-size: 17px;
	color: var(--theme-primary-color);
	font-variant-caps: all-small-caps;
	font-weight: 500;
}

/* --- Quantity (hidden contract inputs) --- */

.pz__qty {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

/* --- Cart --- */

.pz__buy {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 20px 0;
}

.pz__buy .ui-add-to-cart {
	margin: 0 10px 0 0;
}

.pz__buy .ui-add-to-cart,
.pz__buy .pz__fast {
	width: calc(50% - 5px);
}

.pz__addto {
	display: flex;
	flex-basis: 100%;
	gap: 20px;
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}

.pz__addto-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--pz-muted);
	font-size: 13px;
	cursor: pointer;
}

.pz__addto-btn:hover,
.pz__addto-btn.is-active {
	color: var(--pz-accent);
}

/* --- Accordions --- */

.pz__acc {
	border-top: 1px solid var(--pz-line);
}

.pz__acc:last-of-type {
	border-bottom: 1px solid var(--pz-line);
}

.pz__acc-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 0;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	list-style: none;
}

.pz__acc-head::-webkit-details-marker {
	display: none;
}

.pz__acc-head::after {
	content: '+';
	font-size: 20px;
	line-height: 1;
	color: var(--pz-muted);
	transition: transform 0.2s;
}

.pz__acc[open] .pz__acc-head::after {
	content: '−';
}

.pz__acc-body {
	padding: 0 0 18px;
	font-size: 14px;
	line-height: 1.6;
}

.pz__acc-body--quiet {
	color: var(--pz-muted);
}

.pz__specs {
	margin: 0;
}

.pz__specs-row {
	display: grid;
	grid-template-columns: 45% 1fr;
	gap: 12px;
	padding: 7px 0;
	border-bottom: 1px dashed var(--pz-line);
}

.pz__specs-row dt {
	color: var(--pz-muted);
}

.pz__specs-row dd {
	margin: 0;
}

/* ============ Section headings ============ */

.pz__h2 {
	margin: 0 0 24px;
	font-size: 28px;
	font-weight: 600;
}

.pz__h2-counter {
	color: var(--pz-muted);
	font-size: 18px;
}

/* ============ Reviews ============ */

.pz-reviews__grid {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: 48px;
	align-items: start;
}

.pz-reviews__summary {
	position: sticky;
	top: 96px;
}

.pz-reviews__score {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin-bottom: 14px;
}

.pz-reviews__score-num {
	font-size: 52px;
	font-weight: 700;
	line-height: 1;
}

.pz-reviews__score-caption {
	display: block;
	color: var(--pz-muted);
}

.pz-reviews__bars {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

.pz__btn-outline {
	display: block;
	width: 100%;
	min-height: 48px;
	padding: 12px 18px;
	border: 1px solid var(--pz-ink);
	border-radius: 0;
	background: none;
	color: var(--pz-ink);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	cursor: pointer;
	transition: background 0.2s, color 0.2s;
}

.pz__btn-outline:hover {
	background: var(--pz-ink);
	color: #fff;
}

.pz-reviews__form {
	margin-bottom: 28px;
	padding: 20px;
	border: 1px solid var(--pz-line);
	border-radius: 12px;
}

.pz-reviews__form--hidden {
	display: none;
}

.pz-reviews__login {
	color: var(--pz-muted);
	font-size: 14px;
}

/* ============ Related ============ */

.pz-related {
	margin: 0 0 40px;
}

/* ============ Sticky mobile bar ============ */

.pz-bar {
	display: none;
}

/* ============ Mobile / tablet ============ */

@media (max-width: 1199px) {
	.pz {
		margin-bottom: 32px;
	}

	.pz__layout {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.pz__panel {
		position: static;
	}

	.pz__title {
		font-size: 24px;
	}

	/* Gallery becomes a snap slider */
	.pz__slides {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		gap: 0;
		-webkit-overflow-scrolling: touch;
	}

	.pz__slides::-webkit-scrollbar {
		display: none;
	}

	.pz__slide {
		flex: 0 0 100%;
		scroll-snap-stop: always;
	}

	.pz__dots.is-visible {
		display: flex;
	}

	.pz__overlay {
		display: flex;
	}

	.pz-reviews__grid {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.pz-reviews__summary {
		position: static;
	}

	/* Sticky add-to-cart bar */
	.pz-bar {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 999;
		display: block;
		padding: 8px 12px;
		background: #fff;
		box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.12);
	}

	.pz-bar__cart {
		font-size: 13px;
		letter-spacing: 0.12em;
	}

	/* keep clear of the easychat floating button */
	.pz-bar #button-cart-additional {
		margin-right: 75px;
		margin-bottom: 0;
	}

	/* Keep content clear of the fixed bar and mobile header */
	.main {
		padding-bottom: 72px;
	}
}

@media (min-width: 1200px) {
	.pz__dots {
		display: none !important;
	}

	.pz__slides {
		padding-right: var(--pz-gap);
	}

	.pz__slide:first-child {
		border-top-left-radius: 10px;
	}

	.pz__slide:last-child:nth-child(odd) {
		border-bottom-left-radius: 10px;
	}
}

/* ============================================================
   Prostore module carousel (content_bottom) on pozeme pages:
   hide scrollbar, desktop hover arrows
   ============================================================ */
.pz-mod {
	position: relative;
}

/* prostore's .app wrapper has overflow:hidden which kills position:sticky;
   release vertical clipping only on pozeme pages (clip on X keeps
   negative-margin nav arrows from causing horizontal scroll) */
.app:has(.pz) {
	overflow-x: clip;
	overflow-y: visible;
}

/* prostore's fixed-header mode turns body into a scroll container
   (overflow-x:hidden; overflow-y:auto), which breaks position:sticky;
   release it on pozeme pages — .app still clips horizontal overflow */
body:has(.pz) {
	overflow-y: visible;
	overflow-x: clip;
}

.pz-mod .js-swiper-products-scrollbar {
	display: none !important;
}

.pz-mod__nav {
	position: absolute;
	top: 30%;
	left: -10px;
	right: -10px;
	display: flex;
	justify-content: space-between;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.2s;
	z-index: 5;
}

.pz-mod__nav-btn {
	pointer-events: auto;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #1a1a1a;
}

.pz-mod__nav-btn:hover {
	color: var(--theme-primary-color);
}

.pz-mod:hover .pz-mod__nav {
	opacity: 1;
}

@media (max-width: 1199px) {
	.pz-mod__nav {
		display: none;
	}
}

/* ============================================================
   White canvas for the whole alternative layout
   ============================================================ */
.pz,
.pz-section {
	background: #fff;
}

/* ============================================================
   Dolyami (pay in 4)
   ============================================================ */
.pz__dolyami {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 16px;
	margin: 14px 0 2px;
}

.pz__found-link {
	margin-left: auto;
	white-space: nowrap;
}

.pz__dolyami-link {
	display: inline-flex;
	align-items: center;
	color: inherit;
	text-decoration: none;
	font-size: 14px;
}

.pz__dolyami-link:hover .dolyami-link__text {
	text-decoration: underline;
}

.dolyami-link__logo {
	margin-right: 1rem;
}

#popup-dolyami .dolyami-popup__subtitle {
	margin-bottom: 20px;
	color: #6b6b6b;
}

.dolyami-scheme__items {
	position: relative;
}

.dolyami-scheme__items::before {
	position: absolute;
	top: 0;
	left: 9px;
	bottom: 0;
	width: 1px;
	background: #f2f2f2;
	content: "";
}

.dolyami-scheme__item {
	position: relative;
	display: flex;
	margin-bottom: 30px;
}

.dolyami-scheme__item:nth-child(1) .dolyami-scheme__icon circle {
	stroke-dasharray: 56.5486677646;
	stroke-dashoffset: 42.4115008235;
}

.dolyami-scheme__item:nth-child(2) .dolyami-scheme__icon circle {
	stroke-dasharray: 56.5486677646;
	stroke-dashoffset: 28.2743338823;
}

.dolyami-scheme__item:nth-child(3) .dolyami-scheme__icon circle {
	stroke-dasharray: 56.5486677646;
	stroke-dashoffset: 14.1371669412;
}

.dolyami-scheme__item:nth-child(4) .dolyami-scheme__icon circle {
	stroke-dasharray: 56.5486677646;
	stroke-dashoffset: 0;
}

.dolyami-scheme__item:nth-child(4) .dolyami-scheme__icon::after {
	display: block;
}

.dolyami-scheme__icon {
	position: relative;
	width: 20px;
	height: 20px;
	margin-right: 20px;
	background: #fff;
	outline: 5px solid #fff;
}

.dolyami-scheme__icon::after {
	display: none;
	position: absolute;
	content: "";
	top: 0;
	right: 0;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #025159 url(/image/dolyami-checkmark.svg);
}

.dolyami-scheme__icon::before {
	position: absolute;
	content: "";
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 8px;
	height: 8px;
	background: #0e0f0e;
	border-radius: 50%;
}

.dolyami-scheme__image {
	transform: rotate(-90deg);
	vertical-align: top;
}

.dolyami-scheme__label {
	display: inline-flex;
	line-height: 20px;
}

.dolyami-scheme__list {
	display: flex;
	list-style: none;
	margin: 40px 0;
	padding: 0;
	gap: 0 32px;
}

.dolyami-scheme__list img {
	width: 32px;
	height: 32px;
	display: block;
	margin-bottom: 16px;
}

.dolyami-popup__note {
	color: #6b6b6b;
	font-size: 14px;
}

@media screen and (min-width: 768px) {
	#popup-dolyami {
		min-width: 670px;
	}

	.dolyami-popup__subtitle {
		margin-bottom: 35px;
	}

	.dolyami-scheme__items {
		display: flex;
		justify-content: space-between;
	}

	.dolyami-scheme__items::before {
		top: auto;
		left: 0;
		right: 25%;
		width: auto;
		height: 1px;
		bottom: 9px;
	}

	.dolyami-scheme__item {
		flex: 1;
		margin: 0;
		padding-bottom: 35px;
	}

	.dolyami-scheme__icon,
	.dolyami-scheme__icon::after {
		width: 22px;
		height: 22px;
	}

	.dolyami-scheme__icon {
		position: absolute;
		left: 0;
		bottom: 0;
	}

	.dolyami-scheme__label,
	.dolyami-scheme__subtitle,
	.dolyami-scheme__title {
		display: block;
	}
}

/* ============================================================
   Buy panel extras: credit, fast order, found cheaper, share
   ============================================================ */
@media (max-width: 767px) {
	.pz__fast {
		margin: 0 0 1rem;
	}
}

.pz__credit {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px 16px;
	margin: 18px 0;
	padding: 14px 16px;
	border: 1px solid var(--pz-line, #e5e5e5);
	border-radius: 4px;
}

.pz__credit-currency {
	font-size: 22px;
	font-weight: 700;
}

.pz__credit-title {
	flex: 1 1 auto;
	min-width: 180px;
	font-size: 13px;
	color: #6b6b6b;
}

.pz__credit-action {
	display: flex;
	align-items: center;
	gap: 12px;
}

.pz__credit-payments {
	font-size: 13px;
	color: #6b6b6b;
	white-space: nowrap;
}

.pz__found,
.pz__share {
	margin: 10px 0;
}

.pz__short {
	margin: 18px 0;
}

.pz__short-title,
.pz__attshort-title {
	display: block;
	margin-bottom: 8px;
	font-size: 15px;
	font-weight: 700;
}

.pz__short-body {
	color: #4a4a4a;
	font-size: 14px;
	line-height: 1.55;
}

.pz__attshort {
	margin: 18px 0;
}

.pz__attshort-table {
	width: 100%;
	border-collapse: collapse;
}

.pz__attshort-table td {
	padding: 8px 0;
	border-bottom: 1px solid var(--pz-line, #ececec);
	font-size: 14px;
}

.pz__attshort-table tr:last-child td {
	border-bottom: 0;
}

.pz__attshort-table td small {
	display: block;
	color: #8a8a8a;
	font-size: 12px;
}

/* ============================================================
   Media block: video links + discount countdown
   ============================================================ */
.pz__video {
	margin: 10px 0;
}

.pz__discount {
	margin: 14px 0 0;
}

/* ============================================================
   Product layout block: prostore rounding
   ============================================================ */
.pz {
	border-radius: 10px;
}

/* Error spans (server-side option errors) */
.ui-error {
	margin: 0 0 2rem;
}

/* Reviews form toggle button */
.pz__btn-outline {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 12px 24px;
	background: var(--pz-accent);
	border: 1px solid var(--pz-accent);
	border-radius: 5px;
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	transition: background 0.25s, border-color 0.25s;
}

.pz__btn-outline:hover {
	background: var(--pz-accent-dark);
	border-color: var(--pz-accent-dark);
	color: #fff;
}

/* ============================================================
   FAQ + custom tab sections
   ============================================================ */
.pz-section {
	margin: 0 0 1rem;
	border-radius: 10px;
	background: #fff;
}

.pz-section:last-of-type {
	margin-bottom: 56px;
}

.pz-custom__body {
	max-width: 820px;
	color: #333;
	font-size: 15px;
	line-height: 1.65;
}

.pz-custom__body img {
	max-width: 100%;
	height: auto;
}