/* ==================================================================
   Hipstoeren Headless — mobile-fixes.css (LAST layer, numbered)
   The only layer where !important is allowed; delete a rule once its cause is fixed.
================================================================== */

/* 1. Long tokens (e-mail addresses in the footer, product names) never push the page wider */
.ftr__grid>*,.card__body>div,.hsh-side-cart__info,.arch__chips{min-width:0}
.ftr a,.ftr p,.card__title,.contact-lines a{overflow-wrap:anywhere}

/* 2. Rails: start-aligned scroller, touch scroll in both axes */
@media(max-width:1023px){
  .rail{justify-content:flex-start;touch-action:pan-x pan-y;overflow-y:hidden;grid-auto-columns:min(calc((100vw - var(--gut) - 14px)/1.5),300px)}
}

/* 3. Small phones: archive tools wrap under the chips, sort takes the row */
@media(max-width:560px){
  .arch__tools{margin-left:0;width:100%;justify-content:space-between}
  .hsh-sort label{display:none}
  .atc__row{gap:7px}
  .sbar__a .btn{padding:12px 16px}
}

/* 4. Search overlay: input stays large enough to avoid iOS zoom */
@media(max-width:700px){
  .search-overlay__panel{padding:16px 0}
  .hsh-search .inp input{font-size:16px}
}

/* 5. Sticky buy bar respects the home indicator */
.sbar{padding-bottom:env(safe-area-inset-bottom)}

/* 6. Checkout: two-up fields collapse on phones */
@media(max-width:560px){
  .hsh-woowrap .woocommerce form .form-row-first,.hsh-woowrap .woocommerce form .form-row-last{width:100%;float:none}
  .hsh-woowrap .woocommerce table.cart td.actions .coupon{flex-wrap:wrap}
  .hsh-woowrap .woocommerce table.cart td.actions .coupon .input-text{width:100%}
}