/** Shopify CDN: Minification failed

Line 6:31 Unexpected "="

**/
please finish where u left off =/* === bpt-customizer.css (scaffold) === */
/* Paste merged rules at the bottom as you migrate files */
/* No visual change expected from this scaffold */
/* === bpt-customizer.css (starter) === */

/* Mobile gutters + card sizing */
@media (max-width: 768px){
  .content-for-layout .page-width{
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .content-for-layout .bpt-card{
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-radius: 10px !important;
  }
}

/* Bulk selector — scroll both axes and fit full width */
@media (max-width: 1024px){
  #bpt-order, #bpt-order-form, .bpt-order{
    width:100% !important; max-width:100% !important; display:block !important; flex:1 1 100% !important;
    overflow:visible !important; margin-left:0 !important; margin-right:0 !important;
  }
  #bpt-order .bpt-order-wrap, #bpt-order-form .bpt-order-wrap, .bpt-order .bpt-order-wrap{
    width:100% !important; max-width:100% !important; box-sizing:border-box !important;
    overflow:auto !important; -webkit-overflow-scrolling:touch;
  }
  #bpt-order .bpt-order-wrap > table,
  #bpt-order-form .bpt-order-wrap > table,
  .bpt-order .bpt-order-wrap > table{
    width:max-content !important; min-width:640px; white-space:nowrap; border-collapse:separate; border-spacing:0;
  }
  @supports not (width: max-content){
    #bpt-order .bpt-order-wrap > table,
    #bpt-order-form .bpt-order-wrap > table,
    .bpt-order .bpt-order-wrap > table{
      display:inline-block !important; width:auto !important;
    }
  }
}

/* Small spacing buffers to prevent visual overlap */
@media (max-width: 768px){
  aside.bpt-card.bpt-left[aria-label="Choose a product"] { margin-bottom: 16px !important; }
  #bpt-canvas-card, #BPTCanvasCard, .bpt-card--canvas { margin-top: 16px !important; }
}

/* --- paste merged rules here as you migrate files --- */
/* bpt-2row-layout.css — reflow to 2 rows + highlight pulse */
#bpt-theme-v10-11 .bpt-wrap{
  display:grid;
  grid-template-columns: 380px 1fr !important; /* products | canvas */
  grid-auto-rows: minmax(0, auto);
  gap: 18px;
  align-items: start;
}
@media (max-width:1280px){
  #bpt-theme-v10-11 .bpt-wrap{ grid-template-columns: 320px 1fr !important; }
}
@media (max-width:1024px){
  #bpt-theme-v10-11 .bpt-wrap{ grid-template-columns: 1fr !important; }
  /* Ensure right column doesn't try to occupy a 2nd grid track on mobile */
  #bpt-theme-v10-11 .bpt-left,
  #bpt-theme-v10-11 .bpt-rightish{ grid-column: 1 !important; }
}

#bpt-theme-v10-11 .bpt-left     { grid-column: 1; } /* products */
#bpt-theme-v10-11 .bpt-rightish { grid-column: 2; } /* canvas/editor */

/* order goes full-width below */
#bpt-theme-v10-11 .bpt-order{
  grid-column: 1 / -1 !important;
  margin-top: 6px;
}

/* gentle pulse to draw attention after scroll */
@keyframes bptPulse {
  0%   { box-shadow: 0 0 0 0 rgba(37,99,235,.25); }
  100% { box-shadow: 0 0 0 16px rgba(37,99,235,0); }
}
#bpt-theme-v10-11 .bpt-order.is-pulsed,
#bpt-theme-v10-11 .bpt-canvas-wrap.is-pulsed{
  animation: bptPulse 900ms ease-out 2;
}
/* --- BPT 2-up layout + equal card heights --- */
#bpt-root{
  display:grid !important;
  grid-template-columns:360px 1fr !important;
  grid-template-areas:"left middle" "order order";
  gap:18px !important;
  align-items:stretch !important;           /* stretch columns to same row height */
}
#bpt-root .bpt-left{ grid-area:left !important; }
#bpt-root .bpt-rightish{ grid-area:middle !important; }
#bpt-root .bpt-order{ grid-area:order !important; }
/* --- Toolbar column at the left of the canvas (desktop) --- */
@media (min-width:1100px){
  #bpt-theme-v10-11 .bpt-rightish{ position:relative; }
  #bpt-theme-v10-11 .bpt-canvas-wrap{ padding-left:168px; }
  #bpt-theme-v10-11 .bpt-toolbar{
    position:absolute; left:12px; top:40px;   /* <- nudge up/down here */
    width:148px; display:flex; flex-direction:column; gap:8px; margin:0;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn{ min-width:0; width:100%; }
}
/* Mobile/tablet keeps toolbar under canvas */
@media (max-width:1099px){
  #bpt-theme-v10-11 .bpt-toolbar{ position:static; flex-wrap:wrap; }
}

/* Ensure both top cards stretch to the same height */
#bpt-root > .bpt-card{ height:100%; display:flex; flex-direction:column; }

/* Product list scrolls inside its card, not the page */
#bpt-root .bpt-grid{ max-height:68vh; overflow:auto; }

/* Mobile stacks */
@media (max-width:1024px){
  #bpt-root{ grid-template-columns:1fr !important; grid-template-areas:"left" "middle" "order"; }
  #bpt-root > .bpt-card{ height:auto; }
}

/* Quick Add area on the canvas card */
#bpt-theme-v10-11 .bpt-quickadd {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}

#bpt-theme-v10-11 .bpt-quickadd input[type="number"]{
  width: 72px;
  text-align: center;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 8px 10px;
}

#bpt-theme-v10-11 .bpt-quickadd .bpt-quickbtn{
  border: 1px solid #111;
  background: #111;
  color: #fff;
  border-radius: 12px;
  padding: 10px 14px;
  font-weight: 700;
  cursor: pointer;
}

