/*
 * MishiLand v15.0 — Product Page Rebuild — Stylesheet
 * =================================================================
 * Scope: فقط body.single-product. این فایل جایگزین بصری
 * mishiland-single-product-fix.css و mishiland-v14-conversion-polish.css
 * (بخش صفحه محصول) است — همان دو فایل به‌صورت شرطی روی همین صفحه
 * Dequeue شده‌اند (نگاه کنید به inc/product-v15/bootstrap.php)، پس
 * این‌جا Selectorهای آن دو را Override نمی‌کنیم، جایگزین می‌کنیم.
 * mishiland-app.css / mishiland-sticky-atc.css / mishiland-v14-reviews.css /
 * mishiland-v14-discovery.css دست‌نخورده و همچنان فعال‌اند — این فایل
 * از رنگ‌ها/فاصله‌های همان‌ها پیروی می‌کند، تکرارشان نمی‌کند.
 *
 * !important فقط جایی استفاده شده که باید یک قانون WoodMart با
 * Specificity بالا (مثلاً `.woodmart-single-product .product` ) را
 * override کند و نمی‌شود مطمئن بود Selector ما دیرتر لود می‌شود.
 */

body.single-product {
    /* ---- Design Tokens (از پالت فعلی میشی‌لند، رنگ جدید ساخته نشده) ---- */
    --mishi-accent: #C7773A;
    --mishi-accent-dark: #A95F2F;
    --mishi-text: #171b23;
    --mishi-muted: #7a7f88;
    --mishi-bg: #F7F4EF;
    --mishi-surface: #ffffff;
    --mishi-border: #ece7df;
    --mishi-radius: 16px;
    --mishi-radius-sm: 10px;
    --mishi-shadow: 0 6px 20px rgba(17, 24, 39, .05);
    --mishi-space: 16px;

    background: var(--mishi-bg);
}

/* =================================================================
   Layout shell — دو ستونه در دسکتاپ، تک ستونه در موبایل
   ================================================================= */
body.single-product div.product {
    max-width: 1280px !important;
    margin-inline: auto !important;
    display: flex;
    flex-wrap: wrap;
    gap: var(--mishi-space);
    align-items: flex-start;
}

body.single-product div.product .woocommerce-product-gallery {
    flex: 1 1 100%;
    background: var(--mishi-surface);
    border: 1px solid var(--mishi-border);
    border-radius: var(--mishi-radius);
    box-shadow: var(--mishi-shadow);
    overflow: hidden;
}

body.single-product div.product .summary.entry-summary {
    flex: 1 1 100%;
    background: var(--mishi-surface);
    border: 1px solid var(--mishi-border);
    border-radius: var(--mishi-radius);
    box-shadow: var(--mishi-shadow);
    padding: 18px;
}

@media (min-width: 1024px) {
    body.single-product div.product .woocommerce-product-gallery {
        flex-basis: 57%;
        max-width: 57%;
        position: sticky;
        top: 88px;
    }
    body.single-product div.product .summary.entry-summary {
        flex-basis: calc(43% - var(--mishi-space));
        max-width: calc(43% - var(--mishi-space));
    }
}

/* =================================================================
   Gallery — بدون ستون خالی، بدون Crop بد، بدون Overflow
   ================================================================= */
body.single-product .woocommerce-product-gallery__wrapper {
    margin: 0 !important;
}

body.single-product .woocommerce-product-gallery__wrapper img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    background: var(--mishi-surface);
}

