/* ============================================================
   otoauta.pl — listing (wyniki wyszukiwania) — wspólne style
   Wymaga: assets/otoauta.css (tokeny), bootstrap-icons
   ============================================================ */

body { background: var(--bg); }

/* ---------- Slim header ---------- */
.lst-head { background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:60; }
.lst-head__in { display:flex; align-items:center; gap:16px; height:64px; }
.lst-logo { display:inline-flex; align-items:center; flex:none; }
.lst-logo img { height:42px; width:auto; display:block; }
.lst-search { flex:1; max-width:540px; display:flex; align-items:stretch; background:#fff; border:1.5px solid var(--line); border-radius:11px; overflow:hidden; transition:border-color .15s, box-shadow .15s; }
.lst-search:focus-within { border-color:var(--navy-500); box-shadow:0 0 0 3px rgba(37,99,196,.12); }
.lst-search select { -webkit-appearance:none; appearance:none; border:0; background:var(--bg-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235e6a7d' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right .6rem center; font-weight:700; font-size:.85rem; color:var(--ink-2); padding:0 1.9rem 0 .8rem; cursor:pointer; }
.lst-search input { border:0; flex:1; padding:.62rem .85rem; font-size:.9rem; outline:none; min-width:0; }
.lst-search button { border:0; background:var(--orange-500); color:#fff; padding:0 1rem; font-size:1.02rem; cursor:pointer; }
.lst-search button:hover { background:var(--orange-600); }
.lst-head__r { margin-left:auto; display:flex; align-items:center; gap:6px; flex:none; }
.lst-ico { display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 9px; border-radius:10px; color:var(--ink-2); font-size:.66rem; font-weight:600; position:relative; }
.lst-ico:hover { background:var(--navy-50); color:var(--navy-700); }
.lst-ico i { font-size:1.1rem; }
.lst-ico .dot { position:absolute; top:4px; right:8px; width:7px; height:7px; border-radius:50%; background:var(--orange-500); }

/* ---------- Breadcrumb + tytuł ---------- */
.lst-crumbs { font-size:.82rem; color:var(--muted-2); padding:14px 0 6px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.lst-crumbs a { color:var(--muted); }
.lst-crumbs a:hover { color:var(--navy-700); }
.lst-crumbs .sep { color:var(--line); }
.lst-title { font-family:var(--font-display); font-weight:800; font-size:clamp(1.3rem,3vw,1.7rem); letter-spacing:-.02em; margin:0 0 2px; }
.lst-title small { font-weight:700; font-size:.5em; color:var(--muted-2); letter-spacing:0; }

/* ---------- Quick chips (popularne filtry) ---------- */
.lst-chips { display:flex; gap:8px; flex-wrap:wrap; margin:10px 0 4px; }
.lst-chips a { font-size:.82rem; font-weight:600; color:var(--ink-2); background:#fff; border:1px solid var(--line); border-radius:999px; padding:.4rem .8rem; transition:.14s; }
.lst-chips a:hover, .lst-chips a.active { border-color:var(--navy-500); color:var(--navy-700); background:var(--navy-50); }

/* ---------- Toolbar (count + sort + view) ---------- */
.lst-bar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:14px 0 16px; }
.lst-bar__count { font-family:var(--font-display); font-weight:800; font-size:1.05rem; color:var(--ink); }
.lst-bar__count b { color:var(--navy-700); }
.lst-bar__spacer { flex:1; }
.lst-savebtn { font-weight:700; font-size:.84rem; color:var(--navy-700); display:inline-flex; align-items:center; gap:6px; }
.lst-savebtn:hover { color:var(--orange-600); }
.lst-sort { display:inline-flex; align-items:center; gap:7px; }
.lst-sort label { font-size:.82rem; color:var(--muted); font-weight:600; }
.lst-sort select { -webkit-appearance:none; appearance:none; border:1.5px solid var(--line); border-radius:10px; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235e6a7d' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right .6rem center; font-weight:700; font-size:.84rem; color:var(--ink-2); padding:.5rem 2rem .5rem .75rem; cursor:pointer; }
.lst-sort select:focus { outline:none; border-color:var(--navy-500); }
.view-toggle { display:inline-flex; gap:2px; background:var(--bg-2); border-radius:11px; padding:3px; }
.view-toggle button { border:0; background:transparent; width:38px; height:34px; border-radius:8px; color:var(--muted); cursor:pointer; display:grid; place-items:center; font-size:1.05rem; transition:.14s; }
.view-toggle button:hover { color:var(--navy-700); }
.view-toggle button.active { background:#fff; color:var(--navy-700); box-shadow:var(--shadow-sm); }

/* ---------- Kontenery widoku ---------- */
.listing-grid { display:grid; gap:16px; }
.listing-grid.cols-2 { grid-template-columns:repeat(2,1fr); }
.listing-grid.cols-4 { grid-template-columns:repeat(4,1fr); }
.listing-grid.cols-6 { grid-template-columns:repeat(6,1fr); }
.listing-rows { display:flex; flex-direction:column; gap:14px; }

/* Pasek typu oferty (Ogłoszenia / Kup Teraz / Licytacje) */
.lst-offerbar { display:inline-flex; gap:3px; background:var(--bg-2); border-radius:12px; padding:4px; margin:10px 0 2px; flex-wrap:wrap; }
.lst-offerbar button { border:0; background:transparent; font-family:var(--font-ui); font-weight:700; font-size:.86rem; color:var(--muted); padding:.5rem .95rem; border-radius:9px; cursor:pointer; display:inline-flex; align-items:center; gap:7px; transition:.14s; }
.lst-offerbar button:hover { color:var(--navy-700); }
.lst-offerbar button.active { background:#fff; color:var(--navy-700); box-shadow:var(--shadow-sm); }
.lst-offerbar button.active i { color:var(--orange-500); }

/* Aktywne filtry (chipy) */
.lst-active { display:flex; flex-wrap:wrap; gap:7px; align-items:center; margin:4px 0 14px; }
.lst-active:empty { display:none; }
.lst-active__lbl { font-size:.8rem; font-weight:700; color:var(--muted); margin-right:2px; }
.lst-tag { display:inline-flex; align-items:center; gap:6px; font-size:.8rem; font-weight:600; color:var(--navy-700); background:var(--navy-50); border:1px solid var(--navy-100); border-radius:999px; padding:.34rem .7rem; cursor:pointer; transition:.14s; }
.lst-tag:hover { border-color:var(--navy-500); }
.lst-tag i { font-size:.78rem; opacity:.7; }
.lst-tag:hover i { opacity:1; color:var(--orange-600); }
.lst-tag--clear { color:var(--muted); background:transparent; border-color:transparent; }
.lst-tag--clear:hover { color:var(--orange-600); }

/* Status / timer aukcji */
.auc-status { display:inline-flex; align-items:center; gap:5px; font-size:.74rem; font-weight:700; border-radius:7px; padding:.26rem .5rem; }
.auc-status--ok { background:var(--green-100); color:var(--green-600); }
.auc-status--no { background:var(--gold-100); color:var(--gold-600); }
.auc-status--none { background:var(--navy-50); color:var(--navy-700); }
.auc-timer { display:inline-flex; align-items:center; gap:5px; font-size:.76rem; font-weight:700; color:var(--orange-600); }
.row-card__auc { font-size:.78rem; color:var(--muted); }
.row-card__plabel { font-size:.72rem; color:var(--muted-2); font-weight:600; }
.row-card__pricewrap { display:flex; flex-direction:column; gap:5px; align-items:flex-end; text-align:right; }
.gc-auc { font-size:.72rem; color:var(--orange-600); font-weight:700; margin-bottom:2px; }
.gc-plabel { font-size:.6em; color:var(--muted-2); font-weight:700; }
.gc-pm { font-size:.72rem; color:var(--muted-2); }
.car-card__foot .auc-status { margin-top:5px; }

/* Zagęszczenie w gridzie 4/6 kolumn */
.listing-grid.cols-4 .car-card__title, .listing-grid.cols-6 .car-card__title { font-size:.86rem; }
.listing-grid.cols-6 .car-card__body { padding:9px 10px 11px; gap:6px; }
.listing-grid.cols-6 .car-card__specs { font-size:.7rem; gap:3px 7px; }
.listing-grid.cols-6 .car-card__specs span:nth-child(n+4) { display:none; }
.listing-grid.cols-6 .car-card__price { font-size:1rem; }

/* PREMIUM ROW CARD (pierwszy, mobile.de style) */
.row-card--premium { grid-template-columns:360px 1fr 250px; border:1.5px solid var(--gold-600); box-shadow:0 10px 30px rgba(183,121,31,.14), var(--shadow-sm); position:relative; }
.row-card--premium .row-card__media { min-height:286px; display:flex; flex-direction:column; }
.rc-ribbon { position:absolute; top:0; left:0; z-index:5; background:linear-gradient(135deg,var(--gold-600),#9a6614); color:#fff; font-weight:800; font-size:.72rem; letter-spacing:.04em; text-transform:uppercase; padding:.34rem .8rem; border-bottom-right-radius:12px; display:inline-flex; align-items:center; gap:6px; box-shadow:0 4px 12px rgba(183,121,31,.4); }
.rc-gallery { position:absolute; left:10px; right:10px; bottom:10px; display:grid; grid-template-columns:repeat(4,1fr); gap:6px; z-index:3; }
.rc-thumb { height:46px; border-radius:7px; background-size:cover; background-position:center; border:2px solid rgba(255,255,255,.85); position:relative; overflow:hidden; }
.rc-thumb__more { position:absolute; inset:0; background:rgba(8,18,40,.62); color:#fff; font-weight:800; font-size:.82rem; display:grid; place-items:center; }
.rc-tag-ok { font-size:.76rem; font-weight:700; color:var(--green-600); display:inline-flex; align-items:center; gap:5px; }
.rc-dealer { display:flex; align-items:center; gap:9px; width:100%; padding:9px; border:1px solid var(--line); border-radius:11px; background:#fff; }
.rc-dealer__mark { width:38px; height:38px; border-radius:9px; flex:none; display:grid; place-items:center; background:linear-gradient(160deg,var(--navy-600),var(--navy-800)); color:#fff; font-family:var(--font-display); font-weight:800; font-size:.9rem; }
.rc-dealer__name { font-size:.8rem; font-weight:700; color:var(--ink); line-height:1.15; display:flex; flex-direction:column; }
.rc-dealer__name small { font-weight:600; font-size:.68rem; color:var(--muted-2); }
.rc-dealer--priv { justify-content:center; font-size:.82rem; font-weight:700; color:var(--navy-700); gap:7px; }
.rc-dealer--priv i { font-size:1.1rem; }
@media (max-width:991.98px){ .row-card--premium { grid-template-columns:300px 1fr 224px; } }
@media (max-width:767.98px){ .row-card--premium { grid-template-columns:1fr; } .row-card--premium .row-card__media { min-height:0; aspect-ratio:16/11; } }

/* Kontenery widoku — responsywność */

/* ---------- PREMIUM ROW CARD ---------- */
.row-card { display:grid; grid-template-columns:300px 1fr 224px; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .16s ease, box-shadow .18s ease, border-color .18s ease; }
.row-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-lg); border-color:var(--navy-100); }
.row-card__media { position:relative; min-height:212px; overflow:hidden; background:var(--bg-2); }
.row-card__media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.row-card:hover .row-card__media img { transform:scale(1.05); }
.row-card__badges { position:absolute; top:10px; left:10px; display:flex; gap:5px; flex-wrap:wrap; z-index:2; }
.row-card__count { position:absolute; bottom:10px; left:10px; z-index:2; background:rgba(8,18,40,.72); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); color:#fff; font-weight:700; font-size:.72rem; padding:.26rem .5rem; border-radius:7px; display:inline-flex; align-items:center; gap:5px; }
.row-card__fav { position:absolute; top:9px; right:9px; z-index:2; width:34px; height:34px; border-radius:50%; border:0; cursor:pointer; background:rgba(255,255,255,.92); color:var(--ink-2); display:grid; place-items:center; box-shadow:0 2px 8px rgba(8,22,52,.18); transition:.15s; }
.row-card__fav:hover { color:var(--orange-500); transform:scale(1.08); }
.row-card__fav.is-active { color:var(--orange-500); }
.row-card__main { padding:15px 18px; display:flex; flex-direction:column; gap:9px; min-width:0; }
.row-card__head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.row-card__title { font-family:var(--font-display); font-weight:800; font-size:1.12rem; line-height:1.22; color:var(--ink); letter-spacing:-.01em; }
.row-card__title a { color:inherit; }
.row-card__title a:hover { color:var(--navy-700); }
.row-card__sub { font-size:.82rem; color:var(--muted); }
.rc-specs { display:flex; flex-wrap:wrap; gap:7px; }
.rc-spec { display:inline-flex; align-items:center; gap:5px; font-size:.8rem; font-weight:600; color:var(--ink-2); background:var(--bg-2); border-radius:8px; padding:.32rem .6rem; }
.rc-spec i { color:var(--navy-600); font-size:.92rem; }
.row-card__desc { font-size:.85rem; color:var(--muted); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.row-card__foot { margin-top:auto; display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding-top:4px; }
.row-card__loc { font-size:.8rem; color:var(--muted-2); display:inline-flex; align-items:center; gap:5px; }
.row-card__seller { font-size:.76rem; font-weight:700; color:var(--navy-700); background:var(--navy-50); border-radius:7px; padding:.24rem .55rem; display:inline-flex; align-items:center; gap:5px; }
.row-card__side { padding:15px 18px; border-left:1px solid var(--line-2); background:linear-gradient(180deg, #fff, var(--bg-50, #fafcff)); display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; gap:10px; }
.row-card__price { font-family:var(--font-display); font-weight:800; font-size:1.5rem; color:var(--navy-800); letter-spacing:-.02em; line-height:1; text-align:right; }
.row-card__price small { font-weight:700; font-size:.5em; color:var(--muted); }
.row-card__pm { font-size:.74rem; color:var(--muted-2); font-weight:600; }
.row-card__actions { display:flex; flex-direction:column; gap:8px; width:100%; margin-top:auto; }
.row-card__date { font-size:.72rem; color:var(--muted-2); text-align:right; }

/* ---------- Layout A: filtry po lewo ---------- */
.lst-layout { display:grid; grid-template-columns:280px 1fr; gap:22px; align-items:start; padding-bottom:10px; }
.flt { background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; box-shadow:var(--shadow-sm); position:sticky; top:78px; }
.flt__top { display:flex; align-items:center; justify-content:space-between; padding:13px 15px; border-bottom:1px solid var(--line); }
.flt__top h3 { font-family:var(--font-display); font-weight:800; font-size:.98rem; margin:0; }
.flt__clear { font-size:.78rem; font-weight:700; color:var(--orange-600); cursor:pointer; }
.flt__grp { border-bottom:1px solid var(--line-2); }
.flt__hd { display:flex; align-items:center; justify-content:space-between; padding:12px 15px; font-weight:700; font-size:.88rem; color:var(--ink); cursor:pointer; user-select:none; }
.flt__hd .bi { color:var(--muted-2); transition:transform .2s; }
.flt__grp.collapsed .flt__hd .bi { transform:rotate(-90deg); }
.flt__bd { padding:2px 15px 14px; display:flex; flex-direction:column; gap:9px; }
.flt__grp.collapsed .flt__bd { display:none; }
.flt__range { display:flex; gap:8px; align-items:center; }
.flt__range input { width:100%; border:1.5px solid var(--line); border-radius:9px; padding:.5rem .6rem; font-size:.84rem; outline:none; }
.flt__range input:focus { border-color:var(--navy-500); }
.flt__range span { color:var(--muted-2); }
.flt-check { display:flex; align-items:center; gap:9px; font-size:.85rem; color:var(--ink-2); cursor:pointer; }
.flt-check input { width:17px; height:17px; accent-color:var(--navy-700); flex:none; }
.flt-check .cnt { margin-left:auto; font-size:.74rem; color:var(--muted-2); }
.flt-check:hover { color:var(--navy-700); }
.flt__apply { padding:14px 15px; }

/* Mobilny przycisk filtrów */
.flt-mobtn { display:none; }

/* ---------- Layout B: filtry u góry (OLX) ---------- */
.flt-top { background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow-sm); padding:14px; margin-bottom:6px; }
.flt-top__row { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; }
.flt-top__row .oa-field > label { font-size:.72rem; }
.flt-top__more { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; flex-wrap:wrap; }
.flt-top__adv { max-height:0; overflow:hidden; transition:max-height .35s ease; }
.flt-top__adv.open { max-height:400px; }
.flt-top__adv-in { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; padding-top:12px; margin-top:12px; border-top:1px dashed var(--line); }
.flt-top__pills { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }

/* ---------- Paginacja ---------- */
.lst-pages { display:flex; gap:6px; justify-content:center; align-items:center; margin:28px 0 8px; flex-wrap:wrap; }
.lst-pages button { min-width:40px; height:40px; border-radius:10px; border:1px solid var(--line); background:#fff; color:var(--ink-2); font-weight:700; font-size:.88rem; cursor:pointer; transition:.14s; padding:0 10px; }
.lst-pages button:hover:not(:disabled) { border-color:var(--navy-500); color:var(--navy-700); }
.lst-pages button.active { background:var(--navy-700); border-color:var(--navy-700); color:#fff; }
.lst-pages button:disabled { opacity:.4; cursor:default; }

/* ---------- Empty ---------- */
.lst-empty { text-align:center; padding:60px 16px; color:var(--muted); }
.lst-empty i { font-size:2.4rem; color:var(--muted-2); }

/* ---------- Footer mini ---------- */
.lst-foot { background:var(--navy-950); color:#aab8d2; padding:26px 0; margin-top:30px; font-size:.85rem; }
.lst-foot a { color:#c4cee0; }
.lst-foot__in { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }

/* Przełącznik widoków listingu (A/B) */
.lst-switch { position:fixed; z-index:1080; bottom:16px; left:50%; transform:translateX(-50%); display:flex; gap:4px; background:rgba(8,22,52,.92); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-radius:999px; padding:5px; box-shadow:var(--shadow-lg); }
.lst-switch a { font-size:.8rem; font-weight:700; color:#c4cee0; padding:.42rem .8rem; border-radius:999px; white-space:nowrap; }
.lst-switch a.is-active { background:var(--orange-500); color:#fff; }
.lst-switch a:hover:not(.is-active) { color:#fff; background:rgba(255,255,255,.1); }

/* ---------- Responsywność ---------- */
@media (max-width:1199.98px){
  .listing-grid.cols-6 { grid-template-columns:repeat(4,1fr); }
  .listing-grid.cols-4 { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:991.98px){
  .lst-layout { grid-template-columns:1fr; }
  .flt { position:fixed; top:0; left:0; bottom:0; width:86%; max-width:340px; z-index:1200; border-radius:0; transform:translateX(-105%); transition:transform .28s ease; overflow-y:auto; }
  .flt.open { transform:none; }
  .flt-backdrop { position:fixed; inset:0; background:rgba(8,18,40,.5); z-index:1190; opacity:0; visibility:hidden; transition:.2s; }
  .flt-backdrop.show { opacity:1; visibility:visible; }
  .flt-mobtn { display:inline-flex; align-items:center; gap:7px; }
  .flt-top__row { grid-template-columns:repeat(3,1fr); }
  .flt-top__adv-in { grid-template-columns:repeat(3,1fr); }
  .lst-head__r .lst-ico span { display:none; }
}
@media (max-width:767.98px){
  .lst-head__in { flex-wrap:wrap; height:auto; padding:10px 0; gap:10px; }
  .lst-search { order:3; flex-basis:100%; max-width:none; }
  .lst-head__r { margin-left:auto; }
  .lst-head__r .lst-ico span { display:none; }
  .lst-logo img { height:34px; }
  .listing-grid.cols-6 { grid-template-columns:repeat(3,1fr); }
  .listing-grid.cols-4 { grid-template-columns:repeat(2,1fr); }
  .row-card { grid-template-columns:1fr; }
  .row-card__media { min-height:0; aspect-ratio:16/10; }
  .row-card__side { border-left:0; border-top:1px solid var(--line-2); flex-direction:row; align-items:center; justify-content:space-between; }
  .row-card__actions { flex-direction:row; width:auto; margin-top:0; }
  .row-card__date { display:none; }
  .flt-top__row { grid-template-columns:repeat(2,1fr); }
  .flt-top__adv-in { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:479.98px){
  .listing-grid.cols-6, .listing-grid.cols-4 { grid-template-columns:repeat(2,1fr); }
  .row-card__side { flex-direction:column; align-items:stretch; }
  .row-card__actions { flex-direction:column; }
  .row-card__price { text-align:left; }
  .flt-top__row { grid-template-columns:1fr 1fr; }
}

/* Premium: kremowe tło zamiast białego */
.row-card--premium { background: #FEFAEB; }
.row-card--premium .row-card__side { background: transparent; border-left-color: rgba(183,121,31,.18); }

/* Premium: wstążka wystarczy — ukryj plakietki nakładające się na nią */
.row-card--premium .row-card__badges { display: none; }

/* Premium komisu: pasek korzyści + granatowy znak dealera */
.rc-perks { display:flex; flex-wrap:wrap; gap:6px; }
.rc-perks span { display:inline-flex; align-items:center; gap:5px; font-size:.74rem; font-weight:700; color:#7a5410; background:#fdf3d7; border:1px solid #f0e2b6; border-radius:8px; padding:.3rem .55rem; }
.rc-perks span i { color:#b7791f; }
.rc-dealer--pro .rc-dealer__mark { background:linear-gradient(135deg,var(--navy-600),var(--navy-900)); }
.rc-dealer--pro:hover .rc-dealer__name { color:var(--navy-700); }