:root{
  --ar-accent:#c79a2b;
  --ar-hover:#a67d1f;
  --ar-btn-text:#fff;
  --ar-cols:3;
  --ar-mobile-cols:2;
}
.ar-wrap{display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;align-items:start}
.ar-sidebar{background:#fff;border:1px solid #e5e5e5;border-radius:12px;padding:14px;position:sticky;top:16px}
.ar-sidebar-title{display:flex;justify-content:space-between;align-items:center;font-weight:700;text-transform:uppercase;border-bottom:2px solid var(--ar-accent);padding-bottom:10px;margin-bottom:12px;font-size:15px}
.ar-sidebar-close,.ar-filter-toggle{display:none}
.ar-search-row{display:flex;gap:8px;align-items:center;margin-bottom:14px}
.ar-search-row input{flex:1;min-width:0;padding:10px;border:1px solid #ddd;border-radius:8px;font-size:14px}
.ar-search-row button,.ar-card-btn,#ar-search-btn,#ar-reset,#ar-apply{border:none;border-radius:8px;padding:10px 12px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:42px;font-weight:600}
.ar-search-row button,.ar-card-btn,#ar-search-btn{background:var(--ar-accent);color:var(--ar-btn-text)}
.ar-search-row button:hover,.ar-card-btn:hover,#ar-search-btn:hover{background:var(--ar-hover)}
.ar-step{margin-bottom:12px}
.ar-step label{display:block;font-size:12px;font-weight:700;text-transform:uppercase;color:#666;margin-bottom:5px}
.ar-step select{width:100%;padding:10px 36px 10px 10px;border:1px solid #ddd;border-radius:8px;background:#fff;font-size:14px;min-height:42px;height:auto;line-height:1.35;white-space:normal}
.ar-step.ar-disabled select{opacity:.65}
.ar-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
#ar-reset{background:#d94841;color:#fff}
#ar-reset:hover{background:#bb2f28}
#ar-apply{background:#2e9d52;color:#fff}
#ar-apply:hover{background:#257c40}
#ar-results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:16px;flex-wrap:wrap}
.ar-sort select{padding:8px;border:1px solid #ddd;border-radius:8px;min-height:40px}
#ar-products-grid{display:grid;grid-template-columns:repeat(var(--ar-cols),minmax(0,1fr));gap:18px}
.ar-card{background:#fff;border:1px solid #ececec;border-radius:14px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.04);min-width:0}
.ar-card-link{text-decoration:none;color:inherit;display:block}
.ar-card-img{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#fff}
.ar-card-img img{max-width:100%;max-height:100%;object-fit:contain}
.ar-card-body{padding:12px}
.ar-card-name{font-weight:700;line-height:1.35;margin-bottom:6px;min-height:44px;font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ar-card-sku{font-size:12px;color:#777;margin-bottom:6px;word-break:break-word}
.ar-card-price{font-weight:700;font-size:14px}
.ar-card-footer{display:flex;gap:8px;padding:0 12px 12px}
.ar-card-btn{flex:1}
#ar-loading,#ar-no-results,#ar-placeholder{text-align:center;padding:40px 16px;background:#fff;border:1px solid #ececec;border-radius:14px}
.ar-spinner{width:32px;height:32px;border:3px solid #eee;border-top-color:var(--ar-accent);border-radius:50%;margin:0 auto 10px;animation:arspin 1s linear infinite}
@keyframes arspin{to{transform:rotate(360deg)}}
#ar-pagination{margin-top:18px}
.ar-pages{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap}
.ar-page-btn{min-width:38px;height:38px;padding:0 10px;border:1px solid #ddd;background:#fff;border-radius:8px;cursor:pointer}
.ar-page-btn.ar-page-active{background:var(--ar-accent);border-color:var(--ar-accent);color:#fff}
.ar-page-dots{padding:0 4px}
#ar-overlay{display:none}
.autorival-compat-table-wrap{overflow:auto}
.autorival-compat-table{width:100%;border-collapse:collapse;margin-top:12px}
.autorival-compat-table th,.autorival-compat-table td{padding:10px;border:1px solid #e5e5e5;text-align:left;vertical-align:top}
.autorival-compat-table thead th{background:#f8f8f8}
@media (max-width: 1100px){
  .ar-wrap{grid-template-columns:270px minmax(0,1fr);gap:16px}
  #ar-products-grid{gap:14px}
}
@media (max-width: 980px){
  .ar-wrap{grid-template-columns:1fr}
  .ar-filter-toggle{display:inline-flex;background:var(--ar-accent);color:#fff;border:none;border-radius:8px;padding:10px 12px;margin-bottom:12px;cursor:pointer;min-height:42px}
  .ar-sidebar{position:fixed;left:0;top:0;bottom:0;width:340px;max-width:92vw;z-index:10001;transform:translateX(-105%);transition:transform .25s ease;border-radius:0;overflow:auto;padding:16px}
  .ar-sidebar.ar-sidebar-open{transform:translateX(0)}
  .ar-sidebar-close{display:inline-flex;border:none;background:transparent;cursor:pointer;font-size:20px;line-height:1}
  #ar-overlay{position:fixed;inset:0;background:rgba(0,0,0,.44);z-index:10000}
  #ar-products-grid{grid-template-columns:repeat(var(--ar-mobile-cols),minmax(0,1fr))}
  .autorival-compat-table th,.autorival-compat-table td{white-space:nowrap}
  body.ar-mobile-lock{overflow:hidden}
}
@media (max-width: 640px){
  #ar-results-header{flex-direction:column;align-items:stretch}
  .ar-sort{width:100%}
  .ar-sort select{width:100%}
  .ar-search-row{display:grid;grid-template-columns:18px 1fr 56px}
  .ar-card-body{padding:10px}
  .ar-card-footer{padding:0 10px 10px}
  .ar-step select{font-size:13px;line-height:1.3}
}
@media (max-width: 480px){
  #ar-products-grid{grid-template-columns:repeat(var(--ar-mobile-cols),minmax(0,1fr));gap:10px}
  .ar-card-name{min-height:auto;font-size:13px}
  .ar-card-price{font-size:13px}
  .ar-card-btn{min-height:38px}
}
@media (max-width: 389px){
  :root{--ar-mobile-cols:1}
}

/* 4.3.1 mobile/card/button refinements */
@media (max-width: 980px){
  #ar-products-grid{grid-template-columns:1fr !important;}
}
#ar-filter-toggle{
  width:100%;
  justify-content:center;
  background:#2e9d52 !important;
  color:#fff !important;
  font-weight:700;
}
#ar-filter-toggle:hover{
  background:#257c40 !important;
}


.autorival-selected-compat-wrap{
  margin:8px 0 18px;
}
.autorival-selected-compat-label{
  font-size:12px;
  font-weight:700;
  text-transform:uppercase;
  color:#777;
  margin-bottom:6px;
}
.autorival-selected-compat-line{
  font-size:28px;
  line-height:1.2;
  margin:0;
  word-break:break-word;
}
@media (max-width: 980px){
  .autorival-selected-compat-line{font-size:22px;}
}
@media (max-width: 640px){
  .autorival-selected-compat-wrap{margin:8px 0 14px;}
  .autorival-selected-compat-line{font-size:18px;}
}
