/* ============================================================
   Sanigroup — WooCommerce design layer
   Targets both classic (ul.products li.product) and block
   (Product Collection / wc-block-grid) markup, so it lands
   regardless of which template WooCommerce serves.
   ============================================================ */

.woocommerce, .woocommerce-page{ color:var(--sg-ink); }
.woocommerce a{ color:var(--sg-navy); }

/* ---------- page width for shop/product/cart ---------- */
.woocommerce-products-header,
body.woocommerce main, body.woocommerce-page main,
.wp-block-woocommerce-product-collection{ }

/* ---------- ARCHIVE header ---------- */
.woocommerce-products-header{ max-width:1280px; margin:0 auto; padding:54px 28px 0; }
.woocommerce-products-header__title,
.wp-block-post-title.is-archive,
.woocommerce-products-header .page-title{
  font-size:clamp(30px,4vw,44px); font-weight:700; letter-spacing:-.02em; color:var(--sg-ink); margin:0;
}
.term-description{ color:var(--sg-muted); max-width:64ch; margin-top:12px; }

/* toolbar: result count + ordering */
.woocommerce .woocommerce-result-count,
.wc-block-product-collection .woocommerce-result-count{
  color:var(--sg-label); font-size:13px; margin:0; padding-top:6px;
}
.woocommerce .woocommerce-ordering select,
.orderby, select.orderby{
  height:46px; border:1.5px solid var(--sg-line); border-radius:8px; padding:0 38px 0 16px;
  font-size:14px; color:var(--sg-ink); background:#fff; cursor:pointer;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23211f26' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center;
}

/* a subtle divider under the toolbar area */
.woocommerce-products-header + .woocommerce-notices-wrapper,
.woocommerce ul.products{ }

/* ---------- PRODUCT GRID ---------- */
.woocommerce ul.products,
.wc-block-grid__products,
ul.wc-block-product-template,
.wp-block-woocommerce-product-template,
.products.columns-1, .products.columns-2, .products.columns-3, .products.columns-4, .products.columns-5{
  list-style:none; margin:28px auto 0; padding:0 28px; max-width:1280px;
  display:grid !important; grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  gap:26px;
}
.woocommerce ul.products::before, .woocommerce ul.products::after{ content:none !important; }
/* responsive columns: 4 → 3 → 2 → 1 */
@media(max-width:1160px){ .woocommerce ul.products,.wc-block-grid__products,ul.wc-block-product-template,.wp-block-woocommerce-product-template{ grid-template-columns:repeat(3,minmax(0,1fr)) !important; } }
@media(max-width:780px){ .woocommerce ul.products,.wc-block-grid__products,ul.wc-block-product-template,.wp-block-woocommerce-product-template{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:16px; } }
@media(max-width:460px){ .woocommerce ul.products,.wc-block-grid__products,ul.wc-block-product-template,.wp-block-woocommerce-product-template{ grid-template-columns:1fr !important; } }

/* ---------- PRODUCT CARD ---------- */
.woocommerce ul.products li.product,
.wc-block-grid__product,
li.wc-block-product,
.wp-block-woocommerce-product-template li.product,
.wp-block-woocommerce-product-template > li{
  width:auto !important; margin:0 !important; float:none !important;
  background:#fff; border:1px solid var(--sg-line); border-radius:12px;
  padding:16px 16px 18px; display:flex; flex-direction:column;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  position:relative; text-align:left;
}
.woocommerce ul.products li.product:hover,
.wc-block-grid__product:hover,
li.wc-block-product:hover{
  transform:translateY(-4px); box-shadow:0 16px 32px rgba(18,0,104,.10); border-color:var(--sg-lav-deep);
}

/* product image: contained, square, neutral pad — fixes the giant-image problem */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product img,
.wc-block-grid__product-image img,
.wc-block-components-product-image img,
li.wc-block-product img{
  width:100% !important; aspect-ratio:1/1; object-fit:contain;
  background:#fafafb; border-radius:8px; padding:14px; margin:0 0 14px;
}
.woocommerce ul.products li.product a{ display:block; }

