/*!
 * Product Detail production polish — hero details, width, rails, spacing.
 * Presentation only. Preserves approved simplified PDP architecture.
 */

/* -------------------------------------------------------------------------
 * Shared DXP container — align with catalog 1600 envelope
 * ------------------------------------------------------------------------- */
.dxp-product[data-dxp-product-experience] {
	--content-max: 1600px;
	--container-max: 1600px;
	--dxp-container-max: 1600px;
}

.dxp-product[data-dxp-product-experience] .dxp-container {
	width: min(100%, var(--content-max, 1600px));
	max-width: var(--content-max, 1600px);
}

/* -------------------------------------------------------------------------
 * Hero — denser buy box + adaptive product details
 * ------------------------------------------------------------------------- */
.dxp-product[data-dxp-product-experience] .dxp-product-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.35rem 1.75rem;
	align-items: start;
}

@media (min-width: 900px) {
	.dxp-product[data-dxp-product-experience] .dxp-product-layout {
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
		gap: 1.75rem 2rem;
	}
}

.dxp-product[data-dxp-product-experience] .dxp-product-title {
	font-size: clamp(1.75rem, 2.6vw, 2.35rem);
	line-height: 1.15;
	margin: 0.15rem 0 0.35rem;
	font-weight: 800;
}

.dxp-product[data-dxp-product-experience] .dxp-product-price--hero {
	font-size: clamp(1.35rem, 2vw, 1.75rem);
	font-weight: 800;
}

.dxp-product[data-dxp-product-experience] .dxp-buy-box-commerce {
	display: grid;
	gap: 0.65rem;
	margin-top: 0.85rem;
}

.dxp-product[data-dxp-product-experience] .dxp-product-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
}

.dxp-product[data-dxp-product-experience] .dxp-product-actions .dxp-btn-primary {
	min-height: 2.85rem;
	padding-inline: 1.15rem;
}

.dxp-product[data-dxp-product-experience] .dxp-product-actions .dxp-btn-utility {
	order: 3;
}

.dxp-buy-box-details {
	margin-top: 1.15rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(255, 244, 214, 0.12);
}

.dxp-buy-box-details-title {
	margin: 0 0 0.65rem;
	font-size: 0.8rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-weight: 800;
	color: rgba(255, 196, 55, 0.92);
}

.dxp-hero-details-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(11.5rem, 1fr));
	gap: 0.45rem 0.85rem;
	margin: 0;
}

.dxp-hero-details-grid[data-detail-count="1"],
.dxp-hero-details-grid[data-detail-count="2"] {
	grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}

.dxp-hero-detail {
	display: grid;
	gap: 0.15rem;
	padding: 0.5rem 0.65rem;
	border-radius: 0.55rem;
	background: rgba(255, 255, 255, 0.04);
	min-width: 0;
}

.dxp-hero-detail dt {
	margin: 0;
	font-size: 0.75rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: rgba(238, 242, 248, 0.62);
	font-weight: 700;
}

.dxp-hero-detail dd {
	margin: 0;
	font-size: 0.98rem;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.95);
	word-break: break-word;
}

/* -------------------------------------------------------------------------
 * Gallery — avoid excessive upscale of low-res assets
 * ------------------------------------------------------------------------- */
.dxp-product[data-dxp-product-experience] .dxp-product-gallery-main {
	display: grid;
	place-items: center;
	aspect-ratio: 1 / 1;
	max-height: min(34rem, 70vh);
	background: linear-gradient(180deg, #141b2a 0%, #0a101a 100%);
	border-radius: 1rem;
	overflow: hidden;
}

.dxp-product[data-dxp-product-experience] .dxp-product-gallery-main img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 0.85rem;
	image-rendering: auto;
}

.dxp-product[data-dxp-product-experience] .dxp-product-gallery-thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	margin-top: 0.65rem;
}

