/* ==========================================================================
   My tato — product.css
   Owner: CATALOG agent (product/product, review, related, sticky buy bar).
   Use only var(--mt-…) tokens from base.css; no hex codes here (DESIGN.md §2.2).
   ========================================================================== */

/* ---------- Layout ---------- */
.mt-pdp__row { --bs-gutter-x: 0; --bs-gutter-y: 0; margin: 0; }
.mt-pdp__row > * { padding: 0; }
.mt-pdp__top {
  display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); grid-template-areas: "media info" "service info";
  grid-template-rows: auto 1fr; gap: 24px 32px; align-items: start; margin: 8px 0 40px;
}
.mt-pdp__media { grid-area: media; min-width: 0; }
.mt-pdp__info { grid-area: info; min-width: 0; }
.mt-service { grid-area: service; }
@media (max-width: 991.98px) {
  .mt-pdp__top { grid-template-columns: minmax(0, 1fr); grid-template-areas: "media" "info" "service"; grid-template-rows: none; gap: 20px; margin: 4px 0 28px; }
}
/* tablets: photo and buy box side by side, so the price and «Додати в кошик» are on the first screen */
@media (min-width: 768px) and (max-width: 991.98px) {
  .mt-pdp__top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "media info" "service info"; grid-template-rows: auto 1fr; gap: 20px 24px; }
}

/* ---------- Gallery ---------- */
.mt-gallery { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 12px; }
.mt-gallery--single { grid-template-columns: minmax(0, 1fr); }
.mt-gallery__thumbs {
  display: flex; flex-direction: column; gap: 10px; height: 0; min-height: 100%; overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: none; padding: 2px;  margin: -2px;
}
.mt-gallery__thumbs::-webkit-scrollbar { display: none; }
.mt-gallery__thumb {
  position: relative; flex: none; width: 80px; height: 80px; padding: 0; border: 0; border-radius: 12px; overflow: hidden;
  background: var(--mt-media); cursor: pointer;
}
.mt-gallery__thumb::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1.5px var(--mt-border); transition: var(--mt-transition); pointer-events: none; }
.mt-gallery__thumb:hover::after { box-shadow: inset 0 0 0 1.5px var(--mt-brand-300); }
.mt-gallery__thumb.is-active::after { box-shadow: inset 0 0 0 2.5px var(--mt-brand-500); }
.mt-gallery__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.mt-gallery__stage { position: relative; min-width: 0; aspect-ratio: 1 / 1; border-radius: var(--mt-r-xl); background: var(--mt-media); overflow: hidden; }
.mt-gallery__track {
  display: flex; height: 100%; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none;
  overscroll-behavior-x: contain; outline: none;
}
.mt-gallery__track::-webkit-scrollbar { display: none; }
.mt-gallery__slide { flex: 0 0 100%; height: 100%; scroll-snap-align: start; scroll-snap-stop: always; display: block; cursor: zoom-in; }
.mt-gallery__slide img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.mt-gallery__nophoto { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: var(--mt-muted); font: 600 var(--mt-fs-small)/1.3 var(--mt-font-body); }
.mt-gallery__nophoto i { font-size: 56px; color: var(--mt-border-strong); }
.mt-gallery__badges { position: absolute; top: 18px; left: 18px; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; pointer-events: none; }
.mt-gallery__badges .mt-badge { height: 26px; padding: 0 10px; font-size: .8125rem; }
.mt-gallery__nav, .mt-gallery__zoom {
  position: absolute; z-index: 2; display: grid; place-items: center; border: 0; border-radius: 50%;
  background: var(--mt-surface); color: var(--mt-text); box-shadow: var(--mt-sh-1); cursor: pointer; transition: var(--mt-transition);
}
.mt-gallery__nav { top: 50%; width: 44px; height: 44px; margin-top: -22px; font-size: 15px; }
.mt-gallery__nav--prev { left: 16px; }
.mt-gallery__nav--next { right: 16px; }
.mt-gallery__nav:hover:not(:disabled), .mt-gallery__zoom:hover { color: var(--mt-on-tint); box-shadow: inset 0 0 0 1.5px var(--mt-brand-300), var(--mt-sh-1); }
.mt-gallery__nav:disabled { opacity: 0; pointer-events: none; }
.mt-gallery__zoom { right: 16px; bottom: 16px; width: 46px; height: 46px; font-size: 17px; }
.mt-gallery__count {
  position: absolute; left: 16px; bottom: 16px; z-index: 2; padding: 5px 12px; border-radius: var(--mt-r-pill);
  background: rgba(255, 255, 255, .92); color: var(--mt-text-2); font: 600 var(--mt-fs-xs)/1.2 var(--mt-font-body); font-variant-numeric: tabular-nums;
}
.mt-gallery__count b { color: var(--mt-text); font-weight: 800; }
@media (max-width: 991.98px) {
  .mt-gallery { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .mt-gallery__thumbs { order: 2; flex-direction: row; height: auto; min-height: 0; overflow-x: auto; overflow-y: hidden; }
  .mt-gallery__thumb { width: 64px; height: 64px; border-radius: 10px; }
  .mt-gallery__stage { border-radius: var(--mt-r-lg); }
  .mt-gallery__nav { display: none; }
  .mt-gallery__badges { top: 14px; left: 14px; }
  .mt-gallery__count { left: 12px; bottom: 12px; }
  .mt-gallery__zoom { right: 12px; bottom: 12px; }
}
@media (max-width: 575.98px) { .mt-gallery__stage { aspect-ratio: 6 / 5; } }

/* ---------- Title, meta ---------- */
.mt-pdp__title { margin: 0 0 10px; font-size: var(--mt-fs-h2); line-height: 1.2; overflow-wrap: anywhere; }
.mt-pdp__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 0 0 18px; font: 600 var(--mt-fs-small)/1.4 var(--mt-font-body); color: var(--mt-muted); }
.mt-pdp__meta a { color: var(--mt-link); }
.mt-pdp__rating { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; text-decoration: none; }
.mt-pdp__rating i { color: var(--mt-star); font-size: 14px; }
.mt-pdp__rating b { color: var(--mt-text); font-weight: 800; }
.mt-pdp__rating span { color: var(--mt-link); text-decoration: underline; text-underline-offset: .18em; }
.mt-pdp__rating:hover span { color: var(--mt-link-hover); }
.mt-pdp__origin { display: inline-flex; align-items: center; gap: 6px; }