/* title */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-grid__product-title,
.wc-block-components-product-name,
li.wc-block-product .wp-block-post-title{
  font-size:15px !important; line-height:1.35; font-weight:600; color:var(--sg-ink);
  padding:0 !important; margin:0 0 8px; min-height:2.7em;
}
.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title{ color:var(--sg-navy); }

/* price */
.woocommerce ul.products li.product .price,
.wc-block-grid__product-price,
.wc-block-components-product-price{
  color:var(--sg-ink) !important; font-weight:700; font-size:17px; margin:0 0 14px; display:block;
}
.woocommerce ul.products li.product .price del,
.wc-block-components-product-price del{ color:var(--sg-label); font-weight:500; font-size:14px; margin-right:6px; }
.woocommerce ul.products li.product .price ins,
.wc-block-components-product-price ins{ text-decoration:none; color:var(--sg-alert); }
.woocommerce ul.products li.product .price .woocommerce-Price-amount{ font-size:17px; }
.woocommerce ul.products li.product .price small.woocommerce-price-suffix{ color:var(--sg-label); font-weight:500; font-size:11px; }

/* push button to the bottom of the card */
.woocommerce ul.products li.product .button,
.wc-block-grid__product .wp-block-button__link,
.wc-block-grid__product .add_to_cart_button,
li.wc-block-product .wp-block-button__link{
  margin-top:auto !important; width:100%; justify-content:center; text-align:center;
  background:var(--sg-navy) !important; color:#fff !important; border:0; border-radius:3px;
  padding:12px 16px !important; font-size:14px; font-weight:600; cursor:pointer;
  transition:background .15s ease;
}
.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product .wp-block-button__link:hover{ background:var(--sg-navy-hover) !important; }
.woocommerce ul.products li.product .added_to_cart{
  margin-top:8px; text-align:center; font-size:13px; color:var(--sg-navy);
}

/* sale badge */
.woocommerce span.onsale, .wc-block-grid__product-onsale{
  position:absolute; top:14px; left:14px; z-index:2; margin:0; min-height:0; min-width:0;
  background:var(--sg-navy); color:#fff; font-size:11px; font-weight:700; letter-spacing:.02em;
  padding:5px 10px; border-radius:999px; line-height:1;
}

