/* Боковое меню: подкатегории (пункты разделов) крупнее и заметнее. */
#nav-sidebar-apps a[id^="link-"] {
    font-size: 14.5px !important;
    font-weight: 500 !important;
}

/* Заголовки групп — чуть крупнее, чтобы отделять категории от подкатегорий. */
#nav-sidebar-apps h2 a {
    font-size: 15px !important;
    letter-spacing: .1px;
}

/* ============== Палитра для кастомных страниц/плашек (тема) ==============
   CSS-переменные работают и в inline-style. В шаблонах хардкод-цвета заменены
   на var(--tw-…), тёмные значения — под html.dark (тема Unfold). */
:root{
  --tw-note-bg:#eef6ff; --tw-note-br:#b8d4f0;          /* синяя инфо-плашка */
  --tw-noteg-bg:#f3faf3; --tw-noteg-br:#bfe3bf;         /* зелёная плашка */
  --tw-notew-bg:#fff6e5; --tw-notew-br:#f0d9a8;         /* жёлтая (warn) */
  --tw-surface:#fff; --tw-surface2:#f3f5f8;             /* карточки / шапки таблиц */
  --tw-border:#d7dee8; --tw-border2:#d0d7e0;            /* рамки */
  --tw-green-bg:#f2fbf4; --tw-green-br:#bfe6c8;
  --tw-red-bg:#fdf3f2; --tw-red-br:#f0c8c3;
  --tw-track:#eef1f5; --tw-muted:#8a97ab;
}
html.dark{
  --tw-note-bg:#16273a; --tw-note-br:#274b6b;
  --tw-noteg-bg:#16301f; --tw-noteg-br:#2f6b41;
  --tw-notew-bg:#33290f; --tw-notew-br:#6b5a2f;
  --tw-surface:#1f2733; --tw-surface2:#161d27;
  --tw-border:#334155; --tw-border2:#3a475a;
  --tw-green-bg:rgba(22,163,74,.18); --tw-green-br:#2f6b41;
  --tw-red-bg:rgba(220,60,60,.16); --tw-red-br:#7a3b38;
  --tw-track:#2a3340; --tw-muted:#94a3b8;
}

/* ================= Мобильный UX (телефоны операторов) ================= */
@media (max-width: 640px) {
  /* Поля ввода: крупнее палец + 16px, чтобы iOS не зумил экран при фокусе. */
  input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
  select, textarea {
    min-height: 42px !important;
    font-size: 16px !important;
  }
  /* Кнопки/сабмиты — крупный тап-таргет. */
  button, input[type=submit], input[type=button], .button, [role=button] {
    min-height: 42px !important;
    font-size: 15px !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
  }
  /* Чекбоксы «откуда лью» и статусы — крупнее, легче попасть. */
  input[type=checkbox], input[type=radio] {
    width: 20px !important;
    height: 20px !important;
  }
  /* Широкие таблицы админки не должны рвать вёрстку — горизонтальный скролл. */
  .results, #result_list, table.model-list {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* ===== Карточки списков на телефоне/планшете (Unfold .data-row) =====
   Проблема: карточки клиентов сливались в один цвет (тонкая рамка почти
   невидима в тёмной теме). Даём явный фон, рамку, зазор и шапку с именем. */
@media (max-width: 1023px) {
  .data-row {
    background: var(--tw-surface) !important;
    border: 1px solid var(--tw-border2) !important;
    border-radius: 12px !important;
    margin-bottom: 14px !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.18) !important;
    overflow: hidden;
  }
  /* Первое поле (имя) — как «шапка» карточки: выделяем фоном и жирным. */
  .data-row > [class*="field-name_display"],
  .data-row > .action-checkbox {
    background: var(--tw-surface2) !important;
  }
  .data-row > [class*="field-name_display"] { font-weight: 700 !important; font-size: 15px; }
  /* Строки внутри карточки — мягкий разделитель, читаемее. */
  .data-row > [class*="field-"] { border-top-color: var(--tw-border) !important; }
}


/* Выпадашка подсказок клиентов (js/client_suggest.js).
   Живёт и на сводке, и в боковом меню, поэтому не завязана на переменные сводки:
   значения --db-* подставляются, если они есть, иначе свои цвета. */
.cs-drop{position:absolute;z-index:80;left:0;right:0;top:100%;margin-top:4px;
  background:var(--db-input-bg,#fff);border:1px solid var(--db-input-br,#d7dde6);
  border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.18);
  overflow:hidden;max-height:320px;overflow-y:auto}
.cs-drop-item{display:flex;justify-content:space-between;gap:10px;align-items:center;
  padding:10px 12px;text-decoration:none;color:var(--db-text,#111827);
  border-bottom:1px solid var(--db-line2,#eef1f5);font-size:14px}
.cs-drop-item:last-child{border-bottom:none}
.cs-drop-item.is-cur{background:var(--db-card-bg,#f3f6fb)}
.cs-drop-hint{color:var(--db-muted,#7b8794);font-size:12px}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .cs-drop{background:var(--db-input-bg,#0f172a);
    border-color:var(--db-input-br,#33425c)}
  :root:not([data-theme="light"]) .cs-drop-item{color:var(--db-text,#e5e7eb);
    border-bottom-color:var(--db-line2,#1f2937)}
  :root:not([data-theme="light"]) .cs-drop-item.is-cur{background:var(--db-card-bg,#1e293b)}
}
:root[data-theme="dark"] .cs-drop{background:var(--db-input-bg,#0f172a);
  border-color:var(--db-input-br,#33425c)}
:root[data-theme="dark"] .cs-drop-item{color:var(--db-text,#e5e7eb);
  border-bottom-color:var(--db-line2,#1f2937)}
:root[data-theme="dark"] .cs-drop-item.is-cur{background:var(--db-card-bg,#1e293b)}
/* На телефоне строка выше: попадать пальцем, а не мышью. */
@media(max-width:640px){ .cs-drop-item{padding:13px 12px} }