/* Decant — single product page (module «Товар»). Prefix: .pdp- */

.pdp-wrap { padding-bottom: 40px; }
.pdp-wrap .crumbs { margin: 16px 0 14px; }

/* ---------- Top: photo + buy box ---------- */
.pdp-top {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(360px, 460px);
	gap: 24px 56px;
	align-items: start;
}

.pdp-media { display: grid; gap: 12px; min-width: 0; }
.pdp-media__main {
	background: var(--surface);
	border-radius: var(--r-lg);
	height: clamp(380px, calc(100vh - 210px), 640px);
	position: relative;
	overflow: hidden;
}
.pdp-media__main img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 7%;
	mix-blend-mode: multiply;
}
.pdp-thumbs { display: flex; gap: 8px; list-style: none; margin: 0; padding: 0; overflow-x: auto; }
.pdp-thumbs__btn {
	display: block; width: 64px; height: 64px; padding: 4px; border-radius: var(--r-sm);
	background: var(--surface); border: 1px solid transparent; cursor: pointer;
}
.pdp-thumbs__btn img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.pdp-thumbs__btn.is-active { border-color: var(--tint); }

.pdp-info { display: flex; flex-direction: column; min-width: 0; padding-top: 4px; }
.pdp-brand {
	align-self: flex-start;
	font: 500 var(--fs-sm)/1.2 var(--mono);
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--muted);
	margin-bottom: 8px;
}
.pdp-brand:hover { color: var(--text); }
.pdp-title { font-size: var(--fs-2xl); font-weight: 600; letter-spacing: -0.03em; overflow-wrap: anywhere; }
.pdp-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; }

.pdp-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin: 18px 0 18px; }
.pdp-price__now { font: 500 30px/1 var(--font); letter-spacing: -0.03em; }
.pdp-price__was { color: var(--faint); font-size: var(--fs-md); }
.pdp-price__unit { font: 400 var(--fs-sm)/1.2 var(--mono); color: var(--muted); }

/* Size selector: segmented radio group */
.pdp-form { margin: 0; }
.pdp-sizes { border: 0; margin: 0 0 16px; padding: 0; min-width: 0; }
.pdp-label { padding: 0; margin-bottom: 8px; font: 500 var(--fs-xs)/1.3 var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.pdp-sizes__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(78px, 1fr));
	gap: 6px;
}
.pdp-sizes__input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.pdp-sizes__opt {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
	min-height: 70px; padding: 8px 6px;
	border: 1px solid var(--line-strong); border-radius: var(--r-md);
	background: var(--bg); cursor: pointer; text-align: center;
	transition: border-color .15s, box-shadow .15s, background .15s;
}
.pdp-sizes__opt:hover { border-color: var(--text); }
.pdp-sizes__ml { font-weight: 600; font-size: var(--fs-md); line-height: 1.2; }
.pdp-sizes__price { font: 400 var(--fs-sm)/1.2 var(--mono); color: var(--muted); }
.pdp-sizes__kind { font: 400 10px/1.2 var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--faint); }
.pdp-sizes__input:checked + .pdp-sizes__opt { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); background: var(--tint-wash); }
.pdp-sizes__input:checked + .pdp-sizes__opt .pdp-sizes__price { color: var(--text); }
.pdp-sizes__input:focus-visible + .pdp-sizes__opt { outline: 2px solid var(--text); outline-offset: 2px; }
.pdp-sizes__input:disabled + .pdp-sizes__opt { cursor: not-allowed; background: var(--surface-2); border-style: dashed; color: var(--faint); }
.pdp-sizes__input:disabled + .pdp-sizes__opt:hover { border-color: var(--line-strong); }
.pdp-sizes__input:disabled + .pdp-sizes__opt .pdp-sizes__ml { text-decoration: line-through; }
.pdp-sizes__input:disabled + .pdp-sizes__opt .pdp-sizes__price { color: var(--faint); }

