/* Focus must never change geometry or leave an autofocus ring after a click. */
html[data-input-modality="pointer"] :is(button,a,summary,[tabindex]):focus {
 outline-color:transparent!important;
}
html[data-input-modality="pointer"] .vehicle-search :is(.category-options,.brand-options) label:focus-within {
 outline-color:transparent!important;
}
.vehicle-search .category-options label:focus-within{outline:none}
html[data-input-modality="keyboard"] .vehicle-search .category-options label:has(input:focus-visible){
 outline:2px solid var(--blue);outline-offset:3px;
}
.vehicle-search .category-options input:focus-visible{outline:none}
:where(button,a,summary){transition-property:background-color,border-color,color,box-shadow,outline-color;transition-duration:160ms;transition-timing-function:ease-out}
:where(input,select,textarea){transition:border-color 160ms ease-out,box-shadow 160ms ease-out,outline-color 160ms ease-out}
@media(prefers-reduced-motion:reduce){
 :where(button,a,summary,input,select,textarea){transition-duration:0s}
}

/* Vollständige Bedienflächen: Innenabstand und Fokus innerhalb der Kontur. */
.vehicle-grid .vehicle .vehicle-card-meta .favorite-toggle{box-sizing:border-box;min-height:44px;min-width:96px;padding:10px 12px;gap:6px;line-height:1.5;white-space:nowrap;flex:0 0 auto;border-radius:4px}
.vehicle-grid .vehicle .vehicle-card-meta{flex-wrap:wrap;column-gap:12px;row-gap:8px}
.vehicle-grid .vehicle .favorite-toggle svg{flex-shrink:0}
.vehicle-grid .vehicle .compare-choice{box-sizing:border-box;min-height:44px;padding:10px 12px;border-radius:4px;gap:10px;width:100%}
.vehicle-grid .vehicle .compare-choice:hover,.vehicle-grid .vehicle .compare-choice:has(input:checked){background:#f1efec}
.vehicle-grid .vehicle .compare-choice input{flex:0 0 20px;margin:0}
html body :is(button,a,summary,input,select,textarea):focus-visible{outline:2px solid var(--blue);outline-offset:-3px}
html body .vehicle .compare-choice:has(input:focus-visible){outline:2px solid var(--blue);outline-offset:-3px}
html body .vehicle .compare-choice input:focus-visible{outline:none}
html body .vehicle-search :is(.category-options,.brand-options) label:has(input:focus-visible){outline:2px solid var(--blue);outline-offset:-3px}
html body .vehicle-search :is(.category-options,.brand-options) input:focus-visible{outline:none}
html body .photo-picker:has(+input:focus-visible){outline:2px solid var(--blue);outline-offset:-3px}

html body .vehicle-grid .vehicle .compare-choice{padding:10px 12px}
html body #details :is(button,a):focus-visible,html body #comparison :is(button,a):focus-visible{outline:2px solid var(--blue);outline-offset:-3px}

html body .vehicle-grid .vehicle .compare-choice{padding:10px 12px!important}
