/*
Theme Name: WooCommerce Pro
Theme URI: https://webtechit.com/woocommerce-pro
Author: jahidulwd
Author URI: https://webtechit.com
Description: A premium fashion / apparel WooCommerce theme with a fully customizable Theme Options panel (Header, Hero Slider, Categories, Trending Products, Explore Banners, Newsletter, Footer), AJAX login dropdown, and Add to Cart / Buy Now on every product card.
Version: 1.0.13
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wcpro
Tags: e-commerce, custom-menu, featured-images, translation-ready
*/

/* =========================================================
   Base
========================================================= */
:root{
  --maroon:#a41e2c;
  --cream:#faf7f2;
  --ink:#221b17;
  --taupe:#8a7f74;
  --line:#e7e1d8;
  --gold:#c9a15a;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scrollbar-gutter:stable;overflow-x:hidden;max-width:100%;}
body{
  font-family:'Jost', sans-serif;
  color:var(--ink);
  background:#fff;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  max-width:100%;
}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
ul{list-style:none;}
button{font-family:inherit;cursor:pointer;}
.screen-reader-text{position:absolute;left:-9999px;}
.eyebrow{
  letter-spacing:.28em;
  font-size:11px;
  text-transform:uppercase;
  color:var(--taupe);
}

/* ===== Announcement bar ===== */
.announce{
  background:var(--maroon);
  color:#fff;
  text-align:center;
  font-size:12px;
  letter-spacing:.06em;
  padding:9px 10px;
}
.announce span{opacity:.85;margin-left:10px;text-decoration:underline;cursor:pointer;}

/* ===== Header ===== */
header.site-header{
  padding:22px 40px 16px;
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:150;
  background:#fff;
}
.header-row{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
}
.logo{
  text-align:center;
  font-family:'Cormorant Garamond', serif;
  font-size:34px;
  letter-spacing:.35em;
  font-weight:600;
}
.logo img{max-height:44px;margin:0 auto;}
nav.main-nav{
  grid-column:1/4;
  display:flex;
  justify-content:center;
  gap:34px;
  margin-top:16px;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#3a322c;
  flex-wrap:wrap;
  list-style:none;
}
/* nav.main-nav's <li> items have no <ul> wrapper (see wp_nav_menu's
   items_wrap in header.php), so the global "ul{list-style:none}" rule
   never reaches them and the browser default disc marker shows up.
   list-style is inherited, so setting it here on the flex container
   itself covers both the real menu and wcpro_fallback_menu(). */
.mobile-nav-head{display:none;}
nav.main-nav a{position:relative;padding-bottom:4px;}
nav.main-nav a:hover{color:var(--maroon);}
nav.main-nav .menu-item-has-children{position:relative;}
nav.main-nav .sub-menu{
  display:none;
  position:absolute;
  top:100%;left:50%;
  transform:translateX(-50%);
  background:#fff;
  border:1px solid var(--line);
  padding:10px 0;
  min-width:170px;
  text-align:left;
  z-index:40;
}
nav.main-nav .menu-item-has-children:hover .sub-menu{display:block;}
nav.main-nav .sub-menu a{display:block;padding:8px 18px;}
.icons{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:22px;
  font-size:16px;
  position:relative;
}
.icons a{display:inline-flex;align-items:center;}
.icons a:hover{color:var(--maroon);}
.icons .cart{position:relative;}
.icons .cart .count{
  position:absolute;
  top:-8px; right:-9px;
  background:var(--maroon);
  color:#fff;
  font-size:9px;
  width:15px;height:15px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
.icons .account{position:relative;cursor:pointer;}
.icons .account .account-name{
  font-size:11px;
  letter-spacing:.05em;
  font-family:'Jost',sans-serif;
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.icons .account .caret{font-size:8px;opacity:.7;}
.icons .account .account-name-text{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* Desktop / laptop header layout: logo left, menu centered, icons
   right - all in a single row. Uses a 3-column CSS grid
   (1fr auto 1fr) so the nav is centered against the full header
   width rather than just the leftover space between logo and icons,
   which stays correct no matter how wide either of those is.
   (Mobile keeps its own stacked/overlay layout, defined further down
   in the max-width:900px block, and is intentionally left untouched.) */
@media(min-width:901px){
  .header-row{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:30px;
  }
  .logo{
    grid-column:1;
    justify-self:start;
    text-align:left;
  }
  nav.main-nav{
    grid-column:2;
    justify-self:center;
    margin-top:0;
    display:flex;
    justify-content:center;
  }
  .icons{
    grid-column:3;
    justify-self:end;
  }
}
.account-dropdown{
  display:none;
  position:absolute;
  top:calc(100% + 14px);
  right:0;
  background:#fff;
  border:1px solid var(--line);
  min-width:190px;
  padding:10px 0;
  box-shadow:0 12px 24px rgba(0,0,0,.08);
  z-index:60;
}
.account-dropdown.open{display:block;}
.account-dropdown a, .account-dropdown button{
  display:flex;
  align-items:center;
  gap:9px;
  width:100%;
  text-align:left;
  background:none;
  border:none;
  padding:9px 18px;
  font-size:12px;
  letter-spacing:.04em;
  color:#3a322c;
}
.account-dropdown a i, .account-dropdown button i{width:14px;font-size:12px;color:var(--taupe);}
.account-dropdown a:hover, .account-dropdown button:hover{color:var(--maroon);background:var(--cream);}
.account-dropdown .divider{height:1px;background:var(--line);margin:6px 0;}
.login-panel{
  display:none;
  position:absolute;
  top:calc(100% + 14px);
  right:0;
  background:#fff;
  border:1px solid var(--line);
  width:280px;
  padding:22px;
  box-shadow:0 12px 24px rgba(0,0,0,.08);
  z-index:60;
}
.login-panel.open{display:block;}
.login-panel h4{font-family:'Cormorant Garamond',serif;font-size:20px;margin-bottom:14px;}
.login-panel input{
  width:100%;
  border:1px solid var(--line);
  padding:10px 12px;
  font-size:12px;
  margin-bottom:10px;
  font-family:inherit;
}
.login-panel button{
  width:100%;
  background:var(--ink);
  color:#fff;
  border:none;
  padding:11px;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.login-panel .msg{font-size:11px;margin-bottom:8px;}
.login-panel .msg.error{color:var(--maroon);}
.login-panel .row-links{display:flex;justify-content:space-between;margin-top:10px;font-size:11px;}
.login-panel .row-links a:hover{color:var(--maroon);}

/* ===== Mobile nav toggle ===== */
.nav-toggle{display:none;font-size:19px;background:none;border:none;color:var(--ink);cursor:pointer;}
.wcpro-nav-overlay{
  position:fixed;inset:0;
  background:rgba(20,16,14,.4);
  opacity:0;visibility:hidden;
  transition:opacity .3s ease,visibility .3s ease;
  z-index:140;
}
.wcpro-nav-overlay.open{opacity:1;visibility:visible;}
body.wcpro-nav-open{overflow:hidden;}

/* ===== Hero ===== */
.hero{
  position:relative;
  /* Height comes from Theme Options > Hero Slider (rendered as an
     inline --wcpro-hero-height custom property in front-page.php);
     70vh is the fallback if that's ever unset. */
  height:var(--wcpro-hero-height, 70vh);
  min-height:420px;
  overflow:hidden;
  background:#111 center center/cover no-repeat;
}
.hero::before{
  content:"";
  position:absolute; inset:0;
  /* The text sits at right:6% (see .hero-copy below), so the darkening
     needs to be strongest on the RIGHT and fade out to the left - it
     was previously reversed, leaving the text over a fully transparent
     (i.e. unmodified, often bright) part of the image with almost no
     contrast against light backgrounds. */
  background:linear-gradient(270deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.15) 40%, rgba(0,0,0,0) 70%);
}
.hero-copy{
  position:absolute;
  right:6%;
  bottom:14%;
  text-align:right;
  color:#fff;
  /* Belt-and-suspenders: keeps the text readable even over very bright
     or low-contrast areas of whatever image an admin uploads. */
  text-shadow:0 1px 3px rgba(0,0,0,.55), 0 8px 24px rgba(0,0,0,.35);
}
.hero-copy .script{
  font-family:'Cormorant Garamond', serif;
  font-style:italic;
  font-size:64px;
  line-height:.9;
}
.hero-copy .edition{
  font-family:'Cormorant Garamond', serif;
  font-size:26px;
  letter-spacing:.2em;
  margin-top:2px;
}
.hero-copy .sub{
  margin-top:10px;
  font-size:11px;
  letter-spacing:.15em;
  line-height:1.8;
}
.hero-arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  width:38px;height:38px;
  border-radius:50%;
  background:rgba(255,255,255,.85);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer; font-size:14px; color:#222;
  border:none;
  z-index:5;
}
.hero-arrow.left{left:22px;}
.hero-arrow.right{right:22px;}
.hero-slide{display:none;}
.hero-slide.active{display:block;}

/* ===== What's New / Categories ===== */
.whatsnew{
  padding:56px 40px 34px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:26px;
  text-align:center;
}
.whatsnew h2{
  font-family:'Cormorant Garamond', serif;
  font-weight:600;
  font-size:23px;
  line-height:1.15;
  width:auto;
  white-space:nowrap;
  flex-shrink:0;
}
.cat-scroll{
  display:flex;
  gap:34px;
  overflow-x:auto;
  width:100%;
  padding-bottom:6px;
  justify-content:center;
  /* "safe" keeps items from being clipped if the row is ever narrower
     than the content (falls back to plain "center" above in browsers
     that don't support it yet, since an invalid value is ignored and
     the previous declaration for the same property stands). */
  justify-content:safe center;
}
.cat-item{
  text-align:center;
  flex-shrink:0;
  width:96px;
}
.cat-item .circle{
  width:96px;height:96px;
  border-radius:50%;
  overflow:hidden;
  border:1px solid var(--line);
  margin-bottom:10px;
}
.cat-item .circle img{width:100%;height:100%;object-fit:cover;}
.cat-item span{
  font-size:10.5px;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:#3a322c;
}

/* ===== Section headers (script) ===== */
.section-title{
  text-align:center;
  margin:70px 0 30px;
  position:relative;
}
.section-title::before, .section-title::after{
  content:"";
  position:absolute;
  top:50%;
  width:26%;
  border-top:1px solid var(--line);
}
.section-title::before{left:0;}
.section-title::after{right:0;}
.section-title .script{
  font-family:'Cormorant Garamond', serif;
  font-style:italic;
  font-size:34px;
}
.section-title .cap{
  font-size:11px;
  letter-spacing:.3em;
  color:var(--taupe);
  margin-top:2px;
}

/* ===== Product grid ===== */
.grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
  padding:0 40px;
}
.grid.cols-2{grid-template-columns:repeat(2,1fr);}
.grid.cols-3{grid-template-columns:repeat(3,1fr);}
.grid.cols-5{grid-template-columns:repeat(5,1fr);}
.product{
  text-align:left;
  position:relative;
  min-width:0;
}
.product .thumb{
  display:block;
  width:100%;
  aspect-ratio:3/4.1;
  overflow:hidden;
  background:#eee;
  margin-bottom:12px;
  position:relative;
}
.product .thumb .thumb-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  transition:transform .5s ease;
}
.product:hover .thumb .thumb-img{transform:scale(1.05);}
.product .name{font-size:13px;color:#3a322c;margin-bottom:3px;}
.product .name a:hover{color:var(--maroon);}
.product .price{font-size:13px;color:var(--maroon);font-weight:500;}
.product .price del{color:#b8b0a6;font-weight:400;margin-left:6px;}
.product .price ins{text-decoration:none;}
.product-actions{
  display:flex;
  gap:8px;
  margin-top:10px;
}
.product-actions a, .product-actions button{
  flex:1;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  text-align:center;
  font-size:10px;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:9px 6px;
  border:1px solid var(--ink);
  background:#fff;
  color:var(--ink);
  white-space:nowrap;
}
.product-actions a i, .product-actions button i{font-size:11px;}
.product-actions .add_to_cart_button,
.product-actions .ajax_add_to_cart{background:#fff;color:var(--ink);}
.product-actions .add_to_cart_button:hover,
.product-actions .ajax_add_to_cart:hover{background:var(--ink);color:#fff;}
.product-actions .buy-now-btn{background:var(--maroon);color:#fff;border-color:var(--maroon);}
.product-actions .buy-now-btn:hover{background:#82141f;}
.product-actions.added .add_to_cart_button::after{content:" \2713";}
/* WooCommerce's core add-to-cart.js injects a "View cart" link right
   after the button on success. With .product-actions a{flex:1} that
   third item squeezed the row and made the Add to Cart button look
   like it had vanished. We hide it and rely on the toast notification
   (#wcpro-toast, triggered by the shared "added_to_cart" event) to
   confirm the add instead - the button itself stays untouched. */
.product-actions .added_to_cart{display:none !important;}

/* ===== Add to Cart toast notification ===== */
.wcpro-toast{
  position:fixed;
  left:50%;
  bottom:26px;
  transform:translate(-50%,20px);
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--ink);
  color:#fff;
  padding:13px 22px;
  border-radius:6px;
  font-size:12.5px;
  letter-spacing:.02em;
  box-shadow:0 12px 28px rgba(0,0,0,.22);
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease,transform .25s ease,visibility .25s ease;
  z-index:400;
  max-width:90vw;
}
.wcpro-toast.show{opacity:1;visibility:visible;transform:translate(-50%,0);}
.wcpro-toast i{color:#6fcf7a;font-size:15px;flex-shrink:0;}
.wcpro-toast-text{white-space:normal;}
@media(max-width:600px){
  .wcpro-toast{left:16px;right:16px;bottom:16px;transform:translateY(20px);max-width:none;}
  .wcpro-toast.show{transform:translateY(0);}

  .product-actions{gap:5px;}
  .product-actions a, .product-actions button{
    font-size:8.5px;
    letter-spacing:.02em;
    padding:8px 2px;
    gap:3px;
  }
  .product-actions a i, .product-actions button i{font-size:9px;}
}

/* ===== Upsell / Cross-sell product slider (single product page) ===== */
.wcpro-slider-section{margin:0;}
.wcpro-slider-wrap{position:relative;padding:0 40px;}
.wcpro-slider-track{
  display:flex;
  gap:22px;
  overflow-x:auto;
  scroll-behavior:smooth;
  scrollbar-width:none;
  padding-bottom:4px;
}
.wcpro-slider-track::-webkit-scrollbar{display:none;}
.wcpro-slider-track .product{flex:0 0 240px;}
.wcpro-slider-wrap .hero-arrow{
  top:38%;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 6px 16px rgba(0,0,0,.1);
}
.wcpro-slider-wrap .hero-arrow.left{left:6px;}
.wcpro-slider-wrap .hero-arrow.right{right:6px;}
@media(max-width:900px){
  .wcpro-slider-wrap{padding:0 18px;}
  .wcpro-slider-track .product{flex-basis:170px;}
}


.view-more-wrap{clear:both;text-align:center;margin:34px 0 10px;}
.view-more{
  display:inline-block;
  border:1px solid var(--ink);
  padding:11px 34px;
  font-size:11px;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.view-more:hover{background:var(--ink);color:#fff;}

/* ===== Explore banners ===== */
.explore{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:26px;
  padding:0 40px;
  margin:0 auto;
  max-width:1000px;
}
.explore-card{
  position:relative;
  display:block;
  width:100%;
  height:420px;
  overflow:hidden;
  background-color:#eee;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.explore-card .tag{
  position:absolute;
  top:24px;
  font-family:'Cormorant Garamond', serif;
  font-style:italic;
  font-size:26px;
  line-height:1;
  color:var(--ink);
}
.explore-card .tag small{
  display:block;
  font-family:'Jost',sans-serif;
  font-style:normal;
  font-size:11px;
  letter-spacing:.2em;
  margin-top:4px;
}
.explore-card.right .tag{right:24px;text-align:right;}
.explore-card.left .tag{left:24px;}

.flagship-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:26px;
  padding:0 40px;
  max-width:1000px;
  margin:0 auto;
}
.flagship-split .explore-card{height:420px;}

/* ===== Newsletter ===== */
.newsletter{
  text-align:center;
  padding:90px 20px 60px;
}
.newsletter h3{
  font-family:'Jost',sans-serif;
  font-weight:500;
  font-size:16px;
  letter-spacing:.04em;
  margin-bottom:22px;
}
.newsletter form{
  display:flex;
  justify-content:center;
  gap:0;
  max-width:440px;
  margin:0 auto;
}
.newsletter input{
  flex:1;
  border:1px solid var(--ink);
  border-right:none;
  padding:13px 16px;
  font-size:12px;
  font-family:inherit;
}
.newsletter input:focus{outline:none;}
.newsletter button{
  background:var(--ink);
  color:#fff;
  border:none;
  padding:0 28px;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
}

/* ===== Footer ===== */
footer.site-footer{
  background:var(--cream);
  padding:60px 40px 30px;
  border-top:1px solid var(--line);
}
.footer-grid{
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;
  gap:30px;
  max-width:1300px;
  margin:0 auto;
}
.footer-logo{
  font-family:'Cormorant Garamond', serif;
  font-size:28px;
  letter-spacing:.3em;
  font-weight:600;
  margin-bottom:14px;
}
.footer-grid p, .footer-grid a{
  font-size:12.5px;
  line-height:2.1;
  color:#4b4239;
}
.footer-col{list-style:none;}
.footer-col h4{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:14px;
  color:var(--ink);
}
.footer-col a{display:block;}
.footer-col a:hover{color:var(--maroon);}
.footer-bottom{
  text-align:center;
  margin-top:50px;
  font-size:11px;
  color:var(--taupe);
  letter-spacing:.05em;
}

/* ===== Generic page / blog / 404 / search content ===== */
.page-content-wrap, .content-wrap{
  max-width:1100px;
  margin:0 auto;
  padding:70px 40px 90px;
}
.page-title{
  font-family:'Cormorant Garamond', serif;
  font-size:36px;
  margin-bottom:28px;
  text-align:center;
}
.entry-content{font-size:14px;line-height:1.9;color:#3a322c;}
.blog-list article{margin-bottom:46px;padding-bottom:46px;border-bottom:1px solid var(--line);}
.blog-list .entry-title{font-family:'Cormorant Garamond', serif;font-size:26px;margin-bottom:10px;}
.blog-list .entry-title a:hover{color:var(--maroon);}
.blog-list .entry-meta{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--taupe);margin-bottom:14px;}
.pagination{display:flex;justify-content:center;gap:10px;margin-top:40px;}
.pagination a, .pagination span{border:1px solid var(--line);padding:8px 14px;font-size:12px;}
.pagination .current{background:var(--ink);color:#fff;border-color:var(--ink);}
.not-found{text-align:center;padding:100px 20px;}
.not-found .code{font-family:'Cormorant Garamond', serif;font-size:110px;color:var(--maroon);line-height:1;}
.not-found p{margin:18px 0 26px;color:var(--taupe);}
.search-form-wrap{max-width:520px;margin:0 auto 50px;display:flex;}
.search-form-wrap input[type="search"]{flex:1;border:1px solid var(--ink);border-right:none;padding:12px 16px;font-size:13px;font-family:inherit;}
.search-form-wrap button{background:var(--ink);color:#fff;border:none;padding:0 22px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;}

/* ===== Single product ===== */
.single-product-wrap{max-width:1200px;margin:0 auto;padding:60px 40px 90px;}
.single-product-inner{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;}
.single-product-gallery{position:relative;}
.single-product-gallery img{width:100%;object-fit:cover;}
.woocommerce-product-gallery__wrapper{margin:0;}
.woocommerce-product-gallery__image{margin-bottom:12px;}
.woocommerce-product-gallery__image img{aspect-ratio:3/4;}
.woocommerce-product-gallery .flex-viewport{margin-bottom:12px;}
.woocommerce-product-gallery span.onsale{
  position:absolute;top:14px;left:14px;background:var(--maroon);color:#fff;
  font-size:10px;letter-spacing:.08em;padding:5px 11px;text-transform:uppercase;z-index:5;
}
ol.flex-control-thumbs{display:flex;gap:10px;list-style:none;padding:0;margin:0;flex-wrap:wrap;}
ol.flex-control-thumbs li{width:64px;}
ol.flex-control-thumbs img{aspect-ratio:3/4;object-fit:cover;cursor:pointer;opacity:.55;border:1px solid var(--line);transition:opacity .2s ease,border-color .2s ease;}
ol.flex-control-thumbs img.flex-active, ol.flex-control-thumbs img:hover{opacity:1;border-color:var(--ink);}
.woocommerce-product-gallery__trigger{
  position:absolute;top:16px;right:16px;z-index:6;
  background:#fff;width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 10px rgba(0,0,0,.15);font-size:0;
}
.woocommerce-product-gallery__trigger::before{content:"\f00e";font-family:"Font Awesome 6 Free";font-weight:900;font-size:13px;}

.single-product-summary .single-onsale-badge{
  display:inline-block;background:var(--maroon);color:#fff;font-size:10px;letter-spacing:.08em;
  padding:5px 11px;text-transform:uppercase;margin-bottom:12px;
}
.single-product-summary .product_title{font-family:'Cormorant Garamond', serif;font-size:32px;margin-bottom:10px;}
.single-product-summary .star-rating{margin-bottom:14px;font-size:14px;color:var(--gold);}
.single-product-summary .price{font-size:22px;color:var(--maroon);margin-bottom:18px;display:block;font-weight:500;}
.single-product-summary .price del{color:#b8b0a6;font-size:16px;font-weight:400;margin-right:10px;}
.single-product-summary .price ins{text-decoration:none;}

.wcpro-add-to-cart-row{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0;}
.wcpro-add-to-cart-row form.cart{flex:1 1 220px;margin:0;display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.wcpro-add-to-cart-row form.cart .quantity{margin:0;}
.wcpro-add-to-cart-row form.cart .single_add_to_cart_button{flex:1;min-width:160px;}
.wcpro-add-to-cart-row .single_add_to_cart_button,
.wcpro-add-to-cart-row .buy-now-btn{
  text-align:center;padding:15px 18px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--ink);display:flex;align-items:center;justify-content:center;gap:8px;
}
.wcpro-add-to-cart-row .single_add_to_cart_button{background:var(--ink);color:#fff;flex:1 1 160px;}
.wcpro-add-to-cart-row .single_add_to_cart_button:hover{opacity:.9;}
.wcpro-add-to-cart-row .single_add_to_cart_button.disabled,
.wcpro-add-to-cart-row .single_add_to_cart_button.loading{opacity:.5;cursor:not-allowed;pointer-events:none;}
.wcpro-add-to-cart-row .buy-now-btn{background:var(--maroon);color:#fff;border-color:var(--maroon);flex:1 1 160px;}
.wcpro-add-to-cart-row .buy-now-btn:hover{background:#82141f;}
.wcpro-add-to-cart-row .buy-now-btn.loading{opacity:.7;pointer-events:none;}

.wcpro-product-trust{display:flex;flex-wrap:wrap;gap:14px 22px;margin:24px 0;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.wcpro-product-trust span{display:flex;align-items:center;gap:8px;font-size:11.5px;color:#4b4239;}
.wcpro-product-trust i{color:var(--gold);font-size:14px;}

table.variations{width:100%;border-collapse:collapse;margin-bottom:6px;}
table.variations tr{border-bottom:none;display:block;margin-bottom:18px;}
table.variations tr:last-child{margin-bottom:0;}
table.variations td, table.variations th{padding:0;vertical-align:middle;display:block;}
table.variations th{text-align:left;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--taupe);width:auto;margin-bottom:10px;}
table.variations th label{font-weight:500;}
/* Real <select> stays in the DOM (WooCommerce reads its value directly)
   but is visually replaced by the swatch buttons below. */
table.variations select.wcpro-swatch-hidden-select{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
/* Fallback: if JS hasn't run (or fails), the plain select still works. */
table.variations select{
  width:100%;max-width:280px;padding:10px 12px;border:1px solid var(--line);
  font-family:inherit;font-size:13px;background:#fff;color:var(--ink);
}

.wcpro-swatch-group{margin-top:2px;display:flex;align-items:center;flex-wrap:wrap;gap:6px;}
.wcpro-swatch-list{display:flex;flex-wrap:wrap;gap:10px;}
.wcpro-swatch{
  border:1px solid var(--line);background:#fff;cursor:pointer;
  font-family:inherit;color:var(--ink);transition:border-color .15s ease,box-shadow .15s ease;
}
.wcpro-swatch:hover{border-color:var(--ink);}
/* Color circles */
.wcpro-swatch-list.is-color .wcpro-swatch{
  width:34px;height:34px;border-radius:50%;padding:0;
  border:1px solid var(--line);position:relative;
}
.wcpro-swatch-list.is-color .wcpro-swatch::after{
  content:"";position:absolute;inset:-4px;border-radius:50%;
  border:1px solid transparent;transition:border-color .15s ease;
}
.wcpro-swatch-list.is-color .wcpro-swatch.active::after{border-color:var(--ink);}
/* Size pills */
.wcpro-swatch-list.is-size .wcpro-swatch{
  min-width:44px;height:38px;padding:0 12px;font-size:12.5px;
}
.wcpro-swatch-list.is-size .wcpro-swatch.active{
  background:var(--ink);color:#fff;border-color:var(--ink);
}
.wcpro-size-guide-link{margin-left:10px;font-size:11px;text-decoration:underline;color:var(--taupe);align-self:center;}

.reset_variations{display:inline-block;margin:6px 0 10px;font-size:11px;letter-spacing:.04em;text-decoration:underline;color:var(--taupe);}
.woocommerce-variation-price{margin:6px 0 14px;font-size:17px;color:var(--maroon);}
.woocommerce-variation-availability{margin-bottom:10px;font-size:12px;}
.woocommerce-variation-description p{font-size:13px;color:#4b4239;margin-bottom:10px;}

/* Product Code / Availability quick facts */
.wcpro-product-quickfacts{margin:14px 0 18px;}
.wcpro-product-quickfacts .qf-row{display:flex;gap:10px;font-size:13px;margin-bottom:6px;}
.wcpro-product-quickfacts .qf-label{color:var(--taupe);min-width:110px;}
.wcpro-product-quickfacts .qf-value{color:var(--ink);font-weight:500;}

/* Made in.../Wishlist/Compare/Ask about product row */
.wcpro-product-actionlinks{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin:18px 0 6px;font-size:12px;}
.wcpro-product-actionlinks .made-in{color:#4b4239;display:flex;align-items:center;gap:6px;}
.wcpro-product-actionlinks button,
.wcpro-product-actionlinks a{
  background:none;border:none;padding:0;cursor:pointer;font-family:inherit;
  display:flex;align-items:center;gap:6px;color:#4b4239;font-size:12px;text-decoration:none;
}
.wcpro-product-actionlinks button:hover,
.wcpro-product-actionlinks a:hover{color:var(--maroon);}
.wcpro-product-actionlinks button.active{color:var(--maroon);}
.wcpro-product-actionlinks i{font-size:13px;}

/* Bestsellers slider heading reuses .wcpro-slider-section */
.wcpro-bestsellers{margin-top:70px;padding-top:20px;}

/* Sold out badge on product cards (sliders / grids) */
.thumb{position:relative;display:block;}
.sold-out-badge{
  position:absolute;top:10px;right:10px;background:#fff;color:var(--ink);
  font-size:10px;letter-spacing:.06em;text-transform:uppercase;
  padding:5px 10px;border:1px solid var(--line);z-index:2;
}

.quantity{position:relative;display:inline-flex;align-items:stretch;border:1px solid var(--line);height:52px;}
.quantity input.qty{width:48px;text-align:center;border:none;padding:0;font-family:inherit;font-size:13px;-moz-appearance:textfield;background:transparent;}
.quantity input.qty::-webkit-outer-spin-button,.quantity input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.quantity .qty-step{width:36px;border:none;background:#fff;cursor:pointer;font-size:10px;color:var(--ink);}
.quantity .qty-step:hover{background:var(--cream);}

.single-product-summary table.variations{margin-bottom:16px;}
.single-product-summary .woocommerce-product-details__short-description{margin:16px 0;font-size:13.5px;line-height:1.9;color:#4b4239;}
.related.products{padding:0 40px;margin-top:90px;}
.related.products > h2{text-align:center;font-family:'Cormorant Garamond', serif;font-style:italic;font-size:30px;margin-bottom:30px;}
.related.products ul.products{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;list-style:none;padding:0;}

/* ===== Custom Shop page template (template-shop.php) ===== */
.wcpro-shop2{padding:36px 40px 60px;}
.wcpro-shop2-crumb{font-size:12px;color:var(--taupe);margin-bottom:18px;}
.wcpro-shop2-crumb a{color:var(--taupe);}
.wcpro-shop2-crumb a:hover{color:var(--ink);}
.wcpro-shop2-crumb span{margin:0 6px;}
.wcpro-shop2-title{
  font-family:'Jost', sans-serif;
  font-weight:400;
  font-size:34px;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:26px;
}
.wcpro-shop2-tabs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:26px;
  padding-bottom:16px;
  margin-bottom:16px;
  border-bottom:1px solid var(--line);
  overflow-x:auto;
}
.wcpro-shop2-tab{
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--ink);
  white-space:nowrap;
  padding:6px 4px;
}
.wcpro-shop2-tab:hover{color:var(--maroon);}
.wcpro-shop2-tab.active{
  border:1px solid var(--ink);
  padding:6px 14px;
}
.wcpro-shop2-toolbar{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:20px;
  padding-bottom:26px;
  margin-bottom:8px;
}
.wcpro-shop2-views{display:flex;align-items:center;gap:6px;margin-right:auto;}
.wcpro-shop2-view-btn{
  border:none;background:none;color:var(--line);
  font-size:15px;padding:4px;line-height:1;
}
.wcpro-shop2-view-btn:hover{color:var(--taupe);}
.wcpro-shop2-view-btn.active{color:var(--ink);}
.wcpro-shop2-sale{
  display:flex;align-items:center;gap:8px;
  font-size:12.5px;color:var(--ink);cursor:pointer;
}
.wcpro-shop2-sale input{accent-color:var(--ink);width:14px;height:14px;}
.wcpro-shop2-select-wrap{
  font-size:12.5px;color:var(--taupe);
  display:flex;align-items:center;gap:6px;
}
.wcpro-shop2-select-wrap select{
  border:none;background:none;color:var(--ink);
  font-size:12.5px;font-weight:500;cursor:pointer;
  padding:2px 18px 2px 2px;
}
.wcpro-shop2-empty{padding:60px 0;text-align:center;color:var(--taupe);}
.wcpro-shop2-grid.cols-2{grid-template-columns:repeat(2,1fr);}
.wcpro-shop2-grid.cols-3{grid-template-columns:repeat(3,1fr);}
.wcpro-shop2-grid.cols-4{grid-template-columns:repeat(4,1fr);}
.wcpro-shop2-grid.cols-5{grid-template-columns:repeat(5,1fr);}
.wcpro-shop2-grid.cols-6{grid-template-columns:repeat(6,1fr);}
.wcpro-shop2 .grid{padding:0;}
.wcpro-shop2 .pagination{margin-top:20px;}
@media(max-width:900px){
  .wcpro-shop2{padding:24px 18px 40px;}
  .wcpro-shop2-title{font-size:26px;}
  .wcpro-shop2-toolbar{gap:14px;}
  .wcpro-shop2-views{display:none;}
  .wcpro-shop2-grid.cols-3, .wcpro-shop2-grid.cols-4, .wcpro-shop2-grid.cols-5, .wcpro-shop2-grid.cols-6{grid-template-columns:repeat(2,1fr);}
}

/* ===== Shop archive / filter sidebar ===== */
.shop-toolbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding:0 40px 30px;}
.shop-toolbar .results-count{font-size:12px;color:var(--taupe);margin-left:auto;}
.shop-toolbar .ordering{margin-left:14px;}
.wcpro-filter-toggle{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--ink);background:#fff;color:var(--ink);
  padding:9px 16px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;
  transition:background .2s ease,color .2s ease;
}
.wcpro-filter-toggle:hover{background:var(--ink);color:#fff;}

.shop-layout{padding:0 40px;display:block;}
.wcpro-shop-main{width:100%;}
.shop-layout .grid, .shop-layout .pagination{padding:0;}

.wcpro-filters-overlay{
  position:fixed;inset:0;background:rgba(20,16,14,.4);
  opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;
  z-index:190;
}
.wcpro-filters-overlay.open{opacity:1;visibility:visible;}
.wcpro-shop-filters{
  position:fixed;top:0;left:0;height:100vh;width:340px;max-width:88vw;
  background:#fff;z-index:210;
  transform:translateX(-100%);
  transition:transform .35s ease;
  overflow-y:auto;
  box-shadow:12px 0 30px rgba(0,0,0,.15);
}
.wcpro-shop-filters.open{transform:translateX(0);}
.wcpro-filters-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 22px;border-bottom:1px solid var(--line);
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  position:sticky;top:0;background:#fff;
}
.wcpro-filters-head i{color:var(--maroon);margin-right:6px;}
.wcpro-filters-close{background:none;border:none;font-size:16px;cursor:pointer;color:var(--ink);}
.wcpro-filters-body{padding:22px;}
.wcpro-filters-body .widget{margin-bottom:32px;}
.wcpro-filters-body .widget:last-child{margin-bottom:0;}
.wcpro-filters-body .widget h4,
.wcpro-filters-body .widget-title,
.wcpro-filters-body .wp-block-heading{
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px;color:var(--ink);
}
.wcpro-filters-body ul{list-style:none;margin:0;padding:0;}
.wcpro-filters-body ul li{margin-bottom:9px;font-size:13px;}
.wcpro-filters-body ul li a{color:#3a322c;}
.wcpro-filters-body ul li a:hover{color:var(--maroon);}
.wcpro-filters-body .price_slider_wrapper{margin-top:6px;}
.wcpro-filters-body .price_slider_amount .button{
  float:none;display:inline-block;margin-top:12px;
  background:var(--ink);color:#fff;border:none;padding:9px 16px;
  font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
}
body.wcpro-filters-open{overflow:hidden;}

/* ===== Floating / Side Cart panel ===== */
.wcpro-cart-overlay{
  position:fixed;inset:0;background:rgba(20,16,14,.4);
  opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;
  z-index:220;
}
.wcpro-cart-overlay.open{opacity:1;visibility:visible;}
.wcpro-cart-panel{
  position:fixed;background:#fff;z-index:240;
  display:flex;flex-direction:column;
  box-shadow:0 20px 50px rgba(0,0,0,.18);
  opacity:0;visibility:hidden;
  transition:opacity .25s ease,transform .35s ease,visibility .35s ease;
}
.wcpro-cart-panel-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 22px;border-bottom:1px solid var(--line);
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  flex-shrink:0;
}
.wcpro-cart-panel-head i{margin-right:6px;color:var(--maroon);}
.wcpro-cart-close{background:none;border:none;font-size:16px;cursor:pointer;color:var(--ink);}
.wcpro-cart-panel-body{
  padding:20px 22px;
  overflow-y:auto;
  flex:1;
  -webkit-overflow-scrolling:touch;
  /* Thin, unobtrusive scrollbar instead of the browser's bulky default
     (Firefox + Chromium). Still fully scrollable either way. */
  scrollbar-width:thin;
  scrollbar-color:var(--line) transparent;
}
.wcpro-cart-panel-body::-webkit-scrollbar{width:6px;}
.wcpro-cart-panel-body::-webkit-scrollbar-track{background:transparent;}
.wcpro-cart-panel-body::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px;}
.wcpro-cart-panel-body::-webkit-scrollbar-thumb:hover{background:var(--taupe);}

.wcpro-cart-panel.style-drawer{
  top:0;right:0;width:400px;max-width:92vw;transform:translateX(100%);
  /* 100dvh instead of 100vh: on mobile browsers the address/tool bar
     changes the visible viewport height, so 100vh can be taller than
     what's actually on screen and push the checkout/close controls
     out of reach. dvh tracks the real visible area; vh stays as the
     fallback for older browsers that don't support dvh. */
  height:100vh;
  height:100dvh;
}
.wcpro-cart-panel.style-drawer.open{opacity:1;visibility:visible;transform:translateX(0);}

.wcpro-cart-panel.style-dropdown{
  /* Anchored to the cart icon's actual position (set as inline custom
     properties by main.js on open/resize) instead of a hardcoded
     right offset, so it always drops down directly under the icon
     regardless of header layout, screen size, or icon order. */
  top:var(--wcpro-cart-icon-top, calc(var(--wcpro-header-h, 96px) + 12px));
  right:var(--wcpro-cart-icon-right, 40px);
  width:380px;max-width:92vw;max-height:78vh;border-radius:6px;transform:translateY(-12px);
}
.wcpro-cart-panel.style-dropdown.open{opacity:1;visibility:visible;transform:translateY(0);}
body.wcpro-cart-open{overflow:hidden;}

.wcpro-cart-panel-body ul{list-style:none;margin:0;padding:0;}
.wcpro-cart-panel-body ul li{
  display:flex;gap:12px;padding:16px 0;border-bottom:1px solid var(--line);position:relative;align-items:flex-start;
}
.wcpro-cart-panel-body ul li:first-child{padding-top:0;}
.wcpro-cart-panel-body ul li img{width:64px;height:80px;object-fit:cover;flex-shrink:0;border-radius:2px;}
.wcpro-cart-panel-body ul li > a:not(.remove){display:block;flex:1;min-width:0;font-size:12.5px;color:var(--ink);margin-bottom:4px;padding-right:22px;}
.wcpro-cart-panel-body ul li dl.variation{font-size:11px;color:var(--taupe);margin:2px 0 4px;}
.wcpro-cart-panel-body ul li dl.variation dt, .wcpro-cart-panel-body ul li dl.variation dd{display:inline;margin:0;}
.wcpro-cart-panel-body ul li .quantity{border:none;padding:0;display:block;position:static;height:auto;font-size:12px;color:var(--taupe);}
/* Newer WooCommerce versions render the mini-cart quantity as an
   editable number input rather than plain text - without explicit
   sizing this falls back to the browser's default (large, boxy)
   number spinner, which is what made the quantity column look broken
   and squeezed against the price. */
.wcpro-cart-panel-body ul li input[type="number"],
.wcpro-cart-panel-body ul li .quantity input.qty{
  width:48px;padding:4px 6px;margin:4px 0;border:1px solid var(--line);border-radius:3px;font-size:12px;text-align:center;
}
.wcpro-cart-panel-body ul li .remove{
  position:absolute;top:16px;right:0;width:22px;height:22px;
  display:flex;align-items:center;justify-content:center;
  color:var(--taupe);font-size:16px;line-height:1;border-radius:50%;text-decoration:none !important;
  z-index:2;
}
.wcpro-cart-panel-body ul li .remove:hover{background:var(--cream);color:var(--maroon);}
.wcpro-cart-panel-body .woocommerce-mini-cart__total{
  display:flex;justify-content:space-between;font-size:14px;font-weight:500;
  padding-top:16px;margin-top:6px;border-top:1px solid var(--line);
}
/* Target every wrapper WooCommerce has used across versions for the
   View Cart / Checkout links (p.woocommerce-mini-cart__buttons,
   .buttons, or .wc-proceed-to-checkout) so the buttons keep their
   spacing and styling regardless of exact markup. */
.wcpro-cart-panel-body .woocommerce-mini-cart__buttons,
.wcpro-cart-panel-body .buttons,
.wcpro-cart-panel-body .wc-proceed-to-checkout{
  display:flex;flex-direction:column;gap:10px;margin-top:18px;
}
.wcpro-cart-panel-body a.button{
  display:block;text-align:center;padding:13px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--ink);
}
.wcpro-cart-panel-body a.button.checkout{background:var(--ink);color:#fff;}
.wcpro-cart-panel-body a.button.wc-forward:not(.checkout){background:#fff;color:var(--ink);}
.wcpro-cart-panel-body .woocommerce-mini-cart__empty-message{padding:50px 0;text-align:center;font-size:13px;color:var(--taupe);}

@media(max-width:900px){
  header.site-header{padding:14px 18px;}
  .hero{height:var(--wcpro-hero-height-mobile, 50vh);}
  .header-row{grid-template-columns:auto 1fr auto;}
  .logo{font-size:22px;letter-spacing:.22em;}
  .nav-toggle{display:block;}

  /* The account block used to show the logged-in user's name next to
     the icon on every screen size. On narrow phones that extra text
     (plus search/wishlist/cart) was crowding and overflowing the
     header row - icon-only is the standard, safer mobile pattern. */
  .icons{gap:14px;font-size:15px;}
  .icons .account .account-name-text, .icons .account .caret{display:none;}

  nav.main-nav{
    position:fixed;top:0;left:0;
    width:300px;max-width:85vw;height:100vh;
    background:#fff;
    display:block;
    grid-column:auto;
    margin-top:0;
    transform:translateX(-100%);
    transition:transform .35s ease;
    z-index:150;
    overflow-y:auto;
    text-align:left;
    box-shadow:14px 0 30px rgba(0,0,0,.15);
  }
  nav.main-nav.open{transform:translateX(0);display:block;}
  .mobile-nav-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:18px 20px;border-bottom:1px solid var(--line);
    font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  }
  .mobile-nav-close{background:none;border:none;font-size:17px;cursor:pointer;color:var(--ink);}
  nav.main-nav ul{padding:10px 0;}
  nav.main-nav > ul{display:block;}
  nav.main-nav li{display:block;width:100%;border-bottom:1px solid var(--line);}
  nav.main-nav a{display:block;padding:14px 20px;font-size:12px;}
  nav.main-nav .sub-menu{
    display:none;position:static;transform:none;border:none;padding:0;background:var(--cream);min-width:0;
  }
  nav.main-nav li.sub-open > .sub-menu{display:block;}
  nav.main-nav .sub-menu a{padding-left:34px;font-size:11.5px;}

  .grid{grid-template-columns:repeat(2,1fr);padding:0 18px;gap:16px;}
  .explore, .flagship-split{grid-template-columns:1fr;padding:0 18px;}
  .explore-card, .flagship-split .explore-card{height:320px;}
  .styled-grid{grid-template-columns:repeat(2,1fr);padding:0 18px;}
  .whatsnew{padding:40px 18px;flex-direction:column;gap:18px;}
  .whatsnew h2{white-space:normal;}
  .footer-grid{grid-template-columns:repeat(2,1fr);}
  .hero-copy .script{font-size:42px;}
  .single-product-inner{grid-template-columns:1fr;gap:30px;}

  .shop-layout{padding:0 18px;}
  .shop-toolbar{padding:0 18px 22px;}
  .shop-toolbar .results-count{margin-left:0;order:3;width:100%;}

  .wcpro-cart-panel.style-dropdown{
    top:0;right:0;left:0;width:100%;max-width:100%;
    height:100vh;max-height:100vh;
    height:100dvh;max-height:100dvh;
    border-radius:0;
    transform:translateY(-100%);
  }
  .wcpro-cart-panel.style-dropdown.open{transform:translateY(0);}
  .wcpro-cart-panel.style-drawer{width:100%;max-width:100%;}
  .wcpro-cart-panel-head{padding-top:calc(18px + env(safe-area-inset-top));}
  .wcpro-cart-panel-body{padding-bottom:calc(20px + env(safe-area-inset-bottom));}

  .wcpro-add-to-cart-row{flex-direction:column;}
  .wcpro-add-to-cart-row form.cart{width:100%;}
  .wcpro-add-to-cart-row form.cart .single_add_to_cart_button{width:100%;}
  .wcpro-add-to-cart-row .buy-now-btn{width:100%;}
  .related.products ul.products{grid-template-columns:repeat(2,1fr);}
}