/* Styl 1:1 jak KDSolidea (classic), kolor #21285E, ostre rogi */
:root{ --auto-accent:#21285E; --filters-col:clamp(320px,30%,520px); }
.auto-theme{ font-family:"Questrial", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; font-weight:300; max-width:none; margin:0 auto; }
.auto-grid{ display:grid; grid-template-columns: var(--filters-col) 1fr; gap:50px; align-items:start; }
.auto-filters{ position:sticky; top:20px; display:flex; flex-direction:column; gap:18px; border:1px solid #e8e8e8; background:#fff; padding:18px; border-radius:0; box-shadow:0 1px 2px rgba(0,0,0,.03); width:100%; }
.auto-label{ font-size:14px; color:#111; margin-bottom:8px; display:block }
.auto-select, .auto-dual input{ width:100%; border:1px solid #e8e8e8; border-radius:0; padding:10px 12px; background:#fff; outline:none; transition:.2s border-color,.2s box-shadow; }
.auto-select:focus, .auto-dual input:focus{ border-color:var(--auto-accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--auto-accent) 20%, transparent); }
.auto-slider{ margin:16px 8px 10px; }
.auto-range{ display:flex; justify-content:space-between; font-size:13px; color:#4b5563; margin-top:6px }
.auto-checks{ display:flex; flex-direction:column; gap:8px }
.auto-check input{ accent-color: var(--auto-accent); }
.auto-actions{ display:flex; gap:10px }
.auto-btn{ border:1px solid var(--auto-accent); background:#fff; color:var(--auto-accent); padding:10px 14px; text-transform:uppercase; font-weight:700; letter-spacing:.02em; border-radius:0; cursor:pointer }
.auto-btn.auto-apply{ background:var(--auto-accent); color:#fff }
.auto-results{ min-height:200px }
.auto-list{ position:relative }
.auto-list.is-loading:before{ content:'Wczytywanie...'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.6); color:var(--auto-accent); font-weight:700 }
.auto-grid-cards{ display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:18px }
.auto-card{ border:none; padding:0; background:transparent }
.auto-title a{ color:var(--auto-accent); text-decoration:none }
.auto-price{ color:var(--auto-accent); font-weight:700 }
.auto-load-more{ margin-top:16px; border:1px solid var(--auto-accent); background:#fff; color:var(--auto-accent); padding:12px 16px; text-transform:uppercase; font-weight:700; border-radius:0; display:none }

@media (max-width: 1024px){ .auto-grid{ gap:30px } .auto-grid-cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 768px){ .auto-grid{ grid-template-columns: 1fr; } .auto-filters{ position:relative; top:auto } .auto-grid-cards{ grid-template-columns: 1fr; } }


/* === Customizations per request === */

/* Two cards per row by default; already enforced above. */

/* Make filter panel sticky a bit closer to top */
.auto-filters{ position:sticky; top:10px; }

/* Dual inputs (rok od/do, przebieg od/do) side by side 50/50 */
.auto-dual{ display:grid; grid-template-columns: 1fr 1fr; gap:10px; }
.auto-dual .auto-input{ width:100%; }

/* Nicer checkbox/radio groups (skrzynia biegów, paliwo) */
.auto-checks{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:8px; }
.auto-check{ display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid #e5e7eb; background:#fff; cursor:pointer; }
.auto-check input{ margin:0; }
.auto-check:hover{ border-color: color-mix(in srgb, var(--auto-accent) 30%, #e5e7eb); }
.auto-check input:checked + span{ font-weight:600; color:var(--auto-accent); }

/* Tidy selects */
.auto-select{ border-radius:0; }

/* Keep cards unstyled — padding/border handled externally */
.auto-card{ border:none !important; padding:0 !important; background:transparent !important; }

/* Ensure grid gaps look good */
.auto-grid-cards{ gap:20px; }