/**
 * record-form.css
 * Страница: любая карточка с реквизитами — документ, поставка,
 *           задание, всё, что показывает несколько коротких полей
 *           в шапке карточки
 * Блок: сжатая форма реквизитов (`.record-form`)
 *
 * Один класс на все такие шапки: поле 22 точки высотой, подпись
 * мелкая и без отступа снизу, между рядами зазор 2 точки. Числа сняты
 * с готового — Александр показал 05.09.2026 на журнале документов,
 * что слева в таблице поля сжаты как надо, а рядом в карточке те же
 * поля втрое просторнее; здесь эта же мера, а не своя (правило 0.8).
 *
 * Раньше жил в `document-table.css` под именем `.document-head» —
 * только для карточки документа. Координатор 07.09.2026 попросил
 * общий класс: карточка поставки и карточка задания устроены так же
 * (несколько коротких полей и подпись сверху), и вторую копию тех же
 * чисел заводить незачем (правило 0.6). Имя и структуру не меняли —
 * перенесли как есть и переименовали класс везде, где он стоял.
 */

/*
 * Отступ карточки внутри — воздух убран, поля стоят почти вплотную
 * к краю. Поля остаются полями: их нажимают и в них выбирают,
 * сжимается только пустота вокруг.
 */
.record-form .card-body {
    padding: .3rem .4rem;
}

/*
 * Подпись — блочная, и строки вокруг полей схлопнуты.
 *
 * Подпись у Bootstrap строчная, а в шаблоне вокруг неё стоят переносы
 * строк. Браузер считает их за текст и заводит строку в полтора
 * шрифта высотой — восемь точек пустоты над каждым полем, которых
 * нет ни в одном отступе и которые не найти в разборе стилей.
 * На пять полей это сорок точек ни за что.
 */
.record-form .form-label {
    display: block;
    margin-bottom: 0;
    font-size: 11px;
    line-height: 12px;
    color: var(--bs-secondary-color, #6c757d);
}

/* Пустые строки между блоками полей тоже схлопываем. */
.record-form .row > [class*='col-'] {
    line-height: 0;

    /*
     * Колонка ровно по своему полю, а не по самой высокой соседке.
     *
     * Сетка Bootstrap равняет колонки в ряду по высоте: блок поля
     * 34 точки, а колонка — 50, и под каждым полем оставалось
     * по шестнадцать точек пустоты. В разборе стилей их не видно:
     * ни отступов, ни полей — просто растянутая колонка.
     */
    align-self: flex-start;
}

.record-form .row > [class*='col-'] > * {
    line-height: 1.2;
}

/* Полю, которое должно заполнить всю высоту ряда (например заметку),
   даём об этом сказать самому — классом на своей колонке. */
.record-form .row > .record-form-stretch {
    align-self: stretch;
}

/*
 * Поля — ровно те же, что в строке отбора списка: 22 точки высотой,
 * отступ внутри 1 на 6, шрифт 13.
 */
.record-form .form-control,
.record-form .form-select,
.record-form .wms-select-toggle,
.record-form .form-control-plaintext {
    min-height: 22px;
    height: 22px;
    padding: 1px 6px;
    font-size: 13px;
    line-height: 18px;
}

/* Отступ снизу у полей убран: расстояние держит сетка (`g-2`). */
.record-form .mb-0,
.record-form .form-group {
    margin-bottom: 0 !important;
}

/*
 * Между рядами полей зазора нет: сетка расставляет их вплотную.
 *
 * `g-2` у Bootstrap даёт восемь точек по обеим осям. Вбок это
 * по делу — поля не слипаются, — а вниз получалась полоса пустоты
 * между двумя рядами.
 */
.record-form .row {
    --bs-gutter-y: 2px;
}

/*
 * Поле, которое растягивается на весь остаток высоты ряда (заметка
 * и всё похожее): гибкая колонка внутри, ширину берёт всю оставшуюся.
 *
 * `display: flex` сам по себе сбивает ширину колонки сетки — она
 * начинает считаться по содержимому. Класс ставится рядом с колонкой
 * сетки (`col`), а не вместо неё.
 */
.record-form-stretch {
    display: flex;
    flex: 1 1 0;
    min-width: 0;
}

/*
 * Обёртка поля — по прямому потомку, а не по классу: ActiveForm
 * рисует её с именем поля (`field-document-comment`), общего
 * `form-group` там нет вовсе. По классу правило молча не срабатывало.
 */
.record-form-stretch > div {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    width: 100%;
}

.record-form-stretch textarea.form-control {
    flex: 1;
    min-height: 0;
    height: auto;
    resize: none;
}

/*
 * На телефоне растянутое поле не подстраивается под высоту соседей —
 * своя минимальная высота, чтобы было куда вписать пару строк текста.
 */
@media (max-width: 767.98px) {
    .record-form-stretch .form-control {
        min-height: 46px;
    }
}

/*
 * Группа полей — рамка с подписью в разрыве, настоящий `fieldset`
 * и `legend`, а не `div` с серым подзаголовком: семантика честная,
 * и читалка экрана называет группу перед полями внутри. Александр
 * отменил серые подзаголовки с крупными отступами — попросил тот же
 * дух, что у самой формы: тонкая рамка, подпись мелким шрифтом,
 * отступы в пару-тройку точек (координатор 07.09.2026).
 *
 * `legend` браузер и так ставит в разрыв верхней границы сам —
 * специально позиционировать не нужно, только снять фирменные
 * отступы Bootstrap/браузера и подогнать под размер подписи поля
 * (`.form-label`, 11 точек).
 */
.record-form fieldset {
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 4px;
    padding: 8px 6px 6px;
    margin: 0;
    min-width: 0;
}

.record-form legend {
    float: none;
    width: auto;
    padding: 0 4px;
    margin: 0 0 0 .25rem;
    font-size: 11px;
    line-height: 12px;
    color: var(--bs-secondary-color, #6c757d);
}

/* Между группами — тот же зазор, что между рядами полей. */
.record-form fieldset + fieldset,
.record-form .row + fieldset,
.record-form fieldset + .row {
    margin-top: 8px;
}

/* На телефоне группа во всю ширину — тесниться колонками негде. */
@media (max-width: 767.98px) {
    .record-form fieldset {
        width: 100%;
    }
}
