/* ============================================================
   VELORA PDP — Layer 2 product-page restyle (2026-07-20)
   Scoped to body.single-product. Restyles the native WooCommerce
   single-product markup (gallery + summary/buy panel + tabs +
   related) into the v2 "candlelit spice table" system.
   Keeps all Woo functionality intact — pure CSS, reversible.
   Append to Additional CSS after the homepage Layer-2 blocks.
   Fonts (Marcellus/Spectral/Jost) load globally from Layer 1.
   ============================================================ */

/* ---- Layout: two-column gallery | summary ---- */
body.single-product .ast-woocommerce-container{
  max-width:1220px; margin-inline:auto;
  padding-inline:clamp(1.25rem,5vw,4rem);
}
body.single-product div.product{
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:clamp(2rem,4vw,4rem); align-items:start;
}
body.single-product div.product::before,
body.single-product div.product::after{ content:none !important; } /* kill Woo clearfix */
/* tabs, related + upsells are also direct children of div.product — span full width below the gallery/summary row */
body.single-product div.product > .woocommerce-tabs,
body.single-product div.product > .related.products,
body.single-product div.product > .up-sells.products,
body.single-product div.product > .woocommerce-product-gallery + .summary ~ *{ grid-column:1 / -1; }

/* ---- Gallery ---- */
body.single-product .woocommerce-product-gallery{
  position:sticky; top:96px; float:none !important; width:auto !important; margin:0 !important;
}
body.single-product .woocommerce-product-gallery__wrapper{ margin:0; }
body.single-product .woocommerce-product-gallery .flex-viewport,
body.single-product .woocommerce-product-gallery figure,
body.single-product .woocommerce-product-gallery__image{
  border-radius:4px; overflow:hidden; background:#efe4cd;
}
body.single-product .woocommerce-product-gallery__image{
  box-shadow:0 40px 80px -46px rgba(30,20,5,.5);
}
body.single-product .woocommerce-product-gallery img{ border-radius:4px; }
/* thumbnails */
body.single-product .flex-control-thumbs{
  display:flex; flex-wrap:wrap; gap:.6rem; margin:.8rem 0 0; padding:0; list-style:none;
}
body.single-product .flex-control-thumbs li{ width:72px !important; margin:0; }
body.single-product .flex-control-thumbs img{
  border:1px solid #e6d8bb; border-radius:4px; opacity:.75;
  transition:opacity .3s ease, border-color .3s ease, transform .3s ease;
}
body.single-product .flex-control-thumbs img:hover{ transform:translateY(-2px); }
body.single-product .flex-control-thumbs img.flex-active,
body.single-product .flex-control-thumbs .flex-active img{
  opacity:1; border-color:#1f4b3b; box-shadow:0 0 0 1px #1f4b3b;
}
/* onsale flag */
body.single-product span.onsale{
  background:#c0381c !important; color:#fff !important; border-radius:2px;
  font-family:"Jost",sans-serif; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  font-size:.66rem; padding:.5em 1em; min-height:0; min-width:0; line-height:1.2;
}

/* ---- Summary / buy panel ---- */
body.single-product .summary.entry-summary{ float:none !important; width:auto !important; margin:0 !important; }

/* eyebrow above the title */
body.single-product .entry-summary .product_title::before{
  content:"Our signature blend"; display:flex; align-items:center; gap:.7rem;
  font-family:"Jost",sans-serif; font-weight:500; font-size:.72rem; letter-spacing:.26em;
  text-transform:uppercase; color:#7a5108; margin-bottom:.9rem;
}
body.single-product .entry-summary .product_title::after{
  content:""; /* keep hook available */
}
body.single-product h1.product_title{
  font-family:"Marcellus",serif; font-weight:400; letter-spacing:-.01em; line-height:1.08;
  font-size:clamp(2.1rem,4vw,3.1rem); color:#23241b; margin:0 0 .3rem;
}

