/**
 * Canonical Homepage Product Tabs.
 *
 * This module owns only the section shell, tabs and spotlight Big Card.
 * Right-side loop cards remain the global Shop Product Card without local
 * card presentation overrides.
 */
.stm-home-product-tabs{
  --stm-hpt-bg:var(--stm-color-surface,#fff);
  --stm-hpt-border:var(--stm-color-border,#e5e7eb);
  --stm-hpt-divider:var(--stm-color-success,#16a34a);
  --stm-hpt-tab-bg:var(--stm-commerce-raised-control-bg,var(--stm-raised-control-bg,#fff));
  --stm-hpt-tab-text:var(--stm-color-heading,#111827);
  --stm-hpt-tab-hover-bg:var(--stm-commerce-raised-hover-bg,var(--stm-raised-hover-bg,#f8fafc));
  --stm-hpt-tab-active-bg:var(--stm-commerce-raised-accent-bg,var(--stm-raised-accent-bg,#ff6a00));
  --stm-hpt-tab-active-text:var(--stm-color-on-primary,#fff);
  --stm-hpt-bigcard-bg:var(--stm-color-surface,#fff);
  --stm-hpt-bigcard-border:var(--stm-color-primary,#ff6a00);
  --stm-hpt-bigcard-header-bg:var(--stm-color-primary-deep,#111827);
  --stm-hpt-bigcard-header-text:var(--stm-color-on-dark,#fff);
  --stm-hpt-bigcard-chip-bg:var(--stm-color-primary,#ff6a00);
  --stm-hpt-bigcard-chip-text:var(--stm-color-on-primary,#fff);
  --stm-hpt-bigcard-image-bg:var(--stm-color-surface,#fff);
  --stm-hpt-bigcard-title:var(--stm-color-product-link,#075985);
  --stm-hpt-bigcard-price:var(--stm-color-heading,#111827);
  --stm-hpt-bigcard-stock-bg:var(--stm-color-success-soft,#ecfdf3);
  --stm-hpt-bigcard-stock-text:var(--stm-color-success-deep,#166534);
  --stm-hpt-bigcard-button-bg:var(--stm-color-primary,#ff6a00);
  --stm-hpt-bigcard-button-hover-bg:var(--stm-color-primary-deep,#e65300);
  --stm-hpt-bigcard-button-text:var(--stm-color-on-primary,#fff);
  --stm-hpt-custom-max-width:1440px;
  --stm-hpt-top-gap:0px;
  --stm-hpt-bottom-gap:28px;
  --stm-hpt-pad-x:28px;
  --stm-hpt-pad-y:26px;
  --stm-hpt-border-width:1px;
  --stm-hpt-radius:18px;
  --stm-hpt-content-gap:28px;
  --stm-hpt-tabs-gap:8px;
  --stm-hpt-tab-height:44px;
  --stm-hpt-tab-pad-x:20px;
  --stm-hpt-tab-radius:22px;
  --stm-hpt-columns:4;
  --stm-hpt-product-gap:12px;
  --stm-hpt-tablet-visible:2.5;
  --stm-hpt-tablet-gap-count:2;
  --stm-hpt-mobile-visible:1.5;
  --stm-hpt-mobile-gap-count:1;
  --stm-hpt-bigcard-width:370px;
  --stm-hpt-bigcard-pad:16px;
  --stm-hpt-bigcard-radius:18px;
  --stm-hpt-bigcard-border-width:1px;
  --stm-hpt-bigcard-header-height:58px;
  --stm-hpt-bigcard-image-height:320px;
  --stm-hpt-bigcard-title-lines:2;
  --stm-hpt-bigcard-button-height:48px;
  --stm-engine-width-max:var(--stm-header-content-max-width,var(--stm-container-wide,1440px));
  margin:var(--stm-hpt-top-gap,0) auto var(--stm-hpt-bottom-gap,28px);
  padding:0;
  color:var(--stm-color-ink,#1f2937);
  overflow:visible;
}
.stm-home-product-tabs--custom-width{--stm-engine-width-max:var(--stm-hpt-custom-max-width,1440px)}
.stm-home-product-tabs,
.stm-home-product-tabs *{box-sizing:border-box}
.stm-hpt-shell{
  width:100%;
  padding:var(--stm-hpt-pad-y,26px) var(--stm-hpt-pad-x,28px);
  border:var(--stm-hpt-border-width,1px) solid var(--stm-hpt-border);
  border-radius:var(--stm-hpt-radius,18px);
  background:var(--stm-hpt-bg);
  overflow:hidden;
}
.stm-hpt-tabs{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:var(--stm-hpt-tabs-gap,8px);
  width:100%;
  margin:0;
  padding:0;
}
.stm-hpt-tabs--raised{
  padding:8px 10px;
  border:1px solid var(--stm-commerce-raised-edge-line,var(--stm-raised-edge-line,#cbd5e1));
  border-top-color:var(--stm-commerce-raised-edge-highlight,var(--stm-raised-edge-highlight,#fff));
  border-radius:var(--stm-commerce-raised-radius,var(--stm-radius-md,8px));
  background:var(--stm-commerce-raised-heading-bg,var(--stm-raised-heading-bg,#f3f4f6));
  box-shadow:none;
}
.stm-hpt-tab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  height:var(--stm-hpt-tab-height,44px);
  min-height:var(--stm-hpt-tab-height,44px);
  margin:0;
  padding:0 var(--stm-hpt-tab-pad-x,20px);
  border:1px solid var(--stm-hpt-border);
  border-radius:var(--stm-hpt-tab-radius,22px);
  background:var(--stm-hpt-tab-bg);
  color:var(--stm-hpt-tab-text);
  font:inherit;
  font-size:var(--stm-font-size-small,13px);
  font-weight:var(--stm-weight-bold,700);
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  transition:background-color var(--stm-transition-fast,.18s ease),border-color var(--stm-transition-fast,.18s ease),color var(--stm-transition-fast,.18s ease);
}
.stm-hpt-tab:hover{border-color:var(--stm-hpt-tab-active-bg);background:var(--stm-hpt-tab-hover-bg);color:var(--stm-hpt-tab-text)}
.stm-hpt-tab.is-active{border-color:var(--stm-hpt-tab-active-bg);background:var(--stm-hpt-tab-active-bg);color:var(--stm-hpt-tab-active-text);box-shadow:none}
.stm-hpt-tab:focus-visible{outline:var(--stm-focus-outline,2px solid currentColor);outline-offset:2px}
.stm-hpt-divider{width:100%;height:1px;margin:var(--stm-space-3,12px) 0 var(--stm-space-4,16px);background:var(--stm-hpt-divider)}
.stm-hpt-pane[hidden]{display:none}
.stm-hpt-layout{
  display:grid;
  grid-template-columns:minmax(0,var(--stm-hpt-bigcard-width,370px)) minmax(0,1fr);
  align-items:stretch;
  gap:var(--stm-hpt-content-gap,28px);
  width:100%;
  min-width:0;
}
.stm-hpt-layout--no-bigcard{grid-template-columns:minmax(0,1fr)}
.stm-hpt-loop{min-width:0;overflow:visible}
.stm-hpt-products{
  display:grid;
  grid-template-columns:repeat(var(--stm-hpt-columns,4),minmax(0,1fr));
  align-items:stretch;
  gap:var(--stm-hpt-product-gap,12px);
  width:100%;
  min-width:0;
  margin:0;
  padding:0;
  list-style:none;
}
.woocommerce ul.products.stm-hpt-products>li.product.stm-product-card{float:none;clear:none;width:100%;max-width:none;min-width:0;margin:0}
.stm-hpt-bigcard{
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:100%;
  border:var(--stm-hpt-bigcard-border-width,1px) solid var(--stm-hpt-bigcard-border);
  border-radius:var(--stm-hpt-bigcard-radius,18px);
  background:var(--stm-hpt-bigcard-bg);
  overflow:hidden;
}
.stm-hpt-bigcard__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--stm-space-2,8px);
  min-height:var(--stm-hpt-bigcard-header-height,58px);
  padding:0 var(--stm-hpt-bigcard-pad,16px);
  border-bottom:1px solid var(--stm-hpt-bigcard-border);
  background:var(--stm-hpt-bigcard-header-bg);
  color:var(--stm-hpt-bigcard-header-text);
  box-shadow:none;
}
.stm-hpt-bigcard--heading-raised .stm-hpt-bigcard__head{
  border-bottom-color:color-mix(in srgb,var(--stm-hpt-bigcard-header-bg) 76%,var(--stm-color-heading,#111827));
  background:linear-gradient(180deg,color-mix(in srgb,var(--stm-hpt-bigcard-header-bg) 76%,var(--stm-color-surface,#fff)) 0 1px,var(--stm-hpt-bigcard-header-bg) 1px calc(100% - 1px),color-mix(in srgb,var(--stm-hpt-bigcard-header-bg) 76%,var(--stm-color-heading,#111827)) calc(100% - 1px) 100%);
}
.stm-hpt-bigcard__chip,
.stm-hpt-bigcard__badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:5px 10px;
  border-radius:999px;
  font-size:var(--stm-font-size-xs,11px);
  font-weight:var(--stm-weight-bold,700);
  line-height:1;
  text-transform:capitalize;
  white-space:nowrap;
}
.stm-hpt-bigcard__chip{background:var(--stm-hpt-bigcard-chip-bg);color:var(--stm-hpt-bigcard-chip-text)}
.stm-hpt-bigcard__badge{background:var(--stm-color-surface,#fff);color:var(--stm-color-heading,#111827)}
.stm-hpt-bigcard__body{display:flex;flex:1 1 auto;min-width:0;flex-direction:column;padding:var(--stm-hpt-bigcard-pad,16px)}
.stm-hpt-bigcard__media{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:var(--stm-hpt-bigcard-image-height,320px);
  min-height:0;
  margin:0 0 var(--stm-space-3,12px);
  border:1px solid var(--stm-hpt-border);
  border-radius:calc(var(--stm-hpt-bigcard-radius,18px) - 6px);
  background:var(--stm-hpt-bigcard-image-bg);
  overflow:hidden;
}
.stm-hpt-bigcard__image{display:block;width:100%;height:100%;object-fit:contain}
.stm-hpt-bigcard__title{
  display:-webkit-box;
  margin:0 0 var(--stm-space-3,12px);
  overflow:hidden;
  color:var(--stm-hpt-bigcard-title);
  font-size:var(--stm-font-size-large,18px);
  font-weight:var(--stm-weight-bold,700);
  line-height:1.28;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:var(--stm-hpt-bigcard-title-lines,2);
}
.stm-hpt-bigcard__title a{color:inherit;text-decoration:none}
.stm-hpt-bigcard__title a:hover{text-decoration:underline;text-underline-offset:3px}
.stm-hpt-bigcard__commerce{display:flex;align-items:center;justify-content:space-between;gap:var(--stm-space-3,12px);min-height:48px;padding:0 var(--stm-space-3,12px);border:1px solid var(--stm-hpt-border);border-radius:10px;background:var(--stm-color-surface-soft,#f8fafc)}
.stm-hpt-bigcard__price{color:var(--stm-hpt-bigcard-price);font-size:var(--stm-font-size-large,18px);font-weight:var(--stm-weight-bold,700)}
.stm-hpt-bigcard__price del{color:var(--stm-color-muted,#64748b);font-size:.72em;opacity:.78}
.stm-hpt-bigcard__price ins{text-decoration:none}
.stm-hpt-bigcard__rating{display:flex;align-items:center;justify-content:flex-end;min-width:0}
.stm-hpt-bigcard__rating .star-rating{float:none;margin:0;color:var(--stm-product-rating-color,#f59e0b);font-size:11px}
.stm-hpt-bigcard__stock{display:flex;align-items:center;justify-content:center;min-height:36px;margin-top:var(--stm-space-3,12px);padding:0 var(--stm-space-3,12px);border:1px solid var(--stm-hpt-border);border-radius:10px;background:var(--stm-hpt-bigcard-stock-bg);color:var(--stm-hpt-bigcard-stock-text);font-size:var(--stm-font-size-xs,11px);font-weight:var(--stm-weight-semibold,600);text-align:center}
.stm-hpt-bigcard__stock.is-out{background:var(--stm-color-danger-soft,#fef2f2);color:var(--stm-color-danger,#dc2626)}
.stm-hpt-bigcard__foot{display:flex;align-items:center;gap:var(--stm-space-3,12px);margin-top:auto;padding:0 var(--stm-hpt-bigcard-pad,16px) var(--stm-hpt-bigcard-pad,16px)}
.stm-hpt-bigcard__button{display:inline-flex;flex:1 1 auto;align-items:center;justify-content:center;height:var(--stm-hpt-bigcard-button-height,48px);min-height:var(--stm-hpt-bigcard-button-height,48px);padding:0 var(--stm-space-4,16px);border:0;border-radius:10px;border:1px solid var(--stm-color-primary-deep);background:var(--stm-commerce-raised-accent-bg,var(--stm-hpt-bigcard-button-bg));color:var(--stm-hpt-bigcard-button-text);font-size:var(--stm-font-size-small,13px);font-weight:var(--stm-weight-bold,700);text-decoration:none;transition:background-color var(--stm-transition-fast,.18s ease)}
.stm-hpt-bigcard__button:hover{background:var(--stm-commerce-raised-accent-hover-bg,var(--stm-hpt-bigcard-button-hover-bg));color:var(--stm-hpt-bigcard-button-text)}
.stm-hpt-bigcard__wishlist{display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.stm-hpt-empty{display:grid;place-items:center;min-height:240px;color:var(--stm-color-muted,#64748b);font-size:var(--stm-font-size-ui,14px)}
html[data-stm-layout="tablet"] .stm-hpt-shell{padding:clamp(16px,var(--stm-hpt-pad-y,26px),28px) clamp(14px,var(--stm-hpt-pad-x,28px),28px)}
html[data-stm-layout="tablet"] .stm-hpt-layout,
html[data-stm-layout="mobile"] .stm-hpt-layout{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:clamp(14px,var(--stm-hpt-content-gap,28px),28px);
}
html[data-stm-layout="tablet"] .stm-hpt-bigcard,
html[data-stm-layout="mobile"] .stm-hpt-bigcard{
  width:min(100%,var(--stm-hpt-bigcard-width,370px));
  max-width:var(--stm-hpt-bigcard-width,370px);
  min-height:100%;
  margin-inline:auto;
  align-self:center;
}
html[data-stm-layout="tablet"] .stm-hpt-loop,
html[data-stm-layout="mobile"] .stm-hpt-loop{
  width:100%;
  min-width:0;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x proximity;
  scroll-padding-inline:0;
  overscroll-behavior-x:contain;
  overscroll-behavior-y:auto;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x pan-y;
  scroll-behavior:smooth;
  cursor:grab;
}
html[data-stm-layout="tablet"] .stm-hpt-loop::-webkit-scrollbar,
html[data-stm-layout="mobile"] .stm-hpt-loop::-webkit-scrollbar{display:none}
html[data-stm-layout="tablet"] .stm-hpt-products,
html[data-stm-layout="mobile"] .stm-hpt-products{
  display:flex;
  flex-wrap:nowrap;
  gap:var(--stm-hpt-product-gap,12px);
  width:100%;
  min-width:100%;
  max-width:none;
  overflow:visible;
  scroll-snap-type:none;
  padding-bottom:2px;
}
html[data-stm-layout="tablet"] .stm-hpt-loop.is-pointer-dragging,
html[data-stm-layout="mobile"] .stm-hpt-loop.is-pointer-dragging{
  cursor:grabbing;
  scroll-behavior:auto;
  scroll-snap-type:none;
  user-select:none;
}
html[data-stm-layout="tablet"] .stm-hpt-products>li.product,
html[data-stm-layout="mobile"] .stm-hpt-products>li.product,
html[data-stm-layout="tablet"] .stm-hpt-products>li.product a,
html[data-stm-layout="mobile"] .stm-hpt-products>li.product a,
html[data-stm-layout="tablet"] .stm-hpt-products>li.product button,
html[data-stm-layout="mobile"] .stm-hpt-products>li.product button{touch-action:auto}
html[data-stm-layout="tablet"] .stm-hpt-products img,
html[data-stm-layout="mobile"] .stm-hpt-products img{-webkit-user-drag:none;user-drag:none}
html[data-stm-layout="tablet"] .stm-hpt-products>li.product{
  flex:0 0 calc((100% - (var(--stm-hpt-tablet-gap-count,2) * var(--stm-hpt-product-gap,12px))) / var(--stm-hpt-tablet-visible,2.5));
  width:auto;
  max-width:none;
  scroll-snap-align:start;
  scroll-snap-stop:normal;
}
html[data-stm-layout="mobile"] .stm-hpt-shell{padding:clamp(12px,var(--stm-hpt-pad-y,26px),22px) 10px;border-radius:min(var(--stm-hpt-radius,18px),14px)}
html[data-stm-layout="mobile"] .stm-hpt-tabs{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
html[data-stm-layout="mobile"] .stm-hpt-tabs::-webkit-scrollbar{display:none}
html[data-stm-layout="mobile"] .stm-hpt-tab{flex:0 0 auto;height:min(var(--stm-hpt-tab-height,44px),40px);min-height:min(var(--stm-hpt-tab-height,44px),40px);padding-inline:min(var(--stm-hpt-tab-pad-x,20px),14px)}
html[data-stm-layout="mobile"] .stm-hpt-products>li.product{
  flex:0 0 calc((100% - (var(--stm-hpt-mobile-gap-count,1) * var(--stm-hpt-product-gap,12px))) / var(--stm-hpt-mobile-visible,1.5));
  width:auto;
  max-width:none;
  scroll-snap-align:start;
  scroll-snap-stop:normal;
}
.stm-hpt-bigcard__wishlist .stm-pl__wish{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:var(--stm-icon-button-size,34px);
  min-width:var(--stm-icon-button-size,34px);
  height:var(--stm-icon-button-size,34px);
  min-height:var(--stm-icon-button-size,34px);
  margin:0;
  padding:0;
  border:1px solid var(--stm-hpt-border);
  border-radius:50%;
  background:transparent;
  color:var(--stm-color-heading,#111827);
  cursor:pointer;
}
.stm-hpt-bigcard__wishlist .stm-pl__icon--wish{
  display:block;
  width:18px;
  height:18px;
  background:currentColor;
  -webkit-mask:url("../../../storefront/assets/icons/wishlist.svg") center/contain no-repeat;
  mask:url("../../../storefront/assets/icons/wishlist.svg") center/contain no-repeat;
}
.stm-hpt-bigcard__wishlist .stm-pl__wish.is-active .stm-pl__icon--wish{
  -webkit-mask-image:url("../../../storefront/assets/icons/wishlist-filled.svg");
  mask-image:url("../../../storefront/assets/icons/wishlist-filled.svg");
}