/* ============================================================ *\
   Zatr — Minimal product reviews (Le Labo inspired)
   Uses the global :root tokens from dashboard.css.
\* ============================================================ */

.zr-reviews { font-family: "ModamWeb", serif; }

/* Fine, unboxed ticks using the original inactive/active indicator palette. */
.z-gender-check { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; color:rgb(241 237 233); flex-shrink:0; }
.z-gender-check.is-active { color:rgb(97 64 0); }
.z-gender-check svg { display:block; }

.zr-review {
  padding: 22px 2px;
  border-bottom: 1px solid var(--line);
}
.zr-review:first-child { border-top: 1px solid var(--line); }
.zr-review-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 10px;
  gap: 16px;
}
.zr-review-author { font-size: 13px; color: var(--ink); }
.zr-review-date { font-size: 11px; color: var(--muted); white-space: nowrap; }
.zr-review-body { font-size: 14px; line-height: 2; color: var(--sub); font-weight: 300; margin: 0; }

.zr-reviews-empty {
  font-size: 13px; color: var(--muted);
  padding: 10px 2px; line-height: 2;
}

.zr-form { max-width: 640px; }
.zr-form label {
  display: block;
  font-size: 11px; color: var(--muted);
  margin-bottom: 10px;
}
.zr-form textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 0;
  background: #fff;
  padding: 14px 16px;
  font-family: "ModamWeb", serif;
  font-size: 14px;
  color: var(--ink);
  line-height: 1.9;
  resize: vertical;
  min-height: 120px;
  transition: border-color 0.2s ease;
}
.zr-form textarea:focus { outline: none; border-color: var(--ink); }

.zr-btn {
  display: inline-flex; align-items: center; justify-content: center;
  margin-top: 18px;
  background: #11110f; color: #fff;
  border: 1px solid #11110f; border-radius: 0;
  box-shadow: none;
  font-weight: 400;
  padding: 13px 38px;
  font-family: "ModamWeb", serif;
  font-size: 12px; text-transform: uppercase;
  cursor: pointer; text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease;
}
.zr-btn:hover { background: #292927; border-color: #292927; color: #fff; }
.zr-btn:focus-visible { outline: 2px solid #11110f; outline-offset: 3px; }

/* ============================================================ *\
   Product detail — lower section (specs / notes / accordions)
   Bring oversized, heavy fonts in line with the minimal theme.
\* ============================================================ */

/* spec rows: muted lighter label, balanced value */
#tab-specs dt {
  font-size: 13px !important;
  font-weight: 400 !important;
}
#tab-specs dl { font-size: 13.5px !important; font-weight: 300 !important; }

/* accordion section titles (توضیحات تکمیلی / مشخصات / نت ها / آرای زطر) */
#tab-specs h6 { font-size: 17px !important; font-weight: 500 !important; }

/* متن قدیمیِ طولانی محصول و آکاردئون تکراری آن از صفحهٔ فروش حذف شده‌اند؛
   محتوا همچنان برای مدیریت در ادمین نگه‌داری می‌شود. */
.zatr-product-extra-details { display: none !important; }
.zatr-product-summary .product-details-actions { display: none !important; }

.product-english-name {
    color: #3d3a36;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    margin: 0;
    text-align: left;
}

/* Preserve the original price baseline while long titles wrap tightly. */
.z-product-title-price { display:grid; grid-template-columns:minmax(0, 1fr) max-content; gap:16px; align-items:start; direction:rtl; }
.product-single .z-product-title-price > .product-title {
    margin-left: 0;
    margin-right: 0;
    overflow: visible;
    overflow-wrap: anywhere;
    line-height: 1.3;
}
.product-single .product-head .z-product-title-price > .product-price {
    position: relative;
    top: 5px;
    left: auto;
    float: none;
    width: auto;
    margin-top: 0;
    text-align: left;
}
.product-single .z-product-title-price > .product-price ins,
.product-single .z-product-title-price > .product-price del { display:inline-block; white-space:nowrap; }
@media (max-width:767px) {
    .z-product-title-price { gap:12px; }
    .product-single .product-head .z-product-title-price > .product-price { top:1px; }
}

.product-identity-row {
    align-items: center;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    margin-top: 5px;
    width: 100%;
}

.product-identity-row .product-type { font-size: 14px; font-weight: 500; margin: 0; }
.product-identity-row .product-type a { color: inherit; text-decoration: none; }
.product-identity-row .product-type a:hover { opacity: .65; }

@media (max-width: 640px) {
    .product-english-name { font-size: 14px; }
    .product-identity-row { gap: 12px; margin-top: 4px; }
    .product-identity-row .product-type { font-size: 12px; }
}

.zatr-product-notes { display: flex; align-items: center; gap: clamp(14px, 2vw, 28px); padding: 0 0 24px; }
.zatr-notes-collage { flex: 0 0 min(47%, 320px); width: min(47%, 320px); }
.zatr-notes-collage__canvas { position: relative; width: 100%; aspect-ratio: 1; background: #f7f4ee; }
.zatr-note-tile { border: 1px solid #f1ede6; overflow: hidden; }
.zatr-note-tile > a { display: block; width: 100%; height: 100%; }
.zatr-note-tile > a::after { content: attr(data-note-title); position: absolute; inset: 0; z-index: 1; display: grid; place-items: center; padding: 6px; background: rgba(17, 17, 17, .34); color: #fff; font-size: 12px; font-weight: 500; line-height: 1.4; text-align: center; opacity: 0; transition: opacity .2s ease; pointer-events: none; }
.zatr-note-tile img { transition: transform .25s ease; }
.zatr-note-tile:hover > a::after,
.zatr-note-tile:focus-within > a::after { opacity: 1; }
.zatr-note-tile:hover img,
.zatr-note-tile:focus-within img { transform: scale(1.045); }
.zatr-note-more { position: absolute; left: 6px; right: auto; bottom: 6px; z-index: 2; min-width: 28px; height: 28px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; direction: ltr; unicode-bidi: isolate; background: #111; color: #fff; font-size: 11px; font-weight: 500; line-height: 1; }
.zatr-notes-copy { min-width: 0; flex: 1; }
.zatr-notes-copy > p { margin: 0 0 11px; color: #77736d; font-size: 11px; font-weight: 500; }
.zatr-notes-links { display: flex; flex-wrap: wrap; gap: 7px 8px; }
.zatr-notes-links a { color: #151515; border-bottom: 1px solid #d8d2c9; font-size: 13px; line-height: 1.65; text-decoration: none; transition: border-color .2s ease, color .2s ease; }
.zatr-notes-links a:hover { border-color: #151515; color: #77736d; }

@media (max-width: 560px) {
  .zatr-product-notes { flex-direction: column; align-items: center; gap: 9px; padding: 8px 12px 22px; }
  .zatr-notes-collage { flex: 0 0 auto; width: 260px; }
  .zatr-notes-copy { width: 100%; text-align: right; }
  .zatr-notes-links { justify-content: flex-start; }
  .zatr-notes-copy > p { margin-bottom: 8px; font-size: 10px; }
  .zatr-notes-links { gap: 4px 7px; }
  .zatr-notes-links a { font-size: 12px; }
}

@media (max-width: 767px) {
  #tab-specs dt { font-size: 12.5px !important; }
  #tab-specs dl { font-size: 13px !important; }
  #tab-specs h6 { font-size: 15px !important; }
  #tab-specs h5,
  #tab-reviews h5,
  #tab-add-review h5 {
    font-size: 16px !important;
    font-weight: 500 !important;
  }
}