/* price */
body.single-product .summary .price,
body.single-product .summary .price ins{
  font-family:"Marcellus",serif; color:#1f4b3b !important;
}
body.single-product .summary .price{
  font-size:2.6rem; line-height:1; margin:1.3rem 0 .2rem;
  display:flex; align-items:baseline; gap:.9rem; flex-wrap:wrap;
}
body.single-product .summary .price .woocommerce-Price-amount{ font-size:2.6rem; color:#1f4b3b; }
body.single-product .summary .price del{
  font-family:"Jost",sans-serif; font-size:1rem; color:#5c5a49; opacity:.8;
}
body.single-product .summary .price::after{
  content:"60g pouch · ≈ 24 cups"; display:block; flex-basis:100%;
  font-family:"Jost",sans-serif; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase;
  color:#5c5a49; margin-top:.5rem;
}

/* short description */
body.single-product .woocommerce-product-details__short-description{
  margin-top:1.2rem; color:#5c5a49; font-size:1.08rem; line-height:1.7; max-width:46ch;
}
body.single-product .woocommerce-product-details__short-description p{ margin:0; }

/* stock */
body.single-product .ast-stock-detail,
body.single-product p.stock{
  font-family:"Jost",sans-serif; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase;
  color:#1f4b3b; margin-top:1.2rem;
}

/* divider before purchase */
body.single-product form.cart{
  margin-top:1.6rem; padding-top:1.6rem; border-top:1px solid #e6d8bb;
  display:flex; gap:.9rem; flex-wrap:wrap; align-items:stretch;
}
/* quantity */
body.single-product .quantity{
  display:inline-flex; align-items:center; border:1px solid #e6d8bb; border-radius:4px;
  background:#fff; overflow:hidden;
}
body.single-product .quantity input.qty{
  width:66px; min-height:54px; text-align:center; border:0; background:transparent;
  font-family:"Jost",sans-serif; font-size:1.05rem; color:#23241b;
}
/* add to basket */
body.single-product form.cart .single_add_to_cart_button{
  flex:1 1 auto; min-height:54px; border-radius:4px;
  background:#1f4b3b !important; color:#f6efe0 !important;
  font-family:"Jost",sans-serif !important; font-weight:600 !important;
  font-size:.82rem !important; letter-spacing:.16em !important; text-transform:uppercase !important;
  border:1px solid transparent; padding:1em 1.9em;
  transition:transform .4s cubic-bezier(.22,.61,.36,1), background-color .3s ease, box-shadow .4s ease;
}
body.single-product form.cart .single_add_to_cart_button:hover{
  background:#163829 !important; transform:translateY(-2px);
  box-shadow:0 14px 34px -16px rgba(31,75,59,.7);
}

/* product meta */
body.single-product .product_meta{
  margin-top:1.7rem; font-family:"Jost",sans-serif; font-size:.78rem; letter-spacing:.05em;
  color:#5c5a49; display:grid; gap:.4rem;
}
body.single-product .product_meta > span{ display:block; }
body.single-product .product_meta a{ color:#1f4b3b; }
body.single-product .product_meta a:hover{ color:#163829; text-decoration:underline; }

/* payments fieldset */
body.single-product .ast-single-product-payments{
  margin-top:1.6rem; padding:1.2rem 0 0; border:0; border-top:1px solid #e6d8bb;
}
body.single-product .ast-single-product-payments legend{
  font-family:"Jost",sans-serif; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase;
  color:#5c5a49; padding:0; margin-bottom:.7rem;
}

/* ---- Tabs (description) ---- */
body.single-product .woocommerce-tabs{ margin-top:clamp(2.5rem,5vw,4rem); }
body.single-product .woocommerce-tabs ul.tabs{ padding:0; margin:0 0 1.5rem; border-bottom:1px solid #e6d8bb; }
body.single-product .woocommerce-tabs ul.tabs::before{ border:0; }
body.single-product .woocommerce-tabs ul.tabs li{
  background:transparent; border:0; border-radius:0; margin:0 1.5rem 0 0; padding:0;
}
body.single-product .woocommerce-tabs ul.tabs li::before,
body.single-product .woocommerce-tabs ul.tabs li::after{ display:none; }
body.single-product .woocommerce-tabs ul.tabs li a{
  font-family:"Jost",sans-serif; font-weight:500; font-size:.8rem; letter-spacing:.14em;
  text-transform:uppercase; color:#5c5a49; padding:.7rem 0; display:inline-block;
  border-bottom:2px solid transparent; transition:color .3s ease, border-color .3s ease;
}
body.single-product .woocommerce-tabs ul.tabs li.active a,
body.single-product .woocommerce-tabs ul.tabs li a:hover{ color:#1f4b3b; border-color:#e7a73c; }
body.single-product .woocommerce-Tabs-panel h2{
  font-family:"Marcellus",serif; font-weight:400; font-size:clamp(1.6rem,2.6vw,2.1rem);
  color:#23241b; letter-spacing:-.01em;
}
body.single-product .woocommerce-Tabs-panel p{ color:#5c5a49; }

/* ---- Related products ---- */
body.single-product .related.products,
body.single-product .up-sells.products{
  margin-top:clamp(3rem,6vw,5rem); padding-top:clamp(2.5rem,5vw,4rem); border-top:1px solid #e6d8bb;
}
body.single-product .related.products > h2,
body.single-product .up-sells.products > h2{
  font-family:"Marcellus",serif; font-weight:400; letter-spacing:-.01em;
  font-size:clamp(1.7rem,3vw,2.4rem); color:#23241b; margin-bottom:2rem;
}
body.single-product ul.products li.product .woocommerce-loop-product__title{
  font-family:"Marcellus",serif !important; font-weight:400 !important; font-size:1.15rem !important;
  color:#23241b !important; letter-spacing:-.01em;
}
body.single-product ul.products li.product .price{
  font-family:"Marcellus",serif !important; color:#1f4b3b !important;
}
body.single-product ul.products li.product .price .woocommerce-Price-amount{ color:#1f4b3b !important; }
body.single-product ul.products li.product a img{ border-radius:4px; background:#efe4cd; }
body.single-product ul.products li.product .button{
  font-family:"Jost",sans-serif !important; font-weight:600 !important; font-size:.74rem !important;
  letter-spacing:.14em !important; text-transform:uppercase !important;
  background:transparent !important; color:#1f4b3b !important; border:1px solid rgba(31,75,59,.4) !important;
  border-radius:4px !important; padding:.8em 1.4em !important; transition:background-color .3s ease, border-color .3s ease;
}
body.single-product ul.products li.product .button:hover{
  background:rgba(31,75,59,.06) !important; border-color:#1f4b3b !important;
}

/* ---- Responsive ---- */
@media(max-width:940px){
  body.single-product div.product{ grid-template-columns:1fr; gap:2rem; }
  /* Clear the desktop sticky offset fully: position:static alone leaves the
     inherited top:96px pushing the gallery down onto the title. Force both. */
  body.single-product .woocommerce-product-gallery{ position:static !important; top:auto !important; }
}
