/* ═══════════════════════════════════════════════════════════════
   AnimeMasti — touch / phone behaviour. Loaded last in base.html.
   ═══════════════════════════════════════════════════════════════ */

/* Instant taps: no double-tap-zoom wait, a visible tap flash. */
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(229,9,20,.18);}
a,button,input,select,textarea,label,summary,[role="button"],[onclick],
.nc-cslide,.nc-dot,.nc-card,.hw-card,.nc-hex,.nc-product{touch-action:manipulation;}

/* The floating price/name chips sit on top of the hero card — let taps
   fall through to the card underneath. */
.nc-chip{pointer-events:none !important;}

@media (hover:none),(pointer:coarse){
  /* A tapped card would otherwise stay "lifted" (sticky :hover) and the
     layout jumps under the finger. Use a short press effect instead. */
  .nc-product:hover,.nc-series-tile:hover,.nc-pill:hover,.nc-trust-card:hover,
  .nc-univ:hover,.nc-hex:hover,.hw-card:hover,.lexi-product-card:hover,
  .nc-btn-primary:hover,.nc-btn-solid-cyan:hover,.hw-cta:hover,
  .nc-press-start:hover,.nc-np-enter:hover{transform:none !important;}
  .nc-series-tile:hover .nc-series-art,
  .lexi-product-card:hover .card-image img{transform:none !important;}
  .nc-product:active,.hw-card:active,.nc-hex:active,.lexi-product-card:active,
  .nc-pill:active,.nc-cslide.active:active,.nc-card:active,.am-chip:active,
  .btn-lexi-primary:active,.btn-lexi-ghost:active{transform:scale(.97) !important;transition:transform .08s !important;}

  /* Hot Wheels: a belt that keeps moving under your thumb is impossible to
     tap. On touch it becomes a strip you swipe yourself. */
  /* !important: neon-home.css is linked after this file on the home page */
  .hw-strip{overflow-x:auto !important;overflow-y:hidden !important;overscroll-behavior-x:contain;
            scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .hw-strip::-webkit-scrollbar{display:none;}
  .hw-track{animation:none !important;transform:none !important;padding:0 16px;}
  .hw-card[aria-hidden="true"]{display:none !important;}
  .hw-card{scroll-snap-align:start;}
  .hw-road{display:none !important;}
  .hw-card{scroll-snap-align:start;}

  /* Bigger targets */
  .nc-car-arrow{width:46px !important;height:46px !important;}
  .nc-dots{gap:10px !important;padding:8px 0 !important;}
  .nc-dot{width:18px !important;height:8px !important;}
}

/* ── Phone layout ───────────────────────────────────────────── */
@media (max-width:767px){
  /* Header: logo + search icon + menu button on one line */
  .am-mobile-actions{display:flex;align-items:center;gap:8px;}
  .am-mobile-search-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
    border-radius:10px;background:rgba(229,9,20,.07);border:1px solid rgba(229,9,20,.17);color:#f4f4f5;font-size:17px;}
  .navbar-toggler{min-width:44px;min-height:44px;}
  #mobileNav a{min-height:44px;display:flex !important;align-items:center;}

  /* Comfortable form fields — 16px stops iOS zooming into the input */
  input,select,textarea{font-size:16px !important;}
  .am-search input{font-size:16px !important;}

  /* Sort chips scroll sideways instead of stacking four rows deep */
  .am-sortbar{flex-wrap:nowrap;}
  .am-sortbar-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    margin-right:-16px;padding-right:16px;}
  .am-sortbar-chips::-webkit-scrollbar{display:none;}
  .am-chip{flex:0 0 auto;padding:9px 14px;}

  /* Search dropdown uses the full width and leaves room for the keyboard */
  .am-suggest{max-height:60vh;}
  .am-sg-row{padding:11px 14px;}
}