/* ---------- Buy box ---------- */
.mt-buybox { padding: 22px; background: var(--mt-surface); border: 1px solid var(--mt-border); border-radius: var(--mt-r-lg); box-shadow: var(--mt-sh-1); }
.mt-buybox__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; margin: 0 0 8px; font-variant-numeric: lining-nums tabular-nums; }
.mt-buybox__now { font: 800 var(--mt-fs-price-lg)/1.1 var(--mt-font-head); color: var(--mt-text); white-space: nowrap; }
.mt-buybox__now.is-sale { color: var(--mt-sale); }
.mt-buybox__old { font: 700 1.125rem/1.2 var(--mt-font-body); color: var(--mt-muted); white-space: nowrap; }
.mt-buybox__save {
  display: inline-flex; align-items: center; gap: 6px; align-self: center; height: 28px; padding: 0 10px; border-radius: var(--mt-r-pill);
  background: var(--mt-sale-50); color: var(--mt-sale-600); font: 800 .84375rem/1 var(--mt-font-body); white-space: nowrap;
}
.mt-buybox__save i { font-size: 12px; }
.mt-buybox__note { margin: 0 0 6px; font-size: var(--mt-fs-small); color: var(--mt-muted); }
.mt-buybox__discounts { margin: 8px 0 10px; padding: 10px 14px; list-style: none; border-radius: var(--mt-r-sm); background: var(--mt-surface-2); font-size: var(--mt-fs-small); color: var(--mt-text-2); }
.mt-buybox__discounts b { color: var(--mt-text); }
.mt-buybox__stock { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 0 0 18px; font: 600 var(--mt-fs-small)/1.35 var(--mt-font-body); color: var(--mt-text-2); }
.mt-buybox__avail { display: inline-flex; align-items: center; gap: 7px; color: var(--mt-text); }
.mt-buybox__avail::before { content: ''; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--mt-success); }
.mt-buybox__stock.is-order .mt-buybox__avail::before { background: var(--mt-warning); }
.mt-buybox__stock.is-out .mt-buybox__avail::before { background: var(--mt-disabled); }
.mt-buybox__ship { display: inline-flex; align-items: center; gap: 7px; }
.mt-buybox__ship i { color: var(--mt-brand-600); }
.mt-buybox__min { display: flex; gap: 8px; margin: 12px 0 0; padding: 10px 12px; border-radius: var(--mt-r-sm); background: var(--mt-warning-50); color: var(--mt-warning); font-size: var(--mt-fs-small); font-weight: 600; }
.mt-buybox__min i { margin-top: 3px; }
@media (max-width: 575.98px) { .mt-buybox { padding: 16px; border-radius: var(--mt-r-md); } }

