/* Product detail page. */

.nt-pdp {
	display: grid;
	grid-template-columns: minmax(0, 480fr) minmax(0, 420fr);
	grid-template-areas: "gallery summary" "directions summary";
	grid-template-rows: auto 1fr;
	gap: 24px 56px;
	padding-top: 40px;
	padding-bottom: 64px;
}
.nt-pdp__gallery { grid-area: gallery; min-width: 0; }
.nt-pdp__directions { grid-area: directions; align-self: start; min-width: 0; }
.nt-pdp__summary { grid-area: summary; min-width: 0; }
.nt-pdp__title { font-size: 42px; line-height: 1.15; margin: 0 0 10px; }
.nt-pdp__desc { color: var(--nt-text-2); margin-bottom: 20px; }
.nt-pdp__desc p:last-child { margin: 0; }
.nt-pdp__buy > * + * { margin-top: 16px; }
.nt-pdp__buy > .nt-btn--quick { margin-top: 12px; }

.nt-price-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; margin: 0 0 16px; }
.nt-price-row__note { color: var(--nt-muted); font-size: 15px; }

/* Gallery */
.nt-gallery__main { position: relative; }
.nt-gallery__stage {
	position: relative; aspect-ratio: 1 / 1; overflow: hidden;
	background: var(--nt-light); border-radius: var(--nt-radius-lg);
	display: flex; align-items: center; justify-content: center;
}
.nt-gallery__img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; transform-origin: center; }
.nt-gallery__stage:hover .nt-gallery__img.is-active { transform: scale(1.12); }
.nt-gallery__stage .nt-bottle { transition: transform .45s ease; }
.nt-gallery__stage:hover .nt-bottle { transform: scale(1.12); }
.nt-gallery__arrow {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
	width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--nt-border-2);
	background: var(--nt-white); color: var(--nt-navy); display: inline-flex; align-items: center; justify-content: center;
	transition: background var(--nt-ease);
}
.nt-gallery__arrow:hover { background: var(--nt-surface); }
.nt-gallery__arrow--prev { left: 14px; }
.nt-gallery__arrow--next { right: 14px; }
.nt-gallery__counter {
	position: absolute; right: 14px; bottom: 14px; z-index: 2;
	padding: 4px 12px; border-radius: var(--nt-radius-pill); background: var(--nt-white); color: var(--nt-navy);
	font-family: var(--nt-font-head); font-size: 13px; font-weight: 600;
}
.nt-gallery__thumbs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.nt-gallery__thumb {
	padding: 0; border: 2px solid transparent; border-radius: 14px; overflow: hidden; background: var(--nt-light);
	aspect-ratio: 1 / 1; transition: border-color var(--nt-ease);
}
.nt-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.nt-gallery__thumb:hover { border-color: var(--nt-border-2); }
.nt-gallery__thumb.is-active { border-color: var(--nt-blue); }

/* Spec box */
.nt-specs {
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 0;
	border: 1px solid var(--nt-border); border-radius: 14px; background: var(--nt-surface); overflow: hidden;
}
.nt-specs__item { padding: 12px 16px; border-bottom: 1px solid var(--nt-border); }
.nt-specs__item:nth-child(odd) { border-right: 1px solid var(--nt-border); }
.nt-specs__item:nth-last-child(-n+2):nth-child(odd), .nt-specs__item:last-child { border-bottom: 0; }
.nt-specs dt { font-family: var(--nt-font-head); font-size: 13px; font-weight: 600; color: var(--nt-muted); }
.nt-specs dd { margin: 0; font-family: var(--nt-font-head); font-weight: 700; color: var(--nt-navy); font-size: 15px; }