body.single-product .flex-control-thumbs {
    display: flex !important;
    gap: 8px;
    padding: 10px;
    margin: 0 !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
body.single-product .flex-control-thumbs::-webkit-scrollbar { display: none; }

body.single-product .flex-control-thumbs li {
    flex: 0 0 auto;
    width: 64px;
}
body.single-product .flex-control-thumbs img {
    width: 64px;
    height: 64px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid var(--mishi-border);
}

/* =================================================================
   Title / Rating / Price
   ================================================================= */
body.single-product .product_title {
    font-size: clamp(20px, 2.1vw, 28px);
    font-weight: 800;
    line-height: 1.5;
    color: var(--mishi-text);
    margin: 0 0 8px;
}

body.single-product .woocommerce-product-rating {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

body.single-product p.price {
    font-size: clamp(22px, 2.4vw, 30px);
    font-weight: 800;
    color: var(--mishi-text);
    margin: 4px 0 10px;
}
body.single-product p.price del {
    font-size: 15px;
    color: var(--mishi-muted);
    opacity: .8;
    margin-inline-start: 8px;
}
body.single-product p.price ins {
    text-decoration: none;
}

.ml15-discount-badge {
    display: inline-block;
    background: #FDECE1;
    color: var(--mishi-accent-dark);
    font-size: 13px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 999px;
    margin-bottom: 10px;
}

/* =================================================================
   Key Feature Chips
   ================================================================= */
.ml15-features {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 4px 0 14px;
}
.ml15-features__chip {
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: var(--mishi-bg);
    border: 1px solid var(--mishi-border);
    border-radius: var(--mishi-radius-sm);
    padding: 8px 12px;
    font-size: 12.5px;
    min-width: 96px;
}
.ml15-features__chip-label {
    color: var(--mishi-muted);
}
.ml15-features__chip-value {
    color: var(--mishi-text);
    font-weight: 700;
}

/* =================================================================
   Add to Cart form
   ================================================================= */
body.single-product form.cart {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin: 10px 0;
}
body.single-product .single_add_to_cart_button {
    flex: 1 1 auto;
    border-radius: var(--mishi-radius-sm) !important;
    font-weight: 700 !important;
}

/* =================================================================
   Purchase extra row (CTA مشاوره + اعتماد فشرده)
   ================================================================= */
.ml15-purchase-extra {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed var(--mishi-border);
}

.ml15-consult-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--mishi-accent);
    color: var(--mishi-accent-dark);
    font-weight: 700;
    font-size: 14px;
    padding: 10px 14px;
    border-radius: var(--mishi-radius-sm);
    cursor: pointer;
}
.ml15-consult-btn__icon { width: 18px; height: 18px; }

.ml15-trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin-top: 12px;
}
.ml15-trust-row__item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    color: var(--mishi-muted);
}
.ml15-trust-row__item svg { width: 16px; height: 16px; color: var(--mishi-accent); flex: 0 0 auto; }

/* =================================================================
   Tabs → موبایل: Accordion (رفتار در product-v15.js) / دسکتاپ: Tab عادی
   ================================================================= */
@media (max-width: 767px) {
    body.single-product .woocommerce-tabs ul.tabs {
        display: none !important; /* روی موبایل عنوان‌ها به Accordion Header تبدیل می‌شوند */
    }
    body.single-product .woocommerce-tabs .ml15-accordion-item {
        border: 1px solid var(--mishi-border);
        border-radius: var(--mishi-radius-sm);
        margin-bottom: 8px;
        overflow: hidden;
        background: var(--mishi-surface);
    }
    body.single-product .woocommerce-tabs .ml15-accordion-header {
        width: 100%;
        text-align: right;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 14px;
        font-weight: 700;
        font-size: 14px;
        color: var(--mishi-text);
        background: none;
        border: 0;
    }
    body.single-product .woocommerce-tabs .ml15-accordion-header[aria-expanded="true"] .ml15-accordion-caret {
        transform: rotate(180deg);
    }
    body.single-product .woocommerce-tabs .panel {
        padding: 0 14px 14px;
    }
    body.single-product .woocommerce-tabs .panel[hidden] {
        display: none;
    }
    body.single-product .woocommerce-tabs table.woocommerce-product-attributes {
        display: block;
        width: 100%;
    }
    body.single-product .woocommerce-tabs table.woocommerce-product-attributes tbody,
    body.single-product .woocommerce-tabs table.woocommerce-product-attributes tr {
        display: block;
        width: 100%;
    }
    body.single-product .woocommerce-tabs table.woocommerce-product-attributes th,
    body.single-product .woocommerce-tabs table.woocommerce-product-attributes td {
        display: block;
        width: 100% !important;
        padding: 6px 0;
        border: 0;
        border-bottom: 1px solid var(--mishi-border);
    }
}

@media (min-width: 768px) {
    body.single-product .woocommerce-tabs table.woocommerce-product-attributes {
        width: 100%;
    }
}

/* =================================================================
   Discovery rails (Similar / Complementary / Recently Viewed) —
   فقط فاصله‌گذاری یکدست، رنگ/کارت خودشان از mishiland-v14-discovery.css
   ================================================================= */
body.single-product .ml-section + .ml-section {
    margin-top: 28px;
}

/* Safe-area برای iPhone (نوار Sticky ATC خودش در mishiland-sticky-atc.css
   مدیریت می‌شود؛ اینجا فقط اطمینان می‌دهیم محتوای صفحه زیر آن گیر نکند) */
@media (max-width: 767px) {
    body.single-product.ml-has-sticky-atc {
        padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }
}


