/* Компактная подсказка поиска (live search). Подключается в header.twig с ?v=N — при изменении увеличивайте N. */
#us_livesearch.expanded{max-height:460px}
#us_livesearch>div.ls2{padding:6px 8px;min-height:0}
.ls2{font-size:14px;line-height:1.3;color:#1f2937}
.ls2-cats{display:flex;flex-wrap:wrap;gap:6px;padding:4px 2px 8px;border-bottom:1px solid #eef0f3;margin-bottom:4px}
.ls2-chip{display:inline-flex;align-items:baseline;gap:6px;max-width:100%;padding:4px 10px;border-radius:14px;background:#eef3fb;color:#3b5f99;font-size:13px;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ls2-chip:hover{background:#dfe9f8;color:#2a4a7d;text-decoration:none}
.ls2-chip small{color:#8a8f98;font-size:11px;overflow:hidden;text-overflow:ellipsis}
.ls2-list{max-height:330px;overflow-y:auto;scrollbar-width:thin}
.ls2-item{display:flex;align-items:center;gap:10px;padding:6px 6px;border-radius:6px;color:inherit;text-decoration:none}
.ls2-item:hover{background:#f5f8ff;color:inherit;text-decoration:none}
.ls2-item img{width:40px;height:40px;object-fit:contain;flex:0 0 40px;border-radius:4px;background:#fff}
.ls2-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.ls2-name{font-size:14px;font-weight:500;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ls2-name b{font-weight:700;color:#000;background:#fff6c7}
.ls2-meta{font-size:12px;color:#7a808a;display:flex;gap:10px;flex-wrap:wrap}
.ls2-meta .in-stock{color:#4c9a00}.ls2-meta .out-of-stock{color:#d64545}
.ls2-price{flex:0 0 auto;text-align:right;font-size:14px;font-weight:700;white-space:nowrap}
.ls2-price s{display:block;font-weight:400;font-size:12px;color:#9aa0a8}
.ls2-price .ls2-new{color:#d64545}
.ls2-all{display:block;margin-top:4px;padding:8px;text-align:center;font-size:13px;color:#3b5f99;border-top:1px solid #eef0f3;text-decoration:none}
.ls2-all:hover{background:#f5f8ff;text-decoration:none}
@media (max-width:575px){.ls2-item img{width:36px;height:36px;flex-basis:36px}.ls2-price{font-size:13px}.ls2-chip{white-space:normal;flex-wrap:wrap;gap:2px 6px;border-radius:10px}.ls2-chip small{display:inline}}
/* Десктоп: ширина подсказки не по самой длинной строке (в new.css там min-width:max-content),
   а по полю поиска, но не уже 480px и не шире экрана */
@media (min-width:1024px){
  .header #search #us_livesearch.expanded{min-width:0;width:100%;width:max(100%,480px);max-width:calc(100vw - 300px)}
  .ls2-chip{white-space:normal;max-width:100%}
  .ls2-cats{overflow:hidden}
}
