function hasActiveFiltersMin(f){
return f.brand!=='Alle Marken'||f.type!=='Alle Typen'||f.transmission!=='Alle'||f.fuel!=='Alle'||f.priceMin||f.priceMax||f.kmMax||f.dispMin||f.powerMin||f.seats!=='Alle'||f.electric||f.offer;
}
function MinimalCard({v,onOpen,compareSelected,onToggleCompare,compareDisabled,isFavorite,onToggleFavorite}){return <div style={{cursor:'pointer'}} onClick={()=>onOpen(v)}>
<div style={{position:'relative',background:v.img.light,height:190,display:'flex',alignItems:'center',justifyContent:'center',color:'var(--fg-muted)',fontSize:12}}>
Fahrzeugbild
<div onClick={e=>e.stopPropagation()} style={{position:'absolute',top:10,right:10,display:'flex',gap:12}}>
<button onClick={()=>onToggleFavorite(v)} style={{border:'none',background:'none',padding:0,cursor:'pointer',fontSize:11,fontWeight:600,color:isFavorite?'#fff':'rgba(255,255,255,.85)',textShadow:'0 1px 3px rgba(0,0,0,.5)',textDecoration:isFavorite?'underline':'none'}}>{isFavorite?'Merken ✓':'Merken'}</button>
<label style={{fontSize:11,color:'#fff',display:'flex',alignItems:'center',gap:5,cursor:compareDisabled&&!compareSelected?'not-allowed':'pointer',textShadow:'0 1px 3px rgba(0,0,0,.5)'}}>
<input type="checkbox" checked={compareSelected} disabled={compareDisabled&&!compareSelected} onChange={()=>onToggleCompare(v)} style={{width:13,height:13}}/> Vergleichen
</label>
</div>
</div>
<div style={{padding:'14px 0',borderBottom:'1px solid var(--border-subtle)'}}>
<div style={{display:'flex',justifyContent:'space-between',alignItems:'baseline'}}>
<span style={{fontFamily:'var(--font-display)',fontWeight:700,fontSize:17}}>{v.brand} {v.model}</span>
{v.offer&&<span style={{fontSize:12,fontWeight:700,color:'var(--fg-brand)'}}>Angebot</span>}
</div>
<div style={{fontSize:13,color:'var(--fg-muted)',marginTop:2}}>{v.km.toLocaleString('de-DE')} km · {v.fuel} · {v.transmission}{v.count>1?` · ${v.count}× verfügbar`:''}</div>
<div style={{fontFamily:'var(--font-display)',fontWeight:700,fontSize:18,marginTop:6}}>{window.fmtPrice(v.price)}</div>
</div></div>;
}
function MarketScreenMinimal({onOpenVehicle,onOpenCompare,onOpenSavedSearch,onOpenTradeIn,compareList,setCompareList,favorites,onToggleFavorite}){
const {Button}=window.AutohausVoitelDesignSystem_21e950;
const emptyFilters={brand:'Alle Marken',modelText:'',type:'Alle Typen',transmission:'Alle',fuel:'Alle',priceMin:'',priceMax:'',kmMax:'',dispMin:'',powerMin:'',seats:'Alle',electric:false,offer:false};
const [q,setQ]=React.useState('');
const [filterOpen,setFilterOpen]=React.useState(false);
const [browseAll,setBrowseAll]=React.useState(false);
const [filters,setFiltersState]=React.useState(emptyFilters);
function setFilter(k,v){setFiltersState(s=>({...s,[k]:v}));}
function resetFilters(){setFiltersState(emptyFilters);}
const active=hasActiveFiltersMin(filters)||q.trim().length>0;
const showGrid=active||browseAll;
let list=window.VOITEL_MARKET.filter(v=>{
if(q&&!(`${v.brand} ${v.model}`.toLowerCase().includes(q.toLowerCase())))return false;
if(filters.brand!=='Alle Marken'&&v.brand!==filters.brand)return false;
/* substring match: stock model strings are long ("Tourneo Custom Titanium
   X L2 FWD") while the dropdown lists base names */
if(filters.modelText&&!(v.model+' '+v.brand).toLowerCase().includes(filters.modelText.toLowerCase()))return false;
/* FilterPanel feeds the grouped labels, so compare on the same grouping. */
if(filters.type!=='Alle Typen'&&window.voitelBodyCategory(v.type)!==filters.type)return false;
if(filters.transmission!=='Alle'&&v.transmission!==filters.transmission)return false;
if(filters.fuel!=='Alle'&&window.voitelFuelGroup(v.fuel)!==filters.fuel)return false;
if(filters.priceMin&&v.price<Number(filters.priceMin))return false;
if(filters.priceMax&&v.price>Number(filters.priceMax))return false;
if(filters.kmMax&&v.km>Number(filters.kmMax))return false;
if(filters.electric&&!v.electric)return false;
if(filters.offer&&!v.offer)return false;
return true;
});
list=[...list].sort((a,b)=>new Date(b.added)-new Date(a.added));
function toggleCompare(v){setCompareList(cl=>{if(cl.find(x=>x.id===v.id))return cl.filter(x=>x.id!==v.id);if(cl.length>=3)return cl;return [...cl,v];});}
const onSale=window.VOITEL_MARKET.filter(v=>v.offer);
const newest=[...window.VOITEL_MARKET].sort((a,b)=>new Date(b.added)-new Date(a.added)).slice(0,4);
const popular=[...window.VOITEL_MARKET].sort((a,b)=>b.requests-a.requests).slice(0,4);
const FilterPanel=window.FilterPanelExport;
function Section({title,items}){
return <div style={{marginBottom:48}}>
<div style={{fontFamily:'var(--font-display)',fontWeight:700,fontSize:19,marginBottom:18,paddingBottom:10,borderBottom:'1px solid var(--border-subtle)'}}>{title}</div>
<div style={{display:'grid',gridTemplateColumns:'repeat(4,1fr)',columnGap:28}}>
{items.map(v=><MinimalCard key={v.id} v={v} onOpen={onOpenVehicle} compareSelected={!!compareList.find(x=>x.id===v.id)} compareDisabled={compareList.length>=3} onToggleCompare={toggleCompare} isFavorite={!!favorites.find(x=>x.id===v.id)} onToggleFavorite={onToggleFavorite}/>)}
</div></div>;
}
return <div style={{fontFamily:'var(--font-body)',maxWidth:'var(--container-max)',margin:'0 auto',padding:'48px 24px 100px'}}>
<div style={{marginBottom:44}}>
<div style={{fontFamily:'var(--font-display)',fontWeight:700,fontSize:32,marginBottom:20}}>Fahrzeugmarkt</div>
<div style={{display:'flex',alignItems:'center',gap:16,borderBottom:'1px solid var(--slate-900)',paddingBottom:12}}>
<img src="https://unpkg.com/lucide-static@0.469.0/icons/search.svg" width={16} style={{opacity:.5}}/>
<input value={q} onChange={e=>setQ(e.target.value)} placeholder="Marke oder Modell suchen, z. B. Ford Puma" style={{flex:1,border:'none',outline:'none',fontSize:18,fontFamily:'var(--font-body)',background:'none'}}/>
<button onClick={()=>setFilterOpen(true)} style={{border:'none',background:'none',fontSize:14,fontWeight:600,color:'var(--fg-secondary)',cursor:'pointer',padding:0}}>Filter</button>
</div>
</div>
{!showGrid?<div>
<Section title="Sonderangebote" items={onSale}/>
<Section title="Neu hinzugefügt" items={newest}/>
<Section title="Meistgesucht" items={popular}/>
<div style={{textAlign:'center'}}><button onClick={()=>setBrowseAll(true)} style={{border:'none',borderBottom:'1px solid var(--fg-primary)',background:'none',fontSize:14,fontWeight:600,cursor:'pointer',padding:'0 0 2px'}}>Alle {window.VOITEL_MARKET.length} Fahrzeuge ansehen</button></div>
</div>:<div>
<div style={{fontSize:13,color:'var(--fg-muted)',marginBottom:20}}>{list.length} Fahrzeuge</div>
<div style={{display:'grid',gridTemplateColumns:'repeat(4,1fr)',columnGap:28,rowGap:36}}>
{list.map(v=><MinimalCard key={v.id} v={v} onOpen={onOpenVehicle} compareSelected={!!compareList.find(x=>x.id===v.id)} compareDisabled={compareList.length>=3} onToggleCompare={toggleCompare} isFavorite={!!favorites.find(x=>x.id===v.id)} onToggleFavorite={onToggleFavorite}/>)}
</div>
{list.length===0&&<div style={{padding:40,textAlign:'center',color:'var(--fg-muted)'}}>Keine Fahrzeuge gefunden.</div>}
</div>}
{compareList.length>0&&<div style={{position:'fixed',bottom:0,left:0,right:0,background:'#fff',borderTop:'1px solid var(--slate-900)',padding:'16px 24px',display:'flex',justifyContent:'center',gap:20,alignItems:'center',zIndex:50}}>
<span style={{fontSize:13,color:'var(--fg-secondary)'}}>{compareList.length} zum Vergleich ausgewählt: {compareList.map(v=>v.model).join(', ')}</span>
<button onClick={onOpenCompare} disabled={compareList.length<2} style={{border:'none',borderBottom:'1px solid var(--fg-primary)',background:'none',fontSize:13,fontWeight:700,cursor:'pointer'}}>Vergleichen</button>
<button onClick={()=>setCompareList([])} style={{border:'none',background:'none',color:'var(--fg-muted)',cursor:'pointer',fontSize:13}}>Leeren</button>
</div>}
{filterOpen&&<div style={{position:'fixed',inset:0,background:'rgba(0,0,0,.4)',zIndex:60,display:'flex',justifyContent:'flex-end'}} onClick={()=>setFilterOpen(false)}>
<div onClick={e=>e.stopPropagation()} style={{background:'#fff',width:320,height:'100%',padding:28,overflowY:'auto'}}>
<FilterPanel filters={filters} setFilter={setFilter} resultCount={list.length} onReset={resetFilters}/>
<Button variant="primary" onClick={()=>setFilterOpen(false)} style={{width:'100%',marginTop:16}}>Ergebnisse anzeigen ({list.length})</Button>
</div></div>}
</div>;
}
window.MarketScreenMinimalExport=MarketScreenMinimal;