/* Compact product flow: recommendations before tabs and mobile rails */
.single-product .ml-compact-recommendations-title {
  margin-top: 18px !important;
  margin-bottom: 8px !important;
}
.single-product .ml-compact-recommendations-title .elementor-element-2b1a70f {
  display: none !important;
}
.single-product .ml-compact-recommendations-products {
  margin-top: 0 !important;
  margin-bottom: 18px !important;
}
.single-product .woocommerce-tabs {
  margin-top: 14px !important;
}

@media (max-width: 767px) {
  .single-product .ml-compact-recommendations-title {
    margin-top: 10px !important;
    margin-bottom: 4px !important;
  }
  .single-product .ml-compact-recommendations-title .elementor-heading-title {
    font-size: 19px !important;
    line-height: 1.5 !important;
    margin: 0 !important;
  }
  .single-product .ml-compact-recommendations-products {
    margin-bottom: 12px !important;
  }
  .ml-compact-recommendations-products .products {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    overflow-x: auto !important;
    padding: 2px 2px 10px !important;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .ml-compact-recommendations-products .products::-webkit-scrollbar {
    display: none;
  }
  .ml-compact-recommendations-products .product,
  .ml-compact-recommendations-products .product-grid-item {
    flex: 0 0 72% !important;
    width: 72% !important;
    max-width: 72% !important;
    scroll-snap-align: start;
  }

  #reviews #comments .commentlist {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    overflow-x: auto !important;
    margin: 0 !important;
    padding: 2px 2px 12px !important;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  #reviews #comments .commentlist::-webkit-scrollbar {
    display: none;
  }
  #reviews #comments .commentlist > li {
    flex: 0 0 84% !important;
    width: 84% !important;
    margin: 0 !important;
    scroll-snap-align: start;
  }
  #reviews .comment_container {
    height: 100%;
    padding: 13px !important;
    border: 1px solid #ece7e2;
    border-radius: 14px;
    background: #fff;
  }
  #reviews .description p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
  }
  .single-product .woocommerce-Tabs-panel {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}


@media (max-width: 767px) {
  body.single-product .ml-compact-recommendations-products .products > .product-grid-item {
    flex: 0 0 74vw !important;
    width: 74vw !important;
    min-width: 74vw !important;
    max-width: 74vw !important;
  }
}


/* Preserve WoodMart native product carousel calculations */
@media (max-width: 767px) {
  body.single-product .ml-compact-recommendations-products .wd-carousel-container.products {
    display: block !important;
    overflow: visible !important;
    padding: 0 !important;
  }
  body.single-product .ml-compact-recommendations-products .product-grid-item {
    flex: initial !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}


/* Stable mobile recommendation rail independent of carousel calculations */
@media (max-width: 767px) {
  body.single-product .ml-compact-recommendations-products .wd-carousel-inner {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none;
  }
  body.single-product .ml-compact-recommendations-products .wd-carousel-inner::-webkit-scrollbar {
    display: none;
  }
  body.single-product .ml-compact-recommendations-products .wd-carousel {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }
  body.single-product .ml-compact-recommendations-products .wd-carousel-wrap {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    width: max-content !important;
    transform: none !important;
  }
  body.single-product .ml-compact-recommendations-products .wd-carousel-item {
    flex: 0 0 74vw !important;
    width: 74vw !important;
    min-width: 74vw !important;
    max-width: 74vw !important;
    height: auto !important;
  }
  body.single-product .ml-compact-recommendations-products .wd-carousel-item .product-grid-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}


/* Compact mobile reviews rail and collapsed review form */
@media (max-width: 767px) {
  body.single-product #tab-reviews,
  body.single-product #reviews,
  body.single-product #reviews #comments {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body.single-product #reviews #comments .commentlist {
    width: 100% !important;
    max-width: 100% !important;
  }
  body.single-product #reviews #comments .commentlist > li {
    flex: 0 0 82vw !important;
    width: 82vw !important;
    min-width: 82vw !important;
    max-width: 82vw !important;
  }
  body.single-product #review_form_wrapper {
    display: none !important;
  }
  body.single-product #review_form_wrapper.ml-review-form-open {
    display: block !important;
  }
  body.single-product .ml-review-form-toggle {
    width: 100%;
    margin: 12px 0 2px;
    padding: 11px 14px;
    border: 1px solid #9b6a3d;
    border-radius: 10px;
    color: #74451f;
    background: #fff;
    font-weight: 700;
  }
}