/* Bundles */
.nt-bundles { border: 0; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; }
.nt-bundles__legend { font-family: var(--nt-font-head); font-weight: 700; font-size: 15px; color: var(--nt-navy); margin-bottom: 10px; padding: 0; }
.nt-bundle {
	display: flex; align-items: center; gap: 12px; position: relative;
	padding: 14px 16px; min-height: 64px; cursor: pointer;
	border: 1px solid var(--nt-border-2); border-radius: 14px; background: var(--nt-white);
	transition: border-color var(--nt-ease), background var(--nt-ease);
}
.nt-bundle:hover { border-color: var(--nt-blue); }
.nt-bundle.is-selected { border: 2px solid var(--nt-blue); background: var(--nt-surface); padding: 13px 15px; }
.nt-bundle__radio { position: absolute; opacity: 0; width: 1px; height: 1px; }
.nt-bundle:has(.nt-bundle__radio:focus-visible) { outline: 2px solid var(--nt-blue); outline-offset: 2px; }
.nt-bundle__dot { flex: none; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--nt-border-2); background: var(--nt-white); position: relative; }
.nt-bundle.is-selected .nt-bundle__dot { border-color: var(--nt-blue); }
.nt-bundle.is-selected .nt-bundle__dot::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--nt-blue); }
.nt-bundle__main { display: flex; flex-direction: column; line-height: 1.3; }
.nt-bundle__title { font-family: var(--nt-font-head); font-weight: 700; color: var(--nt-navy); font-size: 16px; }
.nt-bundle__sub { font-size: 14px; color: var(--nt-muted); }
.nt-bundle__price { margin-left: auto; display: flex; flex-direction: column; align-items: flex-end; line-height: 1.25; }
.nt-bundle__price strong { font-family: var(--nt-font-head); font-weight: 700; font-size: 17px; color: var(--nt-navy); }
.nt-bundle__price del { font-size: 13px; color: var(--nt-muted); }

.nt-buy-row { display: flex; gap: 12px; align-items: stretch; }
.nt-buy-row .nt-btn { min-height: 58px; }
.nt-stock-out { padding: 14px 16px; border-radius: 12px; background: var(--nt-surface); color: var(--nt-text-2); font-weight: 700; }

/* WhatsApp card */
.nt-wa {
	display: flex; gap: 14px; align-items: flex-start;
	padding: 18px; border: 1px solid var(--nt-border-2); border-radius: 16px; background: var(--nt-surface);
}
.nt-wa__icon { flex: none; width: 46px; height: 46px; border-radius: 12px; background: var(--nt-light); color: var(--nt-navy); display: inline-flex; align-items: center; justify-content: center; }
.nt-wa__body { flex: 1 1 auto; min-width: 0; }
.nt-wa__title { font-family: var(--nt-font-head); font-weight: 700; color: var(--nt-navy); margin: 0 0 2px; font-size: 16px; }
.nt-wa__text { margin: 0 0 12px; font-size: 15px; color: var(--nt-text-2); line-height: 1.55; }
.nt-wa__caption { margin: 8px 0 0; font-size: 13px; color: var(--nt-muted); }

.nt-info-list { margin-top: 20px; }
.nt-info-list li { font-size: 15px; }

