/* =============================================================================
   Al Mansoor — shop & category archive design
   -----------------------------------------------------------------------------
   Restyles the theme's existing archive markup. WooCommerce's brand filter,
   sorting, result count and pagination are left completely alone — only their
   appearance changes. Scoped to .amarch so nothing leaks to other pages.
   ============================================================================= */

/* ---------- header band ---------- */
.amarch .cat-hero{
  background:linear-gradient(115deg,#0C1E4D,#1D4ED8 60%,#3B82F6);
  color:#fff;position:relative;overflow:hidden;margin-bottom:30px;
}
.amarch .cat-hero::before{
  content:"";position:absolute;inset:-30%;
  background:radial-gradient(closest-side,rgba(255,255,255,.2),transparent 70%);
  animation:drift 20s ease-in-out infinite alternate;
}
.amarch .cat-hero .wrap{position:relative;z-index:1;padding:34px 20px 38px}
.amarch .cat-hero h1{
  font-family:Rubik,sans-serif;font-size:clamp(26px,3.6vw,38px);font-weight:800;
  letter-spacing:-.6px;margin:0 0 10px;color:#fff;
}
.amarch .cat-desc,
.amarch .cat-desc p{color:rgba(255,255,255,.92);max-width:70ch;margin:0 0 4px;font-size:16px}
.amarch .cat-meta{display:flex;gap:22px;margin-top:16px;font-size:14px;
  color:rgba(255,255,255,.9);flex-wrap:wrap}
.amarch .amarch-crumb .crumb,
.amarch .amarch-crumb .woocommerce-breadcrumb{
  color:rgba(255,255,255,.75);font-size:13.5px;padding:0 0 12px;
}
.amarch .amarch-crumb a{color:#fff}
.amarch .amarch-crumb a:hover{text-decoration:underline}

/* ---------- product cards: the preview look, on the theme's markup ---------- */
.amarch ul.products li.product,
.amarch li.product.loop-entry{
  background:#fff;
  border:1px solid #E2E8F0;
  border-radius:12px;
  overflow:hidden;
  transition:transform .32s cubic-bezier(.22,.61,.36,1),box-shadow .32s,border-color .32s;
}
.amarch ul.products li.product:hover,
.amarch li.product.loop-entry:hover{
  transform:translateY(-8px);
  box-shadow:0 22px 38px -20px rgba(15,23,42,.5);
  border-color:#CBD5E1;
}
.amarch li.product .product-thumbnail{overflow:hidden;background:#fff}
.amarch li.product .product-thumbnail img{
  transition:transform .55s cubic-bezier(.22,.61,.36,1);
}
.amarch li.product:hover .product-thumbnail img{transform:scale(1.08)}

.amarch li.product .woocommerce-loop-product__title{
  font-family:"Nunito Sans",sans-serif;
  font-size:14.5px;font-weight:600;line-height:1.45;
}
.amarch li.product .woocommerce-loop-product__title a:hover{color:#2563EB}
.amarch li.product .price{font-family:Rubik,sans-serif;font-weight:700;color:#1E293B}
.amarch li.product .price del{font-weight:400;opacity:.75}
.amarch li.product .price ins{text-decoration:none}

.amarch .woocommerce span.onsale,
.amarch li.product .onsale{
  background:#DC2626;color:#fff;font-family:Rubik,sans-serif;font-weight:700;
  border-radius:7px;padding:4px 9px;font-size:12px;min-height:0;min-width:0;line-height:1.4;
}

.amarch li.product .product-actions button{
  border-radius:8px;transition:transform .2s cubic-bezier(.22,.61,.36,1),color .2s;
}
.amarch li.product .product-actions button:hover{transform:translateY(-2px);color:#2563EB}

/* add-to-cart keeps the warm CTA */
.amarch li.product .button,
.amarch li.product .add_to_cart_button{
  border-radius:10px;font-family:Rubik,sans-serif;font-weight:600;
  transition:transform .2s cubic-bezier(.22,.61,.36,1),background .2s;
}
.amarch li.product .button:hover{transform:translateY(-2px)}

/* ---------- toolbar: result count + sorting ---------- */
.amarch .woocommerce-result-count{font-size:14.5px;color:#64748B}
.amarch .woocommerce-ordering select,
.amarch select.orderby{
  border:1.5px solid #E2E8F0;border-radius:9px;padding:9px 13px;
  font-family:"Nunito Sans",sans-serif;font-size:14px;background:#fff;
}
.amarch .woocommerce-ordering select:focus{outline:0;border-color:#2563EB}

/* ---------- brand filter sidebar ---------- */
.amarch .widget,
.amarch .wp-block-group.widget{
  border:1px solid #E2E8F0;border-radius:12px;background:#fff;
}
.amarch .widget-title,
.amarch .widgettitle{font-family:Rubik,sans-serif;font-weight:600;font-size:15px}

/* ---------- pagination ---------- */
.amarch .woocommerce-pagination ul li a,
.amarch .woocommerce-pagination ul li span{
  border-radius:9px;font-family:Rubik,sans-serif;font-weight:600;transition:.2s;
}
.amarch .woocommerce-pagination ul li a:hover{
  background:#2563EB;color:#fff;transform:translateY(-2px);
}
.amarch .woocommerce-pagination ul li span.current{
  background:#2563EB;color:#fff;border-color:#2563EB;
}

@media(prefers-reduced-motion:reduce){
  .amarch *,.amarch *::before,.amarch *::after{animation:none!important;transition:none!important}
  .amarch ul.products li.product:hover,
  .amarch li.product.loop-entry:hover{transform:none}
  .amarch li.product:hover .product-thumbnail img{transform:none}
}

/* -----------------------------------------------------------------------------
   Card titles were clamping to one line and cutting mid-word
   ("128 LITERS DOUBLE DOOR DIRECT COO…"). Allow three lines and a fixed
   min-height so the grid still aligns.
   -------------------------------------------------------------------------- */
.amarch li.product .woocommerce-loop-product__title,
.amarch li.product .woocommerce-loop-product__title a{
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
  overflow:hidden;text-overflow:ellipsis;white-space:normal;
  max-height:none;
}
.amarch li.product .woocommerce-loop-product__title{ min-height:3.9em; }