/* ============ PRODUCT DETAIL PAGE ============ */

/* --- Rating row --- */
.mf-rating-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.mf-rating-avg{color:var(--mf-text);font-family:var(--mf-font-head);font-weight:800;font-size:1.05rem}
.mf-rating-row .star-rating{color:#f5b301;font-size:.95rem;margin:0}
.mf-rating-row .woocommerce-review-link,.mf-review-count{color:var(--mf-text2)!important;font-size:.9rem}
.mf-rating-none{color:var(--mf-text2);font-size:.9rem}

/* --- Hide product meta (category / tags / brand) --- */
.woocommerce div.product .product_meta{display:none!important}

/* --- Kit Contents --- */
.mf-kit{margin:26px 0 0;padding:22px 24px;background:var(--mf-surface);
  border:1px solid var(--mf-border);border-radius:16px}
.mf-kit-title{font-family:var(--mf-font-head)!important;font-weight:800!important;
  font-size:1.05rem!important;color:var(--mf-text)!important;margin:0 0 14px!important}
.mf-kit-body{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.mf-kit-list{list-style:none;margin:0;padding:0;flex:1 1 220px;min-width:0}
.mf-kit-list li{position:relative;padding-left:22px;margin-bottom:9px;
  color:var(--mf-text2);font-size:.94rem;line-height:1.5}
.mf-kit-list li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;
  border-radius:50%;background:var(--mf-accent)}
.mf-kit-img{flex:0 0 150px;max-width:150px;border-radius:10px;
  border:1px solid var(--mf-border);background:var(--mf-tile)}

/* --- Social share --- */
.mf-share{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:22px 0 0;position:relative}
.mf-share-label{color:var(--mf-text2);font-size:.9rem;font-family:var(--mf-font-head);font-weight:600}
.mf-share-btn{
  width:38px;height:38px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--mf-surface)!important;border:1px solid var(--mf-border)!important;
  color:var(--mf-text2)!important;cursor:pointer;transition:var(--mf-transition);padding:0;
}
.mf-share-btn:hover{border-color:var(--mf-accent)!important;color:var(--mf-accent)!important;transform:translateY(-2px)}
.mf-share-btn i{font-size:15px}
.mf-share-btn:focus-visible{outline:2px solid var(--mf-accent);outline-offset:2px}
.mf-share-toast{color:var(--mf-accent);font-size:.85rem;opacity:0;transition:opacity .25s ease}
.mf-share-toast.is-visible{opacity:1}

/* ============ DESCRIPTION / SPECIFICATIONS (tabbed, centred) ============ */
.woocommerce div.product .woocommerce-tabs{
  display:block!important;
  max-width:1000px;margin:44px auto 0!important;
  background:#16161f!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:20px!important;
  padding:32px 40px 40px!important;
}

