/* Modelena single product page — v0.6 (user feedback 26 Oct: "Zoom" lafz nahi +
   hover-only zoom, up arrow hatao + down arrow sirf >5 images par (5 visible),
   stitching display-only, prev/next hatao, description box, reviews polish,
   related = homepage Product Card widget jaisi cards, bulk button hatao).
   Tokens: maroon #470108, gold #C9A227, ivory #FAF6EF, radius 0. */

/* v0.5.2: home page jaisa container. Product body edge-to-edge tha (0 margins)
   jab ke home page ~1280px content + dono taraf ~320px white margins rakhta hai.
   Is liye poora template .mdln-container mein hai. */
.mdln-container { max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px; box-sizing: border-box; }

/* ---- Breadcrumb (prev/next navigation v0.6 mein hata di) ---- */
/* v1.0.23 (user ka hukm 27 Oct ~01:24): breadcrumb ke neeche utni hi space jitni upar — upar wali space theek hai, is liye upar 10px waisa hi, neeche 24px se barha kar 40px taake product images + title breadcrumb se thoda neeche aayen. */
.mdln-breadcrumb-row { display: flex; gap: 16px; flex-wrap: wrap; margin: 10px 0 40px; font-family: 'Lato', sans-serif; font-size: 13px; color: #767676; }
/* v1.0.23 FINAL: excerpt + badges form ke andar aate hain (form flex hai) — poori chaudai par apni line mein aayen, qty/ATC ke saath chipken nahi. */
.mdln-summary-col form.cart > .woocommerce-product-details__short-description,
.mdln-summary-col .woocommerce-variation-add-to-cart > .woocommerce-product-details__short-description,
.mdln-summary-col form.cart > .mdln-badges,
.mdln-summary-col .woocommerce-variation-add-to-cart > .mdln-badges { flex: 1 1 100%; }
.mdln-summary-col form.cart > .woocommerce-product-details__short-description,
.mdln-summary-col .woocommerce-variation-add-to-cart > .woocommerce-product-details__short-description { margin: 4px 0 8px; }
/* v1.0.24: Stitching line form ke andar flex item bani (hook badla) — poori line par, badges se upar. */
.mdln-summary-col form.cart:not(.variations_form) > .mdln-stitch-display,
.mdln-summary-col .woocommerce-variation-add-to-cart > .mdln-stitch-display { flex: 1 1 100%; margin: 8px 0; }

/* ---- v1.0.24: Reviews — LEFT summary + RIGHT list (Amazon pattern, real data only). ---- */
.mdln-reviews-section { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: start; }
.mdln-reviews-summary { grid-column: 1; grid-row: 1; background: #fff; border: 1px solid #e5e0d5; padding: 24px; }
.mdln-reviews-section #reviews { grid-column: 2; grid-row: 1; min-width: 0; }
.mdln-rs-title { font-family: 'Lora', serif; color: #470108; font-size: 24px; margin: 0 0 12px; font-weight: 400; }
.mdln-rs-stars { position: relative; display: inline-block; line-height: 0; }
.mdln-rs-stars-bg { display: flex; color: #ddd; }
.mdln-rs-stars-bg svg { width: 18px; height: 18px; fill: currentColor; flex: none; }
.mdln-rs-stars-filled { position: absolute; left: 0; top: 0; display: flex; overflow: hidden; color: #C9A227; }
.mdln-rs-stars-filled svg { width: 18px; height: 18px; fill: currentColor; flex: none; }
.mdln-rs-avg { font-family: 'Lato', sans-serif; font-size: 15px; color: #242424; margin: 10px 0 2px; }
.mdln-rs-total { font-family: 'Lato', sans-serif; font-size: 14px; color: #767676; margin: 0 0 16px; }
.mdln-rs-empty { font-family: 'Lato', sans-serif; font-size: 14px; color: #767676; margin: 0 0 16px; }
.mdln-rs-bars { display: flex; flex-direction: column; gap: 8px; }
.mdln-rs-bar { display: flex; align-items: center; gap: 10px; width: 100%; background: none; border: 0; padding: 4px 0; cursor: pointer; text-align: left; }
.mdln-rs-bar:disabled { cursor: default; opacity: .6; }
.mdln-rs-bar-label { font-family: 'Lato', sans-serif; font-size: 14px; color: #470108; white-space: nowrap; width: 42px; }
.mdln-rs-bar-track { flex: 1; height: 10px; background: #eee; overflow: hidden; }
.mdln-rs-bar-fill { display: block; height: 100%; background: #C9A227; }
.mdln-rs-bar-pct { font-family: 'Lato', sans-serif; font-size: 14px; color: #767676; width: 36px; text-align: right; }
.mdln-rs-bar:hover .mdln-rs-bar-fill { background: #470108; }
.mdln-rs-bar.is-active { outline: 1px solid #C9A227; outline-offset: 2px; }
.mdln-rs-bar.is-active .mdln-rs-bar-fill { background: #470108; }
.mdln-rs-filter-note { font-family: 'Lato', sans-serif; font-size: 14px; color: #470108; margin: 14px 0 0; }
.mdln-rs-show-all { background: none; border: 0; padding: 0; color: #470108; text-decoration: underline; cursor: pointer; font-size: 14px; }
.mdln-rs-no-match { font-family: 'Lato', sans-serif; font-size: 14px; color: #767676; margin: 12px 0; }
@media (max-width: 767px) {
    .mdln-reviews-section { grid-template-columns: 1fr; gap: 24px; }
    .mdln-reviews-summary { grid-column: 1; grid-row: 1; }
    .mdln-reviews-section #reviews { grid-column: 1; grid-row: 2; }
}
.mdln-breadcrumb-row a { color: #767676; text-decoration: none; }
.mdln-breadcrumb-row a:hover { color: #470108; }

/* ---- Product grid ---- */
.mdln-product-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: start; }

/* ---- Gallery ---- */
.mdln-gallery { display: flex; gap: 14px; }
.mdln-thumbs-col { width: 92px; flex: none; display: flex; flex-direction: column; gap: 10px; }
/* 5 thumbs visible: 5 x 110px + 4 x 10px gap = 590px. Neeche wala arrow sirf
   tab render hota hai jab images 5 se zyada hon (PHP). Arrow chhota + gol
   (user: "achhe tareeqe se chhote karke lagao"). */
.mdln-thumbs { display: flex; flex-direction: column; gap: 10px; max-height: 590px; overflow: hidden; }
.mdln-thumb { border: 2px solid #eee; padding: 0; background: #FAF6EF; cursor: pointer; }
.mdln-thumb img { width: 100%; height: 110px; object-fit: cover; display: block; }
.mdln-thumb.active { border-color: #C9A227; }
.mdln-thumb-arrow { width: 28px; height: 28px; margin: 0 auto; padding: 0; background: #fff; border: 1px solid #470108; border-radius: 50%; color: #470108; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.mdln-thumb-arrow svg { width: 14px; height: 14px; }
.mdln-main-wrap { flex: 1; min-width: 0; }
.mdln-main { position: relative; overflow: hidden; background: #FAF6EF; cursor: zoom-in; }
.mdln-main img { width: 100%; height: auto; aspect-ratio: 5 / 6; object-fit: cover; display: block; transition: transform .25s ease; }
.mdln-main.zoomed { cursor: zoom-out; }
.mdln-main.zoomed img { transform: scale(2); }

/* ---- Summary ---- */
.mdln-summary-col .product_title { font-family: 'Lora', serif; font-size: 34px; font-weight: 400; line-height: 1.2; margin: 0 0 8px; }
.mdln-summary-col .star-rating { color: #C9A227; }
.mdln-summary-col .price { font-size: 26px; margin: 10px 0; }
.mdln-summary-col .woocommerce-product-details__short-description p { color: #767676; font-size: 15px; line-height: 1.7; }
/* Simple form row: stitch (full width) + quantity + Add to Cart + share circle. */
.mdln-summary-col form.cart:not(.variations_form) { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 16px 0; }
.mdln-summary-col form.cart .quantity input { padding: 10px; border: 1px solid #ddd; }
.mdln-summary-col form.cart .single_add_to_cart_button { background: #470108; color: #fff; border: 0; padding: 13px 36px; font-family: 'Lato', sans-serif; font-size: 14px; text-transform: uppercase; letter-spacing: .5px; cursor: pointer; flex: 1 1 auto; }
.mdln-summary-col form.cart .single_add_to_cart_button:hover { background: #5E0108; }
/* Buy Now (26 Oct, user ka hukm): single page par ATC ke saath — click par
   seedha checkout. ATC maroon hai, Buy Now gold (accent) taake alag nazar
   aaye; mobile par poori row ki chaudai (flex-wrap ke saath neeche aa jata
   hai, ATC/share wali row kharab nahi hoti). */
.mdln-summary-col form.cart .mdln-buy-now-button { background: #C9A227; color: #242424; border: 0; padding: 13px 32px; font-family: 'Lato', sans-serif; font-size: 14px; text-transform: uppercase; letter-spacing: .5px; cursor: pointer; flex: 1 1 auto !important; }
.mdln-summary-col form.cart .mdln-buy-now-button:hover { background: #B8941F; }
/* v1.0.17: Buy Now ATC ke SAATH ek hi row mein (user ka hukm 23:44) —
   pehle theme ka form.cart button flex:1 Buy Now ko poori row ki bar
   bana deta tha (user ki photo mein wahi bar nazar aayi). Desktop par
   flex:0 0 auto se Buy Now apni natural chaudai par ATC ke saath
   aayega. Mobile (390px) par chaaron ek row mein nahi sama sakte, is
   liye row 1: qty + ATC, row 2: Buy Now + share (calc basis se wrap
   yaqeeni — Buy Now ki basis itni bari hai ke wo row 1 mein sama hi
   nahi sakta, aur row 2 mein share ke saath aa jata hai; bar wali
   shakal khatam).
   v1.0.20 REVERSAL (user ka hukm 00:25): compact row user ko pasand
   nahi aayi — row ke baad khaali jagah bachti thi, share circle
   content ke right edge par nahi lagta tha. Ab ATC + Buy Now dono
   flex:1 (barh kar poori row bhartay hain) + left/right padding bhi
   zyada (ATC 36px, Buy Now 32px) — qty fixed + share 48px fixed, baaki
   jagah dono buttons lete hain, is liye share circle ab summary
   column ke bilkul right edge par lagta hai. Mobile rule waisa hi
   (row 1: qty + ATC flex:1, row 2: Buy Now calc + share). */
@media (max-width: 767px) {
    /* v1.0.30: row 2 ab Buy Now + share (48) + heart (48) + 2 gaps (24) = 120px. */
    .mdln-summary-col form.cart .mdln-buy-now-button { flex: 1 1 calc(100% - 120px) !important; }
}

/* ---- Badges / stitching display / share circle (bulk v0.6 mein hata) ---- */
.mdln-badges { display: flex; flex-wrap: wrap; gap: 14px; margin: 14px 0; }
.mdln-badge { display: inline-flex; align-items: center; gap: 8px; font-family: 'Lato', sans-serif; font-size: 14px; color: #242424; }
.mdln-badge svg { width: 20px; height: 20px; stroke: #470108; fill: none; stroke-width: 1.8; flex: none; }
.mdln-stitch-display { margin: 14px 0; font-family: 'Lato', sans-serif; font-size: 14px; color: #242424; }
.mdln-summary-col form.cart:not(.variations_form) .mdln-stitch-display { width: 100%; margin: 0; }
.mdln-stitch-display span { font-size: 13px; text-transform: uppercase; letter-spacing: 1px; color: #767676; margin-right: 8px; }
.mdln-share-circle { width: 48px; height: 48px; border-radius: 50%; border: 1px solid #470108; background: #fff; color: #470108; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; flex: none; padding: 0; }
/* v0.4.1 FIX: theme ki form.cart button styling (flex:1) circle ko poori
   chauraai tak kheench rahi thi — 50% golai + poori chauraai = lambi anda
   (ellipse) bar ban gayi thi. Is liye size pakka + specificity barha di. */
.mdln-summary-col form.cart .mdln-share-circle { width: 48px !important; height: 48px !important; min-width: 48px; max-width: 48px; flex: 0 0 48px !important; box-sizing: border-box; align-self: center; padding: 0 !important; }
/* v1.0.15: Share glyph ASAL fix — fresh guest check mein bhi icon chhota +
   khaali (hollow) aaya jabke served CSS mein 40px + fill tha; is liye size /
   fill ab sirf CSS par nahi — svg par DIRECT attributes + flex:none +
   button padding 0, taake koi bhi rule ya squeeze icon ko chhota/khaali
   na kar sake. Wahi symbol/function.
   v1.0.17 CORRECTION: 42px user ko HAD SE ZYADA bara laga (circle ke
   andar ghut raha tha) — size 24px kar diya (circle ka aadha, standard
   icon-button proportion), solid dots waisi hi. Mechanism wahi hai.
   v1.0.18: user ne thoda AUR chhota + thoda KAM bold kaha — 20px +
   stroke-width 2 (pehle 2.5).
   v1.0.20: user ne phir thoda AUR chhota kaha — 16px (stroke 2 waisa hi). */
.mdln-share-circle svg { width: 16px; height: 16px; stroke: currentColor; stroke-width: 2; fill: currentColor; flex: none; }

/* v1.0.30 — summary wishlist heart (related hearts jaisa dil, share circle
   ke baad usi row mein; 48px taake share ke saath milay; active par maroon). */
.mdln-summary-col form.cart .mdln-summary-wishlist { width: 48px !important; height: 48px !important; min-width: 48px; max-width: 48px; flex: 0 0 48px !important; box-sizing: border-box; border-radius: 50%; border: 1px solid #470108; background: #fff; color: #470108; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0 !important; align-self: center; }
.mdln-summary-col form.cart .mdln-summary-wishlist svg { width: 18px; height: 18px; flex: none; }
.mdln-summary-col form.cart .mdln-summary-wishlist.active { background: #470108; color: #fff; }
.mdln-summary-col form.cart .mdln-summary-wishlist.active svg { fill: currentColor; }

/* ---- Share popup ---- */
.mdln-share-overlay[hidden] { display: none !important; }
.mdln-share-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 16px; }
.mdln-share-box { position: relative; background: #fff; width: 100%; max-width: 420px; padding: 24px; }
.mdln-share-close { position: absolute; top: 8px; right: 12px; background: none; border: 0; font-size: 26px; cursor: pointer; color: #242424; }
.mdln-share-title { font-family: 'Lora', serif; font-size: 20px; color: #242424; margin: 0 0 6px; }
.mdln-share-sub { font-family: 'Lato', sans-serif; font-size: 13px; color: #767676; margin: 0 0 14px; }
.mdln-share-check { display: flex; gap: 10px; align-items: center; font-family: 'Lato', sans-serif; font-size: 14px; color: #242424; padding: 7px 0; cursor: pointer; }
.mdln-share-wa { display: block; width: 100%; margin-top: 14px; padding: 13px; background: #25D366; color: #fff; border: 0; font-family: 'Lato', sans-serif; font-size: 15px; cursor: pointer; }
.mdln-share-note { font-family: 'Lato', sans-serif; font-size: 12px; color: #767676; margin: 12px 0 0; }

/* ---- Sections below ---- */
.mdln-section-title { font-family: 'Lora', serif; font-size: 26px; font-weight: 400; margin: 56px 0 16px; }
/* v1.0.31: Description block thoda neeche (user 27 Oct) — SCOPE zaroori
   hai kyunki Related Products ka heading bhi isi class ka hai. */
.mdln-desc-section .mdln-section-title { margin-top: 80px; }
/* Description ek BOX mein (v0.6): border + padding, content andar. */
.mdln-desc-box { border: 1px solid #e5e0d5; background: #fff; padding: 28px; margin-bottom: 32px; }
.mdln-desc-box p { color: #767676; font-size: 15px; line-height: 1.8; }

/* ---- Reviews: real buyer reviews, one-by-one list (v0.6 polish) ---- */
/* v1.0.25 (user ka hukm 27 Oct ~02:19): reviews section CENTRE mein nahi —
   pehle max-width 1000px + auto margins poori section ko centre mein
   bithate the, is liye summary page ke left par nahi lagta tha. Ab section
   poori chaudai par left-aligned hai: summary LEFT column (300px), reviews
   list RIGHT column — grid rule upar wali (line ~27) wahi rehti hai. */
.mdln-reviews-section { max-width: none; margin-left: 0; margin-right: 0; }
.mdln-reviews-section .commentlist { margin: 0; padding: 0; }
.mdln-reviews-section .commentlist li { background: #fff; border: 1px solid #e5e0d5; box-shadow: 0 2px 10px rgba(0,0,0,.05); padding: 24px; margin-bottom: 20px; list-style: none; }
/* v1.0.28 — review cards Amazon/Daraz jaisi REAL feel (brand flat corners,
   koi gol pill nahi): verified badge, date grey, stars gold, photo bordered.
   Template ka verified element chhupa hai taake PHP badge ke saath
   duplicate na bane; summary (yellow bars) ko haath nahi lagaya. */
.mdln-reviews-section .woocommerce-review__verified { display: none !important; }
.mdln-verified-badge { display: inline-block; background: #FAF6EF; color: #470108; border: 1px solid #C9A227; padding: 4px 10px; font-size: 12px; font-weight: 700; letter-spacing: .3px; margin: 0 0 10px; }
.mdln-reviews-section .comment-text .meta time, .mdln-reviews-section .woocommerce-review__published-date { color: #767676; font-size: 13px; }
.mdln-reviews-section .comment-text .star-rating { font-size: 15px; }
.mdln-reviews-section .comment-text .description p { font-size: 15px; }
.mdln-reviews-section .comment_container { display: flex; gap: 16px; align-items: flex-start; }
.mdln-reviews-section .comment_container .avatar { width: 48px; height: 48px; border-radius: 50%; border: 2px solid #C9A227; flex: none; }
.mdln-reviews-section .comment-text { flex: 1; min-width: 0; }
.mdln-reviews-section .comment-text .meta { margin-bottom: 8px; }
.mdln-reviews-section .woocommerce-review__author { color: #242424; font-weight: 700; }
.mdln-reviews-section .woocommerce-review__verified { color: #470108; }
.mdln-reviews-section .comment-text .star-rating { color: #C9A227; }
.mdln-reviews-section .comment-text .description p { color: #242424; line-height: 1.7; }
.mdln-review-photo img { max-width: 150px; height: auto; display: block; margin-bottom: 10px; border: 1px solid #e5e0d5; }
.mdln-review-product-thumb { float: right; margin: 0 0 10px 16px; }
.mdln-review-product-thumb img { width: 72px; height: 96px; object-fit: cover; border: 1px solid #e5e0d5; display: block; }
.mdln-load-more { display: block; margin: 8px auto 0; padding: 12px 28px; background: #470108; color: #fff; border: 0; font-family: 'Lato', sans-serif; font-size: 14px; text-transform: uppercase; letter-spacing: .5px; cursor: pointer; }
.mdln-load-more:hover { background: #5E0108; }
.mdln-load-more[hidden] { display: none !important; }
/* Review form: maroon submit, saaf inputs. */
.mdln-reviews-section #respond input[type="text"],
.mdln-reviews-section #respond input[type="email"],
.mdln-reviews-section #respond textarea { border: 1px solid #ddd; padding: 12px; box-sizing: border-box; }
.mdln-reviews-section #respond input#submit { background: #470108; color: #fff; border: 0; padding: 13px 30px; font-family: 'Lato', sans-serif; font-size: 14px; text-transform: uppercase; letter-spacing: .5px; cursor: pointer; }
.mdln-reviews-section #respond input#submit:hover { background: #5E0108; }

/* ---- Related: homepage Product Card widget ki copy (v0.6) ----
   Widget ki style.css se liya gaya, .mdln-related-section prefix ke saath
   taake single page par cards hamesha styled rahen (Angie CSS par inhisar
   nahi). Farq: ATC button maroon (user ka button rule), wishlist active
   maroon. Grid: 4 desktop, 2 tablet/mobile (widget jaisa). */
.mdln-related-section .modelena-grid-43081b20 { display: grid; gap: 20px; grid-template-columns: repeat(4, 1fr); }
.mdln-related-section .modelena-card-43081b20 { display: flex; flex-direction: column; }
.mdln-related-section .modelena-img-wrap-43081b20 { position: relative; overflow: hidden; width: 100%; aspect-ratio: 1 / 1.33; }
.mdln-related-section .modelena-img-wrap-43081b20 img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s ease, opacity 1.2s ease; position: absolute; top: 0; left: 0; }
.mdln-related-section .modelena-img-wrap-43081b20 img.secondary-img { opacity: 0; }
.mdln-related-section .modelena-img-wrap-43081b20:hover img.primary-img.has-secondary { opacity: 0; }
.mdln-related-section .modelena-img-wrap-43081b20:hover img.secondary-img { opacity: 1; transform: scale(1.05); }
.mdln-related-section .modelena-img-wrap-43081b20:hover img.primary-img:not(.has-secondary) { transform: scale(1.05); }
.mdln-related-section .modelena-badge-43081b20 { position: absolute; top: 10px; left: 10px; padding: 4px 8px; font-size: 12px; font-weight: bold; z-index: 2; background-color: #470108; color: #fff; }
.mdln-related-section .modelena-wishlist-43081b20 { position: absolute !important; top: 10px !important; right: 10px !important; left: auto !important; width: 40px; height: 40px; padding: 0; box-sizing: border-box; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: none; cursor: pointer; z-index: 2; box-shadow: 0 2px 10px rgba(0,0,0,0.1); background-color: #fff; color: #1a1a1a; margin: 0 !important; }
.mdln-related-section .modelena-wishlist-43081b20 svg { width: 18px; height: 18px; }
.mdln-related-section .modelena-wishlist-43081b20.active { background-color: #470108; color: #fff; }
.mdln-related-section .modelena-wishlist-43081b20.active svg { fill: currentColor; }
.mdln-related-section .modelena-overlay-43081b20 { position: absolute; bottom: 0; left: 0; width: 100%; padding: 20px; box-sizing: border-box; transform: translateY(100%); transition: transform 0.3s ease; display: flex; flex-direction: column; align-items: center; gap: 10px; background: linear-gradient(to top, rgba(0,0,0,0.5), transparent); z-index: 2; }
.mdln-related-section .modelena-img-wrap-43081b20:hover .modelena-overlay-43081b20 { transform: translateY(0); }
.mdln-related-section .modelena-sizes-43081b20 { display: flex; gap: 5px; }
.mdln-related-section .modelena-size-chip-43081b20 { padding: 4px 10px; font-size: 12px; border: 1px solid currentColor; cursor: pointer; background-color: transparent; color: #fff; }
.mdln-related-section .modelena-size-chip-43081b20.selected { background-color: #fff; color: #000; }
.mdln-related-section .modelena-atc-43081b20 { width: 100%; padding: 10px; border: none; cursor: pointer; font-weight: bold; text-transform: uppercase; background-color: #470108; color: #fff; }
.mdln-related-section .modelena-atc-43081b20:hover { background-color: #5E0108; }
.mdln-related-section .modelena-content-43081b20 { padding: 15px 0; display: flex; flex-direction: column; gap: 5px; }
.mdln-related-section .modelena-kicker-43081b20 { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: #767676; }
.mdln-related-section .modelena-title-43081b20 { font-size: 16px; text-decoration: none !important; color: #000; }
/* v1.0: lambi titles narrow card se bahar na jayen (mobile 2-col) — card
   ke andar wrap hon, chahe title kitna hi lamba ho. */
.mdln-related-section .modelena-card-43081b20,
.mdln-related-section .modelena-content-43081b20 { min-width: 0; }
.mdln-related-section .modelena-title-43081b20,
.mdln-related-section .modelena-kicker-43081b20 { overflow-wrap: anywhere; word-break: break-word; }
.mdln-related-section .modelena-price-43081b20 { flex-wrap: wrap; }
.mdln-related-section .modelena-rating-43081b20 { position: relative; display: inline-block; width: max-content; }
.mdln-related-section .modelena-rating-43081b20 svg { width: 14px; height: 14px; }
.mdln-related-section .modelena-stars-bg-43081b20 { color: #ddd; display: flex; }
.mdln-related-section .modelena-stars-filled-43081b20 { position: absolute; top: 0; left: 0; height: 100%; overflow: hidden; color: #e6b800; display: flex; }
/* v1.0.15: Related cards stars duplicate fix — widget wali fix (flex:none)
   single page par nahi pahunchti kyunke widget CSS yahan load nahi hoti,
   rating rules ki alag copy single.css mein hai; wahi flex-shrink bug yahan
   bhi tha (kam rating par gold sitare sikur kar grey se hat jate the). */
.mdln-related-section .modelena-stars-filled-43081b20 svg { flex: none; }
.mdln-related-section .modelena-price-43081b20 { display: flex; gap: 10px; align-items: center; }
.mdln-related-section .modelena-price-43081b20 .reg-price { text-decoration: line-through; color: #888; }
.mdln-related-section .modelena-price-43081b20 .sale-price { font-weight: bold; color: #000; }
.mdln-related-section .modelena-price-43081b20 > .reg-price:only-child { text-decoration: none; font-weight: bold; color: #000; }
@media (max-width: 1024px) { .mdln-related-section .modelena-grid-43081b20 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .mdln-related-section .modelena-grid-43081b20 { grid-template-columns: repeat(2, 1fr); } }
@media (hover: none) {
    .mdln-related-section .modelena-overlay-43081b20 { position: static; transform: none; background: none; padding: 10px 0 0 0; }
    .mdln-related-section .modelena-size-chip-43081b20 { color: #242424; }
    .mdln-related-section .modelena-size-chip-43081b20.selected { background-color: #470108; color: #fff; }
}
/* Mobile/touch (v0.8, user hukm): ATC image ke upar NAHI — JS use price ke
   neeche le jata hai, is liye khaali overlay mobile par bilkul chhupao. */
@media (hover: none), (max-width: 767px) {
    .mdln-related-section .modelena-overlay-43081b20 { display: none; }
    .mdln-related-section .modelena-atc-43081b20.mdln-moved { margin-top: 10px; }
}
@media (hover: hover) and (pointer: fine) {
    .mdln-related-section .modelena-wishlist-43081b20 { opacity: 0; pointer-events: none; }
    .mdln-related-section .modelena-card-43081b20:hover .modelena-wishlist-43081b20,
    .mdln-related-section .modelena-card-43081b20:focus-within .modelena-wishlist-43081b20,
    .mdln-related-section .modelena-wishlist-43081b20.active { opacity: 1; pointer-events: auto; }
}

/* ---- Mobile: stacked ---- */
@media (max-width: 768px) {
    .mdln-product-grid { grid-template-columns: 1fr; gap: 24px; }
    .mdln-gallery { flex-direction: column; }
    .mdln-thumbs-col { width: 100%; flex-direction: row; order: 2; }
    .mdln-thumbs { flex-direction: row; max-height: none; overflow-x: auto; }
    .mdln-thumb img { width: 70px; height: 84px; }
    .mdln-thumb-arrow { display: none; }
    .mdln-main-wrap { order: 1; }
    .mdln-summary-col .product_title { font-size: 26px; }
    .mdln-reviews-section .comment_container { gap: 12px; }
    .mdln-reviews-section .comment_container .avatar { width: 40px; height: 40px; }
}
/* v1.0.22: Variation area polish (user ka hukm, 27 Oct):
   (a) Sale badge (-62%) ka background ADD TO CART button jaisa maroon —
   theme-settings ka safed background is rule se override hota hai.
   (b) Colour swatches CIRCLE nahi, BOX (site ki flat-corner design):
   container wd-shape-round hai, is liye swatch + inner bg dono par
   radius 0.
   (c) "Colour:" label ka font site style: Cormorant Garamond, maroon.
   (d) Delivery badges row aur Colour row ke darmiyaan khula gap taake
   summary tang na lage. (e) v1.0.20 wala single-page label HATA diya
   gaya hai (user ka aakhri hukm) — .mdln-single-label rule bhi remove. */
.single-product .product-label.onsale { background-color: #470108 !important; color: #ffffff !important; }
/* v1.0.25 (user ka hukm 27 Oct ~02:19): discount badge (-62%) aur us ke neeche wale title ke darmiyan thodi space — badge title se chipka lagta tha. */
.mdln-summary-col .product-label.onsale { display: inline-block; margin-bottom: 12px; }
.mdln-summary-col .wd-swatches-single .wd-swatch,
.mdln-summary-col .wd-swatches-single .wd-swatch-bg { border-radius: 0 !important; }
.mdln-summary-col table.variations th.label label { font-family: 'Cormorant Garamond', serif; font-size: 18px; font-weight: 600; color: #470108; }
.mdln-summary-col .mdln-badges { margin: 12px 0 24px; }

/* v1.0.22 (hearts): Related products ke wishlist dil desktop par bhi
   HAMESHA nazar aayenge — pehle (hover:hover) rule unhein hover tak
   chhupata tha, jab ke mobile par wo pehle se nazar aate the. User ka
   hukm: desktop par show hon, mobile bilkul waisa hi rahe (is rule ka
   media hover:hover hai, is liye touch/mobile par koi farq nahi). */
@media (hover: hover) and (pointer: fine) {
    .mdln-related-section .modelena-wishlist-43081b20 { opacity: 1 !important; pointer-events: auto !important; }
}

/* v1.0.23 wala swatch border v1.0.25 mein HATA diya (user ka aakhri hukm
   27 Oct ~02:19 — gold/maroon border remove karo, theme ka apna swatch
   style hi theek hai). "Clear" link CSS backup barkarar: PHP filter
   markup se hatata hai, ye rule kisi bhi bypass par bhi use chhupata hai. */
.mdln-summary-col .reset_variations { display: none !important; }

/* v1.0.26 (user ka hukm 27 Oct ~02:26): Product Highlights table — brand jaisa
   saaf spec table, description ke andar. Sirf wo data jo description mein hai. */
.mdln-highlights { margin: 0; }
.mdln-highlights-title { font-family: 'Lora', serif; font-size: 22px; font-weight: 400; color: #470108; margin: 0 0 16px; }
.mdln-highlights-table { width: 100%; border-collapse: collapse; }
.mdln-highlights-table th { width: 160px; text-align: left; font-family: 'Lato', sans-serif; font-size: 14px; font-weight: 700; color: #470108; padding: 12px 16px 12px 0; border-bottom: 1px solid #e5e0d5; vertical-align: top; }
.mdln-highlights-table td { font-family: 'Lato', sans-serif; font-size: 14px; color: #242424; padding: 12px 0; border-bottom: 1px solid #e5e0d5; }
@media (max-width: 767px) {
    /* v1.0.26: single product sale badge mobile par aur chhota — sirf padding kam, text waisa hi (26 Oct wala usool). */
    .mdln-summary-col .product-label.onsale { padding: 3px 6px !important; }
    /* v1.0.26 (user ka aakhri hukm — 26 Oct wale "chhota" se reversal): related cards ka dil mobile par BILKUL NAHI, sirf desktop par. */
    .mdln-related-section .modelena-wishlist-43081b20 { display: none !important; }
    .mdln-highlights-table th { width: 110px; padding-right: 10px; }
}

/* ---- v1.0.31: review form stars (user 27 Oct) ----
   Form mein text links ("1 of 5 stars") ki jagah asli star graphics.
   Markup: .comment-form-rating .stars > span > a.star-N (WC/WoodMart).
   Link ka text chhupao (font-size:0), ::before se star dikhao.
   Hover par sab fill, phir hover wale ke baad wale khaali. Selected par
   click wale tak fill (baad wale khaali) — JS .selected + .active lagata
   hai, submit nahi hota. */
.comment-form-rating .stars a { font-size: 0; line-height: 1; text-decoration: none !important; margin-right: 2px; }
.comment-form-rating .stars a::before { content: '☆'; font-size: 26px; color: #c9c9c9; line-height: 1; }
.comment-form-rating .stars:hover a::before { content: '★'; color: #C9A227; }
.comment-form-rating .stars a:hover ~ a::before { content: '☆'; color: #c9c9c9; }
.comment-form-rating .stars.selected a::before { content: '★'; color: #C9A227; }
.comment-form-rating .stars.selected a.active ~ a::before { content: '☆'; color: #c9c9c9; }