/* СВОЁ АДМИН-ПАНЕЛИ: то, чего в двух других кабинетах нет вовсе.
 *
 * Общее лежит в `ui.css` — он одинаков во всех трёх кабинетах байт в байт.
 * Сюда попадает только то, что встречается в одном кабинете: разъехавшийся
 * общий блок никто не заметит, пока сотрудник поддержки не откроет две
 * панели рядом.
 *
 * Правило простое: элемент появился во ВТОРОМ кабинете — переезжает в ядро,
 * во все три копии сразу. Порядок и проверка — docs/panels-ui.md.
 *
 * Адаптив своего кабинета — рядом со своим блоком; общие точки перелома
 * лежат в последнем разделе `ui.css` (Р-191).
 * Цвет — только из tokens.css (правило №10).
 */

/* ==================================================================== */
/* 1. Безопасность и настройки                                           */
/* ==================================================================== */

/* Секрет двухфакторного входа. `user-select: all` — одно нажатие выделяет
   строку целиком: тридцать два символа вводят руками, и промахнуться в них
   слишком легко. Разрядка и крупный шрифт — по той же причине */
.secret {
  max-width: 560px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 16px;
  letter-spacing: 0.1em;
  word-break: break-all;
  user-select: all;
}

/* Форма правки настройки прямо в строке таблицы: поле и кнопка одной
   строкой. Отдельный экран на каждую настройку означал бы двадцать
   переходов ради двадцати чисел */
.setting-form {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.setting-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="file"]),
.setting-form select {
  width: auto;
  min-width: 150px;
  max-width: 280px;
}

/* A16 — журнал действий. Код действия (`partner.create`) не разрывается
   посреди слова: `.key` разрешает перенос где угодно ради длинных ключей, но
   в узкой колонке журнала код превращался в «part / ner. / crea / te» и
   переставал быть кодом вовсе. Идентификаторы рядом разрываются по-прежнему:
   они лежат в своём `div`, и у UUID перенос безвреден */
td > span.key { white-space: nowrap; overflow-wrap: normal; }

/* A16 — журнал действий: что именно поменяли, прямо в строке.
   Тот же список пар, что в карточках, но первая колонка не держит 140 px:
   ячейка журнала узкая, ключ в ней короткий (`price_minor`, `status`), и
   заявленный минимум выпихивал значение за край ячейки */
td > .pairs.tiny { grid-template-columns: minmax(0, auto) minmax(0, 1fr); }

/* ==================================================================== */
/* 2. A22 — справочник документов партнёров (Р-141)                      */
/* ==================================================================== */

/* Три названия в одной ячейке таблицы: русское, английское и на языке
   страны. Столбцами это не помещается — у справочника ещё код, подсказка,
   свойства и выключатель, и таблица уезжала бы за край экрана вдвое */
.pd-names { display: grid; gap: 4px; min-width: 260px; }

.pd-names__row { display: flex; align-items: center; gap: 6px; }

/* Код языка вместо подписи «Русский»: подпись занимала бы половину ячейки,
   а `ru`, `en`, `th` читаются мгновенно и одинаковой ширины */
.pd-names__lang {
  flex: none;
  width: 26px;
  color: var(--text3);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  text-transform: uppercase;
}

.pd-names input:not([type="checkbox"]) { padding: 6px 8px; font-size: 13px; }

/* Матрица «категория × тип». Первая колонка липкая: при пяти типах таблица
   уезжает вбок, и без неё непонятно, к какому документу относится галочка */
.matrix th:first-child,
.matrix td:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--surface2);
}

.matrix thead th:first-child { background: var(--surface); }

.matrix__name { min-width: 230px; font-size: 13px; }
.matrix__cell { white-space: nowrap; text-align: center; }

/* Два флажка в клетке: «нужен» и «обязателен». Подписи словами, а не
   значками: галочка без подписи в таблице на шестьсот клеток означает
   ежедневный вопрос «а которая из них какая» */
.matrix__flag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 10px;
  color: var(--text2);
  font-size: 11px;
}

.matrix__flag input { accent-color: var(--brand); }
.matrix__flag:last-child { margin-right: 0; }

/* Категории строки справочника (Р-150): пять флажков в колонке. Столбцом, а
   не строкой — иначе колонка растягивает таблицу на треть экрана и названия
   переносятся посреди слова */
.pd-kinds { display: grid; gap: 4px; min-width: 160px; }
.pd-kinds .check { color: var(--text2); font-size: 12px; }

/* Окно подтверждения перед сохранением (Р-145). `dialog` вместо своей
   накладки: фокус, Esc и подложку он делает сам */
.pd-dialog {
  width: 620px;
  padding: 22px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface2);
  color: var(--text);
  box-shadow: var(--shadow-lg);
}

.pd-dialog::backdrop { background: var(--overlay); }
