/* =====================================================================
   Выпадающий список подсказок
   ===================================================================== */
#search-suggestions{
  position:absolute;
  left:0;
  right:0;
  top:100%;
  z-index:1020;

  background:#fff;
  border:1px solid #ddd;
  border-top:none;

  list-style:none;
  margin:0;
  padding:0;

  max-height:300px;            /* появляется вертикальный скролл */
  overflow-y:auto;
}

/* =====================================================================
   Строка подсказки как GRID
   48px | 1fr | max-content | 36px  →  img | name | price | cart
   ===================================================================== */
#search-suggestions li{
  display:grid;
  grid-template-columns:48px 1fr max-content 36px;
  align-items:center;
  gap:8px;                       /* «пробелы» между колонками */
  padding:6px 10px;
  cursor:pointer;
  transition:background .15s;
}

#search-suggestions li:hover{
  background:#f5f5f5;
}

/* ---------------------------------------------------------------------
   «Внутренняя» ссылка должна разложиться по ячейкам грида
   --------------------------------------------------------------------- */
#search-suggestions .sugg-link{
  display:contents;              /* критично: img / name / price участвуют в grid */
}

/* ---------------------------------------------------------------------
   1) Картинка
   --------------------------------------------------------------------- */
#search-suggestions li img{
  width:48px;
  height:48px;
  border-radius:4px;
  object-fit:cover;
}

/* ---------------------------------------------------------------------
   2) Название + граммовка
   --------------------------------------------------------------------- */
#search-suggestions .name{
  font-size:14px;
  line-height:1.25;

  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:2;          /* максимум 2 строки */
  -webkit-box-orient:vertical;
}

#search-suggestions .name .weight{
  color:#9e9e9e;
  font-size:13px;
  font-weight:400;
  margin-left:4px;
  display:contents;              /* не убираем, как требовалось */
}

/* ---------------------------------------------------------------------
   3) Цена
   --------------------------------------------------------------------- */
#search-suggestions .price{
  font-weight:600;
  text-align:right;
  white-space:nowrap;
  font-size:15px;
  color:#b5631d;
}

/* ---------------------------------------------------------------------
   4) Кнопка-корзина
   --------------------------------------------------------------------- */
#search-suggestions .sugg-cart{
  border:none;
  background:none;
  width:36px;
  height:36px;
  display:flex;
  justify-content:center;
  align-items:center;
  font-size:18px;
  color:#555;
  cursor:pointer;
  transition:color .15s;
  margin-left:2px;               /* фиксированный зазор от цены */
}

#search-suggestions .sugg-cart:hover{
  color:#dc3545;
}

/* зелёный цвет, когда товар уже в корзине */
#search-suggestions .sugg-cart.in-cart,
#search-suggestions .sugg-cart.in-cart i{
  color:#28a745;
}

/* =====================================================================
   Скролл-бар
   ===================================================================== */
#search-suggestions::-webkit-scrollbar{width:6px;}
#search-suggestions::-webkit-scrollbar-thumb{
  background:#c1c1c1;border-radius:3px;
}
#search-suggestions::-webkit-scrollbar-track{background:transparent;}