/* ---- automarkt search card on phones ---- */
@media (max-width:640px){
  /* "Erweiterte Suche" needs ~162px, which does not fit half a row at the
     14px the selects use. Give each button its own full-width row instead
     of shrinking the type, so both match the fields above. */
  .mkt-filter-grid > button{
    font-size:14px!important;
    padding:0 8px!important;
    gap:6px!important;
    white-space:nowrap;
    justify-content:center!important;
  }
  .mkt-filter-grid > button img{width:15px!important;height:15px!important;flex:none}

  /* The whole search card - photo down to the "X Fahrzeuge" button - is the
     first screen on a phone (Oct 2026). Same look, tighter: the photo takes
     what is left of the visible height (svh: with Safari's bars showing),
     between 120 and 200px; --mkt-card-h is the card's measured height
     (MarketScreenPortalExport.jsx). */
  .mkt-nav-spacer{height:calc(var(--gnav-h,69px) + 10px)!important}
  .mkt-hero-banner-img{height:clamp(120px, calc(100svh - var(--gnav-h,69px) - 10px - var(--mkt-card-h,420px) - 12px), 200px)!important}
  .mkt-hero-search-card{padding:16px 16px 18px!important}
  .mkt-hero-logo{height:30px!important;margin-top:0!important}
  .mkt-h1{font-size:19px!important;line-height:1.2!important;margin-top:8px!important;margin-bottom:12px!important}
  .mkt-hero-search{margin-bottom:8px!important}
  .mkt-hero-search input{height:46px!important;padding-top:0!important;padding-bottom:0!important;box-sizing:border-box!important}
  .mkt-hero-search-card .mkt-filter-grid{gap:8px!important}
  .mkt-hero-search-card .mkt-filter-grid:first-of-type{margin-bottom:8px!important}
  .mkt-hero-search-card .mkt-filter-grid select,.mkt-hero-search-card .mkt-filter-grid button,
  .mkt-hero-search-card .mkt-filter-grid label{height:46px!important}
}
/* narrow phones (iPhone SE and the like): "Erweiterte Suche" does not fit
   half a row at 14px - each button keeps its own full-width row */
@media (max-width:374px){
  .mkt-filter-grid > button{grid-column:1 / -1}
}
/* the no-results capture stacks on phones */
@media (max-width:640px){
  .mkt-noresults-grid{grid-template-columns:1fr!important}
}
/* short phone screens (iPhone SE with Safari's bars: ~550px visible) - the
   photo may go a little lower so the results button still shows */
@media (max-width:640px) and (max-height:600px){
  .mkt-hero-banner-img{height:clamp(96px, calc(100svh - var(--gnav-h,69px) - 10px - var(--mkt-card-h,420px) - 12px), 200px)!important}
}