.dxp-product[data-dxp-product-experience] .dxp-product-gallery-thumb {
	width: 4.25rem;
	height: 4.25rem;
	padding: 0;
	border-radius: 0.55rem;
	border: 1px solid rgba(255, 244, 214, 0.16);
	overflow: hidden;
	background: rgba(0, 0, 0, 0.25);
	cursor: pointer;
}

.dxp-product[data-dxp-product-experience] .dxp-product-gallery-thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.dxp-product[data-dxp-product-experience] .dxp-product-gallery-thumb.is-active,
.dxp-product[data-dxp-product-experience] .dxp-product-gallery-thumb:focus-visible {
	outline: 2px solid #ffc437;
	outline-offset: 2px;
	border-color: rgba(255, 196, 55, 0.55);
}

/* -------------------------------------------------------------------------
 * Vertical rhythm — ~15–25% tighter without crowding
 * ------------------------------------------------------------------------- */
.dxp-product[data-dxp-product-experience] .dxp-pe-stage {
	margin-block: 0.35rem;
}

.dxp-product[data-dxp-product-experience] .dxp-pe-stage > .dxp-section {
	margin-block: 0.55rem;
	padding-block: clamp(1rem, 1.8vw, 1.45rem);
}

.dxp-product[data-dxp-product-experience] [data-dxp-stage="assistant"] .dxp-section {
	padding-block: clamp(0.85rem, 1.5vw, 1.15rem);
}

.dxp-product[data-dxp-product-experience] .dxp-product-intelligence--compact .dxp-panel {
	padding: 1rem 1.15rem;
}

.dxp-product[data-dxp-product-experience] .dxp-product-intelligence--compact .dxp-reco-body {
	font-size: 0.95rem;
	margin: 0.35rem 0;
}

/* -------------------------------------------------------------------------
 * Safety + weather + Product Insight — DECIDE three-column composition
 * ------------------------------------------------------------------------- */
.dxp-product[data-dxp-product-experience] .dxp-pe-decision-support,
.dxp-product[data-dxp-product-experience] [data-dxp-pe-decision-support] {
	align-items: start;
}

.dxp-product[data-dxp-product-experience] .dxp-pe-decision-support-grid {
	align-items: stretch;
}

.dxp-product[data-dxp-product-experience] .dxp-decision-card {
	height: auto;
	min-height: 0;
	align-self: start;
}

