/* UPENDS Categories Navigator 1.2 — Scoped layout; no carousel scripts. */
.upc-categories {
  --upc-bg:#fff; --upc-card-bg:#f6f7f8; --upc-ink:#222;
  --upc-radius:12px; --upc-gap:12px; --upc-font:14px;
  --upc-media-m:126px; --upc-media-d:152px; --upc-count:6;
  --upc-mobile-visible:2.2; --upc-tablet-visible:3.2;
  display:block; width:100%; max-width:100%; box-sizing:border-box;
  background:var(--upc-bg); color:var(--upc-ink); padding:8px 0 12px;
  font-family:inherit; overflow:hidden; isolation:isolate;
}
.upc-categories *, .upc-categories *::before, .upc-categories *::after { box-sizing:border-box; }
.upc-categories .upc-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 16px; }
.upc-categories .upc-heading { padding:0; margin:0; color:var(--upc-ink); font-size:clamp(21px,2.4vw,28px); font-weight:700; line-height:1.25; letter-spacing:0; text-transform:none; }
.upc-categories .upc-swipe-hint { display:none; font-size:12px; color:#727780; flex-shrink:0; }
.upc-categories .upc-track { margin:0; padding:0; display:grid; grid-template-columns:repeat(var(--upc-count),minmax(0,1fr)); gap:var(--upc-gap); width:100%; max-width:100%; min-width:0; }
.upc-categories .upc-card {
  display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start;
  width:100%; min-width:0; margin:0; padding:12px 10px 14px;
  background:var(--upc-card-bg); border:1px solid transparent; border-radius:var(--upc-radius);
  color:var(--upc-ink); text-decoration:none; text-align:center;
  overflow:hidden; cursor:pointer; transition:background-color .15s ease, border-color .15s ease;
  box-shadow:none; position:relative;
}
.upc-categories a.upc-card:hover { background-color:color-mix(in srgb,var(--upc-card-bg) 91%, #c1c5cc); color:var(--upc-ink); text-decoration:none; }
.upc-categories a.upc-card:focus-visible { outline:3px solid #246fe6; outline-offset:-3px; }
.upc-categories .upc-card--inactive { cursor:default; }
.upc-categories .upc-image-area {
  display:flex; align-items:center; justify-content:center;
  width:100%; height:var(--upc-media-d); min-height:var(--upc-media-d);
  overflow:hidden; position:relative; background:transparent; flex-shrink:0;
}
.upc-categories .upc-product-image {
  display:block; width:100%; max-width:100%; height:100%; max-height:100%;
  margin:0; padding:0; object-fit:contain; object-position:center;
  transform:translate(var(--upc-x,0px), var(--upc-y,0px)) scale(var(--upc-scale,1));
  transform-origin:center center; border:0; background:none; box-shadow:none;
}
.upc-categories .upc-product-name {
  display:block; margin:9px 0 0; padding:0 2px; color:var(--upc-ink);
  font-size:var(--upc-font); line-height:1.35; font-weight:650; text-decoration:none;
  overflow-wrap:anywhere;
}
@media (max-width:1023px) {
  .upc-categories .upc-track {
    display:flex; flex-wrap:nowrap; gap:var(--upc-gap);
    overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory;
    overscroll-behavior-inline:contain; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; scroll-padding-inline:0;
  }
  .upc-categories .upc-track::-webkit-scrollbar { display:none; }
  .upc-categories .upc-card { flex:0 0 calc((100% + var(--upc-gap)) / var(--upc-tablet-visible) - var(--upc-gap)); width:auto; scroll-snap-align:start; }
  .upc-categories .upc-image-area { height:var(--upc-media-m); min-height:var(--upc-media-m); }
  .upc-categories .upc-swipe-hint { display:inline-flex; align-items:center; gap:6px; }
}
@media (max-width:767px) {
  .upc-categories { padding:4px 0 10px; }
  .upc-categories .upc-head { margin-bottom:12px; }
  .upc-categories .upc-heading { font-size:21px; }
  .upc-categories .upc-card { flex-basis:calc((100% + var(--upc-gap)) / var(--upc-mobile-visible) - var(--upc-gap)); padding:9px 7px 12px; }
  .upc-categories .upc-product-name { margin-top:8px; }
}
@media (prefers-reduced-motion:reduce) {
  .upc-categories .upc-card { transition:none; }
}

/* V1.2 · Scheme A: top-right flush price label. Absolute overlay in corner whitespace;
   no impact on card height, width, image area or scroll snap. */
.upc-categories .upc-price-badge {
  position:absolute; z-index:2; top:0; right:0;
  display:flex; align-items:center; justify-content:center;
  height:22px; max-width:calc(100% - 4px); min-width:59px;
  margin:0; padding:0 8px;
  border:0; border-radius:0 var(--upc-radius) 0 9px;
  background:var(--upc-badge-color,#ed583f); color:#fff;
  font-family:inherit; font-size:11px; line-height:1; font-weight:800;
  font-variant-numeric:tabular-nums; letter-spacing:-.16px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  box-shadow:none; pointer-events:none;
}