/* ---------- Options ---------- */
.mt-opts { display: flex; flex-direction: column; gap: 18px; margin: 0 0 20px; padding-top: 18px; border-top: 1px solid var(--mt-border); }
.mt-opt { margin: 0; }
.mt-opt__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.mt-opt__label { display: block; margin: 0 0 8px; font: 700 var(--mt-fs-small)/1.3 var(--mt-font-body); color: var(--mt-text-2); }
.mt-opt__head .mt-opt__label { margin: 0; }
.mt-opt__picked { color: var(--mt-text); font-weight: 800; }
.mt-opt__sizes { font-size: var(--mt-fs-xs); white-space: nowrap; text-decoration: underline; text-underline-offset: .18em; }
.mt-opt .form-select { max-width: 420px; }
.mt-opt__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.mt-optchip { position: relative; display: flex; }
.mt-optchip__input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; pointer-events: none; }
.mt-optchip__label {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: var(--mt-r-sm);
  background: var(--mt-surface); box-shadow: inset 0 0 0 1.5px var(--mt-border-strong); color: var(--mt-text);
  font: 700 var(--mt-fs-ui)/1.2 var(--mt-font-body); cursor: pointer; transition: var(--mt-transition); -webkit-user-select: none; user-select: none;
}
.mt-optchip__label:hover { box-shadow: inset 0 0 0 1.5px var(--mt-brand-300); }
.mt-optchip__img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px var(--mt-border); }
.mt-optchip__sub { font: 600 var(--mt-fs-xs)/1.2 var(--mt-font-body); color: var(--mt-muted); }
.mt-optchip__input:checked + .mt-optchip__label { background: var(--mt-tint); box-shadow: inset 0 0 0 2px var(--mt-brand-500); color: var(--mt-on-tint); }
.mt-optchip__input:checked + .mt-optchip__label .mt-optchip__sub { color: var(--mt-on-tint); }
.mt-optchip__input:focus-visible + .mt-optchip__label { outline: 3px solid var(--mt-focus); outline-offset: 2px; }
.mt-optchip.is-out .mt-optchip__label {
  color: var(--mt-muted); cursor: not-allowed; box-shadow: inset 0 0 0 1.5px var(--mt-border); opacity: .7;
  background: repeating-linear-gradient(135deg, var(--mt-surface) 0 6px, var(--mt-bg) 6px 9px);
}
.mt-optchip.is-out .mt-optchip__name { text-decoration: line-through; }
/* size tiles */
.mt-opt__chips--size .mt-optchip__label { flex-direction: column; justify-content: center; gap: 2px; min-width: 64px; min-height: 52px; padding: 4px 14px; font-size: 1rem; font-weight: 800; }
/* errors (core adds .is-invalid to #input-option-* and shows #error-option-*) */
.mt-opt__chips.is-invalid .mt-optchip:not(.is-out) .mt-optchip__label { box-shadow: inset 0 0 0 1.5px var(--mt-danger); }
#form-product .invalid-feedback, #form-review .invalid-feedback { margin-top: 8px; font-size: var(--mt-fs-xs); font-weight: 600; color: var(--mt-danger); }
#form-product .invalid-feedback.d-block::before, #form-review .invalid-feedback.d-block::before {
  content: '\f06a'; margin-right: 6px; font: var(--fa-font-solid, normal 900 1em/1 'Font Awesome 6 Free'); font-weight: 900;
}
#error-quantity:not(:empty) { margin-top: 8px; color: var(--mt-danger); font-weight: 600; }

