/* Shahin Bazar — GLOBAL product card. Applies everywhere WooCommerce renders
   a product loop item: Shop, categories, related products, upsells, search,
   the native [products] shortcode, and any carousel built on the same template.
   Brand tokens: black #1A1A1A, gold #C8901E/#F2B84B, muted #7A7A7A,
   border #E5E2DA, soft bg #F7F5F0, urgency red #D64545 (sale badge only). */

ul.products li.product.sb-product-card{
  position:relative;background:#FFFFFF;border:1px solid #E5E2DA;border-radius:12px;
  overflow:hidden;transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease;
  list-style:none;margin:0;padding:0;
}
ul.products li.product.sb-product-card:hover{border-color:#C8901E;box-shadow:0 10px 26px rgba(26,26,26,.09);transform:translateY(-3px)}

.sb-card-media{position:relative;aspect-ratio:1/1;background:#F7F5F0}
.sb-card-imglink{display:block;width:100%;height:100%}
.sb-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}
ul.products li.product.sb-product-card:hover .sb-card-media img{transform:scale(1.04)}

.sb-card-sale{position:absolute;top:10px;left:10px;z-index:2;background:#D64545;color:#FFFFFF;font-family:'Hind Siliguri',sans-serif;font-weight:600;font-size:11px;padding:4px 10px;border-radius:6px;letter-spacing:.3px;pointer-events:none}

/* Quick-add — plain positioned control, no z-index fighting since the
   whole-card overlay link no longer exists. */
ul.products li.product.sb-product-card a.sb-card-quickadd{
  position:absolute;bottom:10px;right:10px;z-index:3;width:38px;height:38px;
  border-radius:50%;background:#FFFFFF;border:1px solid #E5E2DA;color:#1A1A1A;
  display:flex;align-items:center;justify-content:center;text-decoration:none;
  opacity:0;transform:translateY(6px);
  transition:opacity .25s ease,transform .25s ease,background .25s ease,color .25s ease,border-color .25s ease;
  box-sizing:border-box;padding:0;line-height:1;font-size:0;cursor:pointer;
}
ul.products li.product.sb-product-card:hover a.sb-card-quickadd{opacity:1;transform:translateY(0)}
ul.products li.product.sb-product-card a.sb-card-quickadd:hover{background:#C8901E;border-color:#C8901E;color:#FFFFFF}
ul.products li.product.sb-product-card a.sb-card-quickadd.added{background:#3E9B4F;border-color:#3E9B4F;color:#FFFFFF}
.sb-card-quickadd svg{width:17px;height:17px;flex-shrink:0}
.sb-card-tooltip{position:absolute;bottom:46px;right:0;background:#1A1A1A;color:#FFFFFF;font-family:'Hind Siliguri',sans-serif;font-size:11px;padding:5px 10px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease}
.sb-card-quickadd:hover .sb-card-tooltip{opacity:1}
/* WooCommerce core JS injects an unstyled "View Cart" link after a successful
   add — hidden, since the green .added state already confirms it. */
.sb-card-media .added_to_cart.wc-forward{display:none!important}

.sb-card-body{padding:14px 16px 16px}
.sb-card-titlerow{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:6px}
.sb-card-title{margin:0;flex:1;min-width:0}
.sb-card-title a{font-family:'Hind Siliguri',sans-serif;font-weight:600;font-size:14px;line-height:1.4;color:#1A1A1A;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .25s ease}
.sb-card-title a:hover{color:#C8901E}

/* Wishlist heart — icon ONLY. No background, no border, no box, in any state.
   !important is used deliberately: some plugin/theme CSS styles bare <button>
   elements with their own background and border, and this must win in every
   state rather than depend on load order. */
.sb-wish-btn,
.sb-wish-btn:hover,
.sb-wish-btn:focus,
.sb-wish-btn:focus-visible,
.sb-wish-btn:active,
.sb-wish-btn.is-active,
.sb-wish-btn.is-busy,
.sb-wish-btn.just-toggled{
  background:none!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  outline:none!important;
  text-shadow:none!important;
  padding:0!important;
  margin:0!important;
  min-width:0!important;
  min-height:0!important;
  width:22px!important;
  height:22px!important;
  line-height:1!important;
  font-size:0!important;
  cursor:pointer;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform .3s cubic-bezier(.4,0,.2,1);
}
.sb-wish-btn svg{
  width:19px;height:19px;
  fill:none;stroke:#7A7A7A;stroke-width:2;
  transition:stroke .3s ease,fill .3s ease;
}
/* Hover: gentle zoom + colour shift only — no background, no box */
.sb-wish-btn:hover{transform:scale(1.15)}
.sb-wish-btn:hover svg{stroke:#C8901E}
/* Active = in wishlist: solid gold heart, still no chrome */
.sb-wish-btn.is-active svg{fill:#C8901E;stroke:#C8901E}
/* Confirmation pop after a successful toggle */
@keyframes sb-wish-pop{0%{transform:scale(1)}40%{transform:scale(1.4)}100%{transform:scale(1)}}
.sb-wish-btn.just-toggled{animation:sb-wish-pop .55s cubic-bezier(.4,0,.2,1)}
/* Busy only while the request is in flight, never on hover */
.sb-wish-btn.is-busy{opacity:.5;pointer-events:none}
.sb-card-rating{display:flex;align-items:center;gap:1px;margin-bottom:8px}
.sb-card-rating span{font-family:'Hind Siliguri',sans-serif;font-size:12px;color:#7A7A7A;margin-left:5px}
.sb-card-price{display:flex;align-items:baseline;gap:8px}
.sb-card-now{font-family:'Hind Siliguri',sans-serif;font-weight:700;font-size:16px;color:#1A1A1A}
.sb-card-was{font-family:'Hind Siliguri',sans-serif;font-size:13px;color:#7A7A7A;text-decoration:line-through}

@media (max-width:767px){
  ul.products li.product.sb-product-card a.sb-card-quickadd{opacity:1;transform:none;width:32px;height:32px}
  .sb-card-tooltip{display:none}
  .sb-card-body{padding:11px 12px 13px}
  .sb-card-title a{font-size:13px}
  .sb-card-now{font-size:15px}
}

/* Fix: WPThemePrime Image Swap's own .pisw-image-wrapper span has no
   explicit width/height (display:inline-block, sized by content only).
   Our images inside it are set to width:100%/height:100%, which is
   meaningless without a properly-sized ancestor -- a circular sizing bug
   that let the card's own background colour show through during the
   crossfade, looking washed-out/white. Forcing the wrapper itself to fill
   its parent link fixes this at the source. Not a plugin bug -- the plugin
   ships unopinionated about host sizing, by design, so any theme using it
   must size the wrapper itself. */
.sb-card-imglink .pisw-image-wrapper{display:block!important;width:100%!important;height:100%!important}
.sb-card-imglink .pisw-image-wrapper img{width:100%!important;height:100%!important;object-fit:cover!important}
