/* ============ SHOP / ARCHIVE PAGE (Vielle Rose Counter) ============ */

/* The main shop archive now keeps the theme's native col-lg-9/col-lg-3
   split too, showing the interactive filter sidebar (search, categories,
   brand, price) built for it. Brand and product-category archive pages
   keep the same column split for their 'From the Blog' panel. No page
   forces the sidebar column away anymore — see the SIDEBAR-COLUMN
   ARCHIVE PRODUCT CARDS section below for the shared card sizing used
   whenever a sidebar is present. */

/* breadcrumb */
.woocommerce-breadcrumb{
  font-family:Poppins,sans-serif;font-size:12.5px;color:var(--v-muted);
  padding:18px 0 6px;margin:0;
}
.woocommerce-breadcrumb a{color:var(--v-muted);}
.woocommerce-breadcrumb a:hover{color:var(--v-accent);}

/* page header / title */
.woocommerce-products-header{margin:6px 0 22px;}
.woocommerce-products-header__title.page-title{
  font-family:Poppins,sans-serif;font-weight:600;color:var(--v-ink);
  font-size:26px;margin:0 0 10px;position:relative;padding-bottom:12px;
}
.woocommerce-products-header__title.page-title:after{
  content:"";display:block;position:absolute;left:0;bottom:0;
  width:46px;height:3px;border-radius:2px;background:var(--v-accent);
}
.woocommerce-products-header .page-description{
  font-family:Poppins,"Noto Sans Bengali",sans-serif;font-size:14.5px;
  line-height:1.7;color:var(--v-muted);max-width:56ch;
}
.woocommerce-products-header .page-description p{margin:0;}
.woocommerce-products-header .page-description p:empty{display:none;}

/* result count + ordering row */
.woocommerce-notices-wrapper{margin:0;}
.woocommerce-result-count,
.woocommerce-ordering{
  font-family:Poppins,sans-serif;font-size:13px;color:var(--v-muted);
  margin:0 0 18px;
}
.woocommerce-result-count{float:none;display:inline-block;}
.woocommerce-ordering{float:none;display:inline-block;margin-left:auto;}
form.woocommerce-ordering select.orderby{
  font-family:Poppins,sans-serif;font-size:13px;color:var(--v-ink);
  border:1.5px solid var(--v-hair);border-radius:8px;background:#fff;
  padding:9px 34px 9px 13px;
}
form.woocommerce-ordering select.orderby:focus{border-color:var(--v-accent);outline:none;}
@media(min-width:768px){
  .woocommerce-result-count,.woocommerce-ordering{
    display:flex;align-items:center;
  }
  p.woocommerce-result-count + form.woocommerce-ordering{margin-top:-38px;}
}

/* product grid - sized to match the live shop page's card grid (5 desktop /
   4 tablet / 3 mobile columns, ~150px product image, compact padding)
   instead of the wider default WooCommerce grid, while keeping the site's
   own tokens (Poppins, --v-accent, pill buttons, 14px card radius) rather
   than the shop grid's own off-token colors.
   Flexbox (not CSS Grid) on purpose: with justify-content:center, a last
   row that isn't a full multiple of the column count centers itself
   instead of sitting flush left with empty space on the right. */