@media (max-width: 480px){
  #bpt-theme-v10-11 .bpt-quickadd { gap: 6px; }
  #bpt-theme-v10-11 .bpt-quickadd input[type="number"]{ width: 64px; }
}
/* spacing for Bulk ordering button under quick add */
#bpt-theme-v10-11 #bpt-go-bulk {
  margin-top: 4px;
}
/* Bulk Order: stable horizontal scroll + sticky header (mobile + narrow screens) */
@media (max-width: 1024px) {
  /* Wrap the table in a scroll pane (we'll add this wrapper via JS below if missing) */
  #bpt-order, #bpt-order-form, .bpt-order {
    --bpt-order-maxw: 100vw;
  }
  #bpt-order .bpt-order-wrap,
  #bpt-order-form .bpt-order-wrap,
  .bpt-order .bpt-order-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    max-width: var(--bpt-order-maxw);
    border-radius: 10px;
  }

  /* Table layout hygiene */
  #bpt-order table, #bpt-order-form table, .bpt-order table {
    border-collapse: separate;
    border-spacing: 0;
    min-width: 640px;           /* prevent squish */
    white-space: nowrap;        /* keep headers readable */
  }
  #bpt-order th, #bpt-order td,
  #bpt-order-form th, #bpt-order-form td,
  .bpt-order th, .bpt-order td {
    padding: 10px 12px;
  }

  /* Sticky header row so header always aligns while scrolling */
  #bpt-order thead th,
  #bpt-order-form thead th,
  .bpt-order thead th {
    position: sticky;
    top: 0;
    background: #fff;          /* match your card bg */
    z-index: 2;
    box-shadow: 0 1px 0 rgba(0,0,0,.06);
  }

  /* Lock the first column too (e.g., size labels) so users always know the row */
  #bpt-order tbody th:first-child,
  #bpt-order tbody td:first-child,
  #bpt-order-form tbody th:first-child,
  #bpt-order-form tbody td:first-child,
  .bpt-order tbody th:first-child,
  .bpt-order tbody td:first-child {
    position: sticky;
    left: 0;
    background: #fff;
    z-index: 1;
  }

  /* Optional: cap the vertical height if rows get long (adds vertical scroll) */
  #bpt-order .bpt-order-wrap,
  #bpt-order-form .bpt-order-wrap,
  .bpt-order .bpt-order-wrap {
    max-height: 60vh;
  }
}
/* --- Patch: Bulk Order card scroll fix with both horizontal + vertical scroll --- */
@media (max-width: 1024px) {
  #bpt-order, #bpt-order-form, .bpt-order {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    flex: 1 1 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #bpt-order .bpt-order-wrap,
  #bpt-order-form .bpt-order-wrap,
  .bpt-order .bpt-order-wrap {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;

    /* 🔑 Allow scrolling in both directions */
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  #bpt-order table,
  #bpt-order-form table,
  .bpt-order table {
    width: 100% !important;
    min-width: 640px;
    border-collapse: separate;
    border-spacing: 0;
    white-space: nowrap;
  }

  #bpt-order .bpt-summary,
  #bpt-order-form .bpt-summary,
  .bpt-order .bpt-summary,
  #bpt-order .bpt-footer,
  #bpt-order-form .bpt-footer,
  .bpt-order .bpt-footer {
    width: 100% !important;
  }
}
/* --- Patch: ensure horizontal overflow actually occurs on iOS/Safari --- */
@media (max-width: 1024px) {
  /* The scroll pane must be the thing with overflow */
  #bpt-order .bpt-order-wrap,
  #bpt-order-form .bpt-order-wrap,
  .bpt-order .bpt-order-wrap {
    overflow-x: auto !important;   /* horizontal scroll */
    overflow-y: auto !important;   /* vertical scroll still allowed */
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y;     /* hint touch scrolling in both axes */
    max-width: 100% !important;
  }

  /* 🔑 Make the table wider than the wrapper when content demands it */
  #bpt-order .bpt-order-wrap > table,
  #bpt-order-form .bpt-order-wrap > table,
  .bpt-order .bpt-order-wrap > table {
    width: max-content !important; /* grow to fit columns */
    min-width: 640px;              /* prevents over-squish on small sets */
    white-space: nowrap;
  }

  /* Fallback for older Safari that ignores width:max-content on <table> */
  @supports not (width: max-content) {
    #bpt-order .bpt-order-wrap > table,
    #bpt-order-form .bpt-order-wrap > table,
    .bpt-order .bpt-order-wrap > table {
      display: inline-block !important;  /* lets the table expand to content */
      width: auto !important;
    }
  }

  /* Make sure no ancestor is clipping the scroll area */
  #bpt-order, #bpt-order-form, .bpt-order {
    overflow: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
  }
}
/* BPT — Quick Size polish (safe, scoped to known IDs/classes only) */
#bpt-quick-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

label[for="bpt-quick-size"],
.bpt-quick-size-label {
  font-size: 14px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: .2px;
  margin-right: 6px;
  user-select: none;
}

#bpt-quick-size,
select.bpt-quick-size {
  min-width: 172px;
  height: 44px;
  padding: 8px 12px;
  font-size: 16px;
  line-height: 1.3;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 10px;
  background-color: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 12px;
}

#bpt-quick-size,
select.bpt-quick-size {
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(0,0,0,.5) 50%),
    linear-gradient(135deg, rgba(0,0,0,.5) 50%, transparent 50%),
    linear-gradient(to right, rgba(0,0,0,.2), rgba(0,0,0,.2));
}
#bpt-quick-size,
select.bpt-quick-size {
  background-position:
    right 16px center,
    right 10px center,
    right 36px center;
  background-size: 6px 6px, 6px 6px, 1px 24px;
}

#bpt-quick-size:focus,
select.bpt-quick-size:focus {
  border-color: rgba(25,118,210,.55);
  box-shadow: 0 0 0 3px rgba(25,118,210,.15);
}
#bpt-quick-size:hover,
select.bpt-quick-size:hover {
  border-color: rgba(0,0,0,.35);
}

@media (max-width: 640px) {
  #bpt-quick-controls { gap: 8px; }
  #bpt-quick-size,
  select.bpt-quick-size { min-width: 150px; height: 44px; font-size: 15px; }
}
/* Restore native dropdown arrow */
#bpt-quick-size,
select.bpt-quick-size {
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  appearance: auto;
  background-image: none;
  background-position: initial;
  background-size: initial;
  padding-right: 12px;
}
/* BPT — QuickAdd cohesion (resilient selectors) */
#bpt-quickadd-cluster,
#bpt-quickadd {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 8px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}

#bpt-price {
  display: inline-flex;
  align-items: center;
  height: 44px;
  padding: 0 12px;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 999px;
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  letter-spacing: .2px;
  background: #fafafa;
  color: #111;
  white-space: nowrap;
  margin-right: 2px;
}

#bpt-quickadd select,
#bpt-quickadd input[type="number"],
#bpt-quickadd button {
  height: 44px;
  border-radius: 10px;
  font-size: 16px;
  letter-spacing: .2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#bpt-quickadd select {
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  appearance: auto;
  background-color: #fff;
  padding: 8px 12px;
  border: 1px solid rgba(0,0,0,.2);
}

#bpt-quickadd input[type=number]::-webkit-outer-spin-button,
#bpt-quickadd input[type=number]::-webkit-inner-spin-button { -webkit-appearance: auto; margin: 0; }
#bpt-quickadd input[type=number] { -moz-appearance: number-input; appearance: auto; padding: 8px 12px; border: 1px solid rgba(0,0,0,.2); background:#fff; }

#bpt-quickadd button {
  font-weight: 700;
  padding: 0 16px;
}

#bpt-bulkjump {
  padding: 0 14px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  color: #111;
}
#bpt-bulkjump:hover { border-color: rgba(0,0,0,.25); }

#bpt-price { order: 1; }
#bpt-quickadd input[type="number"] { order: 2; }
#bpt-quickadd select { order: 3; }
#bpt-quickadd button { order: 4; }
#bpt-bulkjump { order: 5; }

@media (max-width: 640px) {
  #bpt-price { order: -2; }
}
/* Force native number spinners */
#bpt-quickadd input[type=number]::-webkit-outer-spin-button,
#bpt-quickadd input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: auto !important;
  appearance: auto !important;
  margin: 0 !important;
  display: inline-block !important;
  opacity: 1 !important;
}
#bpt-quickadd input[type=number] {
  -moz-appearance: number-input !important;
  appearance: auto !important;
}

