/* ============================================================
   eco-max-ls.css — визуальный слой «СПИСОК ЧАТОВ» (визуал-агент LS)
   Ночь 2026-09-08 · финальный свип списка: 1440+390, light+dark
   messenger.vyshka.cloud · подключён последним в messenger.html

   Зона: только список чатов (#panel-list) — шапка, поиск, папки
   (va-chip), строки (chat-row), секции (vg-sep), бейджи, пины,
   онлайн-точки. Чужие eco-max-* не трогаю: конфликты VA+skin3+vj
   гашу точечными правилами СВОЕГО слоя. Только токены канона,
   никаких новых цветов и шрифтов.
   ============================================================ */

/* ---------- LS-1. Шапка списка: тумблер темы в центре ----------
   Проблема: [title][тумблер][+] при space-between оставляют тумблер
   висеть в геометрическом центре шапки (1440 и 390) — случайный вид.
   Заодно разнобой размеров в одном ряду: тумблер 44px против «+» 40px.
   Фикс: тумблер прижат к «+» справа, кнопки одного размера 44px. */
#panel-list .list-header { gap: 8px; }
#panel-list .list-header #eco-theme-toggle { margin-left: auto; }
#panel-list .list-header .btn-icon { width: 44px; height: 44px; }

/* ---------- LS-2. «Новый чат» в тёмной теме: контраст ----------
   Проблема: bg --accent (#6b96ff) + белая иконка ≈ 2.2:1 — бледно.
   Канон тёмной темы этого скина (VA: чипы, бейджи, «Избранное») —
   чернильная иконка на светлом акценте. */
html[data-theme="dark"] #panel-list .list-header #btn-new-chat {
  color: rgb(11, 18, 32);
}

/* ---------- LS-3. Мобильный список: низ уходит под таб-бар ----------
   Проблема: #chatlist padding-bottom 16px (VA) меньше таб-бара
   (--nav-h 58px) — при прокрутке последние строки прячутся под бар.
   Фикс: паддинг = таб-бар + запас + safe-area. */
@media (max-width: 860px) {
  #chatlist {
    padding-bottom: calc(var(--nav-h, 58px) + 16px + env(safe-area-inset-bottom, 0px));
  }
}

/* ---------- LS-4. Активный чат неотличим от остальных ----------
   Проблема: skin3 давал активной строке inset-полосу, VA её погасил
   (box-shadow: none + ::before display:none) — активная строка теперь
   выглядит как обычная при ховере. Фикс: тонкий акцент-ринг по
   контуру активной строки (канонный --accent, без новых цветов). */
#chatlist .chat-row.is-active,
#chatlist .chat-row.is-active:hover {
  background: var(--brand-soft);
  box-shadow: inset 0 0 0 1.5px var(--accent);
}

/* ---------- LS-5. Бейдж непрочитанных: список ≠ поиск ----------
   Проблема: в #chatlist бейдж плоский (VA), в .search-hits остаётся
   max-ui градиент + цветная тень, в vb свой радиус. Один элемент —
   три вида. Фикс: единый канон бейджа во всех списках панели. */
#panel-list .search-hits .chat-row__badge {
  background: var(--accent);
  box-shadow: none;
  border-radius: 999px;
  min-width: 22px;
  height: 22px;
  padding: 0 7px;
  font-size: 12px;
  font-weight: 700;
}
html[data-theme="dark"] #panel-list .search-hits .chat-row__badge {
  color: rgb(11, 18, 32);
  box-shadow: none;
}

/* ---------- LS-6. Двойные тени аватаров в выдаче поиска ----------
   max-ui вешает цветную тень на .chat-row__avatar; в списке её гасит
   skin3, в поиске — остаётся. Фикс: в выдаче без тени. */
#panel-list .search-hits .chat-row__avatar { box-shadow: none; }

/* ---------- LS-7. vg-бейдж группы: «прорезь» под фон строки ----------
   vg: у бейджа border/bg = --surface. При ховере/активе фон строки
   меняется, а кольцо нет — бейдж отрывается от фона. Фикс: кольцо
   следует за фактическим фоном строки. */
#chatlist .chat-row:hover .vg-hit__badge {
  background: var(--surface-2);
  border-color: var(--surface-2);
}
#chatlist .chat-row.is-active .vg-hit__badge,
#chatlist .chat-row.is-active:hover .vg-hit__badge {
  background: var(--brand-soft);
  border-color: var(--brand-soft);
}

/* ---------- LS-8. Онлайн-точка: кольцо под ховером строки ----------
   VA красит кольцо точки под --surface и под активную строку,
   но забыл ховер. Фикс для симметрии. */
#chatlist .chat-row:hover[data-va-online="1"] .chat-row__avatar::after {
  border-color: var(--surface-2) !important;
}

/* ---------- LS-9. Секция «ГРУППЫ»: выравнивание по аватарам ----------
   vg-sep margin 14px + #chatlist 8px = 22px от края панели, а кромка
   аватаров строк — 20px. Секция «пляшет» относительно рядов.
   Фикс: 12px + 8px = 20px, по кромке аватаров. */
.vg-sep { margin-left: 12px; margin-right: 12px; }