/* Light circular controls, with a larger invisible hit area for touch screens. */
html body #viewCart .cartItemActions,
html body #viewCart .cartQuantity{display:inline-flex;align-items:center;flex:0 0 auto;white-space:nowrap;gap:0}
html body #viewCart .cartItemActions{gap:12px;margin-left:auto}
html body #viewCart .cartControlButton{appearance:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:44px;min-width:44px;height:44px;padding:8px;border:0!important;border-radius:0!important;background:transparent!important;color:var(--text,#111);opacity:.55;box-shadow:none!important;filter:none!important;cursor:pointer;transition:opacity .15s ease}
html body #viewCart .cartControlButton svg{display:block;width:24px;height:24px;flex:none;pointer-events:none}
html body #viewCart .cartRemoveButton svg{width:28px;height:28px}
html body #viewCart .cartQuantityValue{min-width:24px;text-align:center;font-size:18px;font-weight:400;line-height:1.2;font-variant-numeric:tabular-nums;color:var(--text,#111)}
html body #viewCart .cartControlButton:hover:not(:disabled){opacity:1}
html body #viewCart .cartControlButton:focus-visible{outline:2px solid currentColor;outline-offset:1px;opacity:1}
html body #viewCart .cartControlButton:disabled{opacity:.22;cursor:default}
html body #viewCart .cartItemSection .cMain{min-width:0}
html body #viewCart .cartItemSection .cRow{display:flex!important;flex-wrap:wrap!important;align-items:center;gap:8px 16px!important}
@media(max-width:600px){html body #viewCart .cartItemActions{gap:4px}html body #viewCart .cartQuantityValue{min-width:20px}}
@media(prefers-reduced-motion:reduce){html body #viewCart .cartControlButton{transition:none}}
/* The account sidebar can make a desktop cart line as narrow as a phone. */
html body #viewCart .cartItemSection{container-type:inline-size;container-name:cartLine}
@container cartLine (max-width:360px){
  html body #viewCart .cartItemSection .cItem{display:grid!important;grid-template-columns:74px minmax(0,1fr)!important;gap:8px 12px!important}
  html body #viewCart .cartItemSection .cImgWrap{grid-column:1;grid-row:1/span 2;width:74px!important;height:96px!important}
  html body #viewCart .cartItemSection .cMain{display:contents!important}
  html body #viewCart .cartItemSection .cTitle{grid-column:2;grid-row:1;align-self:end;overflow-wrap:anywhere}
  html body #viewCart .cartItemSection .cSub{grid-column:2!important;grid-row:2;align-self:start}
  html body #viewCart .cartItemSection .cRow{grid-column:1/-1!important;grid-row:3!important;margin-top:4px!important}
  html body #viewCart .cartItemActions{gap:4px}
  html body #viewCart .cartQuantityValue{min-width:20px}
}

/* Product links retain the cart layout and the shop's typography. */
html body #viewCart .cartProductLink {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
html body #viewCart a.cImgWrap { display: block; }
html body #viewCart .cartProductLink:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}
@media (hover: hover) {
  html body #viewCart .cTitle .cartProductLink:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
  }
}

/* Match the product purchase counter to the cart controls. */
html body #viewProduct #buyBarInline .ibQtySelector {
  display: inline-flex !important;
  align-items: center;
  flex: 0 0 auto;
  gap: 0 !important;
  height: 44px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body #viewProduct #buyBarInline .ibQtyBtn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  flex: 0 0 44px;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  padding: 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--text, #111) !important;
  opacity: .55;
  box-shadow: none !important;
  filter: none !important;
  cursor: pointer;
  transition: opacity .15s ease;
}
html body #viewProduct #buyBarInline .ibQtyBtn svg {
  display: block;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
}
html body #viewProduct #buyBarInline .ibQtyVal {
  min-width: 24px !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.2;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
html body #viewProduct #buyBarInline .ibQtyBtn:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 1px;
  opacity: 1;
}
@media (hover: hover) {
  html body #viewProduct #buyBarInline .ibQtyBtn:hover:not(:disabled) { opacity: 1; }
}
html body #viewProduct #buyBarInline .ibQtyBtn:disabled {
  opacity: .22;
  cursor: default;
}
@media (prefers-reduced-motion: reduce) {
  html body #viewProduct #buyBarInline .ibQtyBtn { transition: none; }
}