#bpt-quickadd input[type=number] {
  height: 44px !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(0,0,0,.2) !important;
  border-radius: 10px !important;
  background: #fff !important;
  line-height: 1.2 !important;
}
#bpt-quickadd select, #bpt-quickadd-cluster select {
  height: 44px !important;
  line-height: 1.3 !important;
  -webkit-appearance: menulist !important;
  appearance: auto !important;
}
/* QuickAdd transitions */
#bpt-quickadd,
#bpt-quickadd-cluster {
  --bpt-radius: 10px;
  --bpt-press: translateY(0.5px) scale(0.995);
}
#bpt-quickadd button,
#bpt-quickadd-cluster button,
#bpt-quickadd #bpt-bulkjump,
#bpt-quickadd-cluster #bpt-bulkjump {
  border-radius: var(--bpt-radius) !important;
  transition: border-color .2s ease, background-color .2s ease, color .2s ease, transform .08s ease, box-shadow .2s ease !important;
  box-shadow: 0 1px 1px rgba(0,0,0,.04) !important;
}
#bpt-quickadd #bpt-quickadd button:hover,
#bpt-quickadd-cluster #bpt-quickadd button:hover { filter: brightness(1.03); }
#bpt-quickadd #bpt-quickadd button:active,
#bpt-quickadd-cluster #bpt-quickadd button:active { transform: var(--bpt-press); }
#bpt-quickadd #bpt-bulkjump:hover,
#bpt-quickadd-cluster #bpt-bulkjump:hover {
  border-color: rgba(0,0,0,.25) !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.06) !important;
}
#bpt-quickadd #bpt-bulkjump:active,
#bpt-quickadd-cluster #bpt-bulkjump:active { transform: var(--bpt-press); }
#bpt-quickadd button:focus-visible,
#bpt-quickadd-cluster button:focus-visible,
#bpt-quickadd #bpt-bulkjump:focus-visible,
#bpt-quickadd-cluster #bpt-bulkjump:focus-visible {
  outline: 3px solid rgba(25,118,210,.25) !important;
  outline-offset: 2px !important;
}
/* Brand colors (overridden to #1b29b4) */
#bpt-quickadd,
#bpt-quickadd-cluster {
  --bpt-blue: #1b29b4;
  --bpt-blue-hover: #18249f;
  --bpt-blue-active: #141f8a;
  --bpt-blue-ring: rgba(27, 41, 180, .25);
}
#bpt-quickadd #bpt-quickadd button,
#bpt-quickadd-cluster #bpt-quickadd button {
  background: var(--bpt-blue) !important;
  color: #fff !important;
  border: 1px solid var(--bpt-blue) !important;
}
#bpt-quickadd #bpt-quickadd button:hover,
#bpt-quickadd-cluster #bpt-quickadd button:hover {
  background: var(--bpt-blue-hover) !important;
  border-color: var(--bpt-blue-hover) !important;
}
#bpt-quickadd #bpt-quickadd button:active,
#bpt-quickadd-cluster #bpt-quickadd button:active {
  background: var(--bpt-blue-active) !important;
  border-color: var(--bpt-blue-active) !important;
}
#bpt-quickadd #bpt-quickadd button:focus-visible,
#bpt-quickadd-cluster #bpt-quickadd button:focus-visible {
  outline: 3px solid var(--bpt-blue-ring) !important;
  outline-offset: 2px !important;
}
#bpt-quickadd #bpt-bulkjump,
#bpt-quickadd-cluster #bpt-bulkjump {
  background: #fff !important;
  color: var(--bpt-blue) !important;
  border-width: 2px !important;
  border-color: var(--bpt-blue) !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
#bpt-quickadd #bpt-bulkjump:hover,
#bpt-quickadd-cluster #bpt-bulkjump:hover {
  color: var(--bpt-blue-hover) !important;
  border-color: var(--bpt-blue-hover) !important;
  background: rgba(27, 41, 180, 0.06) !important;
}
#bpt-quickadd #bpt-bulkjump:active,
#bpt-quickadd-cluster #bpt-bulkjump:active {
  color: var(--bpt-blue-active) !important;
  border-color: var(--bpt-blue-active) !important;
  background: rgba(27, 41, 180, 0.10) !important;
}
#bpt-quickadd #bpt-bulkjump:focus-visible,
#bpt-quickadd-cluster #bpt-bulkjump:focus-visible {
  outline: 3px solid var(--bpt-blue-ring) !important;
  outline-offset: 2px !important;
}

#bpt-quickadd, #bpt-quickadd-cluster { align-items: center; gap: 10px; }
#bpt-quickadd select, #bpt-quickadd input, #bpt-quickadd button,
#bpt-quickadd-cluster select, #bpt-quickadd-cluster input, #bpt-quickadd-cluster button { vertical-align: middle; }

#bpt-quickadd select:focus-visible,
#bpt-quickadd-cluster select:focus-visible,
#bpt-price:focus-visible {
  outline: 3px solid rgba(27,41,180,.25) !important;
  outline-offset: 2px !important;
}

#bpt-price { margin-right: 6px !important; }
#bpt-bulkjump { transition: transform .08s ease; }
#bpt-bulkjump:active { transform: translateY(.5px) scale(.995); }

/* Micro-stabilizers */
@media (max-width:640px){
  .bpt-products, .products, .product-list, .collection-list, #ProductsList {
    overflow-anchor: none !important;
  }

  header .page-width, header .content-container,
  #MainContent, .main-content, .page-width, .content-container,
  footer .page-width, footer .content-container {
    padding-left: 12px !important;
    padding-right: 12px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
/* Mobile Sticky CTA */
@media (max-width: 640px) {
  #bpt-sticky-cta {
    position: fixed; left: 0; right: 0; bottom: 0;
    z-index: 9999;
    display: flex; gap: 8px; align-items: center;
    padding: 10px 12px;
    background: rgba(255,255,255,.96);
    backdrop-filter: saturate(1.1) blur(6px);
    border-top: 1px solid rgba(0,0,0,.08);
    box-shadow: 0 -4px 10px rgba(0,0,0,.05);
  }
  #bpt-sticky-cta .bpt-price {
    display: inline-flex; align-items: center;
    height: 40px; padding: 0 12px;
    border: 1px solid rgba(27,41,180,.25);
    border-radius: 999px;
    background: rgba(27,41,180,.06);
    color: #1b29b4; font-weight: 700; white-space: nowrap;
  }
  #bpt-sticky-cta input[type="number"] {
    height: 40px; width: 80px;
    padding: 6px 10px; border-radius: 10px;
    border: 1px solid rgba(0,0,0,.2); background: #fff;
    -webkit-appearance: auto; appearance: auto;
  }
  #bpt-sticky-cta button {
    height: 40px; padding: 0 14px; border-radius: 10px;
    font-weight: 700; letter-spacing: .2px;
    background: #1b29b4; color: #fff; border: 1px solid #1b29b4;
    transition: filter .2s ease, transform .08s ease;
  }
  #bpt-sticky-cta button:active { transform: translateY(.5px) scale(.995); }
  body.bpt-has-sticky { padding-bottom: 64px; }
}
/* Inline tooltip for Bulk button */
#bpt-bulkjump { position: relative; }
#bpt-bulkjump::after {
  content: "Best for 24+ items • teams • schools";
  position: absolute; left: 50%; transform: translateX(-50%);
  bottom: calc(100% + 8px);
  background: #111; color: #fff;
  padding: 6px 10px; border-radius: 8px;
  font-size: 12px; line-height: 1.2; white-space: nowrap;
  opacity: 0; pointer-events: none; transition: opacity .2s ease, transform .2s ease;
  box-shadow: 0 4px 10px rgba(0,0,0,.18);
}
#bpt-bulkjump::before {
  content: ""; position: absolute; left: 50%; transform: translateX(-50%);
  bottom: 100%;
  border: 6px solid transparent; border-top-color: #111;
  opacity: 0; transition: opacity .2s ease;
}
#bpt-bulkjump:hover::after,
#bpt-bulkjump:focus-visible::after,
#bpt-bulkjump:hover::before,
#bpt-bulkjump:focus-visible::before { opacity: 1; }

