/* zin styling for WooCommerce content (cart/checkout/shop/single product) — site-wide */
:root{
  --zin-brand: oklch(0.58 0.18 255);
  --zin-brand-700: oklch(0.47 0.18 255);
  --zin-brand-50: oklch(0.975 0.018 255);
  --zin-coral: oklch(0.66 0.17 32);
  --zin-ink: oklch(0.26 0.02 260);
  --zin-ink-3: oklch(0.60 0.012 260);
  --zin-line: oklch(0.92 0.006 260);
  --zin-bg: oklch(0.985 0.004 260);
  --zin-grad: linear-gradient(135deg, oklch(0.62 0.18 237), oklch(0.52 0.19 269));
}
body{ font-family:"Inter", system-ui, sans-serif; color:var(--zin-ink); background:var(--zin-bg); }
/* hide default TT5 header/footer template parts on woo/zin-chrome pages (we provide our own) */

/* WooCommerce headings */
.woocommerce h1, .woocommerce-page h1, .wc-block-components-title, .wp-block-post-title{ font-weight:800; letter-spacing:-.01em; color:var(--zin-ink); }

/* Buttons → zin pill */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.wc-block-components-button, .wp-block-button__link, .wc-block-cart__submit-button{
  background:var(--zin-brand) !important; color:#fff !important; border:none !important;
  border-radius:7px !important; font-weight:700 !important; padding:11px 20px !important;
  box-shadow:0 8px 18px -8px var(--zin-brand);
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .wc-block-components-button:hover, .wp-block-button__link:hover{ filter:brightness(1.06); }
/* primary CTAs (checkout / place order) → coral */
.woocommerce a.checkout-button, .woocommerce #place_order,
.wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-cart .wc-block-cart__submit-button{
  background:var(--zin-coral) !important; box-shadow:0 8px 18px -8px var(--zin-coral);
}
.woocommerce button.button.alt, .woocommerce a.button.alt{ background:var(--zin-coral) !important; }

/* prices → coral / strong */
.woocommerce .price, .woocommerce-Price-amount, .wc-block-components-product-price,
.wc-block-formatted-money-amount, .wc-block-cart-item__total-price-and-sale-badge-wrapper{
  color:var(--zin-coral) !important; font-weight:800;
}
.woocommerce del .woocommerce-Price-amount{ color:var(--zin-ink-3) !important; font-weight:500; }

/* links */
.woocommerce a:hover, .wc-block-components-product-name:hover{ color:var(--zin-brand-700); }
.woocommerce-loop-product__title, .wc-block-components-product-name{ font-weight:700 !important; color:var(--zin-ink); }

/* product loop cards (shop/archive) */
.woocommerce ul.products li.product{ border:1px solid var(--zin-line); border-radius:7px; padding:14px; background:#fff; transition:box-shadow .15s, transform .15s; box-sizing:border-box; }
.woocommerce ul.products li.product:hover{ transform:translateY(-3px); box-shadow:0 18px 40px -12px rgba(28,40,90,.22); }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:14px; line-height:1.34; min-height:38px; }
.woocommerce ul.products li.product img{ border-radius:7px; background:var(--zin-brand-50); }
.woocommerce span.onsale, .wc-block-components-product-sale-badge{ background:var(--zin-coral) !important; border-radius:7px; }

/* ============================================================
   SINGLE PRODUCT — zin PDP skin
   Restyles the native WooCommerce single-product into the zin
   two-column layout (gallery left, buy-box right) + the zin brand
   panels injected by the zin-product mu-plugin (.zpdp-*).
   ============================================================ */

/* two-column shell (dienthoaivui-style): long content stacks in the LEFT column
   (gallery → phụ kiện → mô tả/thông tin → đánh giá → hỏi đáp) beside a tall RIGHT
   rail (buy-box). Float-based so any number of injected sections line up on the
   left; related/up-sells clear to full width. */
.woocommerce div.product{ display:block; }
.woocommerce div.product::after{ content:""; display:table; clear:both; }
.woocommerce div.product > .summary.entry-summary{
  float:right; width:38%; margin:0 0 18px !important; margin-left:0; clear:right; box-sizing:border-box;
}
.woocommerce div.product > .woocommerce-product-gallery,
.woocommerce div.product > div.images,
.woocommerce div.product > .zpdp-thumbs,
.woocommerce div.product > .zpdp-accrow,
.woocommerce div.product > .zpdp-section,
.woocommerce div.product > .woocommerce-tabs{
  float:left; clear:left; width:60%; margin:0 0 18px !important; min-width:0; box-sizing:border-box;
}
.woocommerce div.product > .woocommerce-tabs{ margin-top:0 !important; }
.woocommerce div.product > .related,
.woocommerce div.product > .upsells{ clear:both; width:100%; float:none; }
@media (max-width:1040px){
  .woocommerce div.product > .summary.entry-summary,
  .woocommerce div.product > .woocommerce-product-gallery,
  .woocommerce div.product > div.images,
  .woocommerce div.product > .zpdp-thumbs,
  .woocommerce div.product > .zpdp-accrow,
  .woocommerce div.product > .zpdp-section,
  .woocommerce div.product > .woocommerce-tabs{ float:none; width:auto; max-width:none; clear:both; }
  .woocommerce div.product .summary.entry-summary{ position:static; }
}

/* gallery + placeholder → soft tone box */
.woocommerce div.product div.images, .woocommerce-product-gallery{ position:relative; }
.woocommerce-product-gallery__image, .woocommerce-product-gallery__image--placeholder{ margin:0 !important; }
.woocommerce div.product .woocommerce-product-gallery img,
.woocommerce-product-gallery__image--placeholder img{
  border-radius:16px; background:var(--zin-brand-50); width:100%; display:block;
  aspect-ratio:16/10; object-fit:contain; padding:18px; box-sizing:border-box;
}

/* bỏ gạch chân: giá sale (<ins>), nút-link và link trong PDP (giữ <del> gạch ngang giá cũ) */
.woocommerce div.product ins,
.woocommerce div.product ins .amount,
.woocommerce div.product .summary a,
.woocommerce div.product .product_meta a,
.woocommerce div.product .related a, .woocommerce div.product .related a:hover,
.woocommerce div.product .zpdp-acc,
.zpdp-buynow, .zpdp-buynow:hover, .zpdp-cbtn, .zpdp-rev-cta, .zpdp-qa-cta, .zpdp-toc ol a,
.woocommerce div.product #respond #cancel-comment-reply-link,
.woocommerce .woocommerce-breadcrumb a{ text-decoration:none !important; }
.woocommerce div.product ins{ background:transparent; }

/* buy-box (summary) */
.woocommerce div.product .summary.entry-summary{
  background:#fff; border:1px solid var(--zin-line); border-radius:16px; padding:20px;
  position:static;  /* not sticky — a tall sticky buy-box overlaps the full-width sections below */
}
.woocommerce div.product .product_title{ font-size:23px; font-weight:800; line-height:1.25; margin:0 0 8px; }
.woocommerce div.product .woocommerce-product-rating{ margin:0 0 12px; font-size:13px; }
.woocommerce div.product .woocommerce-product-rating .star-rating{ font-size:1em; color:var(--zin-coral); }
.woocommerce div.product p.price, .woocommerce div.product .summary .price{
  font-size:27px; line-height:1.2; font-weight:800; color:var(--zin-coral) !important; margin:4px 0 4px;
}
.woocommerce div.product p.price del, .woocommerce div.product .summary .price del{ font-size:16px; }
.woocommerce div.product .summary .price ins{ text-decoration:none; }
.woocommerce-product-details__short-description{ color:var(--zin-ink); opacity:.86; font-size:14px; line-height:1.6; margin:8px 0 14px; }

/* add-to-cart row → big coral CTA + quantity */
.woocommerce div.product form.cart{ margin:16px 0 4px; display:flex; gap:10px; align-items:stretch; flex-wrap:wrap; }
.woocommerce div.product form.cart .quantity{ margin:0; }
.woocommerce div.product form.cart .quantity input.qty{
  width:68px; height:50px; border-radius:12px; border:1.5px solid var(--zin-line) !important; text-align:center; font-weight:700; font-size:15px;
}
/* add-to-cart = secondary (outline) since MUA NGAY is the primary CTA */
.woocommerce div.product form.cart .single_add_to_cart_button{
  flex:1 1 120px; min-width:0; min-height:50px; font-size:13.5px; font-weight:800; letter-spacing:0;
  padding:0 12px !important; white-space:nowrap;
  background:var(--zin-brand-50) !important; color:var(--zin-brand-700) !important;
  border:1.5px solid var(--zin-brand) !important; border-radius:12px !important; box-shadow:none !important;
  display:flex; align-items:center; justify-content:center; text-align:center;
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover{ background:#fff !important; }
/* MUA NGAY = primary buy-now CTA */
.zpdp-buynow{ display:flex; flex-direction:column; align-items:center; gap:1px; text-align:center; width:100%;
  padding:14px 14px; margin:0; border-radius:0; background:var(--zin-coral); color:#fff;
  font-size:17px; font-weight:800; letter-spacing:.02em; box-shadow:none; }
.zpdp-buynow:hover{ filter:brightness(1.05); color:#fff; }
.zpdp-buynow small{ font-size:11px; font-weight:500; opacity:.92; letter-spacing:0; }
.woocommerce div.product form.cart.variations_form{ flex-direction:column; }
.woocommerce div.product form.cart .variations{ width:100%; }
.woocommerce div.product form.cart .variations select{ border-radius:10px !important; border:1.5px solid var(--zin-line) !important; min-height:44px; }
.woocommerce div.product .product_meta{ font-size:12.5px; color:var(--zin-ink-3); border-top:1px solid var(--zin-line); margin-top:16px; padding-top:12px; }
.woocommerce div.product .product_meta > span{ display:block; margin:3px 0; }

/* ---- injected zin panels (.zpdp-*) ---- */
/* condition + colour picker + zin price (used devices) */
.zpdp-vgrid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:14px 0 4px; }
.zpdp-opt{ text-align:left; padding:9px 10px; border-radius:10px; border:1.5px solid var(--zin-line); background:#fff; cursor:pointer; display:flex; flex-direction:column; gap:3px; }
.zpdp-opt:hover{ border-color:var(--zin-brand-700); }
.zpdp-opt.is-on{ border-color:var(--zin-brand); background:var(--zin-brand-50); }
.zpdp-opt-l{ font-size:12.5px; font-weight:700; line-height:1.2; color:var(--zin-ink); }
.zpdp-opt-p{ font-size:13px; font-weight:800; color:var(--zin-coral); }
/* real variant grid (ACF Relationship): options are links to sibling products */
.zpdp-vlabel{ font-size:13px; font-weight:700; color:var(--zin-ink); margin:14px 0 8px; }
a.zpdp-opt{ text-decoration:none; }
a.zpdp-opt:hover{ border-color:var(--zin-brand); background:var(--zin-brand-50); }
.zpdp-vgrid--links .zpdp-opt.is-on{ border-color:var(--zin-brand); background:var(--zin-brand-50); box-shadow:0 0 0 1.5px var(--zin-brand) inset; cursor:default; }
.zpdp-vgrid--links .zpdp-opt.is-on::after{ content:""; position:absolute; top:6px; right:6px; width:7px; height:7px; border-radius:50%; background:var(--zin-brand); }
.zpdp-vgrid--links .zpdp-opt{ position:relative; }
.zpdp-clabel{ font-size:13px; font-weight:700; color:var(--zin-ink); margin:14px 0 8px; }
.zpdp-colors{ display:flex; gap:8px; flex-wrap:wrap; }
.zpdp-color{ display:flex; align-items:center; gap:8px; padding:8px 12px; border-radius:10px; border:1.5px solid var(--zin-line); background:#fff; cursor:pointer; font-size:13px; font-weight:600; color:var(--zin-ink); }
.zpdp-color:hover{ border-color:var(--zin-brand-700); }
.zpdp-color.is-on{ border-color:var(--zin-brand); background:var(--zin-brand-50); color:var(--zin-brand-700); }
.zpdp-color .sw{ width:16px; height:16px; border-radius:50%; border:1px solid rgba(0,0,0,.15); flex:0 0 auto; }
.zpdp-priceblock{ margin:16px 0 4px; }
.zpdp-price{ font-size:28px; font-weight:800; color:var(--zin-coral); line-height:1.15; }
.zpdp-pricenote{ font-size:12px; font-style:italic; color:var(--zin-ink-3); margin-top:6px; }
/* when the zin price block is shown, hide the native WC price (JS also does this as fallback) */
.woocommerce div.product .summary:has(.zpdp-priceblock) > p.price{ display:none; }
.zpdp-inst{ display:flex; gap:10px; margin:0; }
.zpdp-inst-btn{ flex:1; display:flex; flex-direction:column; gap:2px; align-items:center; text-align:center; padding:10px 8px; border:1.5px solid var(--zin-line); border-radius:10px; background:var(--zin-brand-50); }
.zpdp-inst-btn b{ font-size:12.5px; color:var(--zin-ink); }
.zpdp-inst-btn span{ font-size:10.5px; color:var(--zin-ink-3); }
.zpdp-tags{ display:flex; gap:8px; flex-wrap:wrap; margin:12px 0 4px; }
.zpdp-pill{ display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:700; padding:5px 10px; border-radius:8px; line-height:1.2; }
.zpdp-pill svg{ width:13px; height:13px; }
.zpdp-pill.is-green{ background:oklch(0.95 0.05 152); color:oklch(0.46 0.11 152); }
.zpdp-pill.is-amber{ background:oklch(0.95 0.07 75); color:oklch(0.48 0.12 70); }
.zpdp-pill.is-blue{ background:var(--zin-brand-50); color:var(--zin-brand-700); }
.zpdp-save{ background:oklch(0.965 0.03 40); border:1px solid oklch(0.9 0.05 40); border-radius:12px; padding:13px 14px; margin:14px 0; font-size:13.5px; line-height:1.55; }
.zpdp-save b{ color:var(--zin-coral); }
.zpdp-save a{ color:var(--zin-brand-700); font-weight:700; font-size:12.5px; }
.zpdp-panel{ background:#fff; border:1px solid var(--zin-line); border-radius:14px; overflow:hidden; margin:14px 0; }
.zpdp-panel > .zpdp-h{ display:flex; align-items:center; gap:8px; margin:0; padding:12px 15px; font-size:14px; font-weight:800; color:var(--zin-ink); background:var(--zin-bg); border-bottom:1px solid var(--zin-line); }
.zpdp-panel.is-accent > .zpdp-h{ background:var(--zin-brand-50); color:var(--zin-brand-700); }
.zpdp-panel > .zpdp-h svg{ width:18px; height:18px; }
.zpdp-body{ padding:14px 15px; font-size:13.5px; line-height:1.6; color:var(--zin-ink); }
.zpdp-body svg{ width:16px; height:16px; flex:0 0 auto; }  /* safety net: never let a body icon balloon */
.zpdp-body ul{ margin:0; padding-left:18px; display:flex; flex-direction:column; gap:7px; }
.zpdp-spec{ border:1px solid var(--zin-line); border-radius:10px; overflow:hidden; }
.zpdp-spec-row{ display:grid; grid-template-columns:128px 1fr; font-size:13px; }
.zpdp-spec-row:nth-child(odd){ background:var(--zin-bg); }
.zpdp-spec-row > span{ padding:9px 12px; }
.zpdp-spec-row .k{ color:var(--zin-ink-3); }
.zpdp-spec-row .v{ font-weight:600; }
.zpdp-cross{ display:flex; flex-direction:column; gap:12px; }
.zpdp-cross-row{ display:flex; align-items:center; gap:12px; }
.zpdp-cross-ic{ width:40px; height:40px; border-radius:10px; background:var(--zin-bg); color:var(--zin-brand); display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.zpdp-cross-ic svg{ width:20px; height:20px; }
.zpdp-cross-tx{ flex:1; }
.zpdp-cross-tx .nm{ font-size:13px; font-weight:600; }
.zpdp-cross-tx .of{ font-size:12px; color:var(--zin-coral); font-weight:700; }
.zpdp-cross-row .zpdp-cbtn{ font-size:12.5px; font-weight:700; color:var(--zin-brand-700); background:var(--zin-brand-50); border-radius:8px; padding:7px 12px; white-space:nowrap; }

/* ---- full-width content sections (Thông tin nổi bật / Mô tả / Hỏi & đáp) ---- */
.woocommerce div.product > .zpdp-section{ grid-column:1 / -1; min-width:0; }
.zpdp-section .zpdp-panel{ margin:14px 0; }
.zpdp-hl{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:11px; }
.zpdp-hl li{ display:flex; gap:10px; align-items:flex-start; font-size:14px; line-height:1.55; color:var(--zin-ink); }
.zpdp-hl li svg{ color:var(--zin-brand); margin-top:2px; }
.zpdp-desc p{ margin:0 0 12px; font-size:14px; line-height:1.7; color:var(--zin-ink); }
.zpdp-desc p:last-child{ margin-bottom:0; }
.zpdp-toc{ background:var(--zin-brand-50); border:1px solid var(--zin-line); border-radius:12px; padding:14px 16px; margin:4px 0 14px; }
.zpdp-toc-h{ display:flex; align-items:center; gap:8px; font-weight:800; font-size:14px; margin-bottom:8px; }
.zpdp-toc ol{ margin:0; padding-left:20px; display:flex; flex-direction:column; gap:6px; font-size:13.5px; color:var(--zin-brand-700); }
.zpdp-qa{ display:flex; flex-direction:column; gap:14px; }
.zpdp-qa-row{ border-top:1px solid var(--zin-line); padding-top:14px; }
.zpdp-qa-row:first-child{ border-top:none; padding-top:0; }
.zpdp-qa-q{ display:flex; gap:9px; align-items:flex-start; font-weight:700; font-size:14px; color:var(--zin-ink); }
.zpdp-qa-q svg{ color:var(--zin-brand); margin-top:2px; flex:0 0 auto; }
.zpdp-qa-a{ display:flex; gap:9px; align-items:flex-start; margin:9px 0 0 26px; background:var(--zin-bg); border:1px solid var(--zin-line); border-radius:10px; padding:10px 12px; font-size:13.5px; line-height:1.55; color:var(--zin-ink); }
.zpdp-qa-badge{ flex:0 0 auto; width:30px; height:22px; border-radius:6px; background:var(--zin-brand); color:#fff; font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; }
.zpdp-qa-cta{ display:inline-flex; align-items:center; gap:8px; margin-top:16px; padding:11px 16px; border-radius:10px; background:var(--zin-brand-50); color:var(--zin-brand-700); font-weight:700; font-size:13.5px; }
.zpdp-qa-cta:hover{ background:var(--zin-brand); color:#fff; }
.zpdp-qa-cta svg{ flex:0 0 auto; }

/* ---- "Phụ kiện mua kèm" row under gallery ---- */
.zpdp-accrow{ background:#fff; border:1px solid var(--zin-line); border-radius:14px; padding:12px 14px; }
.zpdp-accrow-h{ display:flex; align-items:center; gap:8px; font-weight:800; font-size:13.5px; margin-bottom:10px; }
.zpdp-accrow-h svg{ color:var(--zin-brand); }
.zpdp-accrow-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.zpdp-acc{ display:flex; flex-direction:column; gap:6px; border:1px solid var(--zin-line); border-radius:10px; padding:8px; text-decoration:none; transition:box-shadow .15s, transform .15s; }
.zpdp-acc:hover{ transform:translateY(-2px); box-shadow:0 12px 26px -14px rgba(28,40,90,.3); }
.zpdp-acc-img img{ width:100%; aspect-ratio:1/1; object-fit:contain; border-radius:8px; background:var(--zin-brand-50); }
.zpdp-acc-nm{ font-size:11.5px; line-height:1.3; color:var(--zin-ink); font-weight:600; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:30px; }
.zpdp-acc-pr{ font-size:12.5px; font-weight:800; color:var(--zin-coral); }
.zpdp-acc-pr del{ color:var(--zin-ink-3); font-weight:500; font-size:11px; }

/* ---- Đánh giá & nhận xét (rating summary + bars + reviews) ---- */
.zpdp-rev-top{ display:grid; grid-template-columns:auto 1fr; gap:20px; align-items:center; background:var(--zin-bg); border:1px solid var(--zin-line); border-radius:12px; padding:16px 18px; }
.zpdp-rev-score{ text-align:center; padding-right:18px; border-right:1px solid var(--zin-line); }
.zpdp-rev-score .n{ font-size:38px; font-weight:800; color:var(--zin-coral); line-height:1; }
.zpdp-rev-score .s{ color:var(--zin-coral); font-size:15px; letter-spacing:1px; margin-top:4px; }
.zpdp-rev-score .c{ font-size:12px; color:var(--zin-ink-3); margin-top:4px; }
.zpdp-rev-bars{ display:flex; flex-direction:column; gap:6px; }
.zpdp-rev-bar{ display:flex; align-items:center; gap:10px; font-size:12.5px; }
.zpdp-rev-bar .lbl{ width:24px; color:var(--zin-ink-3); }
.zpdp-rev-bar .track{ flex:1; height:8px; border-radius:5px; background:var(--zin-line); overflow:hidden; }
.zpdp-rev-bar .fill{ display:block; height:100%; background:var(--zin-coral); }
.zpdp-rev-bar .cnt{ width:54px; color:var(--zin-ink-3); }
.zpdp-rev-cta{ display:inline-flex; align-items:center; gap:8px; margin:16px 0; padding:11px 18px; border-radius:10px; background:var(--zin-coral); color:#fff; font-weight:800; font-size:14px; box-shadow:0 10px 22px -10px var(--zin-coral); }
.zpdp-rev-cta:hover{ filter:brightness(1.05); color:#fff; }
.zpdp-rev-cta svg{ flex:0 0 auto; }
.zpdp-rev-list{ display:flex; flex-direction:column; gap:14px; }
.zpdp-rev-item{ display:flex; gap:12px; border-top:1px solid var(--zin-line); padding-top:14px; }
.zpdp-rev-item .av{ flex:0 0 auto; width:36px; height:36px; border-radius:50%; background:var(--zin-brand-50); color:var(--zin-brand-700); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:15px; }
.zpdp-rev-item .bd{ flex:1; min-width:0; }
.zpdp-rev-item .hd{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.zpdp-rev-item .hd b{ font-size:14px; }
.zpdp-rev-item .ago{ font-size:12px; color:var(--zin-ink-3); }
.zpdp-rev-item .st{ color:var(--zin-coral); font-size:13px; margin:2px 0 4px; letter-spacing:1px; }
.zpdp-rev-item .tx{ font-size:13.5px; line-height:1.55; color:var(--zin-ink); }
.zpdp-rev-reply{ display:flex; gap:9px; align-items:flex-start; margin-top:9px; background:var(--zin-bg); border:1px solid var(--zin-line); border-radius:10px; padding:9px 11px; font-size:13px; line-height:1.5; color:var(--zin-ink); }
.zpdp-rev-empty{ margin:14px 0 0; font-size:13.5px; color:var(--zin-ink-3); }
/* the custom zin review summary (above) provides the heading + empty state; the WC
   reviews tab keeps only the real list + submit form → drop the duplicate header/nav */
.woocommerce div.product .woocommerce-tabs ul.tabs{ display:none !important; }
.woocommerce div.product #reviews .woocommerce-Reviews-title,
.woocommerce div.product #reviews .woocommerce-noreviews{ display:none !important; }
.woocommerce div.product .woocommerce-tabs .panel{ margin:0; padding:0; }
.woocommerce div.product #reviews #respond .comment-form-rating label{ font-weight:700; }
@media(max-width:560px){ .zpdp-accrow-grid{ grid-template-columns:repeat(2,1fr); } }

/* tabs */
.woocommerce div.product .woocommerce-tabs{ margin-top:30px; }
.woocommerce div.product .woocommerce-tabs ul.tabs{ padding:0; margin:0 0 18px; border-bottom:1px solid var(--zin-line); display:flex; gap:4px; flex-wrap:wrap; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before{ display:none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li{ background:transparent; border:none; border-radius:0; margin:0; padding:0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a{ padding:11px 16px; font-weight:700; color:var(--zin-ink-3); display:block; border-bottom:2px solid transparent; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{ color:var(--zin-brand-700); border-bottom-color:var(--zin-brand); }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after{ display:none; }

/* related / up-sells */
.woocommerce div.product .related, .woocommerce div.product .upsells{ margin-top:32px; border-top:1px solid var(--zin-line); padding-top:18px; }
.woocommerce div.product .related > h2, .woocommerce div.product .upsells > h2{ font-size:19px; font-weight:800; margin-bottom:16px; }

/* cart / checkout tables */
.woocommerce table.shop_table{ border-radius:7px; border:1px solid var(--zin-line); }
.woocommerce-cart table.cart img{ border-radius:7px; background:var(--zin-brand-50); width:64px; }
.wc-block-components-text-input input, .woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .select2-container .select2-selection{ border-radius:7px !important; border:1.5px solid var(--zin-line) !important; }

/* notices */
.woocommerce-message, .wc-block-components-notice-banner.is-success{ border-top-color:var(--zin-brand) !important; }
.woocommerce-message::before{ color:var(--zin-brand) !important; }

/* breadcrumb */
.woocommerce .woocommerce-breadcrumb{ font-size:13px; color:var(--zin-ink-3); margin-bottom:14px; }

/* ===== Ép Inter cho TOÀN BỘ (kể cả block WooCommerce/Gutenberg, ô form, theme cha) ===== */
html, body, input, button, select, textarea, optgroup,
.wp-site-blocks, [class^="wp-block-"], [class*=" wp-block-"],
.woocommerce, .woocommerce-page, .editor-styles-wrapper {
  font-family:"Inter", system-ui, -apple-system, sans-serif !important;
}

/* ============================================================
   PDP nâng cấp (gộp 4 proposal) — append cuối zin-woo.css.
   Phải nằm SAU mọi rule hiện có để thắng do thứ tự nguồn.
   ============================================================ */

/* ---- ISSUE 1: dải ảnh thu nhỏ dưới ảnh chính (.zpdp-thumbs) ---- */
.zpdp-thumbs{ display:flex; gap:10px; flex-wrap:nowrap; overflow-x:auto; margin:10px 0 0; padding:2px; -webkit-overflow-scrolling:touch; }
.zpdp-thumb{ flex:0 0 auto; width:74px; height:74px; border-radius:12px; border:1.5px solid var(--zin-line); background:var(--zin-brand-50); padding:6px; box-sizing:border-box; cursor:pointer; display:flex; align-items:center; justify-content:center; overflow:hidden; transition:border-color .15s, box-shadow .15s; }
.zpdp-thumb:hover{ border-color:var(--zin-brand-700); }
.zpdp-thumb.is-on{ border-color:var(--zin-brand); box-shadow:0 0 0 1.5px var(--zin-brand) inset; cursor:default; }
.zpdp-thumb img{ width:100%; height:100%; object-fit:contain; border-radius:8px; background:transparent; }
@media(max-width:920px){ .zpdp-thumbs{ flex-wrap:wrap; overflow-x:visible; } }
@media(max-width:560px){ .zpdp-thumb{ width:62px; height:62px; } }

/* ---- Tìm theo khu vực + chọn IMEI (nâng/cân cột phải) ---- */
.zpdp-region, .zpdp-imei{ margin:14px 0 4px; }
.zpdp-rlabel{ display:flex; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--zin-ink); margin:0 0 8px; }
.zpdp-rlabel svg{ color:var(--zin-brand); }
.zpdp-rrow{ display:flex; gap:8px; }
.zpdp-rsel{ flex:1 1 0; min-width:0; height:42px; border:1.5px solid var(--zin-line); border-radius:10px; background:#fff; padding:0 10px; font-size:13px; color:var(--zin-ink); cursor:pointer; }
.zpdp-rsel:focus{ outline:none; border-color:var(--zin-brand); }
.zpdp-imei-row{ display:flex; gap:8px; }
.zpdp-imei-btn{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; gap:4px; padding:8px 4px; border:1.5px solid var(--zin-line); border-radius:10px; background:#fff; cursor:pointer; }
.zpdp-imei-btn:hover{ border-color:var(--zin-brand-700); }
.zpdp-imei-btn.is-on{ border-color:var(--zin-brand); background:var(--zin-brand-50); }
.zpdp-imei-img{ width:100%; height:38px; border-radius:7px; background:#fff url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234c63d8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='7' y='2.5' width='10' height='19' rx='2'/><path d='M11 18.5h2'/></svg>") center/20px no-repeat; }
.zpdp-imei-l{ font-size:9px; color:var(--zin-ink-3); text-transform:uppercase; letter-spacing:.05em; line-height:1; }
.zpdp-imei-c{ font-size:11px; font-weight:800; color:var(--zin-ink); line-height:1; }

/* ===== Vùng mua hàng (giống dienthoaivui): MUA NGAY to + nút giỏ | 2 nút trả góp xanh =====
   .zpdp-buybox bọc [form.cart, MUA NGAY, trả góp] (mở prio28 / đóng prio34 trong mu-plugin). */
.woocommerce div.product .summary .zpdp-buybox{
  display:flex; flex-wrap:wrap; gap:10px; margin:18px 0 0; align-items:stretch;
}
/* MUA NGAY = nút chính lớn (coral) — order trước, chiếm phần lớn hàng 1 */
.woocommerce div.product .summary .zpdp-buybox > .zpdp-buynow{
  order:1; flex:1 1 0; min-width:0; width:auto; margin:0; padding:13px 14px; border-radius:14px;
  background:var(--zin-coral); color:#fff; border:none; box-shadow:0 12px 26px -10px var(--zin-coral);
  white-space:normal;
}
.woocommerce div.product .summary .zpdp-buybox > .zpdp-buynow small{ white-space:normal; }
.woocommerce div.product .summary .zpdp-buybox > .zpdp-buynow:hover{ filter:brightness(1.05); color:#fff; }
/* form.cart → nút "Thêm vào giỏ" nhỏ (icon + chữ) viền coral, cao bằng MUA NGAY */
.woocommerce div.product .summary .zpdp-buybox > form.cart{
  order:2; flex:0 0 92px; margin:0 !important; padding:0 !important;
  border:none !important; background:none !important; border-radius:0 !important; display:block;
}
.woocommerce div.product .summary .zpdp-buybox > form.cart .quantity{ display:none !important; }
.woocommerce div.product .summary .zpdp-buybox > form.cart .single_add_to_cart_button{
  width:100%; height:100%; min-height:100%; flex-direction:column; gap:3px;
  font-size:11.5px !important; line-height:1.15; font-weight:800; letter-spacing:0;
  padding:8px 6px !important; white-space:normal;
  background:#fff !important; color:var(--zin-coral) !important;
  border:1.5px solid var(--zin-coral) !important; border-radius:14px !important; box-shadow:none !important;
  display:flex; align-items:center; justify-content:center; text-align:center;
}
.woocommerce div.product .summary .zpdp-buybox > form.cart .single_add_to_cart_button:hover{
  background:var(--zin-coral) !important; color:#fff !important;
}
.woocommerce div.product .summary .zpdp-buybox > form.cart .single_add_to_cart_button::before{
  content:""; width:23px; height:23px; flex:0 0 auto;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e2553a' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><circle cx='9' cy='20' r='1.4'/><circle cx='18' cy='20' r='1.4'/><path d='M2 3h3l2.4 12.2a1.6 1.6 0 0 0 1.6 1.3h8.3a1.6 1.6 0 0 0 1.6-1.3L23 7H6'/></svg>") center/contain no-repeat;
}
.woocommerce div.product .summary .zpdp-buybox > form.cart .single_add_to_cart_button:hover::before{ filter:brightness(0) invert(1); }
/* 2 nút trả góp xanh nổi bật (hàng 2) */
.woocommerce div.product .summary .zpdp-buybox > .zpdp-inst{ order:3; flex:1 1 100%; margin:0; gap:10px; }
.woocommerce div.product .summary .zpdp-buybox .zpdp-inst-btn{
  flex:1 1 0; min-width:0; flex-direction:column; gap:3px; padding:11px 8px; text-align:center;
  background:var(--zin-brand); border:none; border-radius:12px; color:#fff;
  box-shadow:0 10px 22px -12px var(--zin-brand);
}
.woocommerce div.product .summary .zpdp-buybox .zpdp-inst-btn b{ font-size:13px; color:#fff; font-weight:800; }
.woocommerce div.product .summary .zpdp-buybox .zpdp-inst-btn span{ font-size:10.5px; color:rgba(255,255,255,.88); }
.woocommerce div.product .summary .zpdp-buybox .zpdp-inst-btn .zpdp-pre{ color:#fff; font-weight:700; }
@media(max-width:380px){
  .woocommerce div.product .summary .zpdp-buybox > .zpdp-buynow,
  .woocommerce div.product .summary .zpdp-buybox > form.cart{ flex-basis:100%; }
}

/* ============================================================
   ISSUE 3 — khu đánh giá native WooCommerce (#reviews): style form + list
   ============================================================ */
.woocommerce div.product #reviews{ margin-top:8px; }
.woocommerce div.product #reviews #comments{ margin:0; }

.woocommerce div.product #reviews ol.commentlist{ list-style:none; margin:0; padding:0; }
.woocommerce div.product #reviews ol.commentlist li.comment{ margin:0; padding:0; }
.woocommerce div.product #reviews ol.commentlist li.comment + li.comment{ margin-top:14px; }
.woocommerce div.product #reviews ol.commentlist li .comment_container{
  display:flex; gap:12px; align-items:flex-start;
  border:1px solid var(--zin-line); border-radius:12px; background:#fff;
  padding:14px 15px; position:relative;
}
.woocommerce div.product #reviews ol.commentlist li img.avatar{
  position:static; float:none; width:40px; height:40px; border-radius:50%;
  margin:0; padding:0; border:none; background:var(--zin-brand-50); flex:0 0 auto;
}
.woocommerce div.product #reviews ol.commentlist li .comment-text{
  flex:1; min-width:0; margin:0; border:none; padding:0;
}
.woocommerce div.product #reviews ol.commentlist li .comment-text p.meta{
  font-size:12.5px; color:var(--zin-ink-3); margin:0 0 4px; line-height:1.4;
}
.woocommerce div.product #reviews ol.commentlist li .comment-text p.meta strong,
.woocommerce div.product #reviews ol.commentlist li .comment-text .woocommerce-review__author{
  color:var(--zin-ink); font-weight:800; font-size:14px;
}
.woocommerce div.product #reviews ol.commentlist li .comment-text .woocommerce-review__dash{ color:var(--zin-ink-3); }
.woocommerce div.product #reviews ol.commentlist li .comment-text .woocommerce-review__published-date{
  color:var(--zin-ink-3); font-weight:500; font-size:12px;
}
.woocommerce div.product #reviews ol.commentlist li .comment-text .star-rating{
  color:var(--zin-coral); font-size:13px; margin:0 0 6px; float:none;
}
.woocommerce div.product #reviews ol.commentlist li .comment-text .star-rating::before{ color:var(--zin-line); }
.woocommerce div.product #reviews ol.commentlist li .comment-text .description,
.woocommerce div.product #reviews ol.commentlist li .comment-text .description p{
  font-size:13.5px; line-height:1.6; color:var(--zin-ink); margin:0;
}
.woocommerce div.product #reviews ol.commentlist li .comment-text .description p + p{ margin-top:8px; }
.woocommerce div.product #reviews ol.commentlist ul.children{ list-style:none; margin:10px 0 0; padding:0 0 0 20px; }

.woocommerce div.product #reviews #review_form_wrapper{ margin-top:16px; }
.woocommerce div.product #reviews #respond{
  border:1px solid var(--zin-line); border-radius:14px; background:#fff;
  padding:16px 16px 18px; margin:0;
}
.woocommerce div.product #reviews #respond #reply-title.comment-reply-title{
  display:block; font-size:15px; font-weight:800; color:var(--zin-ink);
  margin:0 0 12px; padding:0;
}
.woocommerce div.product #reviews #respond .comment-form{ margin:0; }
.woocommerce div.product #reviews #respond .comment-form > p{ margin:0 0 12px; }
.woocommerce div.product #reviews #respond .comment-notes{ font-size:13px; color:var(--zin-ink-3); font-weight:400; line-height:1.5; margin:0 0 14px; }
.woocommerce div.product #reviews #respond .comment-form label{
  display:block; font-size:13px; font-weight:700; color:var(--zin-ink); margin:0 0 6px;
}
.woocommerce div.product #reviews #respond .comment-form input[type="text"],
.woocommerce div.product #reviews #respond .comment-form input[type="email"],
.woocommerce div.product #reviews #respond .comment-form textarea#comment,
.woocommerce div.product #reviews #respond .comment-form textarea{
  width:100%; box-sizing:border-box; font-size:14px; color:var(--zin-ink);
  background:#fff; border:1.5px solid var(--zin-line) !important; border-radius:10px !important;
  padding:11px 13px; line-height:1.5; transition:border-color .15s, box-shadow .15s;
}
.woocommerce div.product #reviews #respond .comment-form textarea#comment,
.woocommerce div.product #reviews #respond .comment-form textarea{ min-height:118px; resize:vertical; }
.woocommerce div.product #reviews #respond .comment-form input[type="text"]:focus,
.woocommerce div.product #reviews #respond .comment-form input[type="email"]:focus,
.woocommerce div.product #reviews #respond .comment-form textarea:focus{
  outline:none; border-color:var(--zin-brand) !important;
  box-shadow:0 0 0 3px var(--zin-brand-50);
}
.woocommerce div.product #reviews #respond .comment-form input::placeholder,
.woocommerce div.product #reviews #respond .comment-form textarea::placeholder{ color:var(--zin-ink-3); }

.woocommerce div.product #reviews #respond .comment-form-rating{ margin:0 0 14px; }
.woocommerce div.product #reviews #respond .comment-form-rating label{ margin:0 0 8px; }
.woocommerce div.product #reviews #respond p.stars{
  display:inline-flex; align-items:center; gap:2px; margin:0; line-height:1;
}
.woocommerce div.product #reviews #respond p.stars a{
  position:relative; width:30px; height:28px; margin:0; padding:0; float:none;
  text-indent:0; border:none; box-shadow:none; background:none; font-size:0;
}
.woocommerce div.product #reviews #respond p.stars a::before{
  content:"\2605"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:26px; line-height:1; color:var(--zin-line); transition:color .12s, transform .12s;
}
.woocommerce div.product #reviews #respond p.stars a:hover::before{ transform:scale(1.08); }
.woocommerce div.product #reviews #respond p.stars:hover a::before{ color:var(--zin-line); }
.woocommerce div.product #reviews #respond p.stars a:hover::before,
.woocommerce div.product #reviews #respond p.stars a:hover ~ a::before{ color:var(--zin-coral); }
.woocommerce div.product #reviews #respond p.stars.selected a.active::before,
.woocommerce div.product #reviews #respond p.stars.selected a.active ~ a::before{ color:var(--zin-coral); }
.woocommerce div.product #reviews #respond p.stars.selected a:not(.active)::before{ color:var(--zin-line); }

.woocommerce div.product #reviews #respond .comment-form-cookies-consent{
  display:flex; align-items:flex-start; gap:8px; font-size:12.5px; color:var(--zin-ink-3); line-height:1.5;
}
.woocommerce div.product #reviews #respond .comment-form-cookies-consent label{
  display:inline; font-weight:500; color:var(--zin-ink-3); margin:0;
}
.woocommerce div.product #reviews #respond .comment-form-cookies-consent input[type="checkbox"]{
  width:16px; height:16px; margin:1px 0 0; accent-color:var(--zin-brand); flex:0 0 auto;
}

.woocommerce div.product #reviews #respond .form-submit{ margin:4px 0 0; }
.woocommerce div.product #reviews #respond .form-submit input#submit,
.woocommerce div.product #reviews #respond .form-submit input.submit,
.woocommerce div.product #reviews #respond .form-submit .wp-element-button{
  background:var(--zin-coral) !important; color:#fff !important; border:none !important;
  border-radius:10px !important; font-size:14px; font-weight:800 !important; letter-spacing:.02em;
  padding:12px 26px !important; box-shadow:0 10px 22px -10px var(--zin-coral) !important; cursor:pointer;
}
.woocommerce div.product #reviews #respond .form-submit input#submit:hover,
.woocommerce div.product #reviews #respond .form-submit input.submit:hover,
.woocommerce div.product #reviews #respond .form-submit .wp-element-button:hover{ filter:brightness(1.05); }

.woocommerce div.product #reviews #respond .must-log-in{ font-size:13.5px; color:var(--zin-ink-3); }
.woocommerce div.product #reviews #respond .must-log-in a{ color:var(--zin-brand-700); font-weight:700; }

@media(max-width:560px){
  .woocommerce div.product #reviews ol.commentlist li .comment_container{ padding:12px; gap:10px; }
  .woocommerce div.product #reviews #respond{ padding:14px; }
}