/* packages/ui/newticket.css — раздел «Создать тикет» (KS-80, ADR-0199).
 *
 * Раскладка повторяет раздел «Сервисы» (`services.css`), и это несущее, а не
 * косметика: `#content` — это `.panel` с `overflow: hidden` (shell.css).
 * Раздел, положивший содержимое прямо в панель, не прокручивается вовсе —
 * ровно этот дефект здесь и чинится. Прокручиваемый узел ровно один
 * (`.ticket-body`), у шапки `flex: none`.
 *
 * Поля формы своих стилей почти не заводят: подпись, ввод, подсказка и
 * секции берутся у `form.css` (`.cfg-group`, `.cfg-field`, `.cfg-label`,
 * `.cfg-input`, `.cfg-select`, `.cfg-textarea`, `.cfg-hint`) — те же
 * элементы, что на форме настроек сервиса, и выглядеть они обязаны
 * одинаково. Здесь только то, чего там нет: список функций с галочками,
 * строка ответа и экран «задача создана».
 *
 * Только токены темы, ни одного литерального цвета (гейт
 * tests/test_ui_assets.py).
 */

.ticket-screen {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}

.ticket-screen .page-head {
  flex: none;
}

/* Единственный прокручиваемый узел раздела. `position: relative` — чтобы
   `.state` (states.css) позиционировался относительно него, а не всей
   страницы, как это сделано в `.services-list`. */
.ticket-body {
  position: relative;
  flex: 1;
  min-height: 0;
  padding: 1.1rem;
  overflow-y: auto;
}

/* Ширина колонки — как у формы настроек (`.cfg-*` рассчитаны на ~720 px):
   строка длиннее просто не читается. */
.ticket-form {
  max-width: 720px;
}

/* Последняя секция без отбивки снизу: за ней сразу панель действий. */
.ticket-form .cfg-group:last-of-type {
  margin-bottom: 12px;
}

/* Поле, у которого нет ни подсказки, ни значения, не должно оставлять
   пустую строку под собой. */
.ticket-team:empty {
  display: none;
}

.ticket-functions {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  margin-top: 0.2rem;
  padding: 0.3rem 0.15rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-2);
  /* Функций у сервиса может быть много; список прокручивается сам, а не
     растягивает форму так, что кнопка отправки уезжает за экран. */
  max-height: 14rem;
  overflow-y: auto;
}

.ticket-functions .cfg-hint {
  padding: 0.3rem 0.55rem;
  margin: 0;
}

.ticket-fn {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.35rem 0.55rem;
  border-radius: 5px;
  font: 400 13px/1.4 var(--sans);
  color: var(--ink);
  cursor: pointer;
}

.ticket-fn:hover {
  background: var(--surface-3);
}

.ticket-fn-box {
  width: 14px;
  height: 14px;
  flex: none;
  accent-color: var(--blue);
  cursor: pointer;
}

.ticket-fn-box:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

/* Панель действий — та же, что у формы настроек (`.cfg-actions`), но без
   выравнивания вправо: здесь одна кнопка, и она принадлежит форме, а не
   плавающей панели сохранения. */
.ticket-actions {
  justify-content: flex-start;
  padding-top: 0;
}

.ticket-note {
  margin-top: 0.6rem;
  font: 400 12px/1.45 var(--sans);
  color: var(--ink-2);
}

.ticket-note.error {
  color: var(--err);
}

/* Экран «задача создана» — плашка той же формы, что карточки разделов
   (`.card` в services.css): белая панель с рамкой и скруглением. */
.ticket-done {
  max-width: 720px;
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  padding: 1.2rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.ticket-done-title {
  margin: 0;
  font: 600 15px/1.3 var(--sans);
  color: var(--ink);
}

.ticket-done-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

/* Ссылка на задачу — кнопка по виду (`.btn.primary` из shell.css), но
   остаётся ссылкой по существу: у неё есть адрес, её можно открыть в новой
   вкладке средствами браузера. Выравнивание — единственное, чего кнопочным
   стилям не хватает на элементе `<a>`. */
.ticket-done-actions a.btn {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}