/* Qty selector styling */
#bpt-quick-qty-select {
  height: 44px;
  min-width: 100px;
  padding: 8px 12px;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 10px;
  background: #fff;
  font-size: 16px;
  line-height: 1.3;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  appearance: auto;
  margin-right: 8px;
}
.bpt-qty-hidden {
  position: absolute !important;
  width: 1px !important; height: 1px !important;
  margin: -1px !important; padding: 0 !important; border: 0 !important;
  clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; overflow: hidden !important;
}
input[type="number"]:not(.bpt-qty-hidden) {
  height: 44px;
  padding: 8px 12px;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 10px;
  background: #fff;
  font-size: 16px;
  line-height: 1.2;
  -webkit-appearance: auto; appearance: auto;
}
.bpt-qty-wrap { display: inline-block; }

/* Mobile customizer flow (sticky quick row) */
@media (max-width: 640px) {
  #bpt-quickadd, #bpt-quickadd-cluster {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: minmax(48px, auto);
    gap: 8px !important;
    padding: 10px !important;

    position: sticky;
    top: var(--bpt-sticky-top, 72px);
    z-index: 1000;
    background: rgba(255,255,255,.97) !important;
    backdrop-filter: saturate(1.05) blur(6px);
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 14px;
    box-shadow: 0 4px 14px rgba(0,0,0,.06);
    margin: 8px 0 12px 0;
  }

  html, body { scroll-padding-top: calc(var(--bpt-sticky-top, 72px) + 12px); }

  #bpt-price {
    grid-column: 1 / -1 !important;
    order: 1 !important;
    margin: 0 !important;
    justify-self: start;
  }

  #bpt-quick-qty-select { order: 2 !important; width: 100% !important; }
  #bpt-quickadd input[type="number"]:not(.bpt-qty-hidden),
  #bpt-quickadd-cluster input[type="number"]:not(.bpt-qty-hidden) {
    order: 2 !important; width: 100% !important;
  }
  #bpt-quick-size { order: 3 !important; width: 100% !important; }

  #bpt-quickadd button {
    grid-column: 1 / -1 !important;
    order: 4 !important;
    width: 100% !important;
    min-height: 48px !important;
  }

  #bpt-bulkjump {
    grid-column: 1 / -1 !important;
    order: 5 !important;
    width: 100% !important;
    min-height: 48px !important;
    text-align: center;
  }

  .product__media, .product__canvas, .bpt-canvas, .main-content,
  .page-width, .content-container { overflow: visible !important; }
}
@media (min-width: 641px) and (max-width: 768px) {
  #bpt-quickadd, #bpt-quickadd-cluster { gap: 10px !important; }
}

/* Global offset for anchors */
:root { --bpt-sticky-top: var(--bpt-sticky-top, 72px); }
html, body { scroll-padding-top: calc(var(--bpt-sticky-top) + 12px); }

/* Phones: neutralize product list stickiness */
@media (max-width: 640px) {
  .bpt-products, .products, .product-list, .collection-list,
  #bpt-products, #ProductsList, .sidebar, [data-bpt="products"] {
    position: static !important;
    overflow-anchor: none !important;
  }

  #bpt-quickadd, #bpt-quickadd-cluster,
  .product__canvas, .bpt-canvas, #bpt-order, .main-content {
    overflow: visible !important;
  }

  #bpt-order, [id*="bpt-order"], .product__canvas, .bpt-canvas {
    scroll-margin-top: calc(var(--bpt-sticky-top) + 12px);
  }

  .page-width, .content-container, .main-content {
    box-sizing: border-box;
    padding-left: 12px !important;
    padding-right: 12px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .product__canvas, .bpt-canvas {
    min-height: 52vh;
  }
}
@media (min-width: 641px) and (max-width: 900px) {
  .bpt-products, .products, .product-list, .collection-list,
  #bpt-products, #ProductsList, .sidebar, [data-bpt="products"] {
    overflow-anchor: none !important;
  }
}

/* Unified gutters */
:root { --bpt-gutter: 12px; --bpt-max: 1200px; }
@media (max-width: 640px) {
  header .page-width, header .content-container, header .header__wrapper, header .header__inner,
  #MainContent, .main-content, .page-width, .content-container, .shopify-section,
  footer .page-width, footer .content-container, footer .footer__content-top,
  footer .footer__blocks, footer .footer__content-bottom {
    box-sizing: border-box !important;
    padding-left: var(--bpt-gutter) !important;
    padding-right: var(--bpt-gutter) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: var(--bpt-max) !important;
  }

  #bpt-quickadd, #bpt-quickadd-cluster,
  .product__canvas, .bpt-canvas, #bpt-order, .bpt-order, .order-table-section {
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .bpt-products, .products, .product-list, .collection-list, .sidebar, #bpt-products, #ProductsList {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #bpt-quickadd, #bpt-quickadd-cluster {
    left: auto; right: auto;
  }

  html, body { scroll-padding-top: calc(var(--bpt-sticky-top, 72px) + 12px); }
  #bpt-order, [id*="bpt-order"], .product__canvas, .bpt-canvas { scroll-margin-top: calc(var(--bpt-sticky-top, 72px) + 12px); }
}

/* Bulk selector card beautification */
#bpt-order, .bpt-order, .order-table-section {
  --bpt-blue: #1b29b4;
  --bpt-blue-hover: #18249f;
  --bpt-blue-active: #141f8a;
  --bpt-blue-ring: rgba(27,41,180,.25);
  --bpt-card-bg: #fff;
  --bpt-card-br: 14px;
  --bpt-border: 1px solid rgba(0,0,0,.08);
  --bpt-shadow: 0 1px 3px rgba(0,0,0,.05);
  background: var(--bpt-card-bg);
  border: var(--bpt-border);
  border-radius: var(--bpt-card-br);
  box-shadow: var(--bpt-shadow);
  padding: 16px;
}

#bpt-order h1, #bpt-order h2, #bpt-order h3,
.bpt-order h1, .bpt-order h2, .bpt-order h3 {
  margin-top: 4px; margin-bottom: 10px;
}
#bpt-order .section-title, .bpt-order .section-title { font-weight: 700; }

#bpt-order input, #bpt-order select, #bpt-order textarea,
.bpt-order input, .bpt-order select, .bpt-order textarea {
  height: 44px;
  padding: 8px 12px;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 10px;
  background: #fff;
  font-size: 16px; line-height: 1.3;
}
#bpt-order textarea, .bpt-order textarea { min-height: 88px; height: auto; }

#bpt-order input:focus-visible, #bpt-order select:focus-visible, #bpt-order textarea:focus-visible,
.bpt-order input:focus-visible, .bpt-order select:focus-visible, .bpt-order textarea:focus-visible {
  outline: 3px solid var(--bpt-blue-ring); outline-offset: 2px;
  border-color: var(--bpt-blue);
}

#bpt-order .form-row, .bpt-order .form-row { margin-bottom: 10px; }
#bpt-order .form-row > label, .bpt-order .form-row > label { margin-bottom: 6px; display: block; }

#bpt-order .button--primary, #bpt-order button[type="submit"],
.bpt-order .button--primary, .bpt-order button[type="submit"] {
  height: 44px; padding: 0 16px;
  border-radius: 10px; font-weight: 700; letter-spacing: .2px;
  background: var(--bpt-blue); color: #fff; border: 1px solid var(--bpt-blue);
  transition: filter .2s ease, transform .08s ease, box-shadow .2s ease;
  box-shadow: 0 1px 1px rgba(0,0,0,.04);
}
#bpt-order .button--primary:hover, #bpt-order button[type="submit"]:hover,
.bpt-order .button--primary:hover, .bpt-order button[type="submit"]:hover {
  background: var(--bpt-blue-hover); border-color: var(--bpt-blue-hover);
}
#bpt-order .button--primary:active, #bpt-order button[type="submit"]:active,
.bpt-order .button--primary:active, .bpt-order button[type="submit"]:active {
  transform: translateY(.5px) scale(.995);
  background: var(--bpt-blue-active); border-color: var(--bpt-blue-active);
}
#bpt-order .button--secondary, #bpt-order .button--outline, #bpt-order .btn-outline,
.bpt-order .button--secondary, .bpt-order .button--outline, .bpt-order .btn-outline {
  height: 44px; padding: 0 14px;
  border-radius: 10px; font-weight: 700;
  background: #fff; color: var(--bpt-blue);
  border: 2px solid var(--bpt-blue);
}
#bpt-order .button--secondary:hover, #bpt-order .button--outline:hover, #bpt-order .btn-outline:hover,
.bpt-order .button--secondary:hover, .bpt-order .button--outline:hover, .bpt-order .btn-outline:hover {
  color: var(--bpt-blue-hover); border-color: var(--bpt-blue-hover);
}