.dxp-product[data-dxp-product-experience] .dxp-decision-card--insight {
	margin: 0;
	padding: clamp(1rem, 1.8vw, 1.35rem);
	border: 1px solid var(--dxp-color-line, rgba(255, 255, 255, 0.12));
	border-radius: var(--dxp-radius-card, var(--dxp-radius-md));
	background: var(--dxp-color-surface-elevated, var(--dxp-color-surface, #101a2b));
	box-shadow: var(--dxp-shadow-elevated, 0 6px 18px rgba(15, 26, 46, 0.05));
}

.dxp-product[data-dxp-product-experience] .dxp-decision-card--insight .dxp-intelligence-kicker {
	margin: 0 0 0.35rem;
	font-size: 0.75rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	opacity: 0.72;
}

.dxp-product[data-dxp-product-experience] .dxp-decision-card--insight .dxp-decision-card-title {
	margin: 0 0 0.65rem;
}

.dxp-product[data-dxp-product-experience] .dxp-decision-card--insight .dxp-reco-body {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.5;
}

.dxp-product[data-dxp-product-experience] .dxp-decision-card--insight .dxp-panel,
.dxp-product[data-dxp-product-experience] .dxp-pe-decide-insight-body {
	padding: 0;
	background: transparent;
	border: 0;
	box-shadow: none;
}

@media (min-width: 768px) and (max-width: 1099px) {
	.dxp-product[data-dxp-product-experience] .dxp-pe-decision-support[data-dxp-decide-cols="3"] .dxp-pe-decision-support-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dxp-product[data-dxp-product-experience] .dxp-pe-decision-support[data-dxp-decide-cols="3"] .dxp-decision-card--insight {
		grid-column: 1 / -1;
	}
}

@media (min-width: 1100px) {
	.dxp-product[data-dxp-product-experience] .dxp-pe-decision-support[data-dxp-decide-cols="3"] .dxp-pe-decision-support-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Hide empty/stale standalone intelligence stage if ever present */
.dxp-product[data-dxp-product-experience] [data-dxp-stage="intelligence"]:empty {
	display: none;
}

/* -------------------------------------------------------------------------
 * Recommendation rails — adaptive to result count; shared card system
 * ------------------------------------------------------------------------- */
.dxp-product[data-dxp-product-experience] .dxp-product-rail {
	display: grid;
	gap: 1rem 1.15rem;
	align-items: start;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 14.5rem), 1fr));
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail[data-rail-count="1"] {
	grid-template-columns: minmax(0, 18rem);
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail[data-rail-count="2"] {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: 40rem;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail[data-rail-count="3"] {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card--pdm {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	height: auto;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-media-wrap {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	max-height: 11.5rem;
	min-height: 8.5rem;
	overflow: hidden;
	flex: 0 0 auto;
	background: linear-gradient(180deg, #141b2a 0%, #0a101a 100%);
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-media {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: auto;
	background: transparent;
	overflow: hidden;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-media img,
.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-noimage {
	position: absolute;
	inset: 0;
	object-fit: contain;
	object-position: center;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	padding: 0.45rem;
	box-sizing: border-box;
	margin: 0;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-noimage {
	display: grid;
	place-items: center;
	min-height: 100%;
	background:
		radial-gradient(circle at 32% 28%, rgba(255, 196, 55, 0.2), transparent 50%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.02));
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-noimage::after {
	content: "Image coming soon";
	font-size: 0.78rem;
	color: rgba(238, 242, 248, 0.55);
	font-weight: 700;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-body {
	display: flex;
	flex-direction: column;
	flex: 0 1 auto;
	min-height: 0;
	padding: 0.75rem 0.85rem 0.9rem;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-meta {
	margin-top: 0.35rem;
	min-height: 0;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-price:empty {
	display: none;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.4rem;
	margin-top: 0.45rem;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail .dxp-product-card-actions .dxp-btn {
	min-height: 2.4rem;
	width: 100%;
	justify-content: center;
	font-size: 0.85rem;
}

/* Carousel rails: complete cards, no page overflow */
.dxp-product[data-dxp-product-experience] .dxp-product-rail--carousel {
	display: flex;
	overflow-x: auto;
	overflow-y: hidden;
	gap: 1rem;
	align-items: flex-start;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: 0.35rem;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail--carousel::-webkit-scrollbar {
	display: none;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail--carousel .dxp-product-card {
	flex: 0 0 calc((100% - 2rem) / 3);
	max-width: calc((100% - 2rem) / 3);
	scroll-snap-align: start;
	scroll-snap-stop: always;
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail--carousel[data-rail-count="1"] .dxp-product-card {
	flex-basis: min(100%, 18rem);
	max-width: min(100%, 18rem);
}

.dxp-product[data-dxp-product-experience] .dxp-product-rail--carousel[data-rail-count="2"] .dxp-product-card {
	flex-basis: calc((100% - 1rem) / 2);
	max-width: min(22rem, calc((100% - 1rem) / 2));
}

@media (max-width: 899px) {
	.dxp-product[data-dxp-product-experience] .dxp-product-rail--carousel .dxp-product-card {
		flex-basis: 100%;
		max-width: 100%;
	}

	.dxp-product[data-dxp-product-experience] .dxp-product-rail[data-rail-count="2"] {
		grid-template-columns: 1fr;
		max-width: none;
	}
}

/* -------------------------------------------------------------------------
 * Typography readability
 * ------------------------------------------------------------------------- */
.dxp-product[data-dxp-product-experience] .dxp-product-stock,
.dxp-product[data-dxp-product-experience] .dxp-decision-card-title,
.dxp-product[data-dxp-product-experience] .dxp-section-title {
	font-size: max(1rem, 1em);
}