/* Tab bar */
.nt-tabbar {
	position: sticky; top: var(--nt-header-h); z-index: 20;
	background: var(--nt-white); border-top: 1px solid var(--nt-border); border-bottom: 1px solid var(--nt-border);
}
.admin-bar .nt-tabbar { top: calc(var(--nt-header-h) + 32px); }
body:not(.nt-sticky-header) .nt-tabbar { top: 0; }
.nt-tabbar__list {
	list-style: none; margin: 0; padding: 0; display: flex; gap: 4px;
	overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.nt-tabbar__list::-webkit-scrollbar { display: none; }
.nt-tabbar__link {
	display: inline-flex; align-items: center; min-height: 52px; padding: 0 14px; white-space: nowrap;
	font-family: var(--nt-font-head); font-weight: 600; font-size: 14px; color: var(--nt-text-2); text-decoration: none;
	border-bottom: 2px solid transparent; transition: color var(--nt-ease), border-color var(--nt-ease);
}
.nt-tabbar__link:hover { color: var(--nt-navy); }
.nt-tabbar__link.is-active { color: var(--nt-navy); border-bottom-color: var(--nt-blue); }

/* Info sections */
.nt-info { padding: 56px 0; border-bottom: 1px solid var(--nt-border); scroll-margin-top: calc(var(--nt-header-h) + 60px); }
.nt-info:last-child { border-bottom: 0; }
.nt-info__grid { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 24px 56px; }
.nt-info__title { margin: 0; font-size: 30px; }
.nt-info__toggle { pointer-events: none; padding: 0; min-height: 0; font-size: 30px; font-weight: 700; line-height: 1.2; cursor: default; }
.nt-info__toggle .nt-pm { display: none; }
.nt-info__body { min-width: 0; }
.nt-info__body > * + * { margin-top: 20px; }

.nt-tiles { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.nt-tile {
	display: flex; align-items: center; gap: 12px; padding: 16px; border: 1px solid var(--nt-border); border-radius: 14px;
	font-family: var(--nt-font-head); font-weight: 600; color: var(--nt-navy); font-size: 15px;
}
.nt-tile .nt-icon-tile { margin: 0; }

/* Supplement facts */
.nt-facts { border: 2px solid var(--nt-navy); border-radius: 14px; padding: 20px; max-width: 620px; }
.nt-facts__title { font-family: var(--nt-font-head); font-weight: 700; font-size: 24px; color: var(--nt-navy); margin: 0 0 6px; border-bottom: 6px solid var(--nt-navy); padding-bottom: 8px; }
.nt-facts__meta { margin: 0; font-size: 15px; }
.nt-facts__table { width: 100%; border-collapse: collapse; margin: 12px 0; font-size: 15px; }
.nt-facts__table th, .nt-facts__table td { padding: 9px 6px; border-bottom: 1px solid var(--nt-border-2); text-align: right; }
.nt-facts__table th:first-child { text-align: left; }
.nt-facts__table thead th { font-family: var(--nt-font-head); font-size: 13px; color: var(--nt-muted); border-bottom: 3px solid var(--nt-navy); }
.nt-facts__table tbody th { font-weight: 700; color: var(--nt-navy); }
.nt-facts__other, .nt-facts__note { margin: 10px 0 0; font-size: 14px; color: var(--nt-text-2); }

/* Reviews */
.nt-reviews { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 32px; }
.nt-reviews__summary { padding: 22px; background: var(--nt-surface); border-radius: 16px; align-self: start; }
.nt-reviews__avg { font-family: var(--nt-font-head); font-weight: 700; font-size: 44px; color: var(--nt-navy); line-height: 1; margin: 0 0 8px; }
.nt-reviews__avg--empty { color: var(--nt-muted); }
.nt-reviews__summary .nt-muted { font-size: 14px; margin: 6px 0 14px; }
.nt-bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.nt-bars__row { display: grid; grid-template-columns: 52px 1fr 24px; gap: 8px; align-items: center; font-size: 13px; color: var(--nt-text-2); }
.nt-bars__track { height: 8px; border-radius: 4px; background: var(--nt-border); overflow: hidden; }
.nt-bars__fill { display: block; height: 100%; background: var(--nt-blue); border-radius: 4px; }
.nt-bars__count { text-align: right; }
.nt-review-list { list-style: none; margin: 0 0 28px; padding: 0; }
.nt-review { padding: 18px 0; border-bottom: 1px solid var(--nt-border); }
.nt-review__head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-bottom: 6px; }
.nt-review__author { font-family: var(--nt-font-head); color: var(--nt-navy); }
.nt-review__date { color: var(--nt-muted); font-size: 14px; }
.nt-review__text p:last-child { margin: 0; }
.nt-reviews__empty { padding: 18px; border: 1px dashed var(--nt-border-2); border-radius: 14px; color: var(--nt-text-2); }
.nt-review-form { margin-top: 24px; padding: 24px; border: 1px solid var(--nt-border); border-radius: 16px; }
.nt-review-form .comment-form { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.nt-review-form .comment-form > * { grid-column: 1 / -1; }
.nt-review-form .comment-form-author { grid-column: 1; }
.nt-review-form .comment-form-email { grid-column: 2; }
.nt-review-form .comment-form-cookies-consent { display: flex; gap: 8px; align-items: center; font-size: 14px; color: var(--nt-text-2); }
.nt-review-form .form-submit { margin: 8px 0 0; }
.nt-star-picker { display: inline-flex; gap: 4px; }
.nt-star-picker__star {
	width: 44px; height: 44px; padding: 8px; border: 0; background: none; color: var(--nt-blue);
	display: inline-flex; align-items: center; justify-content: center; border-radius: 10px;
}
.nt-star-picker__star i { font-size: 26px; }
.nt-star-picker__star.is-on i { font-weight: 900; } /* regular star -> solid star */
.nt-star-picker__star:hover { background: var(--nt-surface); }

/* Mobile sticky bar */
.nt-sticky-buy { display: none; }

/* Quick Buy content */
.nt-qb__head { padding-right: 48px; }
.nt-qb__head .nt-h2 { font-size: 26px; margin-bottom: 6px; }
.nt-qb__head p { font-size: 15px; }
.nt-qb__summary {
	display: flex; align-items: center; gap: 14px; padding: 14px; margin: 18px 0 12px;
	background: var(--nt-surface); border: 1px solid var(--nt-border); border-radius: 14px;
}
.nt-qb__thumb { flex: none; width: 60px; height: 60px; border-radius: 12px; background: var(--nt-light); overflow: hidden; display: flex; align-items: center; justify-content: center; }
.nt-qb__thumb img { width: 100%; height: 100%; object-fit: cover; }
.nt-qb__thumb .nt-bottle { width: 90%; filter: none; }
.nt-qb__product { flex: 1 1 auto; min-width: 0; }
.nt-qb__name { margin: 0; font-family: var(--nt-font-head); font-weight: 700; color: var(--nt-navy); font-size: 15px; }
.nt-qb__variant { margin: 0; font-size: 14px; color: var(--nt-muted); }
.nt-qb__price { font-family: var(--nt-font-head); font-size: 18px; color: var(--nt-navy); white-space: nowrap; }
.nt-chips { display: flex; gap: 8px; margin: 0 0 20px; flex-wrap: wrap; }
.nt-chip {
	flex: 1 1 0; min-height: 44px; padding: 0 12px; border: 1px solid var(--nt-border-2); border-radius: 10px; background: var(--nt-white);
	font-family: var(--nt-font-head); font-weight: 600; font-size: 14px; color: var(--nt-navy); transition: all var(--nt-ease);
}
.nt-chip:hover { border-color: var(--nt-blue); }
.nt-chip[aria-pressed="true"] { border: 2px solid var(--nt-blue); background: var(--nt-surface); }
.nt-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.nt-form-grid .nt-field { grid-column: 1 / -1; }
.nt-form-grid .nt-field--half { grid-column: auto; }
.nt-qb__form .nt-totals { background: var(--nt-surface); border-radius: 14px; padding: 8px 16px; }
.nt-qb__form .nt-totals del { margin-right: 6px; font-weight: 400; color: var(--nt-muted); }
.nt-qb__form .nt-totals .is-free { color: #15803d; }
.nt-qb__consent {
	display: flex; align-items: flex-start; gap: 12px; margin: 0 0 16px; padding: 14px 16px;
	border: 1px solid var(--nt-border-2); border-radius: 14px; background: var(--nt-white);
	font-size: 15px; line-height: 1.45; color: var(--nt-text); transition: border-color var(--nt-ease), background-color var(--nt-ease);
}
.nt-qb__consent input { flex: none; margin: 1px 0 0; cursor: pointer; }
.nt-qb__consent:hover { border-color: var(--nt-blue); }
.nt-qb__consent:has(input:checked) { border-color: var(--nt-blue); background: var(--nt-surface); }
.nt-qb__consent:has(input:focus-visible) { outline: 3px solid var(--nt-blue); outline-offset: 2px; }
.nt-qb-success { text-align: center; padding: 24px 8px 8px; }
.nt-qb-success__icon { display: inline-flex; width: 76px; height: 76px; border-radius: 50%; background: var(--nt-light); color: var(--nt-navy); align-items: center; justify-content: center; margin-bottom: 16px; }
.nt-qb-success .nt-h2 { font-size: 26px; }
.nt-qb-success .nt-h2:focus { outline: none; }
.nt-qb-success p { color: var(--nt-text-2); max-width: 420px; margin: 0 auto 22px; }

/* ---------- Mobile ---------- */
@media (max-width: 860px) {
	.nt-pdp { display: flex; flex-direction: column; gap: 0; padding-top: 16px; padding-bottom: 32px; }
	.nt-pdp__summary { display: contents; }
	.nt-pdp__gallery { order: 1; margin-bottom: 20px; }
	.nt-pdp__head { order: 2; }
	.nt-pdp__directions { order: 3; margin-bottom: 20px; }
	.nt-pdp__buy { order: 4; }
	.nt-pdp__title { font-size: 28px; }
	.nt-price--lg { font-size: 28px; }

	.nt-gallery__stage { border-radius: 20px; }
	.nt-gallery__thumbs { display: flex; overflow-x: auto; gap: 10px; scrollbar-width: none; }
	.nt-gallery__thumbs::-webkit-scrollbar { display: none; }
	.nt-gallery__thumb { flex: 0 0 72px; width: 72px; height: 72px; }
	.nt-gallery__arrow { width: 40px; height: 40px; }

	.nt-info { padding: 0; scroll-margin-top: calc(var(--nt-header-h) + 56px); }
	.nt-info__grid { display: block; }
	.nt-info__title { font-size: 18px; }
	.nt-info__toggle { pointer-events: auto; cursor: pointer; min-height: 60px; padding: 16px 0; font-size: 18px; font-weight: 700; }
	.nt-info__toggle .nt-pm { display: inline-block; }
	.nt-info:not(.is-open) .nt-info__body { display: none; }
	.nt-info__body { padding-bottom: 24px; }
	.nt-tiles { grid-template-columns: 1fr; }

	.nt-reviews { grid-template-columns: 1fr; gap: 20px; }
	.nt-review-form { padding: 18px; }
	.nt-review-form .comment-form { grid-template-columns: 1fr; }
	.nt-review-form .comment-form-author, .nt-review-form .comment-form-email { grid-column: 1; }

	.single-product .nt-footer { padding-bottom: 110px; }
	.nt-sticky-buy {
		display: flex; align-items: center; gap: 12px; justify-content: space-between;
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
		background: var(--nt-white); border-top: 1px solid var(--nt-border); box-shadow: 0 -8px 24px rgba(0, 39, 89, .08);
		transform: translateY(110%); transition: transform .3s ease;
	}
	.nt-sticky-buy.is-visible { transform: none; }
	.nt-sticky-buy__info { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
	.nt-sticky-buy__title { font-size: 13px; color: var(--nt-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.nt-sticky-buy__price { font-family: var(--nt-font-head); font-size: 19px; color: var(--nt-navy); }
	.nt-sticky-buy .nt-btn { min-height: 50px; padding: 0 26px; }
}
@media (max-width: 420px) {
	.nt-form-grid { grid-template-columns: 1fr; }
	.nt-form-grid .nt-field--half { grid-column: 1 / -1; }
	.nt-bundle { gap: 10px; padding: 12px; }
	.nt-bundle.is-selected { padding: 11px; }
	.nt-bundle .nt-badge { font-size: 11px; padding: 3px 8px; }
	.nt-specs { grid-template-columns: 1fr; }
	.nt-specs__item:nth-child(odd) { border-right: 0; }
	.nt-specs__item { border-bottom: 1px solid var(--nt-border) !important; }
	.nt-specs__item:last-child { border-bottom: 0 !important; }
}
@media (max-width: 360px) {
	.nt-bundle { flex-wrap: wrap; }
	.nt-bundle__price { margin-left: 32px; flex-direction: row; gap: 8px; align-items: baseline; }
}