/* Quantity + button */
.pdp-buy { display: flex; gap: 10px; align-items: stretch; }
.pdp-qty {
	display: inline-flex; align-items: center; flex: none;
	height: 48px; border: 1px solid var(--line-strong); border-radius: var(--r-pill);
}
.pdp-qty__btn {
	width: 40px; height: 100%; border: 0; background: transparent; cursor: pointer;
	font-size: 18px; line-height: 1; border-radius: var(--r-pill);
}
.pdp-qty__btn:hover { background: var(--surface); }
.pdp-qty__input {
	width: 36px; height: 100%; border: 0; background: transparent; text-align: center;
	font: 500 var(--fs-md)/1 var(--mono); -moz-appearance: textfield; appearance: textfield;
}
.pdp-qty__input::-webkit-outer-spin-button, .pdp-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pdp-qty__input:focus { outline: none; }
.pdp-qty:focus-within { border-color: var(--text); }
.pdp-add { flex: 1; height: 48px; font-size: var(--fs-md); white-space: nowrap; }
.pdp-add [data-pdp-total] { font-family: var(--mono); font-weight: 500; }
.pdp-add.is-loading { position: relative; color: transparent; opacity: .85; }
.pdp-add.is-loading::after {
	content: ""; position: absolute; width: 18px; height: 18px; border-radius: 50%;
	border: 2px solid rgba(255,255,255,.35); border-top-color: var(--accent-ink);
	animation: pdp-spin .7s linear infinite;
}
@keyframes pdp-spin { to { transform: rotate(360deg); } }

.pdp-soldout { margin: 0 0 12px; padding: 12px 14px; background: var(--surface); border-radius: var(--r-md); color: var(--muted); font-size: var(--fs-sm); }

.pdp-facts { list-style: none; margin: 18px 0 0; padding: 14px 0 0; border-top: 1px solid var(--line); display: grid; gap: 8px; font-size: var(--fs-sm); color: var(--muted); }
.pdp-facts li { display: flex; align-items: center; gap: 10px; }
.pdp-icon { flex: none; color: var(--text); }

.pdp-rating-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-size: var(--fs-sm); color: var(--muted); align-self: flex-start; }

/* Stars (real ratings only) */
.pdp-stars { position: relative; display: inline-block; font-size: 14px; line-height: 1; letter-spacing: 1px; white-space: nowrap; }
.pdp-stars__bg { color: var(--line-strong); }
.pdp-stars__fg { position: absolute; inset: 0 auto 0 0; overflow: hidden; color: var(--text); }

/* ---------- Details: notes, story, spec ---------- */
.pdp-details {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
	gap: 32px 56px;
	margin-top: 56px;
	padding-top: 40px;
	border-top: 1px solid var(--line);
}
.pdp-block + .pdp-block { margin-top: 32px; }
.pdp-h2 { font-size: var(--fs-lg); margin-bottom: 14px; }
.pdp-notes { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.pdp-notes .chip { text-transform: capitalize; }
.pdp-notes .chip:hover { text-decoration: none; background: var(--surface); }
.pdp-story { font-size: var(--fs-md); line-height: 1.65; }
.pdp-story p:last-child { margin-bottom: 0; }

.pdp-spec { margin: 0; display: grid; border-top: 1px solid var(--line); }
.pdp-spec > div { display: grid; grid-template-columns: 130px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: var(--fs-sm); }
.pdp-spec dt { color: var(--muted); }
.pdp-spec dd { margin: 0; overflow-wrap: anywhere; }
.pdp-spec dd a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- How your decant is made ---------- */
.pdp-made { margin-top: 56px; }
.pdp-made__steps {
	list-style: none; margin: 0; padding: 0; counter-reset: pdp-step;
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
	border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden;
}
.pdp-made__steps li {
	counter-increment: pdp-step;
	display: grid; gap: 6px; align-content: start;
	padding: 22px 22px 24px; background: var(--surface-2);
}
.pdp-made__steps li + li { border-left: 1px solid var(--line); }
.pdp-made__steps .pdp-icon--lg { margin-bottom: 8px; }
.pdp-made__steps b { font-size: var(--fs-md); font-weight: 600; }
.pdp-made__steps b::before { content: counter(pdp-step) ". "; font-family: var(--mono); font-weight: 500; color: var(--muted); }
.pdp-made__steps span { font-size: var(--fs-sm); color: var(--muted); }

/* ---------- Related lists ---------- */
.pdp-related { margin-top: 64px; }
.pdp-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* ---------- Reviews ---------- */
.pdp-reviews { margin-top: 64px; }
.pdp-reviews__sum { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-sm); }
.pdp-reviews__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pdp-review { border: 1px solid var(--line); border-radius: var(--r-md); padding: 16px 18px; min-width: 0; }
.pdp-review__head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: var(--fs-sm); margin-bottom: 8px; }
.pdp-review__head time { margin-left: auto; font-size: var(--fs-xs); }
.pdp-review__ok { font: 500 11px/1 var(--mono); color: var(--good); }
.pdp-review__text { font-size: var(--fs-sm); line-height: 1.6; overflow-wrap: anywhere; }
.pdp-review__text p:last-child { margin-bottom: 0; }

