/* Keep cart controls inside their cards at every sidebar width. */
body[data-cart-page] .cart-summary{min-width:0;container-type:inline-size}
body[data-cart-page] .cart-experience-head{grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
body[data-cart-page] .cart-experience-step{grid-template-columns:32px minmax(0,1fr)!important;align-items:start!important;min-width:0!important;min-height:0!important;padding:12px!important;gap:10px!important;box-sizing:border-box}
body[data-cart-page] .cart-experience-step>div{min-width:0;max-width:100%}
body[data-cart-page] .cart-experience-step b,body[data-cart-page] .cart-experience-step small{max-width:100%;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important}
body[data-cart-page] .cart-summary strong,body[data-cart-page] .cart-order-meta>div{min-width:0;max-width:100%;overflow-wrap:anywhere}
body[data-cart-page] .cart-bonus-head{flex-wrap:wrap;align-items:center;min-width:0}
body[data-cart-page] .cart-bonus-head>div{flex:1 1 110px;min-width:0;max-width:100%}
body[data-cart-page] #cart_bonus_toggle{flex:1 1 140px;min-width:0!important;max-width:100%!important;height:auto!important;min-height:40px;white-space:normal!important;overflow-wrap:anywhere!important;padding:10px 12px!important;line-height:1.4!important;box-sizing:border-box}
body[data-cart-page] .cart-summary-actions{min-width:0;grid-template-columns:minmax(0,1fr)}
body[data-cart-page] .cart-summary-actions>a,body[data-cart-page] .cart-summary-actions>button{width:100%!important;min-width:0!important;max-width:100%!important;height:auto!important;min-height:46px;white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.45!important;text-align:center;box-sizing:border-box}
@container(min-width:360px){body[data-cart-page] .cart-experience-head{grid-template-columns:repeat(3,minmax(0,1fr))!important}body[data-cart-page] .cart-experience-step{grid-template-columns:minmax(0,1fr)!important;gap:8px!important}}

/* Give the independently scrolling device catalogue more desktop space. */
@media(min-width:1100px){
 body.store-site #catalog>.wrap,body.store-site.store-compact #store_compact_main #catalog>.wrap{width:calc(100% - 40px)!important;max-width:none!important;margin-inline:auto!important}
 body.store-site:has(#catalog .store-catalog-shell) #catalog .store-catalog-shell,body.store-site.store-compact #store_compact_main #catalog .store-catalog-shell{grid-template-columns:clamp(210px,17vw,240px) minmax(0,1fr)!important;gap:18px!important}
 body.store-site #catalog .catalog-panel,body.store-site.store-compact #store_compact_main #catalog .catalog-panel{width:100%!important;min-width:0!important;max-width:none!important;box-sizing:border-box}
 body.store-site #catalog .store-left-rail{min-width:0!important;width:100%!important}
}
body.store-site #catalog .catalog-panel{scrollbar-width:auto!important;scrollbar-color:#438dc4 #0a1a2e}
body.store-site #catalog .catalog-panel::-webkit-scrollbar{width:18px!important;height:18px!important}
body.store-site #catalog .catalog-panel::-webkit-scrollbar-track{background:#0a1a2e;border-radius:10px}
body.store-site #catalog .catalog-panel::-webkit-scrollbar-thumb{background:#438dc4;border:4px solid #0a1a2e;border-radius:10px;min-height:56px}
body.store-site #catalog .catalog-panel::-webkit-scrollbar-thumb:hover{background:#65b5ef}

/* 2026-10-15: denser product rows on wide desktop displays. */
@media (min-width: 1600px) {
  body.store-site #catalog .catalog-panel #grid,
  body.store-site.store-compact #store_compact_main #catalog .catalog-panel #grid,
  body.used-store-site #usedGrid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  body.store-site #catalog .catalog-panel #grid > .product {
    min-width: 0 !important;
  }
  body.store-site #catalog .catalog-panel #grid > .sc-card .body,
  body.used-store-site #usedGrid > .used-card .body {
    padding: 12px !important;
    gap: 6px !important;
  }
  body.store-site #catalog .catalog-panel #grid > .sc-card h3,
  body.used-store-site #usedGrid > .used-card h3 {
    font-size: 16px !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    overflow-wrap: anywhere;
  }
  body.store-site #catalog .catalog-panel #grid > .sc-card .price,
  body.used-store-site #usedGrid > .used-card .price {
    font-size: 18px !important;
    line-height: 1.35 !important;
  }
  body.store-site #catalog .catalog-panel #grid > .sc-card .sc-configure {
    display: block;
    padding: 8px 6px;
    border: 1px solid #306196;
    border-radius: 9px;
    background: #173c5f;
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    overflow-wrap: anywhere;
  }
  body.store-site #catalog .catalog-panel #grid > .sc-card .shop-card-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin-top: auto !important;
  }
  body.store-site #catalog .catalog-panel #grid > .sc-card .shop-card-actions > :is(a, button) {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 8px 5px !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
    text-align: center;
    white-space: normal !important;
  }
  body.used-store-site .used-catalog > .wrap {
    width: calc(100% - 40px) !important;
    max-width: none !important;
    margin-inline: auto !important;
  }
}
@media (min-width: 2200px) {
  body.store-site #catalog .catalog-panel #grid,
  body.store-site.store-compact #store_compact_main #catalog .catalog-panel #grid,
  body.used-store-site #usedGrid {
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
  }
}
