/* Arcendium V22.36.1.3 — Store progressive catalog + receipt actions */

/* One Store action language everywhere: SVG + text + animated underline. */
.arc-store-text-action{
  --arc-store-action-color:var(--accent,#00d4aa);
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  width:auto!important;
  min-width:0!important;
  min-height:0!important;
  padding:8px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  color:var(--muted,#64748b)!important;
  font-family:'IBM Plex Mono',monospace!important;
  font-size:12px!important;
  font-weight:700!important;
  letter-spacing:.035em!important;
  line-height:1.25!important;
  text-decoration:none!important;
  cursor:pointer!important;
  transition:color .18s ease,transform .18s ease!important;
}
.arc-store-text-action::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:1px;
  height:1px;
  background:var(--arc-store-action-color);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .22s cubic-bezier(.22,.8,.28,1);
}
.arc-store-text-action svg{
  width:17px!important;
  height:17px!important;
  flex:0 0 17px!important;
  stroke:currentColor!important;
  transition:transform .18s ease!important;
}
.arc-store-text-action:hover,
.arc-store-text-action:focus-visible{
  color:var(--arc-store-action-color)!important;
  transform:translateY(-1px)!important;
  outline:none!important;
}
.arc-store-text-action:hover::after,
.arc-store-text-action:focus-visible::after{transform:scaleX(1)}
.arc-store-text-action:hover svg,
.arc-store-text-action:focus-visible svg{transform:translateX(1px) scale(1.04)}
.arc-store-text-action:active{transform:translateY(1px) scale(.985)!important}
.arc-store-text-action:disabled,
.arc-store-text-action[aria-disabled="true"]{opacity:.5!important;cursor:not-allowed!important}
.arc-store-checkout-action,
#checkout-pay{--arc-store-action-color:var(--blue,#2563eb)}
.arc-store-remove-action{--arc-store-action-color:#ef4444}
.arc-store-retry-action{--arc-store-action-color:#8b5cf6}
.arc-store-cart-count:empty{display:none!important}
.arc-store-cart-count:not(:empty){
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:18px!important;
  height:18px!important;
  padding:0 4px!important;
  border:1px solid currentColor!important;
  border-radius:0!important;
  font-size:9px!important;
  line-height:1!important;
}

/* Catalog card's View product affordance now uses the same underline animation. */
.arc-store-card-action{
  --arc-store-card-action-color:var(--accent,#00d4aa);
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 0;
  color:var(--muted,#64748b);
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
  transition:color .18s ease,transform .18s ease;
}
.arc-store-card-action::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:var(--arc-store-card-action-color);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .22s cubic-bezier(.22,.8,.28,1);
}
.arc-store-card-action svg{width:15px;height:15px;flex:0 0 15px;stroke:currentColor;transition:transform .18s ease}
.store-card:hover .arc-store-card-action,
.store-card:focus-visible .arc-store-card-action{color:var(--arc-store-card-action-color);transform:translateY(-1px)}
.store-card:hover .arc-store-card-action::after,
.store-card:focus-visible .arc-store-card-action::after{transform:scaleX(1)}
.store-card:hover .arc-store-card-action svg,
.store-card:focus-visible .arc-store-card-action svg{transform:translateX(2px)}

/* Progressive catalog loader: receipt-like, no card/background chrome. */
.store-load-sentinel{
  min-height:84px;
  margin:28px 0 0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--muted,#64748b);
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;
  font-weight:650;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.store-load-sentinel[data-state="error"]{flex-wrap:wrap}
.arc-store-wheel{
  width:17px;
  height:17px;
  flex:0 0 17px;
  border:1.5px solid color-mix(in srgb,var(--muted,#64748b) 35%,transparent);
  border-top-color:var(--accent,#00d4aa);
  border-right-color:var(--blue,#2563eb);
  border-radius:50%;
  background:transparent!important;
  box-shadow:none!important;
  animation:arc-store-wheel .7s linear infinite;
}
.arc-store-load-mark,
.arc-store-end-mark{color:var(--text,#0f172a);font-weight:800}
.arc-store-end-mark::after{content:" /";color:var(--accent,#00d4aa)}
@keyframes arc-store-wheel{to{transform:rotate(360deg)}}

/* The Store is a sharp receipt surface — no curved card containers. */
.store-card,
.store-message,
.product-image,
.variant-choice,
.shipping-choice,
.checkout-card,
.checkout-line,
.checkout-line img,
.order-status-card{border-radius:0!important}

/* Product desktop: image remains fixed/sticky while exact options scroll at right. */
.arc-store-no-image{font-size:68px;color:var(--muted,#64748b)}
@media(min-width:901px){
  .product-page{padding:36px 0 64px!important}
  .product-view{
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)!important;
    gap:52px!important;
    align-items:start!important;
    min-height:calc(100vh - 144px);
  }
  .product-image{
    position:sticky!important;
    top:96px!important;
    width:min(100%,calc(100vh - 132px));
    justify-self:center;
    aspect-ratio:1/1;
  }
  .product-copy{
    max-height:calc(100vh - 116px);
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
    padding:4px 14px 52px 0;
  }
  .product-copy::-webkit-scrollbar{width:6px}
  .product-copy::-webkit-scrollbar-track{background:transparent}
  .product-copy::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--muted,#64748b) 35%,transparent);border-radius:0}
}
.variant-choice,
.shipping-choice{border-radius:0!important}
.product-buy-row{gap:18px!important;align-items:center!important}
.product-buy-row input{border-radius:0!important}
.product-buy-row .arc-store-text-action{margin-bottom:2px}
.product-note{border-top:1px dashed var(--line);padding-top:14px}

/* Checkout keeps square receipt cards and borderless animated actions. */
.checkout-card{box-shadow:none!important}
.checkout-fields input{border-radius:0!important}
.checkout-line{grid-template-columns:64px minmax(0,1fr) auto!important}
.checkout-line .arc-store-remove-action{font-size:10px!important;align-self:center}
.checkout-line .arc-store-remove-action svg{width:15px!important;height:15px!important;flex-basis:15px!important}
#quote-shipping{margin-top:4px!important}
#checkout-pay{margin-top:22px!important}
.empty-cart{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

@media(max-width:900px){
  .product-view{grid-template-columns:1fr!important;gap:34px!important}
  .product-image{position:relative!important;top:auto!important;width:100%!important}
  .product-copy{max-height:none!important;overflow:visible!important;padding-right:0!important}
}
@media(max-width:560px){
  .arc-store-text-action{font-size:11.5px!important}
  .store-card-meta{align-items:flex-end}
  .checkout-line{grid-template-columns:54px minmax(0,1fr)!important}
  .checkout-line img{width:54px!important;height:54px!important}
  .checkout-line .arc-store-remove-action{grid-column:2;justify-self:start}
}
@media(prefers-reduced-motion:reduce){
  .arc-store-text-action,
  .arc-store-text-action::after,
  .arc-store-text-action svg,
  .arc-store-card-action,
  .arc-store-card-action::after,
  .arc-store-card-action svg{transition:none!important}
  .arc-store-wheel{animation-duration:1.5s}
}
.store-message .arc-store-text-action{display:flex!important;width:max-content!important;margin-top:16px!important}
.checkout-line .arc-store-remove-action{height:auto!important;min-height:0!important}
