/* ============================================================================
   Partscan — browse / manuaali mobiilioptimoinnit (paint-perf + responsiivisuus)
   Override-kerros: ladataan VIIMEISENÄ (voittaa aiemmat). Mobile-first.

   Tausta: jank ei tule JS:stä (rAF + passive, ei layout-thrashia) vaan per-frame
   blurista. Paneelit ovat jo ~98% opaakkeja → backdrop-filter-blur on käytännössä
   koriste → sen poisto mobiilissa = iso paint-voitto ilman luettavuushaittaa.
   Isot ambient-blurit (≤110px) ja animoitu halo-bloom-pulssi ovat jatkuvan jankin
   pää-lähteet. Säilytämme premium-lookin (opaakit lasipinnat, kevyt staattinen glow),
   poistamme vain runtime-kustannuksen.
   Ref: ui-ux-pro-max §3 main-thread-budget / reduce-reflows, §4 blur-purpose,
        §5 mobile-first, §7 transform-performance / reduced-motion.
   ========================================================================== */

/* ---------- 1. PAINT-PERF: kevennä per-frame blur (mobiili + reduced-motion) ---------- */
@media (max-width: 768px), (prefers-reduced-motion: reduce) {

  /* 1a. backdrop-filter pois — paneeleilla on jo opaakki/gradientti-tausta,
         joten lasipinta säilyy mutta selain ei blurraa taustaa joka framella. */
  .ps-browse-drawer,
  .ps-browse-overlay,
  .ps-info-overlay,
  .ps-info-panel,
  .ps-browse-manual-guidance-card,
  .ps-browse-manual-guidance-help {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* 1b. Animoitu / koristeellinen filter: blur pois — halo-bloom-pulssi (keyframet)
         re-blurraa joka framella = jatkuva jank manuaalipuolella. */
  .ps-browse-signal::before,
  .ps-browse-manual-panel-index::before,
  .ps-browse-manual-guidance-cards::after,
  .ps-browse-default-view.is-root-preview::after,
  .ps-browse-default-view.is-root-preview .ps-browse-grid,
  .ps-browse-default-view.is-root-preview [class*="ps-browse-top"] {
    animation: none !important;
    filter: none !important;
  }

  /* 1c. Isot ambient-hehkut: rajaa blur-säde (110/68/26px on suhteeton mobiilille).
         Säde ~28px säilyttää pehmeän hehkun murto-osalla paint-kustannuksesta. */
  .ps-app::before,
  .ps-logo-shell::before,
  .ps-footer::after {
    filter: blur(28px) !important;
  }

  /* ---------- 2. RESPONSIIVISUUS + KOSKETUS ---------- */

  /* 2a. Ei vaakascrollia: browse-sisältö mahtuu viewportiin. */
  .ps-browse-drawer,
  .ps-browse-manual-active,
  .ps-browse-manual-workspace {
    max-width: 100%;
    overflow-x: hidden;
  }

  /* 2b. Vetolaatikon korkeus dvh:lla — mobiilin osoiterivi ei katkaise. */
  .ps-browse-drawer {
    max-height: 100dvh;
  }

  /* 2c. Kosketuskohteet ≥44px + nopea tap (touch-action poistaa 300ms-viiveen). */
  .ps-browse-manual-option,
  .ps-browse-manual-inline-action,
  .ps-browse-manual-guidance-card,
  .ps-browse-manual-guidance-help {
    touch-action: manipulation;
    min-height: 44px;
  }

  /* 2d. Holo-turntable (ajoneuvokortin visuaali) ei saa kaapata pystyscrollia:
         autoplay-<video> nappaa touch-eventit (mm. iOS) → sormiveto holon kohdalla
         jää jumiin sen sijaan että vierittäisi sivua. Video on dekoratiivinen
         (aria-hidden) → pointer-events pois, ja pan-y päästää pystyvierityksen läpi
         koko visuaalin alueelta. */
  .ps-browse-vehicle-card-visual {
    touch-action: pan-y !important;
  }

  .ps-browse-vehicle-card-video {
    pointer-events: none !important;
    touch-action: pan-y !important;
  }
}

/* ---------- 3. Erittäin kapeat puhelimet (≤480px): tiukempi tila ---------- */
@media (max-width: 480px) {
  /* Guidance-kortit yhteen sarakkeeseen jo (core hoitaa), varmista padding kapealla. */
  .ps-browse-manual-guidance-card {
    padding: 16px 16px 14px;
  }
}

/* ---------- 4. SCROLL-JAMI-KORJAUS + kevennys (≤767px = drawer-inner-scroll-regiimi) ----------
   BUGI (Andy, mobiili): manuaalipuolella sivu jumittui holon (section 3) kohdalla — selailu
   pysähtyi siihen, piti poistua sivulta kokonaan.
   SYY: `.ps-browse-manual-result-surface` on SISÄKKÄINEN scroll-container
   (overflow-y:auto + overscroll-behavior:contain) drawer-innerin sisällä. Touch-veto holon
   päältä reititetään result-surfaceen; sillä ei (tiivistyksen jälkeen) ole scrollattavaa, ja
   `overscroll-behavior:contain` ESTÄÄ vedon chainaamisen ulompaan drawer-inneriin → veto
   kuolee → koko sivu jumiin. (≤767px on ainoa regiimi jossa drawer-inner scrollaa.)
   KORJAUS: mobiilissa VAIN drawer-inner scrollaa — manuaalin sisäkkäiset containerit eivät
   ole scroll-containereita (overflow:visible) → veto chainaa aina sivun pääscrolliin. */
@media (max-width: 767px) {
  .ps-browse-default-view.is-manual-browse .ps-browse-manual-active {
    grid-template-rows: auto auto !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
  }

  .ps-browse-default-view.is-manual-browse .ps-browse-manual-result-surface,
  .ps-browse-default-view.is-manual-browse .ps-browse-manual-active-grid {
    overflow: visible !important;
    overscroll-behavior: auto !important;
  }

  /* KEVENNYS: autoplay-turntable-<video> pois mobiilista — staattinen poster-kuva (::before)
     jää näkyviin. Poistaa videodekoodauksen (jatkuva GPU/CPU-kuorma) + videon touch-kaappauksen.
     Iso mobiili-kevennys ilman visuaalista menetystä (holo näkyy yhä still-kuvana). */
  .ps-browse-vehicle-card-video {
    display: none !important;
  }
}

/* ---------- 5. SYSTEEMINEN scroll-jami-suoja (≤767px) ----------
   Holo-jamin lisäksi browse/manual-puolella on USEITA sisäkkäisiä scroll-containereita
   (overflow-y:auto + overscroll-behavior:contain): result-surface, active-grid, type-grid
   (browse-drawer-landing-grid), manual-active, drawer-inner. JOKAINEN on potentiaalinen
   "ansa" jossa sormiveto reititetään sisempään containeriin, jolla ei ole scrollattavaa, ja
   contain estää vedon chainaamisen ulospäin → sivu jumittuu (kuten holon kohdalla).
   Korjaus: neutralisoidaan overscroll-behavior KOKO drawer-puusta → veto chainaa AINA
   ulompaan scrolliin (drawer-inner / sivu), ei jää koskaan jumiin missään kohdassa.
   overscroll-behavior on ei-piirtävä, periytymätön ominaisuus → laaja descendant-sääntö
   on halpa (laskenta kerran, ei per-frame) ja turvallinen (no-op ei-scrollaaville). */
@media (max-width: 767px) {
  .ps-browse-drawer,
  .ps-browse-drawer * {
    overscroll-behavior: auto !important;
  }
}