/* ==========================================================================
   Noamy Kids — mobile-fixes.css (LAST layer; the only one allowed !important)
   Every rule is numbered and justified.
   ========================================================================== */

/* 1. A hidden overlay must be unclickable: [hidden] beats any display rule (lessons § 26). */
[hidden]{display:none!important}

/* 1b. WC's variation JS slideDown()s .single_variation with an inline display:block; the theme shows
       price + stock itself (product.js), so this block stays hidden. */
.single_variation_wrap .single_variation{display:none!important}

/* 2. Admin bar: the front-end bar is fixed only ≤782px, then the sticky header moves with it. */
@media(max-width:782px){body.admin-bar .site-header{top:46px}}
@media(max-width:600px){body.admin-bar .site-header{top:0}}

/* 3. Shop filters become a drawer below 1000px (the concept hides them; the products must
      not be pushed below the fold, lessons § 69.6). */
@media(max-width:1000px){
  .shop-layout{grid-template-columns:minmax(0,1fr)}
  .filter-toggle{display:inline-flex}
  .filters{position:fixed!important;top:0;left:0;bottom:0;width:min(380px,90vw);height:100dvh;background:#fff;z-index:9001;transform:translateX(-105%);transition:transform .28s ease;display:flex;flex-direction:column;padding:0}
  .filters.is-open{transform:none}
  .filters__head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line)}
  .filters__form{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:20px}
  .filters__apply{display:block;position:sticky;bottom:0;background:#fff;padding:14px 0 4px}
  .filters-backdrop{position:fixed;inset:0;background:rgba(26,21,18,.4);z-index:9000}
}

/* 4. Grid/flex children must be allowed to shrink (no sideways scroll). */
.pdp > *,.shop-layout > *,.foot-grid > *,.look > *,.split > *,.contact-grid > *{min-width:0}
h1,h2,h3,h4{overflow-wrap:break-word}

/* 5. Cart, checkout, account stack on small screens. */
@media(max-width:960px){
  .woo-page--cart .woocommerce,.woo-page--checkout form.checkout,.woo-page--account .woocommerce{display:block!important}
  .cart-collaterals .cart_totals,.woo-page--checkout form.checkout > #order_review{position:static!important;margin-top:30px}
  .woo-page--checkout form.checkout > #order_review_heading{margin-top:30px}
  .woo-page--account .woocommerce-MyAccount-navigation{margin-bottom:24px}
}
@media(max-width:760px){
  .woocommerce-cart-form__contents thead{display:none}
  .woocommerce-cart-form__contents tr.cart_item{display:grid;grid-template-columns:80px minmax(0,1fr) auto;gap:6px 12px;padding:16px 0;border-bottom:1px solid var(--line-soft);position:relative}
  .woocommerce-cart-form__contents tr.cart_item td{display:block;padding:0!important;border:0!important}
  .woocommerce-cart-form__contents td.product-thumbnail{grid-row:1 / span 3}
  .woocommerce-cart-form__contents td.product-remove{position:absolute;top:16px;right:0}
  .woocommerce-cart-form__contents td.product-name{grid-column:2 / 4;padding-right:34px!important}
  .woocommerce-cart-form__contents td.product-price{display:none!important}
  .woocommerce-cart-form__contents td.product-quantity{grid-column:2}
  .woocommerce-cart-form__contents td.product-subtotal{grid-column:3;align-self:center;font-family:var(--font-head)}
  .woocommerce-cart-form__contents td::before{content:none!important}
  .woocommerce td.actions .coupon,.woocommerce td.actions > .button{float:none!important;width:100%}
  .woocommerce td.actions > .button{margin-top:10px}
  .woo-page--account #customer_login,.woocommerce-Addresses{grid-template-columns:1fr!important}
}

/* 6. Mobile rails: one and a half cards = the swipe affordance (lessons § 70). */
@media(max-width:767px){
  .rail{grid-auto-columns:min(calc((100vw - 2 * var(--pad) - 14px) / 1.5),300px)!important}
}

/* 7. Sticky buy bar must not cover the toast. */
@media(max-width:620px){body.single-product .nmk-toast{bottom:88px}}

/* 8. The WhatsApp button (Code Snippet "WhatsApp", inline style) must not cover the sticky buy bar. */
@media(max-width:620px){body.single-product .whatsapp-float-button{bottom:86px!important}}