#bpt-order table, .bpt-order table, .order-table-section table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  table-layout: auto;
}
#bpt-order thead th, .bpt-order thead th, .order-table-section thead th {
  text-align: left; font-weight: 700; padding: 10px 8px; background: #f8f9ff;
  border-bottom: 1px solid rgba(0,0,0,.08);
}
#bpt-order tbody td, .bpt-order tbody td, .order-table-section tbody td {
  padding: 10px 8px; border-bottom: 1px solid rgba(0,0,0,.06);
}
#bpt-order tbody tr:nth-child(odd) td,
.bpt-order tbody tr:nth-child(odd) td,
.order-table-section tbody tr:nth-child(odd) td {
  background: #fcfcff;
}

#bpt-order td select, #bpt-order td input,
.bpt-order td select, .bpt-order td input {
  height: 44px; min-width: 72px;
  border-radius: 10px; font-size: 16px;
}

#bpt-order .note, .bpt-order .note { color: rgba(0,0,0,.6); font-size: 13px; }

#bpt-order button[type="submit"],
.bpt-order button[type="submit"],
.order-table-section button[type="submit"],
#bpt-order .button--primary,
.bpt-order .button--primary,
.order-table-section .button--primary {
  background: #1b29b4 !important;
  border: 1px solid #1b29b4 !important;
  color: #fff !important;
  height: 44px;
  border-radius: 10px;
  font-weight: 700;
  letter-spacing: .2px;
  transition: filter .2s ease, transform .08s ease;
  box-shadow: 0 1px 1px rgba(0,0,0,.04);
}
#bpt-order button[type="submit"]:hover,
.bpt-order button[type="submit"]:hover,
.order-table-section button[type="submit"]:hover,
#bpt-order .button--primary:hover,
.bpt-order .button--primary:hover,
.order-table-section .button--primary:hover {
  filter: brightness(1.03);
}
#bpt-order button[type="submit"]:active,
.bpt-order button[type="submit"]:active,
.order-table-section button[type="submit"]:active,
#bpt-order .button--primary:active,
.bpt-order .button--primary:active,
.order-table-section .button--primary:active {
  transform: translateY(.5px) scale(.995);
}
#bpt-order button[type="submit"]:focus-visible,
.bpt-order button[type="submit"]:focus-visible,
.order-table-section button[type="submit"]:focus-visible,
#bpt-order .button--primary:focus-visible,
.bpt-order .button--primary:focus-visible,
.order-table-section .button--primary:focus-visible {
  outline: 3px solid rgba(27,41,180,.25) !important;
  outline-offset: 2px !important;
}

/* "Add Selected to Cart" button */
#bpt-order #bpt-add-selected,
.bpt-order #bpt-add-selected,
.order-table-section #bpt-add-selected,
button#bpt-add-selected.cta {
  background: #1b29b4 !important;
  background-color: #1b29b4 !important;
  color: #fff !important;
  border: 1px solid #1b29b4 !important;
  height: 44px;
  border-radius: 10px;
  font-weight: 700;
  letter-spacing: .2px;
  padding: 0 16px;
  -webkit-appearance: none;
  appearance: none;
  transition: filter .2s ease, transform .08s ease, box-shadow .2s ease;
  box-shadow: 0 1px 1px rgba(0,0,0,.04);
}
#bpt-order #bpt-add-selected:hover,
.bpt-order #bpt-add-selected:hover,
.order-table-section #bpt-add-selected:hover,
button#bpt-add-selected.cta:hover { filter: brightness(1.03); }
#bpt-order #bpt-add-selected:active,
.bpt-order #bpt-add-selected:active,
.order-table-section #bpt-add-selected:active,
button#bpt-add-selected.cta:active { transform: translateY(.5px) scale(.995); }
#bpt-order #bpt-add-selected:focus-visible,
.bpt-order #bpt-add-selected:focus-visible,
.order-table-section #bpt-add-selected:focus-visible,
button#bpt-add-selected.cta:focus-visible {
  outline: 3px solid rgba(27,41,180,.25) !important;
  outline-offset: 2px !important;
}

/* Bulk Qty selector */
.bpt-bulk-qty-select {
  height: 44px;
  min-width: 88px;
  padding: 8px 12px;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 10px;
  background: #fff;
  font-size: 16px; line-height: 1.3;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  appearance: auto;
  margin-right: 8px;
}
.bpt-qty-hidden {
  position: absolute !important;
  width: 1px !important; height: 1px !important;
  margin: -1px !important; padding: 0 !important; border: 0 !important;
  clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; overflow: hidden !important;
}
#bpt-order input[type="number"]:not(.bpt-qty-hidden),
.bpt-order input[type="number"]:not(.bpt-qty-hidden),
.order-table-section input[type="number"]:not(.bpt-qty-hidden) {
  height: 44px;
  padding: 8px 12px;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 10px;
  background: #fff;
  font-size: 16px; line-height: 1.2;
  -webkit-appearance: auto; appearance: auto;
}
.bpt-bulk-qty-wrap { display: inline-block; margin-right: 8px; }

/* Bulk card totals */
#bpt-order, .bpt-order, .order-table-section {
  --bpt-blue: #1b29b4;
  --bpt-blue-10: rgba(27,41,180,.10);
  --bpt-blue-25: rgba(27,41,180,.25);
  --bpt-green: #148f4a;
  --bpt-green-10: rgba(20,143,74,.10);
  --bpt-border: 1px solid rgba(0,0,0,.08);
}
.bpt-totals {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px 12px;
  padding-top: 12px;
  margin-top: 12px;
  border-top: var(--bpt-border);
}
.bpt-totals .bpt-label {
  font-size: 14px;
  color: rgba(0,0,0,.7);
}
.bpt-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 110px;
  height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  white-space: nowrap;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  color: #111;
}
.bpt-pill--subtotal {
  border-color: var(--bpt-blue-25);
  background: var(--bpt-blue-10);
  color: var(--bpt-blue);
}
.bpt-pill--discount {
  border-color: var(--bpt-green);
  background: var(--bpt-green-10);
  color: var(--bpt-green);
}
.bpt-pill--total {
  height: 44px;
  font-size: 18px;
  background: var(--bpt-blue);
  color: #fff;
  border-color: var(--bpt-blue);
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}
.bpt-total-row, .bpt-subtotal-row, .bpt-discount-row { display: contents; }
@media (max-width:640px){
  .bpt-totals { grid-template-columns: 1fr; }
  .bpt-totals .bpt-value { justify-self: start; }
}

