/**
 * Single product page — desktop + mobile.
 */

body.single-product .site-main {
	background-color: #fff;
}

.oten-single-product--bundle {
	background: #fafafa;
}

.oten-single-product {
	background: #fff;
	padding-bottom: 88px;
}

/* Breadcrumb */
.oten-single-product__breadcrumb {
	padding: 12px 16px;
}

.oten-single-product__breadcrumb-list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.oten-single-product__breadcrumb-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.oten-single-product__breadcrumb-link,
.oten-single-product__breadcrumb-current {
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 11px;
	line-height: 1.4;
	color: #898989;
	text-decoration: none;
}

.oten-single-product__breadcrumb-link:hover,
.oten-single-product__breadcrumb-link:focus-visible {
	color: var(--oten-brand);
}

.oten-single-product__breadcrumb-current {
	color: var(--oten-ink);
}

.oten-single-product__breadcrumb-sep {
	color: #c9c9c9;
	font-size: 11px;
}

/* Layout */
.oten-single-product__layout {
	display: flex;
	flex-direction: column;
	padding: 0 16px;
}

/* Gallery */
.oten-single-product__gallery-main {
	position: relative;
	min-height: 0;
	overflow: hidden;
	background: #f5f5f5;
	aspect-ratio: 311 / 381;
}

.oten-single-product__gallery-image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	object-position: top center;
}

.oten-single-product__wishlist {
	position: absolute;
	top: 12px;
	inset-inline-start: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 9999px;
	background: #fff;
	cursor: pointer;
	transition: transform 0.2s ease, background-color 0.2s ease;
}

.oten-single-product__wishlist:hover,
.oten-single-product__wishlist:focus-visible {
	transform: scale(1.05);
}

.oten-single-product__wishlist:focus-visible {
	outline: 2px solid var(--oten-brand);
	outline-offset: 2px;
}

.oten-single-product__wishlist.is-active {
	background: var(--oten-brand);
}

.oten-single-product__wishlist.is-active .oten-single-product__wishlist-icon path {
	fill: #fff;
}

.oten-single-product__wishlist-icon {
	display: block;
	width: 18px;
	height: 18px;
}

.oten-single-product__gallery-thumbs {
	display: flex;
	gap: 10px;
	margin-top: 10px;
}

.oten-single-product__gallery-thumb {
	flex: 0 0 auto;
	position: relative;
	width: 64px;
	height: 64px;
	padding: 0;
	overflow: hidden;
	background: #f5f5f5;
	border: 1px solid #e1e1e1;
	cursor: pointer;
}

.oten-single-product__gallery-thumb.is-active {
	border-color: var(--oten-ink);
}

.oten-single-product__gallery-thumb:focus-visible {
	outline: 2px solid var(--oten-brand);
	outline-offset: 2px;
}

.oten-single-product__gallery-thumb-image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	object-position: top center;
}

/* Info */
.oten-single-product__info {
	margin-top: 20px;
}

/* Simple products: the thumbnail strip lives at the end of the info column
   markup (so desktop can pin it to the bottom, aligned with the main
   image), but on mobile it must still appear right after the main image,
   before the title — so it's flex-ordered first there. */
.oten-single-product:not(.oten-single-product--bundle) .oten-single-product__info {
	display: flex;
	flex-direction: column;
}

.oten-single-product:not(.oten-single-product--bundle) .oten-single-product__info .oten-single-product__gallery-thumbs {
	order: -1;
	margin-top: 0;
	margin-bottom: 20px;
}

.oten-single-product__title {
	margin: 0 0 16px;
	font-family: Kalameh, IRANYekanX, Tahoma, sans-serif;
	font-size: 16px;
	line-height: 1.4;
	font-weight: 500;
	color: var(--oten-ink);
	text-align: right;
}

.oten-single-product__row {
	margin-bottom: 18px;
}

.oten-single-product__row-label {
	display: block;
	margin-bottom: 10px;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	color: var(--oten-ink);
}

.oten-single-product__swatches {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.oten-single-product__swatch {
	width: 24px;
	height: 24px;
	padding: 0;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 9999px;
	cursor: pointer;
	box-shadow: none;
	transition: box-shadow 0.2s ease;
}

.oten-single-product__swatch.is-active {
	box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--oten-ink);
}

.oten-single-product__swatch:focus-visible {
	outline: 2px solid var(--oten-brand);
	outline-offset: 2px;
}

.oten-single-product__size-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.oten-single-product__size-guide {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 0;
	border: 0;
	background: none;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 12px;
	color: var(--oten-brand);
	cursor: pointer;
}

