/* Боковое меню: подкатегории (пункты разделов) крупнее и заметнее. */
#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; }
}