/* Interface states and controls. Typography is owned by typography.css. */
:root{--ui-focus:#566e35;--ui-selected:#e4ebd9;--ui-border:#acb99b;--ui-error:#8b3e32}
:where(button,a,input,select,textarea,summary):focus-visible{outline:2px solid var(--ui-focus);outline-offset:3px}
.search{transition:border-color .16s,box-shadow .16s,background-color .16s}
.search:focus-within{border-color:var(--ui-focus);box-shadow:0 0 0 2px #566e351a;background:#fff}
.search input:focus-visible{outline:none}
.search button{min-width:30px;min-height:36px;flex-shrink:0}
.icon-btn,.dialog-head button,.cart-item>button{border-radius:2px;transition:background-color .16s,color .16s,border-color .16s}
.icon-btn.active,.icon-btn[aria-pressed=true]{background:#dce5cd;color:#35472a}
.product-card .favorite{background:#ffffffc9;border:1px solid #ffffff99}
.product-card .favorite.active{background:#dce5cd;border-color:#a6b68f}
.nav-menu[open]>summary{color:#354b2b}
.nav-menu .menu-content{border-top:2px solid #6b8053;box-shadow:0 15px 35px #202d2026}
.menu-content a{border-radius:1px;padding-left:8px;padding-right:8px}
.catalog-vehicle-tabs a,.active-query button{transition:background-color .16s,border-color .16s}
.active-query{flex-wrap:wrap;gap:8px}
.active-query button{display:inline-flex;align-items:center;min-height:34px;border:1px solid #c5cfb9;background:#edf1e6;padding:6px 12px}
.filter-options{gap:2px}
.filter-options label{min-height:36px;padding:7px 9px;margin-left:-9px;margin-right:-9px;border:1px solid transparent;border-radius:2px;transition:background-color .16s,border-color .16s}
.filter-options label:has(input:checked){background:var(--ui-selected);border-color:#ced9bf;color:#304426}
.filter-options label:has(input:focus-visible){outline:2px solid var(--ui-focus);outline-offset:1px}
.filter-options input:focus-visible{outline:none}
.filter-reset{min-height:38px;text-underline-offset:4px}
body:has(dialog[open]){overflow:hidden}
dialog{border:1px solid #d2dac8;box-shadow:0 24px 80px #19231740;overscroll-behavior:contain;scrollbar-gutter:stable;scroll-padding-top:85px}
.dialog-head{position:sticky;top:0;background:#fff;z-index:2;margin:-1px -1px 14px;padding:0 1px 12px;border-bottom:1px solid #e0e6d8;align-items:start}
.dialog-head h2{padding-top:4px;margin-bottom:0}
.dialog-head button{flex-shrink:0;min-width:40px;min-height:40px;display:grid;place-items:center;margin-top:-4px}
dialog .field input,dialog .field select,dialog .field textarea,.trade-row input{transition:border-color .16s,box-shadow .16s,background-color .16s}
.field input:focus,.field select:focus,.field textarea:focus,.trade-row input:focus{border-color:var(--ui-focus);box-shadow:inset 0 0 0 1px var(--ui-focus)}
:where(input,textarea,select)[aria-invalid=true],:where(input,textarea,select):user-invalid{border-color:var(--ui-error)!important;box-shadow:inset 0 0 0 1px var(--ui-error);background:#fff9f7}
.cart-item>button{min-width:40px;min-height:40px;display:grid;place-items:center}
.cart-quantity{display:flex;align-items:center;gap:10px;margin-top:10px}
.cart-quantity input{width:70px;min-height:38px;padding:6px 8px;border:1px solid #bcc8ad;background:#f7f9f2;border-radius:1px;text-align:center}
.cart-quantity input:focus{border-color:var(--ui-focus)}
.cart-quantity input:user-invalid{border-color:var(--ui-error);background:#fff9f7}
.cart-total{background:#eef2e7;margin:8px -12px 0;padding:18px 12px}
dialog .empty{padding:38px 20px;background:#f1f4eb}
#toast{box-shadow:0 8px 26px #19231722;border:1px solid #59684b}
@media(hover:hover){
 .icon-btn:hover,.dialog-head button:hover{background:#e6eddd}
 .cart-item>button:hover{background:#f1e5df;color:#873c2e}
 .menu-content a:hover{background:#eef2e7;color:#314829}
 .filter-options label:hover{background:#f0f4e9}
 .active-query button:hover{background:#dde7ce;border-color:#9aaf80}
 .catalog-vehicle-tabs a:not(.active):hover{background:#e6eddc;border-color:#aaba98}
 .cart-item a:hover h3{text-decoration:underline;text-underline-offset:3px}
}
@media(max-width:760px){
 .header-tools .icon-btn,.favorite,.buy-row .icon-btn{min-width:44px;min-height:44px}
 .favorite{right:3px;top:3px;padding:11px}
 .dialog-head button,.cart-item>button{min-width:44px;min-height:44px}
 dialog{width:560px;max-width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:24px;scroll-padding-top:75px}
 .dialog-head{top:0;padding-top:2px;padding-bottom:12px;margin-bottom:18px}
 .filter-options label{min-height:44px}
 .filters-dialog .dialog-submit{position:sticky;bottom:-24px;z-index:2;box-shadow:0 -12px 18px 10px #ffffffec;margin-bottom:0}
 .cart-item{grid-template-columns:64px minmax(0,1fr) 44px;gap:11px}
 .cart-item img{height:64px}
 .cart-quantity{flex-wrap:wrap;gap:7px}
 .cart-quantity input{min-height:42px;width:66px}
 #toast{bottom:calc(20px + env(safe-area-inset-bottom));width:max-content;max-width:calc(100% - 32px)}
 body:has(.mobile-buy) #toast{bottom:calc(92px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