.oten-single-product__size-guide-icon {
	display: block;
	width: 16px;
	height: 14px;
}

.oten-single-product__sizes {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.oten-single-product__size-btn {
	min-width: 44px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid #e1e1e1;
	background: #fff;
	color: var(--oten-ink);
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.oten-single-product__size-btn:hover,
.oten-single-product__size-btn:focus-visible {
	border-color: var(--oten-ink);
}

.oten-single-product__size-btn:focus-visible {
	outline: 2px solid var(--oten-brand);
	outline-offset: 2px;
}

.oten-single-product__size-btn.is-active {
	background: var(--oten-black);
	border-color: var(--oten-black);
	color: #fff;
}

/* Bundled items ("این باندل شامل") */
.oten-bundle {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-bottom: 18px;
}

.oten-bundle-item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 16px;
	border: 1px solid #eee;
	background: #fff;
}

.oten-bundle-item__media {
	flex-shrink: 0;
}

.oten-bundle-item__image {
	display: block;
	width: 64px;
	height: 80px;
	object-fit: cover;
	background: #f7f7f7;
}

.oten-bundle-item__body {
	flex: 1 1 auto;
	min-width: 0;
}

.oten-bundle-item__title {
	margin: 0 0 12px;
	font-family: Kalameh, IRANYekanX, Tahoma, sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--oten-ink);
}

.oten-bundle-item__summary {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 12px;
	line-height: 1.6;
	color: #555;
}

.oten-bundle-item__row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
}

.oten-bundle-item__row:last-child {
	margin-bottom: 0;
}

.oten-bundle-item__row-label {
	flex-shrink: 0;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 12px;
	color: #666;
}

.oten-bundle-item__swatches {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.oten-bundle-item__swatch {
	width: 18px;
	height: 18px;
	padding: 0;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 9999px;
	cursor: pointer;
	box-shadow: none;
	transition: box-shadow 0.2s ease;
}

.oten-bundle-item__swatch.is-active {
	box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--oten-ink);
}

.oten-bundle-item__swatch:focus-visible {
	outline: 2px solid var(--oten-brand);
	outline-offset: 2px;
}