/* Badges as pills */
:root { --bpt-blue:#1b29b4; --bpt-blue-10:rgba(27,41,180,.10); --bpt-blue-25:rgba(27,41,180,.25); --bpt-green:#148f4a; --bpt-green-10:rgba(20,143,74,.10); }
#bpt-order .badge, .bpt-order .badge, .order-table-section .badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
#bpt-order .badge:has(#bpt-sub),
.bpt-order .badge:has(#bpt-sub),
.order-table-section .badge:has(#bpt-sub){
  border-color: var(--bpt-blue-25);
  background: var(--bpt-blue-10);
  color: var(--bpt-blue);
}
#bpt-order .badge:has(#bpt-disc),
.bpt-order .badge:has(#bpt-disc),
.order-table-section .badge:has(#bpt-disc){
  border-color: var(--bpt-green);
  background: var(--bpt-green-10);
  color: var(--bpt-green);
}
#bpt-order .badge:has(#bpt-total),
.bpt-order .badge:has(#bpt-total),
.order-table-section .badge:has(#bpt-total){
  height: 44px;
  padding: 0 14px;
  background: var(--bpt-blue);
  color: #fff;
  border-color: var(--bpt-blue);
}
#bpt-sub, #bpt-disc, #bpt-total { font-weight: 700; }
#bpt-order .badge.bpt-badge-sub,   .bpt-order .badge.bpt-badge-sub,   .order-table-section .badge.bpt-badge-sub   { border-color: var(--bpt-blue-25); background: var(--bpt-blue-10); color: var(--bpt-blue); }
#bpt-order .badge.bpt-badge-disc,  .bpt-order .badge.bpt-badge-disc,  .order-table-section .badge.bpt-badge-disc  { border-color: var(--bpt-green);  background: var(--bpt-green-10);  color: var(--bpt-green); }
#bpt-order .badge.bpt-badge-total, .bpt-order .badge.bpt-badge-total, .order-table-section .badge.bpt-badge-total { height: 44px; padding: 0 14px; background: var(--bpt-blue); color: #fff; border-color: var(--bpt-blue); }

/* Busy/feedback + toast */
#bpt-add-selected.is-busy {
  position: relative;
  pointer-events: none;
  filter: brightness(0.98);
}
#bpt-add-selected.is-busy::after {
  content: "";
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  width: 16px; height: 16px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.7);
  border-top-color: transparent;
  animation: bpt-spin .7s linear infinite;
}
@keyframes bpt-spin { to { transform: translateY(-50%) rotate(360deg); } }
#bpt-add-selected.bpt-wiggle { animation: bpt-wiggle .18s ease-in-out 0s 2; }
@keyframes bpt-wiggle {
  0%,100% { transform: translateX(0); }
  25% { transform: translateX(-3px); }
  75% { transform: translateX(3px); }
}
.bpt-toast {
  position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%);
  z-index: 99999;
  background: #111; color: #fff; border-radius: 12px;
  padding: 10px 14px; font-weight: 600; font-size: 14px; line-height: 1.2;
  box-shadow: 0 8px 22px rgba(0,0,0,.22);
  opacity: 0; pointer-events: none; transition: opacity .2s ease, transform .2s ease;
}
.bpt-toast.bpt-show { opacity: 1; transform: translateX(-50%) translateY(-4px); }
.bpt-toast .bpt-dot { display:inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; background: #1b29b4; }
#bpt-add-selected.bpt-busy { filter: brightness(.98); cursor: progress; }

/* P0 polish — page-scoped, non-destructive */
.product__canvas, .bpt-canvas, #bpt-canvas, .product__media {
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.06) !important;
}
#bpt-quickadd select:focus-visible,
#bpt-quickadd input:focus-visible,
#bpt-quickadd button:focus-visible,
#bpt-quickadd-cluster select:focus-visible,
#bpt-quickadd-cluster input:focus-visible,
#bpt-quickadd-cluster button:focus-visible,
#bpt-bulkjump:focus-visible,
#bpt-add-selected:focus-visible,
#bpt-order input:focus-visible,
#bpt-order select:focus-visible,
#bpt-order textarea:focus-visible {
  outline: 3px solid rgba(27,41,180,.25) !important;
  outline-offset: 2px !important;
}
@media (hover:hover) {
  .products .card, .bpt-products .card, .product-list .card, .products a {
    transition: transform .12s ease, box-shadow .2s ease;
  }
  .products .card:hover, .bpt-products .card:hover, .product-list .card:hover, .products a:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(0,0,0,.08);
  }
}

/* P0 bundle */
:root { --bpt-blue:#1b29b4; --bpt-ring:rgba(27,41,180,.25); }
.bpt-steps {
  display:flex; gap:12px; align-items:center; flex-wrap:wrap;
  background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:14px;
  box-shadow:0 6px 18px rgba(0,0,0,.06); padding:10px 12px; margin:10px 0 12px;
}
.bpt-step { display:flex; align-items:center; gap:8px; font-weight:700; }
.bpt-step .dot { width:22px; height:22px; border-radius:999px; background:var(--bpt-blue);
  color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:12px; }

#bpt-price { position:relative; }
#bpt-price + .bpt-price-tip { margin-left:8px; cursor:help; font-weight:700; color:var(--bpt-blue); }
.bpt-tip {
  position:absolute; z-index:50; background:#111; color:#fff; font-size:12px; line-height:1.3;
  padding:8px 10px; border-radius:8px; box-shadow:0 8px 22px rgba(0,0,0,.22);
  opacity:0; transform:translateY(6px); pointer-events:none; transition:.18s ease;
  max-width:220px;
}
.bpt-tip.show { opacity:1; transform:translateY(0); }

.bpt-share {
  border:1px solid var(--bpt-blue); color:var(--bpt-blue); background:#fff;
  border-radius:10px; padding:8px 12px; font-weight:700;
}
.bpt-share:focus-visible { outline:3px solid var(--bpt-ring); outline-offset:2px; }
.bpt-share:active { transform:translateY(.5px) scale(.995); }

.bpt-toast {
  position:fixed; left:50%; bottom:20px; transform:translateX(-50%); z-index:99999;
  background:#111; color:#fff; border-radius:12px; padding:10px 14px; font-weight:600; font-size:14px;
  box-shadow:0 8px 22px rgba(0,0,0,.22); opacity:0; pointer-events:none; transition:.2s;
}
.bpt-toast.show { opacity:1; transform:translateX(-50%) translateY(-4px); }
.bpt-wiggle { animation:bpt-wiggle .18s ease-in-out 0s 2; }
@keyframes bpt-wiggle {0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}

#bpt-quick-inline { display: none !important; }

/* Steps bar non-sticky */
#bpt-steps-sticky { position: static !important; top: auto !important; box-shadow: none; }
#bpt-steps-sticky .num:focus-visible,
#bpt-steps-sticky .label:focus-visible,
#bpt-quickadd-cluster button:focus-visible,
#bpt-quickadd-cluster select:focus-visible,
#bpt-quickadd-cluster input[type="number"]:focus-visible,
#bpt-order .badge:focus-visible,
button:focus-visible,
a[role="button"]:focus-visible {
  outline: 3px solid #1b29b4;
  outline-offset: 2px;
  border-radius: 10px;
}
#bpt-steps-sticky .num:hover { box-shadow: 0 0 0 5px rgba(27,41,180,.16); }
#bpt-steps-sticky .label { color:#1b29b4; font-weight:800; }
#bpt-steps-sticky .divider { opacity:.55; }

#bpt-price, .bpt-price, #bpt-qa-price { color:#1b29b4; font-weight:800; font-size:1.05rem; }

#bpt-order .badge { border-radius: 999px; padding: 6px 10px; font-weight:700; }

.bpt-swatch-row {
  position: relative;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.bpt-swatch-row::after {
  content:"";
  position:absolute;
  right:0; top:0; bottom:0;
  width:28px;
  pointer-events:none;
  background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.85));
}