ul.products.columns-3,
ul.products{
  display:flex !important;flex-wrap:wrap !important;justify-content:center !important;
  gap:18px !important;margin:0 !important;padding:0 !important;
}
.woocommerce ul.products li.product{
  box-sizing:border-box;
  flex:0 0 calc((100% - 4*18px)/5) !important;max-width:calc((100% - 4*18px)/5) !important;
  margin:0 !important;padding:0 !important;
  background:#fff;border:1px solid var(--v-hair);border-radius:14px;overflow:hidden;
  box-shadow:none !important;text-align:left !important;
  transition:transform .25s ease,box-shadow .25s ease;position:relative;
  float:none !important;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-5px);box-shadow:0 14px 30px rgba(199,110,136,.17) !important;
}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{
  display:block;color:inherit;text-decoration:none;
}
.woocommerce ul.products li.product img{
  width:100%;height:150px;object-fit:contain;background:var(--v-surf);
  mix-blend-mode:multiply;margin:0 !important;border-radius:0 !important;
  transition:transform .4s ease;
}
.woocommerce ul.products li.product:hover img{transform:scale(1.05);}
.woocommerce ul.products li.product .onsale{
  position:absolute !important;top:10px !important;left:10px !important;right:auto !important;
  z-index:3;margin:0 !important;
  background:var(--v-accent) !important;color:#fff !important;border-radius:999px !important;
  font-family:Poppins,sans-serif !important;font-size:9px !important;font-weight:600 !important;
  letter-spacing:.4px;text-transform:uppercase;padding:5px 9px !important;line-height:1.2 !important;
  box-shadow:0 4px 10px rgba(224,87,124,.28);min-width:0;min-height:0 !important;height:auto;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:Poppins,sans-serif !important;font-size:12px !important;font-weight:500 !important;
  line-height:1.4;color:var(--v-ink) !important;margin:10px 10px 4px;text-align:left !important;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  min-height:2.6em;
}
.woocommerce ul.products li.product .price{
  font-family:Poppins,sans-serif !important;font-size:13.5px !important;font-weight:700 !important;
  color:var(--v-accent) !important;text-align:left !important;
  display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;margin:0 10px 10px;
}
.woocommerce ul.products li.product .price del{
  font-size:11px;font-weight:400;color:#B79AA4;order:2;opacity:1;
}
.woocommerce ul.products li.product .price del .amount{color:#B79AA4;}
.woocommerce ul.products li.product .price ins{
  text-decoration:none;background:transparent;color:var(--v-accent);order:1;
}
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.add_to_cart_button{
  display:block;margin:0 10px 10px !important;margin-top:0 !important;text-align:center;
  background:#FFF3F6;color:var(--v-accent);border:1.5px solid var(--v-edge);
  border-radius:999px !important;font-family:Poppins,sans-serif;font-size:11.5px;font-weight:600;
  padding:8px 12px;box-shadow:none;transition:all .2s ease;
}
.woocommerce ul.products li.product a.add_to_cart_button:hover{
  background:linear-gradient(95deg,#F2648C,#E0577C);color:#fff;
  border-color:transparent;box-shadow:0 8px 18px rgba(224,87,124,.30);
}
.woocommerce ul.products li.product a.added_to_cart{
  display:block;margin:0 10px 10px;text-align:center;font-size:10.5px;color:var(--v-muted);
}

@media(max-width:1023px){
  ul.products{gap:15px !important;}
  .woocommerce ul.products li.product{
    flex-basis:calc((100% - 3*15px)/4) !important;max-width:calc((100% - 3*15px)/4) !important;
  }
}
@media(max-width:767px){
  ul.products{gap:10px !important;}
  .woocommerce ul.products li.product{
    flex-basis:calc((100% - 2*10px)/3) !important;max-width:calc((100% - 2*10px)/3) !important;
  }
}

/* pagination (future-proofed for when the catalog grows past one page) */
nav.woocommerce-pagination{margin:32px 0 8px;text-align:center;}
nav.woocommerce-pagination ul.page-numbers{
  display:inline-flex;gap:8px;list-style:none;padding:0;margin:0;
}
nav.woocommerce-pagination .page-numbers{
  display:flex;align-items:center;justify-content:center;
  min-width:38px;height:38px;padding:0 10px;border-radius:999px;
  font-family:Poppins,sans-serif;font-size:13px;font-weight:500;color:var(--v-ink);
  border:1.5px solid var(--v-hair);background:#fff;text-decoration:none;
  transition:all .2s ease;
}
nav.woocommerce-pagination .page-numbers.current,
nav.woocommerce-pagination .page-numbers:hover{
  background:linear-gradient(95deg,#F2648C,#E0577C);color:#fff;border-color:transparent;
}

/* ============ BRAND INDEX GRID (/brands, [vb_brand_grid]) ============ */
.vb-brand-container{width:100%;max-width:1300px;margin:0 auto;padding:0 20px;box-sizing:border-box;}
.vb-brand-hero{text-align:center;padding:44px 20px 34px;}
.vb-hero-title{
  font-family:Poppins,sans-serif;font-size:28px;font-weight:600;color:var(--v-ink);
  margin:0 0 10px;position:relative;display:inline-block;padding-bottom:14px;
}
.vb-hero-title:after{
  content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:46px;height:3px;border-radius:2px;background:var(--v-accent);
}
.vb-hero-desc{
  font-family:Poppins,sans-serif;font-size:14px;color:var(--v-muted);
  max-width:52ch;margin:0 auto;line-height:1.7;
}

.vb-brand-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding:0 0 44px;}
.vb-brand-card{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  background:#fff;border:1px solid var(--v-hair);border-radius:14px;
  padding:26px 16px;text-decoration:none !important;color:inherit;
  transition:transform .2s ease,box-shadow .2s ease;
}
.vb-brand-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(199,110,136,.17);color:inherit;}
.vb-brand-logo-box{
  width:88px;height:88px;border-radius:50%;background:var(--v-blush);
  border:1px solid var(--v-edge);display:flex;align-items:center;justify-content:center;
  overflow:hidden;margin-bottom:14px;padding:10px;box-sizing:border-box;flex:0 0 auto;
}
.vb-brand-img{max-width:100%;max-height:100%;object-fit:contain;mix-blend-mode:multiply;}
.vb-brand-initial{
  font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500;
  font-size:32px;color:var(--v-accent);
}
.vb-brand-title{font-family:Poppins,sans-serif;font-size:13.5px;font-weight:600;color:var(--v-ink);margin-bottom:4px;}
.vb-brand-count{font-family:Poppins,sans-serif;font-size:11.5px;color:var(--v-muted);}

@media(max-width:1024px){.vb-brand-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:640px){
  .vb-brand-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
  .vb-brand-card{padding:20px 12px;}
  .vb-brand-logo-box{width:72px;height:72px;}
  .vb-hero-title{font-size:23px;}
}

/* ============ BRAND ARCHIVE HERO (individual /brand/{slug}/ pages) ============ */
header.vielle-brand-hero{
  display:flex;align-items:center;gap:26px;
  padding:28px 32px;margin:6px 0 26px;border-radius:22px;
  background:linear-gradient(95deg,var(--v-blush) 0%,var(--v-surf) 100%);
  position:relative;overflow:hidden;
}
.vielle-brand-hero__media{flex:0 0 auto;}
.vielle-brand-hero__logo{
  width:104px;height:104px;border-radius:50%;object-fit:contain;mix-blend-mode:multiply;
  background:#fff;border:1px solid var(--v-edge);padding:14px;box-sizing:border-box;display:block;
}
.vielle-brand-hero__initial{
  width:104px;height:104px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid var(--v-edge);
  font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500;
  font-size:42px;color:var(--v-accent);
}
.vielle-brand-hero__body{flex:1 1 auto;min-width:0;}
.vielle-brand-hero__title.page-title{margin:0 0 12px;}
.vielle-brand-hero__count{
  display:inline-block;font-family:Poppins,sans-serif;font-size:12px;font-weight:600;
  color:var(--v-accent);background:#fff;border:1px solid var(--v-edge);border-radius:999px;
  padding:5px 14px;letter-spacing:.2px;
}
.vielle-brand-hero__desc.page-description{margin-top:12px;max-width:64ch;font-size:13.5px;}

@media(max-width:640px){
  header.vielle-brand-hero{flex-direction:column;text-align:center;padding:26px 20px;gap:16px;}
  .vielle-brand-hero__logo,.vielle-brand-hero__initial{width:84px;height:84px;font-size:34px;}
  .vielle-brand-hero__title.page-title:after{left:50%;transform:translateX(-50%);}
  .vielle-brand-hero__desc.page-description{margin-left:auto;margin-right:auto;}
}

/* ============ BRAND ARCHIVE "FROM THE BLOG" SIDEBAR ============ */
.vielle-blog-widget{
  background:#fff;border:1px solid var(--v-hair);border-radius:14px;
  padding:20px;margin:6px 0 0;
}
.vielle-blog-widget .widget-title{
  font-family:Poppins,sans-serif;font-size:15px;font-weight:600;color:var(--v-ink);
  margin:0 0 16px;position:relative;padding-bottom:10px;
}
.vielle-blog-widget .widget-title:after{
  content:"";position:absolute;left:0;bottom:0;width:34px;height:3px;border-radius:2px;background:var(--v-accent);
}
.vielle-blog-list{display:flex;flex-direction:column;gap:14px;}
.vielle-blog-item{display:flex;gap:12px;text-decoration:none !important;align-items:flex-start;}
.vielle-blog-item__img{
  flex:0 0 auto;width:64px;height:64px;border-radius:10px;overflow:hidden;background:var(--v-surf);
}
.vielle-blog-item__img img{width:100%;height:100%;object-fit:cover;}
.vielle-blog-item__body{flex:1 1 auto;min-width:0;}
.vielle-blog-item__title{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-family:Poppins,sans-serif;font-size:12.5px;font-weight:500;line-height:1.4;color:var(--v-ink);
}
.vielle-blog-item:hover .vielle-blog-item__title{color:var(--v-accent);}
.vielle-blog-item__date{
  display:block;margin-top:4px;font-family:Poppins,sans-serif;font-size:11px;color:var(--v-muted);
}
.vielle-blog-viewall{
  display:inline-block;margin-top:16px;font-family:Poppins,sans-serif;font-size:12px;font-weight:600;
  color:var(--v-accent);text-decoration:none !important;
}
.vielle-blog-viewall:hover{color:var(--v-deep);}
@media(max-width:1023px){
  body.woocommerce-shop aside#secondary,
  body.tax-product_brand aside#secondary,
  body.tax-product_cat aside#secondary{margin-top:26px;}
}

/* ============ SIDEBAR-COLUMN ARCHIVE PRODUCT CARDS ============
   Main /shop/ page, individual /brand/{slug}/ and /product-category/{slug}/
   pages — all three archives keep the col-lg-3 interactive sidebar.
   Card metrics lifted from the "You May Also Like" grid on the single-product
   template (Xpro product grid, .vielle-grid): 16px gutter, 180px image box,
   13px title, 16px price, 12px button on 9/18 padding, 14px radius.
   That grid sits in the PDP's 1300px container (~247px cards); these loops
   sit in the narrower col-lg-9 column beside the sidebar, so the column count
   is left fluid (basis 210px, capped at 265px) to land on the same card width
   rather than forcing 5-up and shrinking the cards. */
body.woocommerce-shop ul.products,
body.tax-product_brand ul.products,
body.tax-product_cat ul.products{gap:16px !important;}
body.woocommerce-shop.woocommerce ul.products li.product,
body.tax-product_brand.woocommerce ul.products li.product,
body.tax-product_cat.woocommerce ul.products li.product{
  flex:1 1 210px !important;max-width:265px !important;
}
body.woocommerce-shop.woocommerce ul.products li.product img,
body.tax-product_brand.woocommerce ul.products li.product img,
body.tax-product_cat.woocommerce ul.products li.product img{height:180px;}
body.woocommerce-shop.woocommerce ul.products li.product .woocommerce-loop-product__title,
body.tax-product_brand.woocommerce ul.products li.product .woocommerce-loop-product__title,
body.tax-product_cat.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:13px !important;line-height:1.45;margin:12px 13px 6px;
}
body.woocommerce-shop.woocommerce ul.products li.product .price,
body.tax-product_brand.woocommerce ul.products li.product .price,
body.tax-product_cat.woocommerce ul.products li.product .price{
  font-size:16px !important;margin:0 13px 12px;
}
body.woocommerce-shop.woocommerce ul.products li.product .price del,
body.tax-product_brand.woocommerce ul.products li.product .price del,
body.tax-product_cat.woocommerce ul.products li.product .price del{font-size:12px;}
body.woocommerce-shop.woocommerce ul.products li.product .button,
body.woocommerce-shop.woocommerce ul.products li.product a.add_to_cart_button,
body.tax-product_brand.woocommerce ul.products li.product .button,
body.tax-product_brand.woocommerce ul.products li.product a.add_to_cart_button,
body.tax-product_cat.woocommerce ul.products li.product .button,
body.tax-product_cat.woocommerce ul.products li.product a.add_to_cart_button{
  font-size:12px;padding:9px 18px;margin:0 13px 15px !important;
}
body.woocommerce-shop.woocommerce ul.products li.product a.added_to_cart,
body.tax-product_brand.woocommerce ul.products li.product a.added_to_cart,
body.tax-product_cat.woocommerce ul.products li.product a.added_to_cart{margin:0 13px 15px;}