/* Tab strip — visible and clickable */
.woocommerce div.product .woocommerce-tabs ul.tabs{
  display:flex!important;gap:32px;list-style:none;
  margin:0 0 28px!important;padding:0 0 0 0!important;
  border-bottom:1px solid rgba(255,255,255,.09)!important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after{display:none!important;border:0!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:transparent!important;border:0!important;border-radius:0!important;
  margin:0!important;padding:0!important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  display:inline-block;padding:0 0 14px!important;
  color:var(--mf-text2)!important;font-family:var(--mf-font-head)!important;
  font-weight:700!important;font-size:1rem!important;
  border-bottom:2px solid transparent!important;
  transition:color .2s ease,border-color .2s ease;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover{color:var(--mf-text)!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{
  color:var(--mf-accent)!important;border-bottom-color:var(--mf-accent)!important;
}

/* Panels */
.woocommerce div.product .woocommerce-tabs .panel{
  background:transparent!important;border:0!important;box-shadow:none!important;
  margin:0!important;padding:0!important;max-width:none!important;
}
/* Panel heading (Description / Specifications) */
.woocommerce div.product .woocommerce-tabs .panel > h2{
  font-family:var(--mf-font-head)!important;font-weight:800!important;
  font-size:1.15rem!important;letter-spacing:.05em;text-transform:uppercase;
  color:var(--mf-text)!important;margin:0 0 22px!important;text-align:left!important;
}
/* Description body */
.woocommerce div.product .woocommerce-Tabs-panel--description{
  column-count:1!important;
  color:var(--mf-text2)!important;line-height:1.9;font-size:.98rem;
}
.woocommerce div.product .woocommerce-Tabs-panel--description p{margin:0 0 12px}
.woocommerce div.product .woocommerce-Tabs-panel--description ul{padding-left:20px;margin:0 0 14px}
.woocommerce div.product .woocommerce-Tabs-panel--description li{margin-bottom:8px}

/* --- Specifications: ONE single stacked column --- */
.woocommerce div.product table.woocommerce-product-attributes,
.woocommerce div.product table.shop_attributes{
  display:block!important;width:100%!important;max-width:none!important;
  margin:0!important;border:0!important;background:transparent!important;
}
.woocommerce div.product table.woocommerce-product-attributes tbody,
.woocommerce div.product table.shop_attributes tbody{display:block!important}
.woocommerce div.product table.woocommerce-product-attributes tr,
.woocommerce div.product table.shop_attributes tr{
  display:grid!important;grid-template-columns:minmax(190px,32%) 1fr!important;
  align-items:baseline;gap:24px;
  padding:16px 0!important;
  border-bottom:1px solid rgba(255,255,255,.07)!important;
  background:transparent!important;
}
.woocommerce div.product table.woocommerce-product-attributes tr:first-child,
.woocommerce div.product table.shop_attributes tr:first-child{padding-top:0!important}
.woocommerce div.product table.woocommerce-product-attributes tr:last-child,
.woocommerce div.product table.shop_attributes tr:last-child{border-bottom:0!important;padding-bottom:0!important}
.woocommerce div.product table.woocommerce-product-attributes th,
.woocommerce div.product table.shop_attributes th{
  border:0!important;background:transparent!important;padding:0!important;
  color:var(--mf-text)!important;font-family:var(--mf-font-head)!important;
  font-weight:700!important;font-size:.95rem!important;font-style:normal!important;
  text-align:left!important;white-space:normal!important;width:auto!important;
}
.woocommerce div.product table.woocommerce-product-attributes td,
.woocommerce div.product table.shop_attributes td,
.woocommerce div.product table.woocommerce-product-attributes td p,
.woocommerce div.product table.shop_attributes td p{
  border:0!important;background:transparent!important;padding:0!important;margin:0!important;
  color:var(--mf-text2)!important;font-family:var(--mf-font-body)!important;
  font-weight:400!important;font-size:.98rem!important;font-style:normal!important;
  text-align:left!important;line-height:1.6;
}

/* --- Responsive (kit + tabs) --- */
@media(max-width:900px){
  .mf-kit-body{flex-direction:column}
  .mf-kit-img{flex:1 1 auto;max-width:100%;width:100%}
  .woocommerce div.product .woocommerce-tabs{padding:26px 22px 30px!important;margin-top:32px!important}
  .woocommerce div.product .woocommerce-tabs ul.tabs{gap:22px}
}
@media(max-width:600px){
  .woocommerce div.product table.woocommerce-product-attributes tr,
  .woocommerce div.product table.shop_attributes tr{grid-template-columns:1fr!important;gap:5px}
}

/* --- Accessibility: visible focus --- */
.mf-buy-now:focus-visible,.mf-wishlist-btn:focus-visible,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:focus-visible{
  outline:2px solid var(--mf-accent);outline-offset:2px;
}

/* ============ ADD-TO-CART BLOCK: quantity stepper + action buttons ============ */
/* Layout:  Row 1  ->  [ quantity stepper ]  [ Add to cart ]
            Row 2  ->  [ Buy Now ]           [ Add to Wishlist ]

   Applied to two selectors so it works on BOTH product types:
   - Simple products:   form.cart          (no variations_form class)
   - Variable products: .woocommerce-variation-add-to-cart
                        (form.cart also wraps variation dropdowns which must flow normally above) */

.woocommerce div.product form.cart:not(.variations_form),
.woocommerce div.product .woocommerce-variation-add-to-cart{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  grid-auto-rows:50px;
  gap:12px!important;
  align-items:stretch;
  max-width:460px;
  margin:0 0 24px!important;
}

/* Grid placement (works inside either container above) */
.woocommerce div.product form.cart:not(.variations_form) > .quantity,
.woocommerce div.product .woocommerce-variation-add-to-cart > .quantity{grid-column:1;grid-row:1;margin:0!important}

.woocommerce div.product form.cart:not(.variations_form) > button.single_add_to_cart_button,
.woocommerce div.product .woocommerce-variation-add-to-cart > button.single_add_to_cart_button{grid-column:2;grid-row:1}

.woocommerce div.product form.cart:not(.variations_form) > .mf-buy-now,
.woocommerce div.product .woocommerce-variation-add-to-cart > .mf-buy-now{grid-column:1;grid-row:2}

.woocommerce div.product form.cart:not(.variations_form) > .mf-wishlist-btn,
.woocommerce div.product .woocommerce-variation-add-to-cart > .mf-wishlist-btn{grid-column:2;grid-row:2}

/* On variable products, form.cart itself must NOT be a grid — it needs to flow
   variations table, price/stock, then the add-to-cart wrapper as blocks. */
.woocommerce div.product form.cart.variations_form{display:block!important;margin:0 0 24px!important}
.woocommerce div.product form.cart.variations_form .variations{margin:0 0 16px!important}

/* --- Quantity stepper (single, full-width pill) --- */
.woocommerce div.product form.cart .quantity{
  display:flex!important;align-items:center;justify-content:space-between;
  width:100%!important;height:50px;
  background:var(--mf-surface)!important;
  border:1px solid var(--mf-border)!important;border-radius:99px!important;
  overflow:hidden;padding:0 4px!important;
}
.woocommerce div.product form.cart .quantity input.qty{
  flex:1 1 auto;width:auto!important;min-width:0;height:100%!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  color:var(--mf-text)!important;text-align:center!important;
  font-family:var(--mf-font-head)!important;font-weight:700!important;font-size:1rem!important;
  padding:0!important;margin:0!important;-moz-appearance:textfield;appearance:textfield;
}
.woocommerce div.product form.cart .quantity input.qty::-webkit-outer-spin-button,
.woocommerce div.product form.cart .quantity input.qty::-webkit-inner-spin-button{
  -webkit-appearance:none;margin:0;display:none;
}
.woocommerce div.product form.cart .quantity input.qty:focus{
  outline:none!important;box-shadow:none!important;background:transparent!important;
}
.woocommerce div.product form.cart .quantity .mf-qty-btn{
  flex:0 0 auto;width:44px;height:100%;
  background:transparent!important;border:0!important;color:var(--mf-text)!important;
  cursor:pointer;font-family:var(--mf-font-head);font-size:1.2rem;line-height:1;
  display:grid;place-items:center;padding:0!important;margin:0!important;border-radius:99px;
  transition:color .2s ease,background .2s ease;
}
.woocommerce div.product form.cart .quantity .mf-qty-btn:hover{
  color:var(--mf-accent)!important;background:rgba(142,194,63,.1)!important;
}
.woocommerce div.product form.cart .quantity .mf-qty-btn:focus-visible{
  outline:2px solid var(--mf-accent);outline-offset:-2px;
}
/* hide the "Quantity" screen-reader label so it doesn't break the pill */
.woocommerce div.product form.cart .quantity label,
.woocommerce div.product form.cart .quantity .screen-reader-text{
  position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
}

/* --- Shared button shape --- */
.woocommerce div.product form.cart button.single_add_to_cart_button,
.mf-buy-now,
.mf-wishlist-btn{
  width:100%!important;min-width:0!important;max-width:none!important;
  height:50px!important;margin:0!important;padding:0 18px!important;
  border-radius:99px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  gap:8px;font-family:var(--mf-font-head)!important;font-weight:700!important;
  letter-spacing:.01em;white-space:nowrap;cursor:pointer;transition:var(--mf-transition);
}

/* Primary — Add to cart */
.woocommerce div.product form.cart button.single_add_to_cart_button{
  font-size:.98rem!important;
  background:var(--mf-accent)!important;color:#0a0a0f!important;border:0!important;
  box-shadow:0 6px 20px var(--mf-accent-glow)!important;
}
.woocommerce div.product form.cart button.single_add_to_cart_button:hover{
  background:var(--mf-accent-light)!important;transform:translateY(-2px);
}

/* Secondary — Buy Now */
.mf-buy-now{
  font-size:.96rem!important;
  background:transparent!important;color:var(--mf-accent)!important;
  border:2px solid var(--mf-accent)!important;box-shadow:none!important;
}
.mf-buy-now:hover{background:var(--mf-accent)!important;color:#0a0a0f!important;transform:translateY(-2px)}

/* Tertiary — Wishlist */
.mf-wishlist-btn{
  font-size:.9rem!important;font-weight:600!important;
  background:transparent!important;color:var(--mf-text2)!important;
  border:1px solid var(--mf-border)!important;box-shadow:none!important;
}
.mf-wishlist-btn svg{width:17px;height:17px;flex:none}
.mf-wishlist-btn:hover{border-color:var(--mf-accent)!important;color:var(--mf-accent)!important;transform:translateY(-2px)}
.mf-wishlist-btn.is-active{color:var(--mf-accent)!important;border-color:var(--mf-accent)!important;box-shadow:0 0 12px var(--mf-accent-glow)!important}
.mf-wishlist-btn.is-active svg{fill:var(--mf-accent)}

/* --- Variation dropdowns (variable products only) --- */
.woocommerce div.product form.cart.variations_form table.variations{
  border:0!important;background:transparent!important;width:100%!important;max-width:460px;
}
.woocommerce div.product form.cart.variations_form table.variations tr{
  display:grid!important;grid-template-columns:110px 1fr!important;
  align-items:center;gap:12px;padding:0 0 12px!important;background:transparent!important;
}
.woocommerce div.product form.cart.variations_form table.variations th.label,
.woocommerce div.product form.cart.variations_form table.variations td.label{
  border:0!important;background:transparent!important;padding:0!important;
  color:var(--mf-text)!important;font-family:var(--mf-font-head)!important;
  font-weight:700!important;font-size:.92rem!important;text-align:left!important;
}
.woocommerce div.product form.cart.variations_form table.variations td.value{
  border:0!important;background:transparent!important;padding:0!important;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.woocommerce div.product form.cart.variations_form table.variations td.value select{
  flex:1 1 auto;min-width:0;height:44px;padding:0 36px 0 14px;
  background:var(--mf-surface)!important;color:var(--mf-text)!important;
  border:1px solid var(--mf-border)!important;border-radius:99px!important;
  font-family:var(--mf-font-body)!important;font-size:.94rem!important;
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--mf-text2) 50%),linear-gradient(135deg,var(--mf-text2) 50%,transparent 50%)!important;
  background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%!important;
  background-size:6px 6px,6px 6px!important;background-repeat:no-repeat!important;
  cursor:pointer;transition:var(--mf-transition);
}
.woocommerce div.product form.cart.variations_form table.variations td.value select:hover,
.woocommerce div.product form.cart.variations_form table.variations td.value select:focus{
  border-color:var(--mf-accent)!important;outline:none!important;
}
.woocommerce div.product form.cart.variations_form .reset_variations{
  color:var(--mf-text2)!important;font-size:.82rem!important;
  text-decoration:none;border-bottom:1px dashed var(--mf-border);padding-bottom:1px;
  transition:var(--mf-transition);
}
.woocommerce div.product form.cart.variations_form .reset_variations:hover{
  color:var(--mf-accent)!important;border-bottom-color:var(--mf-accent);
}
/* Variation price + stock line */
.woocommerce div.product form.cart.variations_form .single_variation_wrap .woocommerce-variation{
  margin:0 0 14px!important;
}
.woocommerce div.product form.cart.variations_form .single_variation_wrap .woocommerce-variation-price .price{
  color:var(--mf-accent)!important;font-family:var(--mf-font-head)!important;
  font-weight:800!important;font-size:1.4rem!important;
}
.woocommerce div.product form.cart.variations_form .single_variation_wrap .woocommerce-variation-availability{
  color:var(--mf-text2)!important;font-size:.88rem;margin-top:4px;
}
/* Disabled add-to-cart state (before a variation is picked) */
.woocommerce div.product form.cart button.single_add_to_cart_button.disabled,
.woocommerce div.product form.cart button.single_add_to_cart_button:disabled{
  opacity:.5!important;cursor:not-allowed!important;transform:none!important;
  box-shadow:none!important;
}

/* --- Stack on small screens for larger tap targets --- */
/* ===================== TABLET  (<=1024px) ===================== */
/* B5 FIX — variations table: stack label above the dropdown from the mobile
 * breakpoint (767px) rather than 480px. Between 481-767px the previous
 * `110px 1fr` grid squeezed longer attribute labels against the select.
 *
 * Selector notes:
 *   form.cart.variations_form  — restricts to variable products only, so
 *                                simple-product layouts are untouched
 *   table.variations tr        — each attribute row (Variants, Colour, etc.) */
@media(max-width:767px){
  .woocommerce div.product form.cart.variations_form table.variations tr{
    grid-template-columns:1fr;
    gap:6px;
  }
  /* Label sits on its own line above the control */
  .woocommerce div.product form.cart.variations_form table.variations th.label,
  .woocommerce div.product form.cart.variations_form table.variations td.label{
    margin-bottom:2px;
  }
  /* Dropdown takes full width; Clear link drops onto its own line beneath */
  .woocommerce div.product form.cart.variations_form table.variations td.value{
    flex-direction:column;
    align-items:stretch;
    gap:8px;
  }
  .woocommerce div.product form.cart.variations_form table.variations td.value select{
    width:100%;
    min-height:48px;   /* touch target — WCAG 2.5.5 / Apple HIG */
    font-size:16px;    /* prevents iOS Safari zoom-on-focus */
  }
  /* Clear link: left-aligned, own tap area, no longer crowding the select */
  .woocommerce div.product form.cart.variations_form .reset_variations{
    align-self:flex-start;
    min-height:32px;
    display:inline-flex;
    align-items:center;
  }
}

/* ===================== MOBILE  (<=480px) ===================== */
@media(max-width:480px){
  .woocommerce div.product form.cart:not(.variations_form),
  .woocommerce div.product .woocommerce-variation-add-to-cart{
    grid-template-columns:1fr!important;max-width:none;
  }
  .woocommerce div.product form.cart:not(.variations_form) > .quantity,
  .woocommerce div.product .woocommerce-variation-add-to-cart > .quantity{grid-column:1;grid-row:1}
  .woocommerce div.product form.cart:not(.variations_form) > button.single_add_to_cart_button,
  .woocommerce div.product .woocommerce-variation-add-to-cart > button.single_add_to_cart_button{grid-column:1;grid-row:2}
  .woocommerce div.product form.cart:not(.variations_form) > .mf-buy-now,
  .woocommerce div.product .woocommerce-variation-add-to-cart > .mf-buy-now{grid-column:1;grid-row:3}
  .woocommerce div.product form.cart:not(.variations_form) > .mf-wishlist-btn,
  .woocommerce div.product .woocommerce-variation-add-to-cart > .mf-wishlist-btn{grid-column:1;grid-row:4}
}
