/**
 * Живые подсказки в поиске. Размеры — в шкале темы (1rem ≈ 1px при ширине 1920),
 * цвета взяты у сайта: зелёный #8DC63F, текст #2D2D2D, второстепенный #676767.
 */

.cs-ls-panel {
  position: absolute;
  top: calc(100% + 6rem);
  left: 0;
  z-index: 60;
  /* Тема масштабирует всё от ширины окна (1rem ≈ 1px при 1920). Подсказкам это годится,
     но ниже минимума они становятся нечитаемыми, поэтому у размеров есть пол в px. */
  width: max(340px, 420rem);
  max-width: calc(100vw - 24px);
  max-height: min(62vh, 620rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 8rem 0;
  background: #fff;
  border: 1rem solid #E2E5E3;
  border-radius: 12rem;
  box-shadow: 0 12rem 32rem rgba(45, 45, 45, 0.12), 0 2rem 6rem rgba(45, 45, 45, 0.06);
  animation: cs-ls-in 160ms cubic-bezier(0.22, 1, 0.36, 1);
  scrollbar-width: thin;
  scrollbar-color: #C9D3C2 transparent;
}

@keyframes cs-ls-in {
  from { opacity: 0; transform: translateY(-6rem); }
  to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .cs-ls-panel { animation: none; }
}

.cs-ls-panel::-webkit-scrollbar { width: 8rem; }
.cs-ls-panel::-webkit-scrollbar-thumb { background: #C9D3C2; border-radius: 8rem; }
.cs-ls-panel::-webkit-scrollbar-track { background: transparent; }

.cs-ls-panel ::selection { background: #DDEFC4; color: #2D2D2D; }

.cs-ls-group + .cs-ls-group { margin-top: 6rem; border-top: 1rem solid #F0F2EF; padding-top: 10rem; }

.cs-ls-group-title {
  padding: 4rem 16rem 6rem;
  color: #6B7268;
  font-size: max(11px, 12rem);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.cs-ls-row {
  display: flex;
  align-items: center;
  gap: max(10px, 12rem);
  padding: max(7px, 8rem) max(12px, 16rem);
  color: #2D2D2D;
  text-decoration: none;
  transition: background-color 120ms ease-out;
}

.cs-ls-row:hover,
.cs-ls-row.is-active {
  background: #F4F8EF;
}

.cs-ls-row:focus-visible,
.cs-ls-all:focus-visible {
  outline: 2rem solid #8DC63F;
  outline-offset: -2rem;
}

.cs-ls-thumb {
  flex: none;
  width: max(38px, 44rem);
  height: max(38px, 44rem);
  object-fit: contain;
  border-radius: 8rem;
  background: #F7F8F6;
}

.cs-ls-icon {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: max(38px, 44rem);
  height: max(38px, 44rem);
  border-radius: 8rem;
  background: #F4F8EF;
  color: #6E8C45;
}

.cs-ls-icon svg { width: max(17px, 20rem); height: max(17px, 20rem); }

.cs-ls-text { min-width: 0; display: flex; flex-direction: column; gap: 2rem; }

.cs-ls-title {
  font-size: max(14px, 15rem);
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cs-ls-title mark {
  background: none;
  color: #5F8F1F;
  font-weight: 700;
}

.cs-ls-meta {
  display: flex;
  align-items: center;
  gap: 6rem;
  color: #676767;
  font-size: max(12px, 13rem);
  line-height: 1.3;
}

.cs-ls-meta b { color: #2D2D2D; font-weight: 700; font-variant-numeric: tabular-nums; }
.cs-ls-meta i { color: #C4CBC0; font-style: normal; }

.cs-ls-all {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8rem;
  margin-top: 6rem;
  padding: 12rem 16rem 4rem;
  border-top: 1rem solid #F0F2EF;
  color: #5F8F1F;
  font-size: max(13px, 14rem);
  font-weight: 600;
  text-decoration: none;
  transition: color 120ms ease-out;
}

.cs-ls-all span {
  padding: 2rem 8rem;
  background: #F4F8EF;
  border-radius: 20rem;
  color: #6E8C45;
  font-variant-numeric: tabular-nums;
}

.cs-ls-all:hover { color: #4C7A12; }
.cs-ls-all:hover span { background: #E7F1DA; }
.cs-ls-all.is-active { background: #F4F8EF; }

.cs-ls-empty {
  display: flex;
  flex-direction: column;
  gap: 4rem;
  padding: 14rem 16rem;
}

.cs-ls-empty b { color: #2D2D2D; font-size: max(14px, 15rem); font-weight: 600; }
.cs-ls-empty span { color: #676767; font-size: max(12px, 13rem); line-height: 1.4; }

/* На узких экранах сайдбар сам во всю ширину — панель тянется по полю */
@media (max-width: 768px) {
  .cs-ls-panel {
    width: calc(100vw - 24px);
    max-height: 58vh;
  }
}