/* ---------- PAGINATION ---------- */
.woocommerce nav.woocommerce-pagination{ max-width:1280px; margin:44px auto 0; padding:0 28px 10px; text-align:center; }
.woocommerce nav.woocommerce-pagination ul{ border:0; display:inline-flex; gap:8px; }
.woocommerce nav.woocommerce-pagination ul li{ border:0; margin:0; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  border:1.5px solid var(--sg-line); border-radius:8px; min-width:42px; height:42px;
  display:inline-flex; align-items:center; justify-content:center; padding:0 10px;
  color:var(--sg-ink); font-weight:600; background:#fff;
}
.woocommerce nav.woocommerce-pagination ul li span.current{ background:var(--sg-navy); color:#fff; border-color:var(--sg-navy); }
.woocommerce nav.woocommerce-pagination ul li a:hover{ border-color:var(--sg-navy); color:var(--sg-navy); }

/* ============================================================
   SINGLE PRODUCT
   ============================================================ */
/* The BLOCK single-product template manages its own two-column layout
   (gallery floats left, details flow right). Do NOT impose a grid here —
   that crams gallery + details into one column and makes the title wrap
   vertically. Just center and cap the width. */
.woocommerce div.product, .single-product div.product{
  max-width:1280px; margin:30px auto 0;
}
.single-product .woocommerce-breadcrumb{
  max-width:1280px; margin:26px auto 0; padding:0 28px;
  font-size:13px; color:var(--sg-label);
}
.single-product .woocommerce-breadcrumb a{ color:var(--sg-navy); }

/* gallery — let it keep its native ~48% float-left width; do NOT force 100% */
.woocommerce div.product div.images{ margin:0; }
.woocommerce-product-gallery .woocommerce-product-gallery__image img,
.woocommerce div.product div.images img{
  border:1px solid var(--sg-line); border-radius:14px; background:#fafafb;
}
.woocommerce-product-gallery .flex-viewport{ border-radius:14px; }
.woocommerce div.product .woocommerce-product-gallery__trigger{ top:18px; right:18px; }

/* summary */
.woocommerce div.product div.summary, .product .entry-summary{ margin:0 !important; }
.woocommerce div.product .product_title, .product_title.entry-title{
  font-size:clamp(26px,3.2vw,38px) !important; font-weight:700; letter-spacing:-.02em;
  line-height:1.12; color:var(--sg-ink); margin:0 0 18px;
}
.woocommerce div.product p.price, .woocommerce div.product span.price{
  color:var(--sg-ink) !important; font-size:28px !important; font-weight:700; margin:0 0 20px;
}
.woocommerce div.product p.price del{ color:var(--sg-label); font-weight:500; font-size:20px; }
.woocommerce div.product p.price ins{ text-decoration:none; color:var(--sg-alert); }
.woocommerce div.product p.price .woocommerce-price-suffix,
.woocommerce div.product .price small{ font-size:13px; color:var(--sg-label); font-weight:500; }
.woocommerce div.product .woocommerce-product-details__short-description,
.product .entry-summary > p{ color:var(--sg-muted); line-height:1.7; margin:0 0 24px; }

/* quantity + add to cart */
.woocommerce div.product form.cart{ margin:0 0 24px; display:flex; gap:14px; align-items:stretch; flex-wrap:wrap; }
.woocommerce .quantity .qty, .wc-block-components-quantity-selector{
  height:54px; width:84px; border:1.5px solid var(--sg-line); border-radius:8px;
  text-align:center; font-size:16px; color:var(--sg-ink); background:#fff;
}
.woocommerce div.product form.cart .button,
.woocommerce div.product .single_add_to_cart_button{
  height:54px; padding:0 32px !important; background:var(--sg-navy) !important; color:#fff !important;
  border:0; border-radius:3px; font-size:16px; font-weight:600; cursor:pointer; transition:background .15s ease;
  display:inline-flex; align-items:center; justify-content:center;
}
.woocommerce div.product .single_add_to_cart_button:hover{ background:var(--sg-navy-hover) !important; }

/* meta */
.woocommerce div.product .product_meta{
  border-top:1px solid var(--sg-line); padding-top:18px; font-size:14px; color:var(--sg-muted);
}
.woocommerce div.product .product_meta > span{ display:block; margin-bottom:6px; }
.woocommerce div.product .product_meta a{ color:var(--sg-navy); }

/* tabs */
.woocommerce div.product .woocommerce-tabs{
  clear:both; max-width:1280px; margin:46px auto 0; padding:0 28px; width:100%;
}
.woocommerce div.product .woocommerce-tabs ul.tabs{ padding:0; margin:0 0 24px; border-bottom:1px solid var(--sg-line); display:flex; gap:6px; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before{ border:0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:none; border:0; border-radius:0; margin:0; padding:0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  padding:14px 18px; font-weight:600; color:var(--sg-muted); display:block; border-bottom:3px solid transparent; margin-bottom:-1px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{ color:var(--sg-navy); border-bottom-color:var(--sg-navy); }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{ display:none; }
.woocommerce div.product .woocommerce-Tabs-panel{ color:var(--sg-muted); line-height:1.75; }
.woocommerce div.product .woocommerce-Tabs-panel h2{ color:var(--sg-ink); font-size:22px; }

/* related / upsells */
.woocommerce .related.products, .woocommerce .upsells.products{
  clear:both; max-width:1280px; margin:60px auto 0; padding:0 28px 10px; width:100%;
}
.woocommerce .related.products > h2, .woocommerce .upsells.products > h2{
  font-size:26px; font-weight:700; color:var(--sg-ink); letter-spacing:-.01em; margin:0 0 6px;
}

@media(max-width:900px){
  /* stack: gallery full-width on top, details below */
  .woocommerce div.product div.images, .woocommerce-product-gallery{ float:none; width:100%; margin:0 0 24px; }
}

/* ============================================================
   NOTICES
   ============================================================ */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews{
  border-radius:10px; border:1px solid var(--sg-line); border-top:3px solid var(--sg-navy);
  background:#fff; padding:16px 18px; color:var(--sg-ink);
}
.woocommerce-message{ border-top-color:#1f9d57; }
.woocommerce-error{ border-top-color:var(--sg-alert); }
.woocommerce-message .button, .woocommerce-info .button{
  background:var(--sg-navy); color:#fff; border-radius:3px; padding:8px 16px;
}

/* ============================================================
   CART + CHECKOUT (block)
   ============================================================ */
.wc-block-cart, .wc-block-checkout{ max-width:1280px; margin:40px auto; padding:0 28px; }
.wc-block-components-button.contained,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button,
.wc-block-cart__submit-button{
  background:var(--sg-navy) !important; color:#fff !important; border-radius:3px !important; font-weight:600;
}
.wc-block-components-button.contained:hover{ background:var(--sg-navy-hover) !important; }
.wc-block-components-text-input input,
.wc-block-components-textarea{
  border-radius:8px !important; border-color:var(--sg-line) !important;
}
.wc-block-cart-items, .wc-block-components-totals-wrapper{ border-color:var(--sg-line) !important; }

/* ============================================================
   FIXES v0.3 — collapsed single-product column, checkout 2-col,
   FiboFilters ordering select
   ============================================================ */

/* single product: stop the image blowing out col 1 and squeezing the summary */
.woocommerce div.product img{ max-width:100%; height:auto; }
.woocommerce div.product div.images,
.woocommerce div.product div.summary,
.product .entry-summary{ min-width:0; }
.woocommerce div.product .product_title,
.product_title.entry-title{ font-size:clamp(24px,3vw,34px) !important; overflow-wrap:anywhere; }
.woocommerce div.product .woocommerce-product-gallery{ max-width:100%; }
.woocommerce div.product .woocommerce-product-gallery img{ width:100%; }

/* FiboFilters ordering dropdown (your snippet swaps it; style it like ours) */
select.fibofilters-orderby,
.fibofilters-ordering select{
  height:46px; border:1.5px solid var(--sg-line); border-radius:8px; padding:0 38px 0 16px;
  font-size:14px; color:var(--sg-ink); background:#fff; cursor:pointer;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23211f26' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center;
}

/* checkout: force the two-column layout (form + order summary) */
.wc-block-checkout{ max-width:1180px; margin:40px auto; padding:0 28px; }
@media(min-width:1000px){
  .wc-block-checkout{ display:flex; gap:56px; align-items:flex-start; }
  .wc-block-checkout__main{ flex:1 1 60%; min-width:0; }
  .wc-block-checkout__sidebar{ flex:0 0 360px; max-width:360px; }
}

/* shop wrapper: ONE 1280 content box so breadcrumb, toolbar and grid all line up */
.sg-shop{ max-width:1280px; margin:0 auto; padding:14px 28px 64px; }
.sg-shop .woocommerce-products-header,
.sg-shop .woocommerce ul.products,
.sg-shop ul.products{ max-width:none !important; margin-left:0 !important; margin-right:0 !important; padding-left:0 !important; padding-right:0 !important; }
.sg-shop .woocommerce-products-header{ padding-top:30px !important; padding-bottom:0 !important; }
.sg-shop ul.products{ margin-top:22px !important; }
.sg-shop .woocommerce-breadcrumb{ max-width:none; margin:0 0 4px; padding:0; font-size:13px; color:var(--sg-label); }
.sg-shop .woocommerce-breadcrumb a{ color:var(--sg-navy); }
/* single product wrapper just needs bottom room; it self-constrains internally */
.sg-single{ padding-bottom:64px; }