/* ---------- Buy row: qty · add to cart ---------- */
.mt-buyrow { display: flex; align-items: stretch; gap: 10px; }
.mt-buyrow .mt-qty { display: flex; align-items: center; flex: none; height: 52px; border-radius: var(--mt-r); background: var(--mt-surface); box-shadow: inset 0 0 0 1.5px var(--mt-border-input); }
.mt-buyrow .mt-qty__btn {
  display: grid; place-items: center; width: 44px; height: 52px; padding: 0; border: 0; border-radius: var(--mt-r);
  background: transparent; color: var(--mt-text); font-size: 14px; cursor: pointer; transition: var(--mt-transition);
}
.mt-buyrow .mt-qty__btn:hover { color: var(--mt-on-tint); background: var(--mt-tint); }
.mt-buyrow .mt-qty .mt-qty__input {
  width: 48px; height: 48px; min-height: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; box-shadow: none;
  text-align: center; font: 800 1.0625rem/1 var(--mt-font-body); font-variant-numeric: tabular-nums;
}
.mt-buyrow .mt-qty .mt-qty__input:focus { box-shadow: none; outline: 3px solid var(--mt-focus); outline-offset: -2px; }
.mt-buyrow__cart { flex: 1 1 auto; min-width: 0; min-height: 52px; }
.mt-buyrow__cart:disabled:not(.is-out) { background: var(--mt-primary); border-color: var(--mt-primary); opacity: 1; }
.mt-buyrow__cart.is-out:disabled { background: var(--mt-bg); border-color: var(--mt-bg); color: var(--mt-muted); opacity: 1; }
/* phones, and tablets where the buy box is the narrow right column: «Додати в кошик» gets its own full row */
@media (max-width: 575.98px), (min-width: 768px) and (max-width: 991.98px) {
  .mt-buyrow { flex-wrap: wrap; }
  .mt-buyrow__cart { order: 3; flex: 1 0 100%; }
  .mt-buyrow .mt-qty { flex: 1 1 auto; justify-content: space-between; }
}

.mt-buybox__aux { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; margin-top: 14px; }
.mt-buybox__help { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; color: var(--mt-text-2); font: 600 var(--mt-fs-small)/1.35 var(--mt-font-body); text-decoration: none; }
.mt-buybox__help .mt-svg { color: var(--mt-brand-600); }
.mt-buybox__help u { color: var(--mt-link); text-underline-offset: .18em; }
.mt-buybox__help:hover u { color: var(--mt-link-hover); }
.mt-buybox__compare {
  display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 4px; border: 0; background: none;
  color: var(--mt-text-2); font: 700 var(--mt-fs-small)/1.2 var(--mt-font-body); cursor: pointer;
}
.mt-buybox__compare:hover { color: var(--mt-link); text-decoration: underline; }
.mt-buybox__compare:disabled { color: var(--mt-brand-500); }
.mt-buybox__compare:disabled .fa-spin { color: var(--mt-brand-500) !important; }
@media (max-width: 575.98px) { .mt-buybox__help, .mt-buybox__compare { min-height: 44px; } }