/* ===== BPT TOOLBAR — CANONICAL (docked left) ===== */
#bpt-theme-v10-11 .bpt-card.bpt-rightish{
  display: flex !important;
  flex-direction: column !important;
}
#bpt-theme-v10-11 .bpt-canvas-wrap{ position: relative !important; }
#bpt-theme-v10-11 .bpt-canvas-wrap.bpt-rail-on{
  padding-left: calc(var(--rail-pad-left)) !important;
}
#bpt-theme-v10-11 .bpt-toolbar{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  justify-content: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
#bpt-theme-v10-11 .bpt-toolbar.bpt-docked-left{
  position: absolute !important;
  left: 12px !important;
  top: 0 !important;
  transform: none !important;
  width: var(--rail-width) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
#bpt-theme-v10-11 .bpt-toolbar.bpt-docked-left .bpt-btn{
  padding: 10px 12px !important;
  min-width: 160px !important;
  border: 1px solid #ddd !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.04) !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
}
#bpt-theme-v10-11 .bpt-toolbar.bpt-docked-left .bpt-ico,
#bpt-theme-v10-11 .bpt-toolbar.bpt-docked-left .bpt-ico svg{
  width: 18px !important; height: 18px !important;
}

/* Mobile: stack under the canvas (no docking) */
@media (max-width: 1024px){
  #bpt-theme-v10-11 .bpt-toolbar.bpt-docked-left{
    position: static !important;
    width: auto !important;
  }
  #bpt-theme-v10-11 .bpt-canvas-wrap.bpt-rail-on{
    padding-left: 12px !important;
  }
}
/* =================== END BPT TOOLBAR — CANONICAL (docked left) =================== */

/* Desktop-only vertical nudge for the docked toolbar */
@media (min-width: 1025px){
  #bpt-theme-v10-11 .bpt-toolbar.bpt-docked-left{
    margin-top: 200px !important;  /* tweak to visually align with mockup */
  }
}

/* ================= FRIENDLY TOOLBAR BUTTONS (cosmetic) ================= */
@media (min-width: 1025px){
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn{
    border-radius: 14px !important;
    background: linear-gradient(#ffffff, #fafbff) !important;
    border-color: #E5E7EB !important;
    box-shadow: 0 1px 0 rgba(0,0,0,.04) !important;
    transition: transform .08s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease !important;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn .bpt-ico{
    display:inline-flex; align-items:center; justify-content:center;
    width: 20px !important; height: 20px !important;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn .bpt-ico svg{
    width: 18px !important; height: 18px !important;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn:hover{
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(15, 23, 42, .10) !important;
    border-color: #d7dbe4 !important;
    background: linear-gradient(#ffffff, #f4f7ff) !important;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn:active{
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(15, 23, 42, .10) !important;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn:focus-visible{
    outline: 3px solid var(--bpt-ring, rgba(27,41,180,.25)) !important;
    outline-offset: 2px;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn--danger{
    border-color: #f2c2bd !important;
    background: linear-gradient(#fffafa, #fff5f4) !important;
    color: #b42318 !important;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn--danger:hover{
    border-color: #ef9f96 !important;
    box-shadow: 0 6px 18px rgba(180,35,24,.14) !important;
    background: linear-gradient(#fff7f6, #ffeceb) !important;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-color{
    border-radius: 12px !important;
    border: 1px solid #E5E7EB !important;
    background: linear-gradient(#ffffff, #fafbff) !important;
    padding: 8px 10px !important;
    transition: box-shadow .18s ease, border-color .18s ease !important;
  }
  #bpt-theme-v10-11 .bpt-toolbar .bpt-color:hover{
    border-color: #d7dbe4 !important;
    box-shadow: 0 6px 18px rgba(15,23,42,.08) !important;
  }
  #bpt-theme-v10-11 .bpt-pill{
    border-radius: 999px !important;
    border: 1px solid #E5E7EB !important;
    background: #fff !important;
    transition: box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
  }
  #bpt-theme-v10-11 .bpt-pill[aria-pressed="true"]{
    background: var(--bpt-accent, #2563eb) !important;
    color: #fff !important;
    border-color: var(--bpt-accent, #2563eb) !important;
    box-shadow: 0 6px 16px rgba(37,99,235,.20) !important;
  }
}
/* Mobile keeps things simple and flat */
@media (max-width: 1024px){
  #bpt-theme-v10-11 .bpt-toolbar .bpt-btn,
  #bpt-theme-v10-11 .bpt-toolbar .bpt-color{
    border-radius: 12px !important;
    box-shadow: none !important;
    background: #fff !important;
  }
}

/* ===== Bulk Order Matrix QoL ===== */
#bpt-theme-v10-11 .bpt-matrix td.has-qty{ background:#f7fbff !important; }
#bpt-theme-v10-11 .bpt-matrix input[type="number"]{
  transition: box-shadow .15s ease, border-color .15s ease;
}
#bpt-theme-v10-11 .bpt-matrix input[type="number"]:focus{
  box-shadow:0 0 0 3px rgba(37,99,235,.20);
  outline:0; border-color:#c7d2fe; border-radius:8px;
}

/* ==== Front/Back pills row above swatches ==== */
#bpt-theme-v10-11 .bpt-top{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-bottom:8px; position:relative; z-index:2;
}
#bpt-theme-v10-11 .bpt-top .bpt-side{
  display:flex; gap:8px; flex-wrap:wrap;
}
@media (min-width:1025px){
  #bpt-theme-v10-11 .bpt-pill{
    padding:6px 12px !important;
    font-size:14px !important;
    line-height:1.2 !important;
    border:1px solid #E5E7EB !important;
    border-radius:999px !important;
    background:#fff !important;
  }
  #bpt-theme-v10-11 .bpt-pill[aria-pressed="true"]{
    background: var(--bpt-accent, #2563eb) !important;
    color:#fff !important;
    border-color: var(--bpt-accent, #2563eb) !important;
    box-shadow:0 6px 16px rgba(37,99,235,.20) !important;
  }
}
@media (max-width:1024px){
  #bpt-theme-v10-11 .bpt-top .bpt-side{ gap:6px; }
  #bpt-theme-v10-11 .bpt-pill{ padding:6px 10px !important; font-size:14px !important; }
}
#bpt-theme-v10-11 #bpt-swatches{ margin-top:6px; }

/* ===== MOBILE FIXES: force clean stacking and kill stray floats ===== */
@media (max-width: 1024px){
  /* Neutralize any grid leftovers on common wrappers */
  #bpt-root,
  #bpt-theme-v10-11 .bpt-wrap {
    display: block !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
  }

  /* Each card becomes a full-width block in order */
  #bpt-theme-v10-11 .bpt-left,
  #bpt-theme-v10-11 .bpt-rightish,
  #bpt-theme-v10-11 .bpt-order {
    display: block !important;
    float: none !important;
    position: static !important;
    grid-column: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 16px !important;
    z-index: auto !important;
  }

  /* Explicit order: Products → Editor → Bulk */
  #bpt-theme-v10-11 .bpt-left { order: 1 !important; }
  #bpt-theme-v10-11 .bpt-rightish { order: 2 !important; }
  #bpt-theme-v10-11 .bpt-order { order: 3 !important; }

  /* Prevent inner sticky/absolute UI from overlapping */
  #bpt-theme-v10-11 .bpt-rightish .bpt-top,
  #bpt-theme-v10-11 .bpt-toolbar {
    position: static !important;
  }

  /* Ensure product list inside the left card is visible */
  #bpt-root .bpt-left .bpt-grid {
    flex: initial !important;
    min-height: auto !important;
    overflow: visible !important;
  }
}

