/* ── Компактная шапка страниц (.pms-page-header) ─────────────────────────────────────
   Одна общая разметка на ~57 страницах (справочники, отчёты, журналы, клиенты…): раньше
   крупная карточка с заголовком h4 и подзаголовком в две строки занимала ~110px по высоте.
   Здесь она ужимается до одной строки «заголовок · подзаголовок … кнопки/иконка» — без правки
   разметки страниц. Префикс .pms-main-content нужен, чтобы перебить и общие стили из app.css,
   и переопределения в файлах отдельных страниц (в т.ч. их @media), не трогая их. */

.pms-main-content .pms-page-header {
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    gap: 8px 12px;
    margin-bottom: 12px;
    padding: 10px 16px;
    border-radius: 14px;
    box-shadow: none;
}

    .pms-main-content .pms-page-header > div:first-child {
        display: flex;
        align-items: baseline;
        flex-wrap: wrap;
        gap: 2px 14px;
        /* Сжимается (длинный подзаголовок переносится внутри), а не выталкивает селект/иконку
           на вторую строку шапки; целиком переносится, только когда места меньше 320px. */
        flex: 1 1 320px;
        min-width: 0;
    }

    .pms-main-content .pms-page-header .pms-page-title {
        font-size: 1.35rem;
        line-height: 1.25;
        white-space: nowrap;
    }

    .pms-main-content .pms-page-header .pms-page-subtitle {
        margin-top: 0;
        font-size: .85rem;
    }

    .pms-main-content .pms-page-header .pms-page-header-icon {
        width: 36px;
        height: 36px;
        min-width: 36px;
        border-radius: 12px;
        box-shadow: none;
    }

        .pms-main-content .pms-page-header .pms-page-header-icon .mud-icon-root {
            font-size: 1.25rem;
        }

/* Селект объекта прямо в шапке (как в «Журнале госпитализации»): прижат вправо, к кнопкам/иконке.
   margin-left: auto важнее justify-content: space-between — иначе средний из трёх элементов
   встал бы посередине шапки. */
.pms-main-content .pms-page-header > .pms-page-header-object {
    margin-left: auto;
    width: 300px;
    max-width: 100%;
}

/* Остальные поля шапки (поиск, второй селект) — после селекта объекта, без margin-left: auto. */
.pms-main-content .pms-page-header > .pms-page-header-field {
    width: 260px;
    max-width: 100%;
}

    .pms-main-content .pms-page-header > .pms-page-header-field-wide {
        width: 320px;
    }

    .pms-main-content .pms-page-header .mud-input-control {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

/* Шапка с несколькими полями (объект + поиск/второй селект + кнопки): чтобы всё уместилось в одну
   строку, декоративная иконка страницы скрывается, а заголовок и селект объекта уже. */
.pms-main-content .pms-page-header:has(> .pms-page-header-field) > .pms-page-header-icon {
    display: none;
}

.pms-main-content .pms-page-header:has(> .pms-page-header-field) > div:first-child {
    flex-basis: 180px;
}

.pms-main-content .pms-page-header:has(> .pms-page-header-field) > .pms-page-header-object {
    width: 240px;
}

/* Поле шапки на всю оставшуюся ширину («Перевод пациентов»: поиск после селекта объекта). Заголовок
   тогда не растягивается, а занимает ровно своё место. */
.pms-main-content .pms-page-header > .pms-page-header-field-grow {
    flex: 1 1 260px;
    width: auto;
}

.pms-main-content .pms-page-header:has(> .pms-page-header-field-grow) > div:first-child {
    flex: 0 0 auto;
}

/* «Заезды и потоки»: заполненность выбранного потока рядом с его селектом. */
.pms-main-content .pms-page-header > .camp-header-occupancy {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 170px;
    font-weight: 800;
    white-space: nowrap;
}

/* Карточка фильтров под шапкой — тоже плотнее. */
.pms-main-content .pms-filter-card {
    padding: 12px 14px;
}

@media (max-width: 700px) {
    .pms-main-content .pms-page-header .pms-page-subtitle {
        display: none;
    }
}