.mt-keyspecs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 24px; margin: 18px 0 0; padding-top: 16px; border-top: 1px dashed var(--mt-border-strong); font-size: .84375rem; }
.mt-keyspecs > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; min-width: 0; }
.mt-keyspecs dt { margin: 0; font-weight: 500; color: var(--mt-muted); }
.mt-keyspecs dd { margin: 0; font-weight: 700; color: var(--mt-text); text-align: right; }
@media (max-width: 575.98px), (min-width: 768px) and (max-width: 991.98px) { .mt-keyspecs { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Service blocks ---------- */
.mt-service { margin: 0; padding: 4px 20px; list-style: none; background: var(--mt-surface); border: 1px solid var(--mt-border); border-radius: var(--mt-r-lg); }
.mt-service__item { position: relative; display: flex; align-items: flex-start; gap: 14px; padding: 14px 0; }
.mt-service__item + .mt-service__item { border-top: 1px solid var(--mt-border); }
.mt-service__ico { display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 12px; background: var(--mt-tint); color: var(--mt-brand-600); font-size: 17px; }
.mt-service__title { display: inline-block; margin: 0 0 2px; color: var(--mt-text); font: 800 .90625rem/1.3 var(--mt-font-body); text-decoration: none; }
.mt-service__title:hover { color: var(--mt-link); text-decoration: underline; }
/* the whole row is the tap target of its title link; links inside the text stay on top */
a.mt-service__title::after { content: ''; position: absolute; inset: 0; }
.mt-service__text { margin: 0; font-size: .84375rem; line-height: 1.45; color: var(--mt-text-2); }
.mt-service__text a { position: relative; z-index: 1; color: var(--mt-link); font-weight: 700; white-space: nowrap; }
@media (max-width: 575.98px) { .mt-service { padding: 2px 16px; border-radius: var(--mt-r-md); } }

/* ---------- Tabs ---------- */
.mt-pdp-tabs { margin: 0 0 8px; }
.mt-pdp-tabs .nav-tabs { border-bottom: 1px solid var(--mt-border); }
.mt-pdp-tabs .nav-tabs::-webkit-scrollbar { display: none; }
.mt-pdp-tabs .nav-link { display: inline-flex; align-items: center; gap: 6px; min-height: 48px; padding: 12px 16px; font-size: 1rem; background: none; }
.mt-pdp-tabs .nav-tabs .nav-link.active { color: var(--mt-text); background: none; }
.mt-tabcount { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: var(--mt-r-pill); background: var(--mt-surface); box-shadow: inset 0 0 0 1px var(--mt-border); color: var(--mt-text-2); font: 800 var(--mt-fs-badge)/1 var(--mt-font-body); }
.mt-pdp-tabs .nav-link.active .mt-tabcount { background: var(--mt-tint-strong); box-shadow: none; color: var(--mt-on-tint); }
.mt-pdp-tabs .tab-content { padding: 24px 0 8px; }
@media (max-width: 991.98px) {
  .mt-pdp-tabs .nav-tabs { margin-inline: calc(-1 * var(--mt-gutter)); padding-inline: calc(var(--mt-gutter) - 8px); }
  .mt-pdp-tabs .nav-link { padding: 12px 12px; }
}

/* Description */
.mt-desc { max-width: 860px; }
.mt-desc.has-aside { max-width: none; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.mt-desc__body { color: var(--mt-text-2); line-height: var(--mt-lh-loose); }
.mt-desc__body > :first-child { margin-top: 0; }
.mt-desc__body h2, .mt-desc__body h3 { margin: 24px 0 10px; color: var(--mt-text); }
.mt-desc__body h2 { font-size: var(--mt-fs-h3); }
.mt-desc__body h3 { font: 800 var(--mt-fs-h4)/1.3 var(--mt-font-body); }
.mt-desc__body ul { padding-left: 0; list-style: none; }
.mt-desc__body ul li { position: relative; margin: 6px 0; padding-left: 20px; }
.mt-desc__body ul li::before { content: ''; position: absolute; left: 4px; top: .7em; width: 6px; height: 6px; border-radius: 50%; background: var(--mt-brand-500); }
.mt-desc__body ol { padding-left: 1.25em; }
.mt-desc__body img { max-width: 100%; height: auto; border-radius: var(--mt-r-md); }
.mt-desc__body table { width: 100%; margin: 12px 0; border-collapse: collapse; font-size: var(--mt-fs-small); }
.mt-desc__body td, .mt-desc__body th { padding: 8px 12px; border: 1px solid var(--mt-border); }
.mt-desc__body a { color: var(--mt-link); }
.mt-desc__tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; font-weight: 700; color: var(--mt-text); }
.mt-desc__tags .mt-chip { min-height: 36px; text-decoration: none; color: var(--mt-text); }
@media (max-width: 991.98px) { .mt-desc__tags .mt-chip { min-height: var(--mt-tap); } }
.mt-sizehint { padding: 22px; border-radius: var(--mt-r-lg); background: var(--mt-tint); border: 1px solid var(--mt-tint-border); color: var(--mt-text-2); font-size: var(--mt-fs-small); outline: none; scroll-margin-top: 120px; }
.mt-sizehint__title { margin: 0 0 8px; font-size: var(--mt-fs-h3); }
.mt-sizehint p { margin: 0 0 10px; }
.mt-sizehint__list { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; padding: 0; list-style: none; }
.mt-sizehint__list li { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border-radius: var(--mt-r-sm); background: var(--mt-surface); color: var(--mt-text); font-weight: 800; }
.mt-sizehint__note { margin: 0 !important; }
.mt-sizehint a { color: var(--mt-link); font-weight: 700; }
@media (max-width: 991.98px) { .mt-desc.has-aside { grid-template-columns: minmax(0, 1fr); gap: 20px; } }

/* Specifications */
.mt-specs { max-width: 860px; overflow: hidden; background: var(--mt-surface); border: 1px solid var(--mt-border); border-radius: var(--mt-r-md); }
.mt-specs__table { width: 100%; margin: 0; border-collapse: collapse; font-size: .90625rem; }
.mt-specs__table th, .mt-specs__table td { padding: 12px 18px; text-align: left; vertical-align: top; border-top: 1px solid var(--mt-border); }
.mt-specs__table tbody:first-child tr:first-child > *, .mt-specs__table thead:first-child th { border-top: 0; }
.mt-specs__table tbody th { width: 38%; font-weight: 500; color: var(--mt-muted); }
.mt-specs__table td { color: var(--mt-text); font-weight: 600; }
.mt-specs__table tbody tr:nth-child(even) > * { background: var(--mt-surface-2); }
.mt-specs__table thead th { background: var(--mt-bg); color: var(--mt-text); font: 800 var(--mt-fs-h6)/1.3 var(--mt-font-body); text-transform: uppercase; letter-spacing: var(--mt-ls-caps); }
@media (max-width: 575.98px) { .mt-specs__table th, .mt-specs__table td { padding: 10px 12px; } .mt-specs__table tbody th { width: 45%; } }

/* ---------- Reviews ---------- */
.mt-reviews { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 32px; align-items: start; }
.mt-reviews__summary { position: sticky; top: calc(var(--mt-header-h) + 16px); display: flex; flex-direction: column; gap: 12px; }
.mt-rsum { padding: 22px; background: var(--mt-surface); border: 1px solid var(--mt-border); border-radius: var(--mt-r-lg); }
.mt-rsum__avg { display: flex; align-items: baseline; gap: 8px; margin: 0; }
.mt-rsum__avg b { font: 800 3.375rem/1 var(--mt-font-head); color: var(--mt-text); font-variant-numeric: lining-nums tabular-nums; }
.mt-rsum__avg span { font-weight: 700; color: var(--mt-muted); }
.mt-rsum__stars { display: flex; gap: 3px; margin: 8px 0 4px; color: var(--mt-star); font-size: 14px; }
.mt-rsum__stars .fa-regular { color: var(--mt-border-strong); }
.mt-rsum__count { margin: 0 0 14px; font-size: var(--mt-fs-small); font-weight: 600; color: var(--mt-muted); }
.mt-rsum__bars { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.mt-rsum__bars li { display: grid; grid-template-columns: 34px minmax(0, 1fr) 24px; align-items: center; gap: 10px; font: 700 var(--mt-fs-xs)/1 var(--mt-font-body); color: var(--mt-text-2); }
.mt-rsum__label { display: inline-flex; align-items: center; gap: 4px; }
.mt-rsum__label i { color: var(--mt-star); font-size: 11px; }
.mt-rsum__bar { position: relative; height: 8px; border-radius: var(--mt-r-pill); background: var(--mt-border); overflow: hidden; }
.mt-rsum__bar > span { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: var(--mt-star); }
.mt-rsum__n { text-align: right; color: var(--mt-muted); font-variant-numeric: tabular-nums; }
.mt-rsum--empty { text-align: center; color: var(--mt-text-2); font-size: var(--mt-fs-small); }
.mt-rsum--empty > i { display: block; margin: 0 auto 10px; font-size: 32px; color: var(--mt-brand-500); }
.mt-rsum--empty p { margin: 0; }
.mt-rsum__empty-title { margin-bottom: 4px !important; font: 800 var(--mt-fs-h4)/1.3 var(--mt-font-body); color: var(--mt-text); }
.mt-rsum__write { width: 100%; }

.mt-rlist { margin: 0 0 8px; padding: 0; list-style: none; }
.mt-review { padding: 18px 0; border-bottom: 1px solid var(--mt-border); }
.mt-review:first-child { padding-top: 0; }
.mt-review__head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.mt-review__avatar { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--mt-tint-strong); color: var(--mt-on-tint); font: 800 1rem/1 var(--mt-font-body); }
.mt-review__who { display: flex; flex-direction: column; min-width: 0; }
.mt-review__author { font-weight: 800; color: var(--mt-text); }
.mt-review__date { font-size: var(--mt-fs-xs); color: var(--mt-muted); }
.mt-review__stars { display: inline-flex; gap: 2px; margin-left: auto; color: var(--mt-star); font-size: 13px; }
.mt-review__stars .fa-regular { color: var(--mt-border-strong); }
.mt-review__text { margin: 0; color: var(--mt-text-2); line-height: var(--mt-lh-body); overflow-wrap: anywhere; }
.mt-rlist__pages { margin: 16px 0 8px; }
.mt-rlist__pages .pagination { justify-content: flex-start; }

.mt-reviewform { margin-top: 24px; padding: 24px; background: var(--mt-surface); border: 1px solid var(--mt-border); border-radius: var(--mt-r-lg); scroll-margin-top: 120px; }
.mt-rlist-wrap:empty + .mt-reviewform { margin-top: 0; }
.mt-reviewform__title { margin: 0 0 16px; font-size: var(--mt-fs-h3); outline: none; scroll-margin-top: 120px; }
.mt-reviewform__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 20px; }
.mt-reviewform__field { margin-bottom: 16px; }
.mt-reviewform__field .form-label { display: block; margin-bottom: 6px; }
.mt-reviewform__field.required .form-label::after { content: " *"; color: var(--mt-brand-600); font-weight: 800; }
.mt-reviewform__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.mt-reviewform__note { margin: 0; font-size: var(--mt-fs-xs); color: var(--mt-muted); }
.mt-reviewform__login { margin: 0; color: var(--mt-text-2); }
.mt-reviewform fieldset { margin: 0 0 16px; }
.mt-reviewform legend { font: 800 var(--mt-fs-h5)/1.3 var(--mt-font-body); margin-bottom: 8px; }
.mt-reviewform #captcha img { border-radius: var(--mt-r-sm); }
/* star rating input: inputs in 5→1 order, shown 1→5 */
.mt-rate { display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; align-items: center; gap: 2px; min-height: 48px; }
.mt-rate__input { position: absolute; width: 1px; height: 1px; margin: -1px; opacity: 0; overflow: hidden; clip: rect(0 0 0 0); }
.mt-rate__star { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--mt-r-sm); color: var(--mt-border-strong); font-size: 26px; cursor: pointer; transition: color var(--mt-dur-fast) var(--mt-ease), transform var(--mt-dur-fast) var(--mt-ease); }
.mt-rate__star:hover, .mt-rate__star:hover ~ .mt-rate__star, .mt-rate__input:checked ~ .mt-rate__star { color: var(--mt-star); }
.mt-rate:hover .mt-rate__input:checked ~ .mt-rate__star:not(:hover):not(:hover ~ .mt-rate__star) { color: var(--mt-border-strong); }
.mt-rate__star:active { transform: scale(.92); }
.mt-rate__input:focus-visible + .mt-rate__star { outline: 3px solid var(--mt-focus); outline-offset: -2px; }
.mt-rate__hint { order: -1; margin-left: 10px; font: 600 var(--mt-fs-small)/1.2 var(--mt-font-body); color: var(--mt-muted); white-space: nowrap; }
.mt-rate.is-set .mt-rate__hint { color: var(--mt-text); font-weight: 800; }
.mt-rate.is-invalid { border-radius: var(--mt-r-sm); box-shadow: inset 0 0 0 1.5px var(--mt-danger); padding-inline: 2px; }
@media (max-width: 991.98px) {
  .mt-reviews { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .mt-reviews__summary { position: static; }
}
@media (max-width: 575.98px) {
  .mt-reviewform { padding: 16px; border-radius: var(--mt-r-md); }
  .mt-reviewform__grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .mt-reviewform__foot .btn { width: 100%; }
  .mt-rate__star { width: 44px; font-size: 24px; }
  .mt-rate:not(.is-set) .mt-rate__hint { display: none; }
  .mt-rate__hint { margin-left: 6px; }
}

/* ---------- Related rail ---------- */
.mt-related { margin-top: 40px; }
.mt-related .mt-sec-head h2 { font-size: var(--mt-fs-h2); }

/* ---------- Mobile sticky buy bar ---------- */
.mt-buybar { display: none; }
@media (max-width: 991.98px) {
  .mt-buybar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--mt-z-buybar); display: flex; align-items: center; gap: 14px;
    padding: 10px var(--mt-gutter) calc(10px + env(safe-area-inset-bottom)); background: var(--mt-surface); box-shadow: var(--mt-sh-up);
    transform: translateY(110%); transition: transform var(--mt-dur) var(--mt-ease); visibility: hidden;
  }
  .mt-buybar.is-on { transform: none; visibility: visible; }
  .mt-buybar__price { display: flex; flex-direction: column; justify-content: center; min-width: 0; font-variant-numeric: lining-nums tabular-nums; }
  .mt-buybar__price s { font: 600 .75rem/1.2 var(--mt-font-body); color: var(--mt-muted); white-space: nowrap; }
  .mt-buybar__price b { font: 800 1.25rem/1.1 var(--mt-font-head); color: var(--mt-text); white-space: nowrap; }
  .mt-buybar__price b.is-sale { color: var(--mt-sale); }
  .mt-buybar__btn { flex: 1 1 auto; min-height: 46px; }
  .mt-buybar-on .mt-footer { padding-bottom: calc(var(--mt-buybar-h) + env(safe-area-inset-bottom)); }
}

/* Bootstrap's .btn:focus-visible sets outline: 0 (box-shadow ring only); keep the 3 px theme outline on these pages */
.mt-pdp .btn:focus-visible, .mt-buybar .mt-btn:focus-visible { outline: 3px solid var(--mt-focus); outline-offset: 2px; }