@media(max-width:1023px){
  body.woocommerce-shop.woocommerce ul.products li.product,
  body.tax-product_brand.woocommerce ul.products li.product,
  body.tax-product_cat.woocommerce ul.products li.product{
    flex:0 0 calc((100% - 2*16px)/3) !important;max-width:calc((100% - 2*16px)/3) !important;
  }
}
@media(max-width:767px){
  body.woocommerce-shop ul.products,
  body.tax-product_brand ul.products,
  body.tax-product_cat ul.products{gap:12px !important;}
  body.woocommerce-shop.woocommerce ul.products li.product,
  body.tax-product_brand.woocommerce ul.products li.product,
  body.tax-product_cat.woocommerce ul.products li.product{
    flex:0 0 calc((100% - 12px)/2) !important;max-width:calc((100% - 12px)/2) !important;
  }
  body.woocommerce-shop.woocommerce ul.products li.product img,
  body.tax-product_brand.woocommerce ul.products li.product img,
  body.tax-product_cat.woocommerce ul.products li.product img{height:150px;}
}

/* Scrollable Product Categories list in the Shop filter sidebar. */
.vielle-shop-categories > ul{
  max-height:360px;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:var(--v-edge) transparent;
  padding-right:8px;
}
.vielle-shop-categories > ul::-webkit-scrollbar{width:6px;}
.vielle-shop-categories > ul::-webkit-scrollbar-track{background:transparent;}
.vielle-shop-categories > ul::-webkit-scrollbar-thumb{
  background:var(--v-edge);
  border-radius:999px;
}
.vielle-shop-categories > ul::-webkit-scrollbar-thumb:hover{background:var(--v-accent);}