.oten-bundle-item__sizes {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.oten-bundle-item__size-btn {
	min-width: 32px;
	height: 28px;
	padding: 0 8px;
	border: 1px solid #e1e1e1;
	background: #fff;
	color: var(--oten-ink);
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 11px;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.oten-bundle-item__size-btn:hover,
.oten-bundle-item__size-btn:focus-visible {
	border-color: var(--oten-ink);
}

.oten-bundle-item__size-btn:focus-visible {
	outline: 2px solid var(--oten-brand);
	outline-offset: 2px;
}

.oten-bundle-item__size-btn.is-active {
	background: var(--oten-black);
	border-color: var(--oten-black);
	color: #fff;
}

.oten-bundle-item__side {
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 10px;
	text-align: left;
}

.oten-bundle-item__view {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 12px;
	color: var(--oten-brand);
	text-decoration: none;
	white-space: nowrap;
}

.oten-bundle-item__view:hover,
.oten-bundle-item__view:focus-visible {
	text-decoration: underline;
}

.oten-bundle-item__view-icon {
	display: block;
	width: 13px;
	height: 13px;
	flex-shrink: 0;
}

.oten-bundle-item__price {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: Kalameh, IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	font-weight: 500;
	color: var(--oten-ink);
	white-space: nowrap;
}

.oten-bundle-item__price-icon {
	display: block;
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.oten-bundle-item__discount-row {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
}

.oten-bundle-item__old-price {
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 11px;
	color: #9a9a9a;
	text-decoration: line-through;
	white-space: nowrap;
}

.oten-bundle-item__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	padding: 1px 5px;
	border-radius: 4px;
	background: #e3352b;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 10px;
	font-weight: 700;
	color: #fff;
	white-space: nowrap;
}

/* Tabs */
.oten-single-product__tabs {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-top: 26px;
	padding-top: 16px;
	border-top: 1px solid #f0f0f0;
	border-bottom: 1px solid #f0f0f0;
}

.oten-single-product__tab {
	position: relative;
	padding: 0 0 8px;
	border: 0;
	background: none;
	font-family: Kalameh, IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	color: #9a9a9a;
	cursor: pointer;
	transition: color 0.2s ease;
}

.oten-single-product__tab:focus-visible {
	outline: 2px solid var(--oten-brand);
	outline-offset: 2px;
}

/* The underline overlaps the tablist's own bottom border (bottom: -1px is
   the border's thickness) instead of sitting above it, so the active
   tab's line and the shared divider read as a single line. */
.oten-single-product__tab::after {
	content: '';
	position: absolute;
	inset-inline: 0;
	bottom: -1px;
	height: 2px;
	background: transparent;
	transition: background-color 0.2s ease;
}

.oten-single-product__tab.is-active {
	color: var(--oten-brand);
}

.oten-single-product__tab.is-active::after {
	background: var(--oten-brand);
}

.oten-single-product__panels {
	padding-top: 16px;
}

.oten-single-product__panel[hidden] {
	display: none;
}

.oten-single-product__feature-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.oten-single-product__feature-item {
	display: flex;
	gap: 6px;
	padding: 8px 0;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	line-height: 1.6;
	color: var(--oten-ink);
	text-align: right;
}

.oten-single-product__feature-label {
	flex-shrink: 0;
	color: var(--oten-ink);
	font-weight: 500;
}

.oten-single-product__feature-value {
	color: #666;
}

.oten-single-product__reviews-empty {
	padding: 24px 0;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	color: #898989;
	text-align: center;
}

.oten-single-product__reviews-empty-text {
	margin: 0 0 20px;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	color: #898989;
	text-align: center;
}

.oten-review__notice {
	margin: 0 0 16px;
	padding: 12px 16px;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	text-align: center;
}

.oten-review__notice--success {
	border: 1px solid #bfe3c9;
	background: #eef8f0;
	color: #1b7a3d;
}

.oten-review__notice--error {
	border: 1px solid #f0c4c4;
	background: #fdf0f0;
	color: #b3261e;
}

.oten-review__summary {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-bottom: 20px;
}

.oten-review__avg {
	font-family: Kalameh, IRANYekanX, Tahoma, sans-serif;
	font-size: 20px;
	font-weight: 700;
	color: var(--oten-ink);
}

.oten-review__stars {
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.oten-review__star {
	display: block;
	width: 18px;
	height: 18px;
	color: #ddd;
}

.oten-review__star.is-filled {
	color: #f5a623;
}

.oten-review__stars--small .oten-review__star {
	width: 14px;
	height: 14px;
}

.oten-review__count {
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 12px;
	color: #898989;
}

.oten-review__list {
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}

.oten-review__item {
	border-top: 1px solid #eee;
	padding: 16px 0;
}

.oten-review__item:last-child {
	border-bottom: 1px solid #eee;
}

.oten-review__head {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 6px;
}

.oten-review__avatar {
	display: block;
	width: 36px;
	height: 36px;
	flex-shrink: 0;
}

.oten-review__avatar-img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	border-radius: 50%;
	object-fit: cover;
}

.oten-review__author {
	font-family: Kalameh, IRANYekanX, Tahoma, sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: var(--oten-ink);
}

.oten-review__head .oten-review__stars {
	margin-inline-start: auto;
}

.oten-review__date {
	display: block;
	margin-bottom: 8px;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 11px;
	color: #aaa;
}

.oten-review__text {
	margin: 0;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	line-height: 1.9;
	color: #444;
}

.oten-single-product__review-form {
	border-top: 1px solid #eee;
	padding-top: 20px;
}

.oten-review__form-title {
	margin: 0 0 12px;
	font-family: Kalameh, IRANYekanX, Tahoma, sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: var(--oten-ink);
}

.oten-review__rate {
	display: flex;
	align-items: center;
	gap: 4px;
	margin-bottom: 16px;
}

.oten-review__rate-input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.oten-review__rate-star {
	display: block;
	cursor: pointer;
	color: #ddd;
	transition: color 0.15s ease, transform 0.15s ease;
}

.oten-review__rate-icon {
	display: block;
	width: 28px;
	height: 28px;
}

.oten-review__rate-star:hover,
.oten-review__rate-star:hover ~ .oten-review__rate-star,
.oten-review__rate-input:checked + .oten-review__rate-star,
.oten-review__rate-input:checked ~ .oten-review__rate-star {
	color: #f5a623;
}

.oten-review__rate-input:focus-visible + .oten-review__rate-star {
	outline: 2px solid var(--oten-brand);
	outline-offset: 2px;
}

.oten-review__field {
	display: block;
	margin-bottom: 16px;
}

.oten-review__textarea {
	box-sizing: border-box;
	width: 100%;
	border: 1px solid #e5e5e5;
	padding: 12px 14px;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	line-height: 1.9;
	color: var(--oten-ink);
	resize: vertical;
}

.oten-review__textarea::placeholder {
	color: #aaa;
}

.oten-review__textarea:focus {
	outline: none;
	border-color: var(--oten-brand);
}

.oten-review__submit.is-loading {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	pointer-events: none;
}

.oten-review__submit.is-loading::before {
	content: '';
	display: block;
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	border: 2px solid rgba(255, 255, 255, 0.35);
	border-top-color: #fff;
	border-radius: 50%;
	animation: oten-review-spin 0.7s linear infinite;
}

@keyframes oten-review-spin {
	to {
		transform: rotate(360deg);
	}
}

.oten-review__login-hint {
	margin: 20px 0 0;
	padding-top: 20px;
	border-top: 1px solid #eee;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	color: #898989;
	text-align: center;
}

.oten-review__login-hint a {
	color: var(--oten-brand);
	font-weight: 500;
}

/* Buy box (desktop sidebar / mobile sticky bar share the same price markup) */
.oten-single-product__buybox {
	display: none;
}

.oten-single-product__discount-row {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
}

.oten-single-product__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	padding: 2px 6px;
	border-radius: 4px;
	background: #e3352b;
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 11px;
	font-weight: 700;
	color: #fff;
	white-space: nowrap;
}

.oten-single-product__old-price {
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 12px;
	color: #9a9a9a;
	text-decoration: line-through;
	white-space: nowrap;
}

.oten-single-product__price-row {
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	justify-content: flex-start;
	gap: 4px;
	margin-top: 4px;
}

.oten-single-product__price-currency-icon {
	display: block;
	flex-shrink: 0;
	width: 14px;
	height: 14px;
}

.oten-single-product__price-value {
	font-family: Kalameh, IRANYekanX, Tahoma, sans-serif;
	font-size: 18px;
	font-weight: 700;
	color: var(--oten-ink);
	white-space: nowrap;
}

.oten-single-product__add-to-cart-form {
	display: contents;
}

.oten-single-product__cta {
	position: relative;
	display: block;
	width: 100%;
	margin-top: 12px;
	padding: 12px 16px;
	border: 0;
	border-radius: 4px;
	background: var(--oten-brand);
	font-family: IRANYekanX, Tahoma, sans-serif;
	font-size: 13px;
	font-weight: 500;
	color: #fff;
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.oten-single-product__cta:hover,
.oten-single-product__cta:focus-visible {
	background: var(--oten-brand-dark);
}

.oten-single-product__cta:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.oten-single-product__cta:disabled:hover,
.oten-single-product__cta:disabled:focus-visible {
	background: var(--oten-brand);
}

.oten-single-product__cta:focus-visible {
	outline: 2px solid var(--oten-brand-dark);
	outline-offset: 2px;
}

.oten-single-product__cta.is-loading {
	color: transparent;
	pointer-events: none;
	cursor: wait;
}

.oten-single-product__cta.is-loading::after {
	content: '';
	position: absolute;
	inset-block-start: 50%;
	inset-inline-start: 50%;
	width: 18px;
	height: 18px;
	margin-block-start: -9px;
	margin-inline-start: -9px;
	border: 2px solid rgba(255, 255, 255, 0.35);
	border-block-start-color: #fff;
	border-radius: 50%;
	animation: oten-single-product-cta-spin 0.7s linear infinite;
}

/* The review submit button carries both .oten-single-product__cta and
   .oten-review__submit, so it has its own loading style (visible text +
   spinner via ::before) — cancel the generic cta one above so the two
   don't both draw a spinner at once. */
.oten-single-product__cta.oten-review__submit.is-loading {
	color: #fff;
}

.oten-single-product__cta.oten-review__submit.is-loading::after {
	content: none;
}

@keyframes oten-single-product-cta-spin {
	to {
		transform: rotate(360deg);
	}
}

/* Related products */
.oten-single-product__related {
	margin-top: 32px;
}

/* Mobile sticky bar */
.oten-single-product__mobile-bar {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 20;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 16px;
	background: #fff;
	box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.08);
}

.oten-single-product__mobile-price {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 3px;
	flex-shrink: 0;
}

.oten-single-product__mobile-price .oten-single-product__discount-row {
	gap: 6px;
}

.oten-single-product__mobile-bar .oten-single-product__price-row {
	margin-top: 0;
}

.oten-single-product__cta--mobile {
	width: auto;
	flex: 0 1 auto;
	min-width: 130px;
	max-width: 200px;
	margin-top: 0;
}

@media (max-width: 767px) {
	.oten-single-product.oten-single-product--bundle {
		padding-bottom: 112px;
		background: #fafafa;
	}

	.oten-single-product--bundle .oten-single-product__breadcrumb {
		padding-inline: 24px;
	}

	.oten-single-product--bundle .oten-single-product__layout {
		padding-inline: 24px;
	}

	.oten-single-product--bundle .oten-single-product__gallery-main {
		aspect-ratio: 1;
	}

	.oten-single-product--bundle .oten-single-product__gallery-thumbs {
		gap: 12px;
		margin-top: 12px;
	}

	.oten-single-product--bundle .oten-single-product__gallery-thumb {
		width: 82px;
		height: 82px;
	}

	.oten-single-product--bundle .oten-single-product__info {
		margin-top: 18px;
	}

	.oten-single-product--bundle .oten-single-product__title {
		margin-bottom: 22px;
		font-size: 18px;
		line-height: 1.55;
	}

	.oten-single-product--bundle .oten-single-product__row {
		margin-bottom: 26px;
	}

	.oten-single-product--bundle .oten-single-product__row-label,
	.oten-single-product--bundle .oten-single-product__size-guide {
		font-size: 14px;
	}

	.oten-single-product--bundle .oten-single-product__swatch {
		width: 25px;
		height: 25px;
	}

	.oten-single-product--bundle .oten-single-product__sizes {
		flex-wrap: nowrap;
		width: auto;
		gap: 8px;
	}

	.oten-single-product--bundle .oten-single-product__size-btn {
		flex: 0 0 42px;
		min-width: 42px;
		height: 36px;
		padding-inline: 6px;
		font-size: 12px;
	}

	.oten-single-product--bundle .oten-bundle {
		gap: 0;
		margin: 0;
		background: #fff;
	}

	.oten-single-product--bundle .oten-bundle-item {
		display: grid;
		grid-template-columns: 72px minmax(0, 1fr);
		grid-template-areas:
			"media body"
			"sizes sizes"
			"side side";
		align-items: start;
		gap: 12px 14px;
		padding: 16px 12px;
		border: 0;
		border-bottom: 1px solid #eee;
	}

	.oten-single-product--bundle .oten-bundle-item__media {
		grid-area: media;
	}

	.oten-single-product--bundle .oten-bundle-item__image {
		width: 64px;
		height: 80px;
	}

	.oten-single-product--bundle .oten-bundle-item__body {
		grid-area: body;
		width: 100%;
	}

	.oten-single-product--bundle .oten-bundle-item__title {
		margin-bottom: 8px;
		font-size: 14px;
		line-height: 1.5;
	}

	.oten-single-product--bundle .oten-bundle-item__summary {
		font-size: 12px;
	}

	.oten-single-product--bundle .oten-bundle-item__row {
		gap: 8px;
		margin-bottom: 6px;
	}

	.oten-single-product--bundle .oten-bundle-item__row--size {
		grid-area: sizes;
		display: block;
		width: 100%;
		margin: 0;
	}

	.oten-single-product--bundle .oten-bundle-item__sizes {
		display: flex;
		flex-wrap: nowrap;
		gap: 6px;
		width: auto;
	}

	.oten-single-product--bundle .oten-bundle-item__size-btn {
		flex: 0 0 40px;
		min-width: 40px;
		height: 28px;
		padding-inline: 4px;
		font-size: 10px;
		border-color: transparent;
		background: #f5f5f5;
	}

	.oten-single-product--bundle .oten-bundle-item__size-btn.is-active {
		background: var(--oten-black);
	}

	.oten-single-product--bundle .oten-bundle-item__side {
		grid-area: side;
		width: 100%;
		flex-direction: row-reverse;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		text-align: initial;
	}

	.oten-single-product--bundle .oten-single-product__details {
		margin-top: 8px;
	}

	.oten-single-product--bundle .oten-single-product__mobile-bar {
		min-height: 92px;
		gap: 16px;
		padding: 18px 24px;
	}

	.oten-single-product--bundle .oten-single-product__cta--mobile {
		flex: 0 0 52%;
		min-width: 0;
		max-width: none;
		height: 52px;
		padding-inline: 12px;
	}
}

@media (min-width: 768px) and (max-width: 1439px) {
	.oten-single-product--bundle .oten-bundle {
		gap: 0;
		margin: 0;
		background: #fff;
	}

	.oten-single-product--bundle .oten-bundle-item {
		display: grid;
		grid-template-columns: 86px minmax(0, 1fr);
		grid-template-areas:
			"media body"
			"sizes sizes"
			"side side";
		align-items: start;
		min-height: 0;
		padding: 20px 16px;
		border: 0;
		border-bottom: 1px solid #e5e5e5;
		gap: 12px 18px;
	}

	.oten-single-product--bundle .oten-bundle-item:first-child {
		border-top: 0;
	}

	.oten-single-product--bundle .oten-bundle-item__media {
		grid-area: media;
	}

	.oten-single-product--bundle .oten-bundle-item__image {
		width: 86px;
		height: 86px;
	}

	.oten-single-product--bundle .oten-bundle-item__body {
		grid-area: body;
		width: 100%;
	}

	.oten-single-product--bundle .oten-bundle-item__title {
		margin-bottom: 6px;
		font-size: 18px;
	}

	.oten-single-product--bundle .oten-bundle-item__summary {
		font-size: 14px;
	}

	.oten-single-product--bundle .oten-bundle-item__row--size {
		grid-area: sizes;
		margin: 0;
	}

	.oten-single-product--bundle .oten-bundle-item__sizes {
		display: flex;
		flex-wrap: nowrap;
		gap: 8px;
		width: 100%;
	}

	.oten-single-product--bundle .oten-bundle-item__size-btn {
		flex: 0 0 46px;
		height: 32px;
		border-color: transparent;
		background: #f5f5f5;
	}

	.oten-single-product--bundle .oten-bundle-item__size-btn.is-active {
		background: var(--oten-black);
	}

	.oten-single-product--bundle .oten-bundle-item__side {
		grid-area: side;
		width: 100%;
		flex-direction: row-reverse;
		align-items: center;
		justify-content: space-between;
		gap: 20px;
		text-align: initial;
	}
}

@media (min-width: 768px) {
	.oten-single-product {
		padding-bottom: 0;
	}

	.oten-single-product__breadcrumb {
		padding: 20px 0;
		width: min(1476px, calc(100% - 60px));
		margin-inline: auto;
	}

	.oten-single-product__breadcrumb-link,
	.oten-single-product__breadcrumb-current,
	.oten-single-product__breadcrumb-sep {
		font-size: 14px;
	}

	.oten-single-product__layout {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 340px;
		grid-template-areas:
			"gallery info buybox"
			"details details .";
		align-items: start;
		gap: 40px;
		width: min(1476px, calc(100% - 60px));
		margin-inline: auto;
		padding: 0;
	}

	.oten-single-product:not(.oten-single-product--bundle) .oten-single-product__layout {
		align-items: stretch;
	}

	.oten-single-product__gallery {
		grid-area: gallery;
	}

	.oten-single-product--bundle .oten-single-product__gallery-main {
		aspect-ratio: 311 / 381;
	}

	/* Simple products: the aspect-ratio lives on the grid item itself
	   (.gallery, not the image inside it) so it renders at a consistent
	   size no matter what resolution the source photo is — the ratio
	   only sets its "natural" size for the row's height calculation;
	   align-items: stretch (above) then resizes the box to match the
	   info column when that's taller, and the image (width/height:
	   100%, object-fit: cover, from the base rules) always fills the
	   box edge-to-edge, so its bottom lines up with the bottom of the
	   thumbnail strip regardless of the photo's own size. The box fills
	   the full gallery column width, same as before. */
	.oten-single-product:not(.oten-single-product--bundle) .oten-single-product__gallery {
		aspect-ratio: 311 / 381;
	}

	.oten-single-product:not(.oten-single-product--bundle) .oten-single-product__gallery-main {
		width: 100%;
		height: 100%;
	}

	.oten-single-product__gallery-thumbs {
		margin-top: 16px;
	}

	.oten-single-product__gallery-thumb {
		width: 88px;
		height: 88px;
	}

	.oten-single-product:not(.oten-single-product--bundle) .oten-single-product__gallery-thumb {
		width: 128px;
		height: 128px;
	}

	/* At narrower desktop widths the info column isn't always wide enough
	   for every enlarged thumbnail in a single row — wrap instead of
	   overflowing. The strip is still pinned to the bottom via
	   margin-top: auto regardless of how many rows it takes.
	   justify-content: flex-start (not flex-end!) is what packs the
	   thumbnails against the right edge here, since the container is
	   RTL — flex-end would pack them to the left, opening a gap on the
	   right, next to the main image, instead of closing it. */
	.oten-single-product:not(.oten-single-product--bundle) .oten-single-product__info .oten-single-product__gallery-thumbs {
		flex-wrap: wrap;
		justify-content: flex-start;
	}

	/* Desktop: thumbnail strip moves back to the end (order: -1 is a
	   mobile-only reorder) and gets pinned to the bottom of the info
	   column so it lines up with the bottom of the main image (the row
	   is stretched to equal height above). */
	.oten-single-product:not(.oten-single-product--bundle) .oten-single-product__info .oten-single-product__gallery-thumbs {
		order: 0;
		margin-top: auto;
		margin-bottom: 0;
		padding-top: 24px;
	}

	.oten-single-product:not(.oten-single-product--bundle) .oten-single-product__details {
		grid-area: details;
	}

	.oten-single-product__info {
		grid-area: info;
		margin-top: 0;
	}

	.oten-single-product__title {
		font-size: 24px;
	}

	.oten-single-product__row-label {
		font-size: 15px;
	}

	.oten-single-product__swatch {
		width: 28px;
		height: 28px;
	}

	.oten-single-product__size-btn {
		min-width: 48px;
		height: 44px;
		font-size: 14px;
	}

	.oten-single-product__size-guide {
		gap: 8px;
		font-size: 14px;
	}

	.oten-single-product__size-guide-icon {
		width: 19px;
		height: 17px;
	}

	.oten-bundle {
		gap: 0;
		margin-top: 26px;
		margin-bottom: 0;
	}

	.oten-bundle-item {
		min-height: 174px;
		padding: 24px 28px;
		border-width: 0 0 1px;
		gap: 16px;
	}

	.oten-bundle-item:first-child {
		border-top: 1px solid #eee;
	}

	.oten-bundle-item__image {
		width: 86px;
		height: 110px;
	}

	.oten-bundle-item__title {
		font-size: 15px;
		margin-bottom: 10px;
	}

	.oten-bundle-item__side {
		align-self: stretch;
		justify-content: space-between;
	}

	.oten-bundle-item__view,
	.oten-bundle-item__price {
		font-size: 14px;
	}

	.oten-single-product__tabs {
		font-size: 15px;
	}

	.oten-single-product__feature-item {
		font-size: 14px;
	}

	.oten-single-product__buybox {
		grid-area: buybox;
		display: block;
		align-self: stretch;
		position: relative;
	}

	.oten-single-product__buybox-inner {
		position: sticky;
		top: 24px;
		padding: 24px;
		background: #fff;
	}

	.oten-single-product__buybox .oten-single-product__old-price {
		font-size: 14px;
	}

	.oten-single-product__buybox .oten-single-product__price-currency-icon {
		width: 18px;
		height: 18px;
	}

	.oten-single-product__buybox .oten-single-product__price-value {
		font-size: 26px;
	}

	.oten-single-product__buybox .oten-single-product__cta {
		font-size: 15px;
		padding: 14px 16px;
	}

	.oten-single-product__related {
		margin-top: 48px;
	}

	.oten-single-product__mobile-bar {
		display: none;
	}

}

@media (min-width: 768px) and (max-width: 1199px) {
	.oten-single-product--bundle .oten-single-product__layout {
		display: flex;
		flex-direction: column;
		gap: 24px;
		width: auto;
		padding: 0 24px;
	}

	.oten-single-product--bundle .oten-single-product__gallery,
	.oten-single-product--bundle .oten-single-product__info,
	.oten-single-product--bundle .oten-bundle,
	.oten-single-product--bundle .oten-single-product__details {
		width: 100%;
	}

	.oten-single-product--bundle .oten-single-product__buybox {
		display: none;
	}

	.oten-single-product--bundle .oten-single-product__mobile-bar {
		display: flex;
	}
}

@media (min-width: 1200px) and (max-width: 1439px) {
	.oten-single-product--bundle .oten-single-product__breadcrumb,
	.oten-single-product--bundle .oten-single-product__layout {
		width: calc(100% - 64px);
		max-width: 1136px;
	}

	.oten-single-product--bundle .oten-single-product__layout {
		grid-template-columns: minmax(340px, 0.95fr) minmax(380px, 1.1fr) minmax(300px, 0.85fr);
		grid-template-areas:
			"gallery info buybox"
			"gallery bundle bundle"
			"details details details";
		gap: 24px;
	}

	.oten-single-product--bundle .oten-bundle {
		grid-area: bundle;
	}

	.oten-single-product--bundle .oten-bundle-item {
		grid-template-columns: 86px minmax(0, 1fr) 190px;
		grid-template-areas:
			"media body side"
			"sizes sizes side";
	}

	.oten-single-product--bundle .oten-bundle-item__side {
		width: auto;
		align-self: stretch;
	}

	.oten-single-product--bundle .oten-single-product__details {
		grid-area: details;
	}
}

@media (min-width: 1440px) {
	.oten-single-product--bundle .oten-single-product__breadcrumb,
	.oten-single-product--bundle .oten-single-product__layout {
		width: calc(100% - 96px);
		max-width: 1344px;
	}

	.oten-single-product--bundle .oten-single-product__layout {
		grid-template-columns: 420px 500px 376px;
		grid-template-areas:
			"gallery info buybox"
			"gallery bundle bundle"
			"details details details";
		column-gap: 24px;
		row-gap: 24px;
	}

	.oten-single-product--bundle .oten-single-product__info {
		margin-top: 4px;
		padding-inline: 8px;
	}

	.oten-single-product--bundle .oten-bundle-config {
		padding: 0 0 52px;
	}

	.oten-single-product--bundle .oten-single-product__title {
		margin-bottom: 34px;
		font-size: 22px;
		line-height: 1.5;
	}

	.oten-single-product--bundle .oten-single-product__row {
		margin-bottom: 34px;
	}

	.oten-single-product--bundle .oten-single-product__row--size {
		margin-bottom: 0;
	}

	.oten-single-product--bundle .oten-single-product__size-head {
		margin-bottom: 20px;
	}

	.oten-single-product--bundle .oten-single-product__sizes {
		gap: 8px;
	}

	.oten-single-product--bundle .oten-single-product__size-btn {
		min-width: 52px;
		height: 40px;
		border-color: transparent;
		background: #f5f5f5;
	}

	.oten-single-product--bundle .oten-single-product__size-btn.is-active {
		background: var(--oten-black);
	}

	.oten-single-product--bundle .oten-bundle {
		grid-area: bundle;
		gap: 0;
		margin: 0;
		background: #fff;
	}

	.oten-single-product--bundle .oten-bundle-item {
		display: grid;
		grid-template-columns: 120px minmax(0, 1fr) 210px;
		grid-template-areas:
			"media body side"
			"sizes sizes side";
		align-items: start;
		min-height: 220px;
		padding: 36px 42px;
		border-width: 0 0 1px;
		gap: 28px;
	}

	.oten-single-product--bundle .oten-bundle-item:first-child {
		border-top: 0;
	}

	.oten-single-product--bundle .oten-bundle-item__media {
		grid-area: media;
	}

	.oten-single-product--bundle .oten-bundle-item__image {
		width: 120px;
		height: 136px;
	}

	.oten-single-product--bundle .oten-bundle-item__body {
		grid-area: body;
		width: auto;
	}

	.oten-single-product--bundle .oten-bundle-item__summary {
		font-size: 14px;
	}

	.oten-single-product--bundle .oten-bundle-item__row--size {
		grid-area: sizes;
		margin: 0;
	}

	.oten-single-product--bundle .oten-bundle-item__title {
		font-size: 18px;
	}

	.oten-single-product--bundle .oten-bundle-item__row-label,
	.oten-single-product--bundle .oten-bundle-item__size-btn {
		font-size: 12px;
	}

	.oten-single-product--bundle .oten-bundle-item__side {
		grid-area: side;
		align-self: stretch;
		justify-content: space-between;
	}

	.oten-single-product--bundle .oten-bundle-item__view,
	.oten-single-product--bundle .oten-bundle-item__price {
		font-size: 16px;
	}

	.oten-single-product--bundle .oten-single-product__details {
		grid-area: details;
	}

	.oten-single-product--bundle .oten-single-product__tabs {
		justify-content: flex-start;
		gap: 56px;
	}

	.oten-single-product--bundle .oten-single-product__buybox-inner {
		padding: 28px;
		border: 0;
	}
}

@media (min-width: 1200px) {
	.oten-single-product--bundle .oten-bundle-item__side {
		flex-direction: column;
		align-items: flex-end;
		justify-content: space-between;
	}

	.oten-single-product--bundle .oten-bundle-item__price {
		order: -1;
		font-size: 20px;
		font-weight: 400;
	}

	.oten-single-product--bundle .oten-bundle-item__price-icon {
		width: 18px;
		height: 18px;
	}

	.oten-single-product--bundle .oten-bundle-item__view {
		order: 1;
		font-size: 16px;
	}

	.oten-single-product--bundle .oten-bundle-item__view-icon {
		width: 16px;
		height: 16px;
	}
}

/* Size guide popup */
.oten-size-guide-modal {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}

.oten-size-guide-modal[hidden] {
	display: none;
}

.oten-size-guide-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
}

.oten-size-guide-modal__box {
	position: relative;
	z-index: 1;
	max-width: 480px;
	max-height: 90vh;
	overflow: auto;
	background: #fff;
	border-radius: 8px;
	padding: 40px 16px 16px;
}

.oten-size-guide-modal__close {
	position: absolute;
	top: 10px;
	left: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 0;
	border-radius: 50%;
	background: #f5f5f5;
	color: var(--oten-ink);
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.oten-size-guide-modal__close:hover,
.oten-size-guide-modal__close:focus-visible {
	background: #e5e5e5;
}

.oten-size-guide-modal__image {
	display: block;
	width: 100%;
	height: auto;
}
