/* ============================================================
   FeederX — WooCommerce bridge
   Small glue between WooCommerce's own markup and the FeederX
   design system. Loaded last by inc/enqueue.php (see styles.css order).
   ============================================================ */

/* Product loop columns on archive (3-up like the prototype) */
.fx-woo ul.products,
.shop-main ul.products{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
}
/* Homepage best-sellers: the [products] shortcode renders its own ul.products
   grid, so the .prodgrid wrapper must NOT also be a grid — otherwise the list is
   squeezed into one column and the cards collapse. Make it a plain block. */
.prodgrid{display:block;}
.fx-home-products.products,
.prodgrid ul.products{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
@media(max-width:1180px){.fx-woo ul.products,.shop-main ul.products,.prodgrid ul.products{grid-template-columns:repeat(3,1fr);}}
@media(max-width:920px){.fx-woo ul.products,.shop-main ul.products,.prodgrid ul.products{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.fx-woo ul.products,.shop-main ul.products,.prodgrid ul.products{grid-template-columns:1fr;}}
ul.products li.product{margin:0;}

/* Shop toolbar */
.shop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 18px;flex-wrap:wrap;}
.shop-toolbar .woocommerce-result-count{margin:0;color:var(--muted);font-weight:600;font-size:14px;}
.shop-toolbar .woocommerce-ordering select{
  border:1.5px solid var(--line);background:var(--white);color:var(--ink);
  border-radius:10px;padding:9px 14px;font-family:var(--font-body);font-weight:600;font-size:14px;
}

/* Pagination → reuse design pill look */
.fx-pagination{margin-top:26px;display:flex;justify-content:center;}
.fx-pagination .page-numbers{list-style:none;display:flex;gap:8px;padding:0;margin:0;flex-wrap:wrap;}
.fx-pagination .page-numbers li{margin:0;}
.fx-pagination .page-numbers a,
.fx-pagination .page-numbers span{
  display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 12px;
  border:1.5px solid var(--line);border-radius:10px;background:var(--white);color:var(--ink);
  font-weight:700;text-decoration:none;
}
.fx-pagination .page-numbers .current{background:var(--acc,#D7283A);border-color:var(--acc,#D7283A);color:#fff;}

/* Free-shipping bar injected into cart/checkout totals */
.fx-freeship{font-size:13.5px;font-weight:600;color:var(--ink-soft);margin:0 0 8px;}
.fx-freeship.is-free{color:#1F8A4D;}
.fx-bar{height:8px;border-radius:6px;background:var(--line-2);overflow:hidden;}
.fx-bar>span{display:block;height:100%;background:linear-gradient(90deg,#1F8A4D,#27AE60);transition:width .4s;}

/* Wishlist heart active state */
.prod .fav.is-on{color:#DD382B;border-color:#DD382B;}

/* Keep WooCommerce notices readable on both skins */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  border-radius:12px;border:1px solid var(--line);background:var(--white);color:var(--ink);
  padding:14px 16px;list-style:none;
}
.woocommerce-message{border-left:4px solid #1F8A4D;}
.woocommerce-error{border-left:4px solid var(--acc,#D7283A);}
.woocommerce-info{border-left:4px solid var(--navy,#1E3A5F);}

/* Generic spacing for cart/checkout/account inside the chrome */
.fx-woo{padding:30px 0 60px;}
.fx-shop-wrap{padding-bottom:60px;}

/* Real images (category thumbnails, product images) must fill & crop their
   fixed-height boxes exactly like the prototype placeholders did. */
.cat .ph img{width:100%;height:168px;object-fit:cover;display:block;}
.cat.big .ph img{height:354px;}
.prod .imgwrap img,
.prod .imgwrap a.fx-img-link img{width:100%;height:208px;object-fit:cover;display:block;}
@media(max-width:760px){.cat.big .ph img{height:200px;}}

/* ============================================================
   FIX: WooCommerce buttons + related/up-sell product grids
   ============================================================ */

/* WooCommerce buttons → FeederX look (kills the default purple button) */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .button,
.woocommerce #respond input#submit{
  background:var(--navy,#1E3A5F);color:#fff;border:none;border-radius:10px;
  font-family:var(--font-disp,inherit);font-weight:700;text-transform:uppercase;letter-spacing:.02em;
  padding:12px 22px;cursor:pointer;text-decoration:none;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  transition:filter .15s,transform .15s;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce .button:hover{filter:brightness(1.07);}

/* primary actions (add to cart on product page, place order) → red accent */
.woocommerce .button.alt,
.woocommerce button.single_add_to_cart_button,
.woocommerce #place_order{
  background:var(--acc,#D7283A);color:#fff;font-size:15px;padding:14px 28px;
}
.woocommerce .button.alt:hover,
.woocommerce button.single_add_to_cart_button:hover,
.woocommerce #place_order:hover{filter:brightness(1.06);}
.woocommerce .button:disabled,
.woocommerce .button.disabled{opacity:.55;cursor:not-allowed;filter:none;}

/* quantity stepper input */
.woocommerce .quantity .qty{
  border:1.5px solid var(--line,#e7e9ee);border-radius:10px;padding:10px;width:74px;text-align:center;
  font-weight:700;background:var(--white,#fff);color:var(--ink,#1b2433);
}

/* single product price + form spacing */
.woocommerce div.product p.price,
.woocommerce div.product span.price{color:var(--acc,#D7283A);font-weight:800;}
.woocommerce div.product form.cart{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:8px;}

/* Related / up-sell products → same 4-up card grid as the rest of the site */
.related ul.products,
.up-sells ul.products,
.woocommerce .related ul.products,
.woocommerce .up-sells ul.products{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
.related > h2,.up-sells > h2{
  font-family:var(--font-disp,inherit);text-transform:uppercase;font-weight:800;color:var(--ink,#1b2433);margin:0 0 16px;
}
@media(max-width:1180px){.related ul.products,.up-sells ul.products{grid-template-columns:repeat(3,1fr);}}
@media(max-width:920px){.related ul.products,.up-sells ul.products{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.related ul.products,.up-sells ul.products{grid-template-columns:1fr;}}

/* Safety: constrain default (non-.prod) loop thumbnails so they never blow up */
.related ul.products li.product a img,
.up-sells ul.products li.product a img,
.related ul.products li.product img.attachment-woocommerce_thumbnail,
.up-sells ul.products li.product img.attachment-woocommerce_thumbnail{
  width:100%;height:auto;border-radius:12px;display:block;
}

/* ============================================================
   Themed classic CART (matches the FeederX mockup)
   ============================================================ */
.fx-cart{display:grid;grid-template-columns:1fr 360px;gap:28px;align-items:start;margin-top:6px;}
.fx-cart-card{background:var(--white,#fff);border:1px solid var(--line,#e7e9ee);border-radius:16px;padding:4px 20px;}
.fx-cart-rows{display:block;}
.fx-cart-row{display:grid;grid-template-columns:92px 1fr auto auto;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line,#e7e9ee);}
.fx-cart-row:last-child{border-bottom:none;}
.fx-cr-img img{width:92px;height:92px;object-fit:cover;border-radius:12px;display:block;}
.fx-cr-brand{display:block;color:var(--acc,#D7283A);font-weight:800;text-transform:uppercase;font-size:11px;letter-spacing:.05em;font-family:var(--font-disp,inherit);}
.fx-cr-name{font-size:16px;font-weight:700;margin:3px 0 6px;line-height:1.25;}
.fx-cr-name a{color:var(--ink,#1b2433);text-decoration:none;}
.fx-cr-name a:hover{color:var(--acc,#D7283A);}
.fx-cr-meta{font-size:12.5px;color:var(--muted,#6b7280);}
.fx-cr-meta p{margin:0;}
.fx-cr-meta dl{margin:0;display:flex;gap:6px;flex-wrap:wrap;}
.fx-cr-meta dt,.fx-cr-meta dd{margin:0;display:inline;}
.fx-cr-stock{display:inline-block;font-size:12.5px;font-weight:700;margin-top:6px;}
.fx-cr-stock.in{color:#1F8A4D;}
.fx-cr-stock.in::before{content:"\25CF ";}
.fx-cr-stock.out{color:var(--acc,#D7283A);}
.fx-remove{display:inline-block;margin:6px 0 0 12px;color:var(--muted,#9aa3af);font-size:12.5px;font-weight:600;text-decoration:none;}
.fx-remove:hover{color:var(--acc,#D7283A);}
.fx-cr-qty .quantity{display:inline-flex;align-items:center;gap:4px;}
.fx-cr-qty .qty{width:54px;text-align:center;border:1.5px solid var(--line,#e7e9ee);border-radius:10px;padding:9px 6px;font-weight:700;background:var(--white,#fff);color:var(--ink,#1b2433);-moz-appearance:textfield;}
.fx-cr-qty .qty::-webkit-outer-spin-button,.fx-cr-qty .qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.fx-step{width:34px;height:38px;border:1.5px solid var(--line,#e7e9ee);background:var(--white,#fff);color:var(--ink,#1b2433);border-radius:10px;font-size:18px;font-weight:700;cursor:pointer;line-height:1;}
.fx-step:hover{border-color:var(--acc,#D7283A);color:var(--acc,#D7283A);}
.fx-cr-price{text-align:right;font-weight:800;color:var(--ink,#1b2433);white-space:nowrap;font-size:16px;}
.fx-cr-unit{display:block;font-size:12px;color:var(--muted,#6b7280);font-weight:600;margin-top:3px;}
.fx-cart-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:16px 0;}
.fx-coupon{display:flex;gap:8px;}
.fx-coupon-input{border:1.5px solid var(--line,#e7e9ee);border-radius:10px;padding:11px 14px;min-width:170px;background:var(--white,#fff);color:var(--ink,#1b2433);}
.woocommerce .fx-cart-actions .button.fx-coupon-btn,
.woocommerce .fx-cart-actions .button.fx-cart-update{background:transparent;color:var(--ink-soft,#4b5563);border:1.5px solid var(--line,#e7e9ee);}
.woocommerce .fx-cart-actions .button.fx-coupon-btn:hover,
.woocommerce .fx-cart-actions .button.fx-cart-update:hover{border-color:var(--acc,#D7283A);color:var(--acc,#D7283A);filter:none;}
.fx-cart-actions-right{margin-left:auto;display:flex;align-items:center;gap:16px;}
.fx-continue{color:var(--ink-soft,#4b5563);text-decoration:none;font-weight:600;}
.fx-continue:hover{color:var(--acc,#D7283A);}

/* Summary card */
.fx-summary{background:var(--white,#fff);border:1px solid var(--line,#e7e9ee);border-radius:16px;padding:22px;position:sticky;top:90px;}
.fx-summary-title{font-family:var(--font-disp,inherit);text-transform:uppercase;font-weight:800;font-size:18px;margin:0 0 14px;color:var(--ink,#1b2433);}
.fx-summary-table{width:100%;border:none;margin:0;}
.fx-summary-table th,.fx-summary-table td{border:none;padding:7px 0;font-weight:600;color:var(--ink-soft,#4b5563);font-size:14.5px;vertical-align:top;}
.fx-summary-table th{text-align:left;}
.fx-summary-table td{text-align:right;color:var(--ink,#1b2433);font-weight:700;}
.fx-summary-table .woocommerce-shipping-totals.shipping th,.fx-summary-table .shipping th{text-align:left;}
.fx-summary-table .woocommerce-shipping-methods{list-style:none;margin:0;padding:0;text-align:right;}
.fx-summary-table .order-total th{font-family:var(--font-disp,inherit);text-transform:uppercase;color:var(--ink,#1b2433);font-size:15px;padding-top:14px;border-top:1px solid var(--line,#e7e9ee);}
.fx-summary-table .order-total td{color:var(--navy,#1E3A5F);font-weight:800;font-size:21px;padding-top:14px;border-top:1px solid var(--line,#e7e9ee);}
.fx-summary-table .fx-freeship-row td{padding-top:10px;}
.fx-checkout-btn{margin:16px 0 14px;}
.woocommerce .fx-checkout-btn .checkout-button{display:flex;width:100%;background:var(--acc,#D7283A);font-size:15px;padding:15px 20px;}
.fx-trust{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:9px;}
.fx-trust li{font-size:13px;color:var(--ink-soft,#4b5563);padding-left:22px;position:relative;}
.fx-trust li::before{content:"\2713";position:absolute;left:0;color:#1F8A4D;font-weight:800;}
.fx-pays{display:flex;gap:6px;flex-wrap:wrap;}
.fx-pays .pay{border:1px solid var(--line,#e7e9ee);border-radius:6px;padding:5px 9px;font-size:11px;font-weight:700;color:var(--muted,#6b7280);}
.fx-cart-cross{margin-top:42px;}

@media(max-width:900px){
	.fx-cart{grid-template-columns:1fr;}
	.fx-summary{position:static;}
}
@media(max-width:560px){
	.fx-cart-row{grid-template-columns:72px 1fr;row-gap:10px;}
	.fx-cr-img img{width:72px;height:72px;}
	.fx-cr-qty,.fx-cr-price{grid-column:2;text-align:left;justify-self:start;}
	.fx-cart-actions-right{margin-left:0;width:100%;}
}

/* cross-sells in cart use the same card grid + cards as related */
.cross-sells ul.products{
	list-style:none;margin:0;padding:0;
	display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
.cross-sells > h2{font-family:var(--font-disp,inherit);text-transform:uppercase;font-weight:800;color:var(--ink,#1b2433);margin:0 0 16px;}
@media(max-width:1180px){.cross-sells ul.products{grid-template-columns:repeat(3,1fr);}}
@media(max-width:920px){.cross-sells ul.products{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.cross-sells ul.products{grid-template-columns:1fr;}}

/* ============================================================
   SPECIFICITY FIXES — must outrank WooCommerce's default stylesheet
   (WooCommerce uses .woocommerce a.button.alt and
    .woocommerce ul.products li.product img with element selectors;
    we prefix with body.woocommerce to win regardless of load order)
   ============================================================ */

/* Buttons: base → navy, primary (.alt / add-to-cart / place order / checkout) → red */
body.woocommerce a.button,
body.woocommerce button.button,
body.woocommerce input.button,
body.woocommerce #respond input#submit{
  background:var(--navy,#1E3A5F);color:#fff;border:none;border-radius:10px;
  font-family:var(--font-disp,inherit);font-weight:700;text-transform:uppercase;letter-spacing:.02em;
}
body.woocommerce a.button.alt,
body.woocommerce button.button.alt,
body.woocommerce input.button.alt,
body.woocommerce #respond input#submit.alt,
body.woocommerce button.single_add_to_cart_button,
body.woocommerce button.single_add_to_cart_button.button.alt,
body.woocommerce a.checkout-button.button.alt,
body.woocommerce #place_order{
  background:var(--acc,#D7283A);color:#fff;
}
body.woocommerce a.button:hover,
body.woocommerce button.button:hover,
body.woocommerce input.button:hover,
body.woocommerce #respond input#submit:hover{filter:brightness(1.07);}

/* keep the cart's secondary buttons (coupon/update) outlined, not navy */
body.woocommerce .fx-cart-actions .button.fx-coupon-btn,
body.woocommerce .fx-cart-actions .button.fx-cart-update{
  background:transparent;color:var(--ink-soft,#4b5563);border:1.5px solid var(--line,#e7e9ee);
}

/* Product-card images: uniform 208px crop, beat WooCommerce's li.product img{height:auto} */
body.woocommerce ul.products li.product .imgwrap img,
body.woocommerce ul.products li.product .imgwrap a.fx-img-link img{
  width:100%;height:208px;object-fit:cover;display:block;
}

/* Force an EVEN product grid (beat WooCommerce's default flex/float loop layout,
   which caused uneven rows like 2 / 3 / 1). Prefix with body.woocommerce to win. */
body.woocommerce .shop-main ul.products,
body.woocommerce .fx-woo ul.products{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;float:none;
}
body.woocommerce .prodgrid ul.products,
body.woocommerce .related ul.products,
body.woocommerce .up-sells ul.products,
body.woocommerce .cross-sells ul.products{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;float:none;
}
body.woocommerce ul.products li.product{float:none;width:auto;margin:0;clear:none;}
@media(max-width:1180px){
  body.woocommerce .shop-main ul.products,
  body.woocommerce .related ul.products,
  body.woocommerce .up-sells ul.products,
  body.woocommerce .cross-sells ul.products,
  body.woocommerce .prodgrid ul.products{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:920px){
  body.woocommerce .shop-main ul.products,
  body.woocommerce .related ul.products,
  body.woocommerce .up-sells ul.products,
  body.woocommerce .cross-sells ul.products,
  body.woocommerce .prodgrid ul.products{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:560px){
  body.woocommerce .shop-main ul.products,
  body.woocommerce .related ul.products,
  body.woocommerce .up-sells ul.products,
  body.woocommerce .cross-sells ul.products,
  body.woocommerce .prodgrid ul.products{grid-template-columns:1fr;}
}

/* WooCommerce adds a clearfix ::before/::after on ul.products. Inside a CSS grid
   these pseudo-elements become phantom cells — ::before steals the first cell and
   pushes the opening row to start at column 2 (looked like "2 then 3, 3, 3..."). */
body.woocommerce ul.products::before,
body.woocommerce ul.products::after{
  content:none !important;
  display:none !important;
}

/* Category "hub" page (parent with children) — subcategory cards fill the row
   regardless of how many there are (e.g. 3 across), reusing the .cat card look. */
.catgrid.fx-subcats{
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  align-items:start;
}
.catgrid.fx-subcats .cat.big{grid-row:auto;} /* no oversized first card on hubs */
@media(max-width:560px){.catgrid.fx-subcats{grid-template-columns:1fr;}}