/* Hide the steps bar on small screens */
@media (max-width: 768px){
  #bpt-steps-sticky { display: none !important; }
}
/* HARD MOBILE STACK + Z-ORDER SAFETY NET */
@media (max-width: 1024px){
  /* Make wrapper its own stacking context so local z-index wins */
  #bpt-theme-v10-11 .bpt-wrap,
  #bpt-root { isolation: isolate !important; }

  /* Products card sits above others */
  #bpt-theme-v10-11 .bpt-left,
  #bpt-root .bpt-left,
  aside.bpt-card.bpt-left {
    position: relative !important;
    z-index: 3 !important;
  }

  /* Canvas + order below products, but above page */
  #bpt-theme-v10-11 .bpt-rightish,
  #bpt-root .bpt-rightish,
  #bpt-theme-v10-11 .bpt-order,
  #bpt-root .bpt-order {
    position: relative !important;
    z-index: 2 !important;
  }

  /* Kill transforms/absolutes that create rogue stacking contexts */
  #bpt-theme-v10-11 .bpt-toolbar,
  #bpt-theme-v10-11 .bpt-rightish,
  #bpt-theme-v10-11 .bpt-canvas-wrap {
    transform: none !important;
    position: static !important; /* toolbar already handled for mobile */
  }

  /* Ensure nothing clips the products card */
  #bpt-theme-v10-11 .bpt-canvas-wrap,
  #bpt-theme-v10-11 .bpt-rightish,
  #bpt-theme-v10-11 .bpt-left {
    overflow: visible !important;
  }
}
/* === BPT — EMERGENCY MOBILE RESET (paste LAST) ========================= */
@media (max-width:1024px){

  /* 1) Create a local stacking context so our z-index rules actually stick */
  #bpt-root,
  #bpt-theme-v10-11 .bpt-wrap{
    isolation: isolate !important;
  }

  /* 2) Hard reset layout to single column blocks */
  #bpt-root,
  #bpt-theme-v10-11 .bpt-wrap{
    display:block !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
  }

  /* 3) Kill any positioning/transform that creates rogue stacking contexts */
  #bpt-theme-v10-11 .bpt-rightish,
  #bpt-theme-v10-11 .bpt-canvas-wrap,
  #bpt-theme-v10-11 .bpt-toolbar{
    position: static !important;
    transform: none !important;
    top: auto !important; left: auto !important; right: auto !important;
  }
  /* If a sticky sneaked in anywhere, neutralize it on mobile */
  #bpt-theme-v10-11 .bpt-rightish *,
  #bpt-theme-v10-11 .bpt-left *,
  #bpt-theme-v10-11 .bpt-order *{
    position: sticky; /* selector bait */
  }
  #bpt-theme-v10-11 .bpt-rightish *[style*="position: sticky"],
  #bpt-theme-v10-11 .bpt-left *[style*="position: sticky"],
  #bpt-theme-v10-11 .bpt-order *[style*="position: sticky"]{
    position: static !important;
  }

  /* 4) Make each card full-width blocks in the intended order */
  #bpt-theme-v10-11 .bpt-left,
  #bpt-theme-v10-11 .bpt-rightish,
  #bpt-theme-v10-11 .bpt-order{
    display:block !important;
    float:none !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 0 16px 0 !important;
    min-width:0 !important;
    overflow:visible !important;
  }
  /* Order: Products → Editor/Canvas → Bulk */
  #bpt-theme-v10-11 .bpt-left    { order:1 !important; }
  #bpt-theme-v10-11 .bpt-rightish{ order:2 !important; }
  #bpt-theme-v10-11 .bpt-order   { order:3 !important; }

  /* 5) Z-index safety net so Products sits above siblings */
  #bpt-theme-v10-11 .bpt-left    { position:relative !important; z-index:3 !important; }
  #bpt-theme-v10-11 .bpt-rightish{ position:relative !important; z-index:2 !important; }
  #bpt-theme-v10-11 .bpt-order   { position:relative !important; z-index:1 !important; }

  /* 6) Remove canvas left-rail padding on mobile (prevents hidden content) */
  #bpt-theme-v10-11 .bpt-canvas-wrap{ padding-left: 0 !important; }

  /* 7) Ensure the product grid/list actually renders above its card bg */
  #bpt-root .bpt-left .bpt-grid{
    position:relative !important;
    z-index:4 !important;
    overflow:visible !important;   /* let dropdowns/tooltips escape */
  }

  /* 8) Toolbar: no docking on mobile */
  #bpt-theme-v10-11 .bpt-toolbar{
    flex-wrap:wrap !important;
    width:auto !important;
  }

  /* 9) Stop any ancestor from clipping or masking the products card */
  .bpt-card,
  .product__canvas, .bpt-canvas, #bpt-canvas,
  .main-content, .page-width, .content-container{
    overflow:visible !important;
  }
}
/* ====================================================================== */
@media (max-width:1024px){
  /* Lift the entire customizer above sticky theme chrome without affecting desktop */
  #bpt-theme-v10-11,
  #bpt-root{ position:relative !important; z-index: 2147483000 !important; }
}
/* === FINAL mobile paint-order guard (kept minimal) === */
@media (max-width: 900px){
  /* never let the order CTA float on top of other cards */
  #bpt-order .cta{ position: static !important; z-index: auto !important; }

  /* cards are plain blocks, no stacking contexts */
  #bpt-theme-v10-11 .bpt-card,
  #bpt-theme-v10-11 .bpt-left,
  #bpt-theme-v10-11 .bpt-rightish,
  #bpt-theme-v10-11 .bpt-order{
    position: static !important;
    transform: none !important;
    z-index: auto !important;
  }

  /* toolbars never sticky on mobile */
  #bpt-theme-v10-11 .bpt-top,
  #bpt-theme-v10-11 .bpt-toolbar{
    position: static !important;
  }
}
/* === MOBILE REPAIR: single source of truth (iOS-safe) === */
@media (max-width: 900px){
  /* Make the wrapper a simple vertical stack */
  #bpt-theme-v10-11 #bpt-root,
  #bpt-theme-v10-11 .bpt-wrap{
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
  }

  /* Neutralize any floats/positions/transforms that create new stacking contexts */
  #bpt-theme-v10-11 .bpt-card,
  #bpt-theme-v10-11 .bpt-left,
  #bpt-theme-v10-11 .bpt-rightish,
  #bpt-theme-v10-11 .bpt-order{
    float: none !important;
    clear: both !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 16px !important;
    z-index: auto !important;
    overflow: visible !important;
  }

  /* Force the visual order we want: Products → Canvas → Order */
  #bpt-theme-v10-11 .bpt-left{ order: 1 !important; position: relative !important; z-index: 3 !important; }
  #bpt-theme-v10-11 .bpt-rightish{ order: 2 !important; position: relative !important; z-index: 2 !important; }
  #bpt-theme-v10-11 .bpt-order{ order: 3 !important; position: relative !important; z-index: 1 !important; }

  /* Kill “sticky” or fixed-ish bits that float over other cards on iOS */
  #bpt-theme-v10-11 .bpt-top,
  #bpt-theme-v10-11 .bpt-toolbar,
  #bpt-theme-v10-11 [style*="position: sticky"]{
    position: static !important;
    top: auto !important;
  }

  /* Canvas & order internals shouldn’t clip children on iOS */
  #bpt-theme-v10-11 .bpt-canvas-wrap{ overflow: visible !important; }
}
/* Drop into bpt-customizer.css near the bottom */
@media (max-width: 900px){
  #bpt-theme-v10-11 .bpt-card{
    position: relative !important;
    isolation: isolate !important;   /* prevents children from jumping over siblings */
    z-index: auto !important;
    background: #fff !important;
  }
}

