/* Catalogue cart + checkout (2026-10-14). Uses the light catalogue tokens from catalog-v2.css (body.cbx-light). */
.shop-wrap { padding: 96px 0 64px; }
.shop-crumb { font-size: 13px; color: var(--cb-muted); margin-bottom: 8px; }
.shop-crumb a { color: var(--cb-accent); text-decoration: none; }
.shop-h1 { font-size: 32px; letter-spacing: -.8px; margin: 0 0 24px; color: var(--cb-ink); }
.shop-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 28px; align-items: start; }

.shop-lines { display: flex; flex-direction: column; gap: 10px; }
.shop-line { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto 120px; gap: 16px; align-items: center;
  background: #fff; border: 1px solid var(--cb-line); border-radius: 16px; padding: 14px 18px; }
.shop-line.is-locked { background: #fafbfe; margin-left: 32px; border-style: dashed; padding-top: 10px; padding-bottom: 10px; }
.shop-line.k-shipping { margin-left: 0; }
/* 2026-10-15: one block per machine; children indented by depth (integration -> its API lines one step further) */
.shop-line.d-1 { margin-left: 32px; }
.shop-mini li.d-1 { padding-left: 14px; } .shop-mini li.d-2 { padding-left: 28px; }
.shop-line.d-2 { margin-left: 64px; }
.shop-line.k-integration.d-1 { background: #fff; border-style: solid; }
.shop-line.is-unmapped { border-color: #f59e0b; background: #fffbeb; }
.shop-map { display: grid; grid-template-columns: 104px minmax(200px, 260px); align-items: center; gap: 8px; margin-top: 6px; font-size: 12.5px; color: #475569; }
.shop-map > span { white-space: nowrap; }
.shop-map select { font: inherit; font-size: 12.5px; width: 100%; min-width: 0; padding: 4px 8px; border: 1px solid #cbd5e1; border-radius: 7px; background: #fff; text-overflow: ellipsis; }
.shop-unit { margin-bottom: 2px; }
/* styled dropdown over a hidden native select (shop-cart.js enhanceSelects) */
.cb-dd-native { display: none; }
.cb-dd { position: relative; min-width: 0; }
.cb-dd-btn { display: flex; align-items: center; justify-content: space-between; gap: 6px; width: 100%; padding: 6px 8px 6px 12px;
  font: inherit; font-size: 13px; color: var(--cb-ink); background: #fff; border: 1px solid var(--cb-line-2); border-radius: 10px; cursor: pointer; text-align: left; }
.cb-dd-cur { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-dd-badge { flex: none; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; color: #047857; background: #ecfdf5; }
.cb-dd-menu li { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cb-dd-menu li.is-active { background: #f5f3ff; }
.shop-saving { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 12.5px; font-weight: 600; color: #047857; }
.shop-saving .material-symbols-outlined { font-size: 17px; }
.cb-dd-btn .material-symbols-outlined { font-size: 18px; color: var(--cb-muted); transition: transform .15s; }
.cb-dd-btn:hover { border-color: var(--cb-accent); }
.cb-dd-btn:focus-visible { outline: 2px solid var(--cb-accent); outline-offset: 1px; }
.cb-dd.is-open .cb-dd-btn { border-color: var(--cb-accent); box-shadow: 0 0 0 3px rgba(124, 58, 237, .12); }
.cb-dd.is-open .cb-dd-btn .material-symbols-outlined { transform: rotate(180deg); }
.cb-dd-menu { display: none; position: absolute; z-index: 20; top: calc(100% + 6px); left: 0; min-width: 100%; width: max-content; max-width: min(380px, calc(100vw - 32px)); box-sizing: border-box;
  margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid var(--cb-line); border-radius: 12px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .14); }
.cb-dd.is-open .cb-dd-menu { display: block; }
.cb-dd-menu li { padding: 8px 10px; border-radius: 8px; font-size: 13px; color: var(--cb-ink); cursor: pointer; }
.cb-dd-menu li small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--cb-muted); }
.cb-dd-menu li[aria-selected="true"] { background: #f5f3ff; color: var(--cb-accent); font-weight: 600; }
.cb-dd-menu li[aria-disabled="true"] { color: #94a3b8; cursor: not-allowed; background: none; }
body.modal-open .cb-dd-menu { display: none; }
@media (max-width: 640px) { .shop-line.d-1 { margin-left: 14px; } .shop-line.d-2 { margin-left: 28px; } }
.shop-art { width: 72px; height: 72px; border-radius: 12px; background: var(--cb-card-imgwrap-bg); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.shop-art img { width: 100%; height: 100%; object-fit: contain; padding: 6px; }
.shop-art .material-symbols-outlined { font-size: 30px; color: var(--cb-accent); }
.is-locked .shop-art { width: 52px; height: 52px; background: #f1edfe; }
.shop-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.shop-kind { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: var(--cb-accent); }
.shop-kind .material-symbols-outlined { font-size: 14px; }
.shop-info b { font-size: 15.5px; font-weight: 600; color: var(--cb-ink); line-height: 1.3; }
.shop-for, .shop-unit { font-size: 12.5px; color: var(--cb-muted); }
.shop-q { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.shop-qty { display: inline-flex; border: 1px solid var(--cb-line-2); border-radius: 10px; overflow: hidden; background: #fff; }
.shop-qty button { width: 32px; height: 34px; border: 0; background: #f6f6fb; font-size: 17px; color: var(--cb-ink); cursor: pointer; }
.shop-qty button:hover { background: #ede7fe; }
.shop-qty input { width: 46px; border: 0; text-align: center; font-size: 15px; font-weight: 600; color: var(--cb-ink); -moz-appearance: textfield; }
.shop-qty input::-webkit-inner-spin-button { -webkit-appearance: none; }
.shop-qty-fixed { display: inline-block; min-width: 40px; text-align: center; font-weight: 600; color: var(--cb-text); padding: 6px 10px; border-radius: 10px; background: #f1f2f8; }
.shop-rm { border: 0; background: none; color: var(--cb-muted); font-size: 12.5px; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.shop-rm:hover { color: #b42318; }
.shop-amt { text-align: right; font-weight: 700; font-size: 16px; color: var(--cb-ink); }

.shop-sum { position: sticky; top: 84px; background: #fff; border: 1px solid var(--cb-line); border-radius: 18px; padding: 22px; box-shadow: 0 14px 34px rgba(30, 27, 75, .06); }
.shop-sum h2 { font-size: 18px; margin: 0 0 14px; color: var(--cb-ink); }
.shop-row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; font-size: 14.5px; color: var(--cb-text); }
.shop-row.muted span:last-child { color: var(--cb-muted); font-size: 13px; text-align: right; }
.shop-row.total { border-top: 1px solid var(--cb-line); margin-top: 6px; padding-top: 14px; font-size: 16px; color: var(--cb-ink); }
.shop-row.total b { font-size: 21px; }
.shop-note { font-size: 12.5px; color: var(--cb-muted); line-height: 1.5; margin: 10px 0 14px; }
.shop-probs { margin: 0 0 14px; padding: 10px 12px 10px 28px; background: #fff4ed; border: 1px solid #fed7aa; border-radius: 10px; font-size: 13px; color: #9a3412; }
.shop-go { width: 100%; justify-content: center; gap: 6px; padding: 12px; font-size: 15px; border-radius: 12px; }
.shop-go[disabled] { opacity: .45; cursor: not-allowed; }
.shop-more { display: block; text-align: center; margin-top: 12px; font-size: 13.5px; color: var(--cb-accent); text-decoration: none; }

.shop-empty { text-align: center; background: #fff; border: 1px solid var(--cb-line); border-radius: 18px; padding: 48px 24px; }
.shop-empty .material-symbols-outlined { font-size: 44px; color: var(--cb-accent); }
.shop-empty h2 { font-size: 20px; margin: 10px 0 6px; color: var(--cb-ink); }
.shop-empty p { color: var(--cb-muted); margin: 0 0 18px; }
.shop-empty .cb-btn { margin: 0 4px; }

.shop-toast { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); z-index: 1040; background: #1f2937; color: #fff; padding: 12px 18px; border-radius: 12px; font-size: 14px; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); max-width: 90vw; }
body.modal-open .shop-toast, body.nav-open .shop-toast { z-index: 1000; }

/* cart link in the product top bar */
.cb-cartlink { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 10px; color: var(--cb-ink); text-decoration: none; }
.cb-cartlink:hover { background: #f1f2f8; color: var(--cb-accent); }
.cb-cartlink [data-cart-count] { position: absolute; top: -3px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--cb-accent); color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }

@media (max-width: 900px) {
  .shop-grid { grid-template-columns: 1fr; }
  .shop-sum { position: static; }
}
@media (max-width: 600px) {
  .shop-line { grid-template-columns: 56px minmax(0, 1fr) auto; }
  .shop-art { width: 56px; height: 56px; }
  .shop-amt { grid-column: 2 / -1; text-align: left; }
  .shop-line.is-locked { margin-left: 14px; }
  /* 2026-10-27: the details column was ~140px between the picture and the quantity, so names wrapped to
     eight lines and the licence dropdown (200px minimum) ran past the card. The picture sits beside the
     details, which take the full width; quantity and line total share the last row. */
  .shop-line { grid-template-columns: 48px minmax(0, 1fr) auto; align-items: start; gap: 10px 12px; }
  .shop-art { width: 48px; height: 48px; grid-column: 1; grid-row: 1; }
  .shop-info { grid-column: 2 / -1; grid-row: 1; min-width: 0; }
  .shop-q { grid-column: 1 / 3; grid-row: 2; display: flex; flex-direction: row; align-items: center; gap: 12px; }
  .shop-amt { grid-column: 3; grid-row: 2; text-align: right; align-self: center; }
  .shop-map { grid-template-columns: auto minmax(0, 1fr); }
  .shop-map.shop-add { width: 100%; }
  .shop-cards { flex-wrap: wrap; }
  .shop-cards > * { min-width: 0; max-width: 100%; }
  .shop-chip > * { min-width: 0; overflow-wrap: anywhere; }
}

/* Checkout (2026-10-14) */
.shop-form { display: flex; flex-direction: column; gap: 18px; }
.shop-card { background: #fff; border: 1px solid var(--cb-line); border-radius: 18px; padding: 22px 24px; }
.shop-card h2 { font-size: 18px; margin: 0 0 16px; color: var(--cb-ink); }
.shop-card h2 small { font-size: 12.5px; font-weight: 500; color: var(--cb-muted); margin-left: 6px; }
.shop-bill { display: grid; grid-template-columns: 120px 1fr; gap: 8px 16px; margin: 0; font-size: 14.5px; }
.shop-bill dt { color: var(--cb-muted); font-weight: 500; }
.shop-bill dd { margin: 0; color: var(--cb-ink); }
.shop-hint { font-size: 12.5px; color: var(--cb-muted); margin: 14px 0 0; }
.shop-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.shop-fields label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; color: var(--cb-text); }
.shop-fields .f-full { grid-column: 1 / -1; }
.shop-fields input, .shop-fields select, .shop-fields textarea { font: inherit; font-weight: 400; font-size: 14.5px; color: var(--cb-ink); background: #fff;
  border: 1px solid var(--cb-line-2); border-radius: 10px; padding: 10px 12px; width: 100%; }
.shop-fields input:focus, .shop-fields select:focus, .shop-fields textarea:focus { outline: 2px solid rgba(var(--cb-accent-rgb), .25); border-color: var(--cb-accent); }
.shop-fields [hidden] { display: none; }
.shop-fields .has-err input, .shop-fields .has-err select, .shop-fields .has-err textarea { border-color: #d92d20; }
.f-err { font-size: 12px; font-weight: 500; color: #b42318; min-height: 0; }
.f-err:empty { display: none; }
.shop-mini { list-style: none; margin: 0 0 6px; padding: 0; }
.shop-mini li { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; font-size: 13.5px; color: var(--cb-text); border-bottom: 1px dashed var(--cb-line); }
.shop-mini li.is-locked { padding-left: 12px; color: var(--cb-muted); }
.shop-mini small { color: var(--cb-muted); }
@media (max-width: 600px) { .shop-fields { grid-template-columns: 1fr; } .shop-bill { grid-template-columns: 1fr; gap: 2px; } .shop-bill dd { margin-bottom: 8px; } }

/* Spec page price block (2026-10-14) */
.cb-spec-price { margin: 18px 0 4px; }
.cb-spec-price .cb-price-amt b { font-size: 30px; }
.cb-spec-price .cb-price-lbl { font-size: 13px; }
/* billing block: long addresses / several invoice mails must wrap, not overflow (2026-10-14) */
.shop-bill dd { min-width: 0; overflow-wrap: anywhere; }
.shop-mail { display: block; }
.shop-mini span, .shop-info b { overflow-wrap: anywhere; }
/* option text wraps inside the menu; the % badge never leaves the border (2026-10-16) */
.cb-dd-menu .cb-dd-text { flex: 1; min-width: 0; }

/* Machine cards + folded details (2026-10-16, shop-cart.js machineCards) */
.shop-line.is-child { display: none; }
.shop-line.is-child.is-shown { display: grid; }
.shop-cards { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.shop-chip { position: relative; display: flex; align-items: center; gap: 8px; min-width: 0; max-width: 220px; padding: 8px 30px 8px 10px;
  background: #faf9ff; border: 1px solid var(--cb-line); border-radius: 12px; }
.shop-chip > .material-symbols-outlined { flex: none; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px;
  font-size: 18px; color: var(--cb-accent); background: #f1edff; }
.shop-chip .t { display: flex; flex-direction: column; min-width: 0; }
.shop-chip .t b { font-size: 13px; font-weight: 600; color: var(--cb-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shop-chip .t small { font-size: 11.5px; color: var(--cb-muted); white-space: nowrap; }
.shop-chip.is-lock { border-style: dashed; }
.shop-rm-x { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; display: grid; place-items: center; padding: 0;
  border: 0; border-radius: 6px; background: none; color: var(--cb-muted); cursor: pointer; }
.shop-rm-x .material-symbols-outlined { font-size: 16px; }
.shop-rm-x:hover { background: #fee2e2; color: #b91c1c; }
.shop-map.shop-add { display: block; margin-top: 0; }
.shop-add .cb-dd-btn { height: 100%; min-height: 48px; padding: 8px 14px; gap: 4px; border: 1px dashed var(--cb-accent); border-radius: 12px;
  color: var(--cb-accent); font-weight: 600; background: #fff; }
.shop-add .cb-dd-btn > .material-symbols-outlined:last-child { display: none; }
.shop-add .cb-dd-btn > .material-symbols-outlined:first-child { font-size: 18px; color: var(--cb-accent); }
.shop-fold { display: inline-flex; align-items: center; gap: 2px; align-self: flex-start; margin-top: 8px; padding: 2px 8px 2px 4px;
  font: inherit; font-size: 12.5px; color: var(--cb-muted); background: none; border: 0; border-radius: 6px; cursor: pointer; }
.shop-fold:hover { color: var(--cb-accent); background: #f5f3ff; }
.shop-fold .material-symbols-outlined { font-size: 18px; transition: transform .15s; }
.shop-fold.is-open .material-symbols-outlined { transform: rotate(180deg); }
.cb-dd-menu { max-height: 340px; overflow-y: auto; }
.cb-dd-menu li[hidden] { display: none; }
.shop-ship-to { display: block; font-size: 11.5px; font-weight: 400; color: var(--cb-muted); }
/* struck-out DLP beside a lower price (2026-10-16) */
.cb-price-mrp, .shop-mrp { color: var(--cb-muted); font-weight: 500; text-decoration: line-through; text-decoration-thickness: 1.5px; }
/* catalogue price block (product/partials/_price.blade.php): price, "% off" tag, list price + saving */
.cb-price-amt { flex-wrap: wrap; row-gap: 4px; }
.cb-price-off { align-self: center; margin-left: 4px; padding: 2px 9px; border-radius: 999px; background: #dcfce7; color: #15803d;
  font-size: 12.5px; font-weight: 700; letter-spacing: .2px; white-space: nowrap; }
.cb-price-was { margin-top: 2px; font-size: 12.5px; color: var(--cb-muted); }
.cb-price-was s { text-decoration-thickness: 1.5px; }
.cb-price-was b { color: #15803d; font-weight: 600; }
.cb-spec-price .cb-price-off { font-size: 14px; padding: 3px 11px; }
.cb-spec-price .cb-price-was { font-size: 14px; }
/* signed-in user chip in the catalogue top bar (2026-10-16) */
.cb-user { position: relative; margin-left: 4px; }
.cb-user summary { list-style: none; display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px 4px 4px; border: 1px solid var(--cb-line); border-radius: 999px; cursor: pointer; background: #fff; }
.cb-user summary::-webkit-details-marker { display: none; }
.cb-user summary:hover, .cb-user[open] summary { border-color: var(--cb-accent); }
.cb-user-av { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--cb-accent); color: #fff; font-weight: 700; font-size: 14px; }
.cb-user-name { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; font-weight: 600; color: var(--cb-ink); }
.cb-user-menu { position: absolute; right: 0; top: calc(100% + 8px); z-index: 1050; min-width: 240px; padding: 12px; background: #fff; border: 1px solid var(--cb-line); border-radius: 14px; box-shadow: 0 14px 34px rgba(15, 23, 42, .14); display: flex; flex-direction: column; gap: 2px; }
.cb-user-menu b { font-size: 14px; color: var(--cb-ink); }
.cb-user-menu small { font-size: 12px; color: var(--cb-muted); margin-bottom: 8px; }
.cb-user-menu a { display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: 8px; font-size: 13.5px; color: var(--cb-ink); text-decoration: none; }
.cb-user-menu a:hover { background: #f5f3ff; color: var(--cb-accent); }
.cb-user-menu .material-symbols-outlined { font-size: 18px; }
body.modal-open .cb-user-menu { display: none; }
@media (max-width: 640px) { .cb-user-name { display: none; } .cb-user summary { padding: 3px; } }
/* cart discount display (2026-10-16), matching the catalogue price block */
.shop-off { display: inline-block; margin-left: 4px; padding: 0 7px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: 11.5px; font-weight: 700; line-height: 18px; }
.shop-was { display: block; font-size: 12px; color: var(--cb-muted); }
.shop-was s { text-decoration-thickness: 1.5px; }
.shop-was b { color: #15803d; font-weight: 600; }
.shop-amt-save { display: block; font-size: 12px; font-weight: 600; color: #15803d; }
.shop-row-save b, .shop-row-save span { color: #15803d; }
/* compare: selected button + bottom tray (2026-10-16, product-compare.js) */
body.cbx .compareButton.is-compared { background: #ede9fe; border-color: var(--cb-accent); color: var(--cb-accent); white-space: nowrap; }
.compareButton .cb-cmp-x { font-size: 15px; margin-left: 2px; opacity: .7; }
.compareButton.is-compared:hover .cb-cmp-x { opacity: 1; color: #b91c1c; }
#cb-cmp-tray { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 1040; width: min(960px, calc(100vw - 32px));
  background: #fff; border: 1px solid var(--cb-line, #e3e6ef); border-radius: 16px; box-shadow: 0 16px 40px rgba(15, 23, 42, .18); }
.cb-cmp-in { display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 16px; flex-wrap: wrap; }
.cb-cmp-lbl { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--cb-ink, #15192b); white-space: nowrap; }
.cb-cmp-lbl .material-symbols-outlined { color: var(--cb-accent, #6d28d9); font-size: 20px; }
.cb-cmp-chips { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; min-width: 0; }
.cb-cmp-chip { display: inline-flex; align-items: center; gap: 4px; max-width: 220px; padding: 4px 4px 4px 10px; border-radius: 999px; background: #f5f3ff;
  color: var(--cb-ink, #15192b); font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cb-cmp-chip button { flex: none; width: 20px; height: 20px; border: 0; border-radius: 50%; background: transparent; color: var(--cb-muted, #667085); font-size: 15px; line-height: 1; cursor: pointer; }
.cb-cmp-chip button:hover { background: #fee2e2; color: #b91c1c; }
.cb-cmp-clear { border: 0; background: none; color: var(--cb-muted, #667085); font-size: 13px; text-decoration: underline; cursor: pointer; }
.cb-cmp-hint { font-size: 13px; color: var(--cb-muted, #667085); }
.cb-cmp-go { white-space: nowrap; }
body.has-cmp-tray { padding-bottom: 96px; }
body.modal-open #cb-cmp-tray { display: none; }
@media (max-width: 640px) { .cb-cmp-chips { flex-basis: 100%; order: 3; } }
/* ── Catalogue shelf toolbar (2026-10-16 redesign): one white card, pill tabs, one 44px line ── */
body.cbx-light .cb-toolbar.cbt-bar { background: #fff; border: 1px solid var(--cb-line); border-radius: 16px; padding: 8px;
  box-shadow: 0 6px 22px rgba(21, 25, 43, .06); gap: 8px; flex-wrap: nowrap; margin-top: 18px; top: 64px; backdrop-filter: none; }
body.cbx-light .cbt-bar .cbt-tabs { gap: 6px; position: relative; }
body.cbx-light .cbt-tab { height: 44px; padding: 0 14px; border: 1px solid transparent; border-bottom: 1px solid transparent; border-radius: 12px;
  color: var(--cb-text); font-size: 14.5px; transition: background .12s, color .12s, border-color .12s; }
body.cbx-light .cbt-tab:hover { background: #f5f3ff; color: var(--cb-accent); }
body.cbx-light .cbt-tab[aria-selected="true"] { background: var(--cb-accent); color: #fff; border-color: var(--cb-accent); box-shadow: 0 6px 16px rgba(109, 40, 217, .25); }
body.cbx-light .cbt-tab .material-symbols-outlined { font-size: 19px; }
body.cbx-light .cbt-tab[aria-selected="true"] .cbt-n { background: rgba(255, 255, 255, .22); color: #fff; }
body.cbx-light .cbt-n.hit { background: #dcfce7; color: #15803d; }
body.cbx-light .cbt-tab[aria-selected="true"] .cbt-n.hit { background: #fff; color: var(--cb-accent); }
body.cbx-light .cbt-bar .cb-search { height: 44px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--cb-line-2); background: #f7f8fc; flex: 0 1 260px; min-width: 200px; }
body.cbx-light .cbt-bar .cb-search:focus-within { border-color: var(--cb-accent); background: #fff; box-shadow: 0 0 0 3px rgba(109, 40, 217, .12); }
body.cbx-light .cbt-bar .cb-search input { background: transparent; border: 0; height: 100%; font-size: 14px; }
body.cbx-light .cbt-bar .cb-sort-select { height: 44px; padding: 0 34px 0 12px; border-radius: 12px; border: 1px solid var(--cb-line-2); background-color: #f7f8fc;
  font: 600 13.5px inherit; font-family: inherit; color: var(--cb-text); cursor: pointer; -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23667085' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; }
body.cbx-light .cbt-bar .cb-sort-select:hover, body.cbx-light .cbt-bar .cb-sort-select:focus { border-color: var(--cb-accent); outline: 0; }
/* search across every shelf: each shelf with hits is shown, with a visible heading */
#products.is-searching .cbt-panel .cbt-sr { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal;
  display: flex; align-items: center; gap: 8px; margin: 26px 0 0; font-size: 17px; font-weight: 700; color: var(--cb-ink); }
#products.is-searching .cbt-panel .cbt-sr small { font-size: 12.5px; font-weight: 700; padding: 1px 9px; border-radius: 99px; background: #dcfce7; color: #15803d; }
#products.is-searching .cbt-lead { display: none; }
#products.is-searching .cbt-tab[aria-selected="true"] { background: #fff; color: var(--cb-text); border-color: var(--cb-line-2); box-shadow: none; }
@media (max-width: 720px) {
  body.cbx-light .cb-toolbar.cbt-bar { flex-wrap: wrap; padding: 6px; border-radius: 14px; }
  body.cbx-light .cbt-bar .cbt-tabs { flex: 1 1 100%; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
  body.cbx-light .cbt-tab { height: 40px; padding: 0 12px; font-size: 14px; }
  body.cbx-light .cbt-bar .cb-search { flex: 1 1 0; min-width: 0; height: 40px; }
  body.cbx-light .cbt-bar .cb-sort-select { height: 40px; flex: 0 0 auto; }
}
/* phone top bar on one row: brand, cart, user, language, menu; "Talk to sales" moves into the menu */
@media (max-width: 991px) {
  .cb-topbar .cb-topbar-actions { order: 1; margin-left: auto; flex-wrap: nowrap; gap: 4px; }
  .cb-topbar .cb-topbar-burger { order: 2; margin-left: 2px !important; }
  .cb-topbar #navbarNav { order: 3; }
}
@media (max-width: 575px) {
  .cb-topbar .cb-topbar-cta { display: none !important; }
  .cb-topbar .cb-topbar-wordmark-thin { display: none; }
}
.cb-topbar .cb-nav-sales { display: none; }
@media (max-width: 575px) { .cb-topbar .cb-nav-sales { display: block; } }
body.cbx-light .cbt-n.zero { opacity: .55; }
#products.is-searching .cbt-tab:has(.cbt-n.zero) { opacity: .6; }
body.cbx-light .cbt-bar .cbt-tabs.at-end { -webkit-mask-image: none; mask-image: none; }
/* compare page: yes / no icons (compare-script.js compareCell) */
.cmp-yes .material-symbols-outlined { color: #16a34a; font-size: 24px; font-variation-settings: 'FILL' 1; }
.cmp-no .material-symbols-outlined { color: #cbd5e1; font-size: 24px; }
.shop-chip .t b .shop-off { margin-left: 4px; vertical-align: 1px; }
.shop-chip { max-width: 260px; }
.shop-info .shop-was b { font-size: inherit; line-height: inherit; color: #15803d; font-weight: 600; }
/* ── Spec page in the light theme (2026-10-16): same white-card feel as the catalogue and cart.
   catalog-v2.css hard-codes dark colours for these spec parts; these re-point them for body.cbx-spec.cbx-light. ── */
body.cbx-spec.cbx-light { --cbx-panel: #fff; }
body.cbx-spec.cbx-light .cb-topbar { background: rgba(255, 255, 255, .92); }
body.cbx-spec.cbx-light .cb-spec-title,
body.cbx-spec.cbx-light .cb-spec-section-title, body.cbx-spec.cbx-light .cbx-sec h2,
body.cbx-spec.cbx-light .cb-spec-description h2, body.cbx-spec.cbx-light .cb-spec-description h3,
body.cbx-spec.cbx-light .cb-spec-description h4, body.cbx-spec.cbx-light .cb-spec-description strong,
body.cbx-spec.cbx-light .cbx-g b, body.cbx-spec.cbx-light .cbx-ucard b, body.cbx-spec.cbx-light .cbx-rd b,
body.cbx-spec.cbx-light .cbx-faq summary, body.cbx-spec.cbx-light .cbx-sub .nm { color: var(--cb-ink); }
body.cbx-spec.cbx-light .cb-spec-description { color: var(--cb-text); }
body.cbx-spec.cbx-light .cb-spec-feature { background: #f5f3ff; border-color: #ddd6fe; color: #5b21b6; }
body.cbx-spec.cbx-light .cb-spec-feature.is-off { background: #f7f8fc; border-color: var(--cb-line); color: var(--cb-mute-2); opacity: 1; }
body.cbx-spec.cbx-light .cbx-g { background: #fff; border-color: var(--cb-line); box-shadow: 0 4px 14px rgba(21, 25, 43, .04); }
body.cbx-spec.cbx-light .cbx-sub { background: rgba(255, 255, 255, .92); border-bottom-color: var(--cb-line); }
body.cbx-spec.cbx-light .cbx-sub a.t:hover { color: var(--cb-accent); background: #f5f3ff; }
body.cbx-spec.cbx-light .cbx-ucard { background: #fff; border-color: var(--cb-line); box-shadow: 0 6px 22px rgba(21, 25, 43, .06); }
body.cbx-spec.cbx-light .cbx-tab { border-color: var(--cb-line-2); color: var(--cb-text); background: #fff; }
body.cbx-spec.cbx-light .cbx-tab[aria-selected="true"] { background: var(--cb-accent); border-color: var(--cb-accent); color: #fff; }
body.cbx-spec.cbx-light .cbx-spectable { background: #fff; }
body.cbx-spec.cbx-light .cbx-spectable td { border-bottom-color: var(--cb-line); color: var(--cb-text); }
body.cbx-spec.cbx-light .cbx-rd a, body.cbx-spec.cbx-light .cbx-faq details { background: #fff; border-color: var(--cb-line); }
body.cbx-spec.cbx-light .cbx-sup a { border-color: var(--cb-line-2); color: var(--cb-accent); }
body.cbx-spec.cbx-light .cbx-sup a:hover { color: var(--cb-accent); border-color: var(--cb-accent); background: #f5f3ff; }
body.cbx-spec.cbx-light .cb-btn--ghost { background: #fff; color: var(--cb-accent); border: 1px solid var(--cb-line-2); }
/* buy box: the price + actions as one white card, like a cart line */
body.cbx-spec.cbx-light .cb-spec-price { background: #fff; border: 1px solid var(--cb-line); border-radius: 18px; padding: 16px 18px 12px;
  box-shadow: 0 6px 22px rgba(21, 25, 43, .06); margin-bottom: 12px; }
body.cbx-spec .cbx-sup-h { color: #fff; }
body.cbx-spec.cbx-light .cbx-sup-h { color: var(--cb-ink); }
body.cbx-spec.cbx-light .cbx-faq details p { color: var(--cb-text); }
/* long integration names wrap instead of being cut, so the "% off" tag stays visible (2026-10-16) */
.shop-chip { max-width: 300px; }
.shop-chip .t b { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.3; }
/* checkout Order summary in the cart's style (2026-10-16) */
.shop-mini .co-blk { display: block; padding: 10px 12px; margin: 0 0 8px; border: 1px solid var(--cb-line); border-radius: 14px; background: #fff; }
.shop-mini .co-h { display: flex; align-items: center; gap: 10px; }
.shop-mini .co-img { flex: none; width: 40px; height: 40px; border-radius: 10px; background: #f5f3ff; display: grid; place-items: center; overflow: hidden; }
.shop-mini .co-img img { width: 100%; height: 100%; object-fit: contain; padding: 3px; }
.shop-mini .co-img .material-symbols-outlined { color: var(--cb-accent); font-size: 20px; }
.shop-mini .co-n { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.shop-mini .co-n b { font-size: 13.5px; color: var(--cb-ink); line-height: 1.3; }
.shop-mini .co-n small { font-size: 12px; color: var(--cb-muted); }
.shop-mini .co-a { text-align: right; white-space: nowrap; font-size: 13px; }
.shop-mini .co-a s { color: var(--cb-muted); font-size: 11.5px; text-decoration-thickness: 1.5px; }
.shop-mini .co-a b { color: var(--cb-ink); }
.shop-mini .co-sets { list-style: none; margin: 8px 0 0; padding: 8px 0 0; border-top: 1px dashed var(--cb-line); }
.shop-mini .co-sets li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 3px 0; border: 0; font-size: 12.5px; }
.shop-mini .co-sets li > span:first-child { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.shop-mini .co-sets .material-symbols-outlined { font-size: 16px; color: var(--cb-accent); }
.shop-mini .co-ship { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; border: 1px dashed var(--cb-line); border-radius: 12px; font-size: 13px; margin-bottom: 8px; }
.shop-mini .co-ship > span { display: inline-flex; align-items: center; gap: 6px; }
.shop-mini .co-ship .material-symbols-outlined { font-size: 17px; color: var(--cb-accent); }
/* checkout: a wider summary column for the per-product cards; the struck price sits above the price */
@media (min-width: 992px) { .shop-grid.shop-grid--co { grid-template-columns: minmax(0, 1fr) 430px; } }
.shop-mini .co-a { display: inline-flex; flex-direction: column; align-items: flex-end; line-height: 1.25; }
.shop-mini .co-sets .shop-off { font-size: 11px; padding: 0 6px; line-height: 16px; }
.shop-mini .co-sets li > span:first-child { flex-wrap: wrap; }
/* ── Compare page (2026-10-16): one comparison table in the cart's card style ── */
.cmp-wrap { padding-top: 92px; padding-bottom: 40px; }
.cmp-h1 { font-size: 30px; font-weight: 800; letter-spacing: -.5px; color: var(--cb-ink); margin: 8px 0 4px; }
.cmp-sub { color: var(--cb-muted); font-size: 14.5px; margin: 0 0 18px; }
.cmp-empty { padding: 40px; text-align: center; color: var(--cb-muted); }
.cmp-root { background: #fff; border: 1px solid var(--cb-line); border-radius: 20px; box-shadow: 0 10px 34px rgba(21, 25, 43, .07); overflow: hidden; }
.cmp-scroll { overflow-x: auto; }
.cmp-table { width: 100%; border-collapse: separate; border-spacing: 0; min-width: calc(200px + var(--cmp-n, 3) * 210px); }
.cmp-table th, .cmp-table td { padding: 12px 16px; border-bottom: 1px solid #eef0f6; vertical-align: middle; }
.cmp-table thead th { position: sticky; top: 64px; z-index: 3; background: #fff; vertical-align: top; border-bottom: 1px solid var(--cb-line); }
.cmp-table tbody th { position: sticky; left: 0; z-index: 1; background: #fbfbfe; text-align: left; font-size: 13px; font-weight: 600; color: var(--cb-muted); width: 200px; }
.cmp-table td { text-align: center; font-size: 14px; color: var(--cb-ink); }
.cmp-table tbody tr:hover td, .cmp-table tbody tr:hover th { background: #f8f6ff; }
.cmp-table tbody tr:last-child td, .cmp-table tbody tr:last-child th { border-bottom: 0; }
.cmp-table tbody tr:not(.is-same) th { color: var(--cb-ink); }
.cmp-table tbody tr:not(.is-same) th::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--cb-accent); margin-right: 8px; vertical-align: 2px; }
.cmp-table.only-diff tbody tr.is-same { display: none; }
.cmp-corner { text-align: left; width: 200px; }
.cmp-corner span { display: block; font-size: 12px; font-weight: 600; color: var(--cb-muted); text-transform: uppercase; letter-spacing: .6px; }
.cmp-corner b { display: block; font-size: 20px; color: var(--cb-ink); margin: 2px 0 14px; }
.cmp-diff { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--cb-text); cursor: pointer; }
.cmp-diff input { accent-color: var(--cb-accent); width: 16px; height: 16px; }
.cmp-prod { position: relative; text-align: center; }
.cmp-prod .cmp-img { display: grid; place-items: center; height: 150px; margin: 4px 8px 10px; border-radius: 16px; background: radial-gradient(circle at 50% 42%, #fff 0, #f5f6fb 60%, #eceef7 100%); }
.cmp-prod .cmp-img img { max-height: 132px; max-width: 90%; object-fit: contain; }
.cmp-code { display: block; font: 700 12px ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 1px; text-transform: uppercase; color: var(--cb-accent); }
.cmp-name { display: block; margin: 4px 0 6px; font-size: 14px; font-weight: 600; line-height: 1.35; color: var(--cb-ink); text-decoration: none; }
.cmp-name:hover { color: var(--cb-accent); }
.cmp-rating { display: block; font-size: 12px; color: var(--cb-muted); margin-bottom: 10px; }
.cmp-stars { position: relative; display: inline-block; color: #e5e7eb; letter-spacing: 1px; }
.cmp-stars-on { position: absolute; left: 0; top: 0; overflow: hidden; white-space: nowrap; color: #f59e0b; }
.cmp-view { display: inline-flex; padding: 8px 16px; font-size: 13px; }
.cmp-rm { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--cb-line); border-radius: 50%; background: #fff; color: var(--cb-muted); cursor: pointer; z-index: 2; }
.cmp-rm:hover { background: #fee2e2; border-color: #fecaca; color: #b91c1c; }
.cmp-rm .material-symbols-outlined { font-size: 16px; }
.cmp-na { color: #cbd5e1; }
@media (max-width: 720px) {
  .cmp-wrap { padding-top: 76px; }
  .cmp-h1 { font-size: 24px; }
  .cmp-table { min-width: calc(130px + var(--cmp-n, 3) * 170px); }
  .cmp-table tbody th, .cmp-corner { width: 130px; font-size: 12px; }
  .cmp-table thead th { top: 58px; }
}
.cmp-table { table-layout: fixed; }
.cmp-table col.cmp-col-k { width: 200px; }
.cmp-table td { overflow-wrap: anywhere; line-height: 1.45; }
.cmp-table td a { color: var(--cb-accent); font-weight: 600; text-decoration: none; }
.cmp-table td a:hover { text-decoration: underline; }
@media (max-width: 720px) { .cmp-table col.cmp-col-k { width: 130px; } }
/* the table scrolls sideways in .cmp-scroll, so a sticky header would be offset inside that box and cover rows */
.cmp-table thead th { position: static; }
/* the language list is positioned even while its <details> is closed; on the one-row phone top bar it then hung
   past the right edge and widened the page (2026-10-16) */
.cb-topbar .cams-lang:not([open]) > ul { display: none; }
@media (max-width: 575px) { .cb-topbar .cams-lang[open] > ul { right: 0; left: auto; max-width: calc(100vw - 24px); } }
/* keep the wide table's layout inside its card on phones (without it the page grew to the table's width) */
.cmp-root { contain: paint; }
/* spec page review (2026-10-16): less empty space above the breadcrumb; the overview a little wider on large screens */
body.cbx-spec.cbx-light .cb-breadcrumb { padding-top: 24px; }
@media (min-width: 1200px) { body.cbx-spec .cb-spec-description { max-width: 82ch; } }
/* compare tray: as wide as its content (it covered the buy box at full width) */
#cb-cmp-tray { width: auto; max-width: min(960px, calc(100vw - 32px)); }

/* Cart stock notice (2026-10-16): not enough ready stock; the order is still allowed.
   (Moved here from a stray css/main/shop.css that no page loaded.) */
.shop-stock { margin: 4px 0 14px; padding: 12px 14px; border-radius: 12px; background: #fffbeb; border: 1px solid #fde68a; color: #78350f; font-size: 13px; line-height: 1.45; }
.shop-stock p { margin: 6px 0 0; }
.shop-stock-h { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: #92400e; }
.shop-stock-h .material-symbols-outlined { font-size: 18px; }
.shop-stock-items { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.shop-stock-chip { padding: 2px 9px; border-radius: 999px; background: #fff; border: 1px solid #fcd34d; font-size: 12px; font-weight: 600; color: #78350f; white-space: nowrap; }
.shop-stock-wa { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 10px; padding: 9px 12px; border-radius: 10px; background: #fff; border: 1px solid #16a34a; color: #15803d !important; font-weight: 700; font-size: 13.5px; text-decoration: none; }
.shop-stock-wa:hover, .shop-stock-wa:focus-visible { background: #f0fdf4; }
.shop-stock-wa .material-symbols-outlined { font-size: 18px; }
.shop-stock-refund { display: flex; align-items: flex-start; gap: 6px; margin-top: 10px; font-size: 12px; color: #92400e; }
.shop-stock-refund .material-symbols-outlined { font-size: 15px; margin-top: 1px; }
.shop-lowtag { display: inline-flex; align-self: flex-start; width: fit-content; align-items: center; gap: 3px; margin: 3px 0 2px; padding: 0 7px; border-radius: 999px; background: #fef3c7; color: #92400e; font-size: 11px; font-weight: 700; line-height: 18px; vertical-align: middle; }
.shop-lowtag .material-symbols-outlined { font-size: 13px; }
.shop-note--foot { margin: 14px 0 0; text-align: center; }

/* Checkout: add a GSTIN (2026-10-16) */
.shop-gst { margin: 14px 0 4px; padding: 14px; border-radius: 12px; border: 1px solid #ddd6fe; background: #f5f3ff; }
.shop-gst-h { display: flex; align-items: center; gap: 6px; font-weight: 700; color: var(--cb-ink); font-size: 14.5px; }
.shop-gst-h .material-symbols-outlined { font-size: 19px; color: var(--cb-accent); }
.shop-gst-sub { margin: 4px 0 10px; font-size: 13px; color: var(--cb-muted); }
.shop-gst-row { display: flex; gap: 8px; flex-wrap: wrap; }
.shop-gst-row input { flex: 1 1 220px; min-width: 0; padding: 10px 12px; border: 1px solid var(--cb-line); border-radius: 10px; font-size: 14px; text-transform: uppercase; background: #fff; }
.shop-gst-row .cb-btn { padding: 10px 16px; border-radius: 10px; }
.shop-gst-pv { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: #fff; border: 1px solid var(--cb-line); font-size: 13.5px; }
.shop-gst-pv b { display: block; color: var(--cb-ink); }
.shop-gst-pv span { display: block; color: var(--cb-text); margin-top: 2px; }
.shop-gst-pv small { display: block; margin: 6px 0 8px; color: #b45309; font-size: 12px; }
.shop-gst-err { display: block; margin-top: 6px; font-size: 13px; color: #b91c1c; }
.shop-gst-err:empty { display: none; }

/* Cart notice after a deep-link add (2026-10-16) */
.shop-notice { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; background: #ecfdf5; border: 1px solid #a7f3d0; color: #065f46; font-size: 14px; }
.shop-notice .material-symbols-outlined { font-size: 20px; }
.shop-notice--bad { background: #fff4ed; border-color: #fed7aa; color: #9a3412; }

/* Shipping breakup (2026-10-18) */
.shop-ship-btn { background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer; display: inline-flex; align-items: center; gap: 2px; text-decoration: underline dotted; text-underline-offset: 3px; }
.shop-ship-btn .material-symbols-outlined { font-size: 18px; transition: transform .15s; }
.shop-ship-btn[aria-expanded="true"] .material-symbols-outlined { transform: rotate(180deg); }
.shop-ship-brk { margin: -2px 0 8px; padding: 8px 12px; border-radius: 10px; background: var(--cb-soft, #F8FAFC); font-size: 12.5px; list-style: none; }
.shop-ship-brk > div { display: flex; justify-content: space-between; gap: 10px; padding: 2px 0; }
.shop-ship-brk small { display: block; margin-top: 4px; color: var(--cb-muted, #64748B); }

/* the breakup row in the checkout summary is a block, not one of the flex rows of .shop-mini (2026-10-18) */
.shop-mini li.shop-ship-brk { display: block; padding: 8px 12px; border: 0; }
.shop-mini li.shop-ship-brk[hidden] { display: none; }
.shop-ship-brk > div > span { flex: 1 1 auto; min-width: 0; }
.shop-ship-brk > div > b { flex: 0 0 auto; white-space: nowrap; }
.shop-ship-btn:focus { outline: none; }
.shop-ship-btn:focus-visible { outline: 2px solid rgba(var(--cb-accent-rgb), .35); outline-offset: 2px; border-radius: 4px; }

/* Phone checkout bar and floating buttons (2026-10-27). The bar mirrors the order summary (cart.blade.php);
   back-to-top covered cart lines and prices and is not shown on phones (a flick scrolls up). */
.shop-mbar { display: none; }
@media (max-width: 600px) {
  .shop-mbar:not([hidden]) {
    display: flex; align-items: center; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); background: #fff;
    border-top: 1px solid #e2e8f0; box-shadow: 0 -6px 20px rgba(15, 23, 42, .08);
  }
  .shop-mbar-tot { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
  .shop-mbar-chat { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 12px; border: 1px solid #e2e8f0; background: #f8fafc; color: #16a34a; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
  .shop-mbar-chat .material-symbols-outlined { font-size: 22px; }
  .shop-mbar-tot small { font-size: 11.5px; color: #64748b; }
  .shop-mbar-tot b { font-size: 15.5px; white-space: nowrap; }
  .shop-mbar .cb-btn { margin-left: auto; white-space: nowrap; min-height: 44px; display: inline-flex; align-items: center; gap: 4px; padding: 0 14px; font-size: 14px; }
  .shop-mbar .cb-btn .material-symbols-outlined { font-size: 18px; }
  /* the total never truncates; the button takes what is left */
  .shop-mbar-tot { flex: 0 0 auto; }
  .shop-mbar .cb-btn { flex: 1 1 0; min-width: 0; justify-content: center; overflow: hidden; }
}
@media (max-width: 400px) {
  .shop-mbar .cb-btn { font-size: 13.5px; padding: 0 10px; }
  .shop-mbar .cb-btn .material-symbols-outlined { display: none; }
  body.has-mbar { padding-bottom: 76px; }
  body.modal-open .shop-mbar { z-index: 1; }
  #btn-back-to-top { display: none !important; }
}
/* Phone heading (2026-10-27): the breadcrumb, "Your cart" and the cards sat 4px from the screen edge (the container had no side padding), with the
   heading under ~90px of empty band; the 40px light heading took a third of the first screen. */
@media (max-width: 600px) {
  .shop-wrap { padding: 72px 16px 40px !important; }
  .shop-crumb { font-size: 13px; margin-bottom: 4px; }
  .shop-h1 { font-size: 26px !important; font-weight: 700; letter-spacing: -.01em; margin: 0 0 14px !important; }
}

/* Checkout fields at 16px on phones (2026-10-27): at 14-14.5px iPhone Safari zoomed the page on every tap */
@media (max-width: 600px) {
  .shop-fields input, .shop-fields select, .shop-fields textarea, #shop-gst-in, .shop-ledger-amt input { font-size: 16px !important; }
}