/* ---------- Sticky mobile bar ---------- */
.pdp-bar { display: none; }

/* ---------- Responsive ---------- */
@media (max-width: 1180px) {
	.pdp-top { gap: 24px 36px; }
	.pdp-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
	.pdp-top { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.pdp-media__main { height: auto; aspect-ratio: 1 / 1; max-height: 70vh; }
	.pdp-title { font-size: 28px; }
	.pdp-details { grid-template-columns: minmax(0, 1fr); margin-top: 40px; padding-top: 32px; }
	.pdp-made { margin-top: 40px; }
	.pdp-made__steps { grid-template-columns: minmax(0, 1fr); }
	.pdp-made__steps li { grid-template-columns: 40px 1fr; column-gap: 14px; padding: 16px; }
	.pdp-made__steps li + li { border-left: 0; border-top: 1px solid var(--line); }
	.pdp-made__steps .pdp-icon--lg { grid-row: span 2; margin: 0; }
	.pdp-related, .pdp-reviews { margin-top: 48px; }
	.pdp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pdp-reviews__list { grid-template-columns: minmax(0, 1fr); }

	.pdp-bar:not([hidden]) {
		display: flex; align-items: center; gap: 12px;
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
		padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
		background: rgba(255,255,255,.96); backdrop-filter: saturate(1.4) blur(12px);
		border-top: 1px solid var(--line);
		transform: translateY(110%); transition: transform .2s var(--ease);
	}
	.pdp-bar.is-on { transform: none; }
	.pdp-bar__info { display: grid; min-width: 0; flex: 1; line-height: 1.25; }
	.pdp-bar__name { font-weight: 600; font-size: var(--fs-sm); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.pdp-bar__size { font-size: var(--fs-xs); color: var(--muted); }
	.pdp-bar__btn { flex: none; height: 44px; }
	.pdp-bar__btn [data-pdp-total] { font-family: var(--mono); }
	body.single-product .site-footer { padding-bottom: 96px; }
	body.single-product .toast { bottom: 84px; }
}

@media (max-width: 420px) {
	.pdp-sizes__grid { grid-template-columns: repeat(auto-fit, minmax(68px, 1fr)); }
	.pdp-spec > div { grid-template-columns: 110px 1fr; }
	.pdp-add .pdp-add__text { font-size: var(--fs-sm); }
}

.pdp-details--spec-only { grid-template-columns: minmax(0, 520px); }
.pdp-details--spec-only .pdp-details__main { display: none; }
.pdp-media:has(.pdp-thumbs) .pdp-media__main { height: clamp(340px, calc(100vh - 290px), 560px); }
@media (max-width: 900px) { .pdp-media:has(.pdp-thumbs) .pdp-media__main { height: auto; } }

/* «What you get»: our travel spray */
.pdp-pack { display: flex; align-items: center; gap: 14px; margin: 16px 0 0; padding: 10px 14px 10px 10px; border: 1px solid var(--line); border-radius: var(--r-md); }
.pdp-pack img { width: 56px; height: 72px; object-fit: contain; background: var(--surface); border-radius: var(--r-sm); mix-blend-mode: multiply; padding: 4px 0; flex: none; }
.pdp-pack p { margin: 0; font-size: var(--fs-sm); color: var(--muted); line-height: 1.4; }
.pdp-pack strong { display: block; color: var(--text); font-weight: 500; }
