/**
 * Узкий экран (< 992px): сайдбар + вкладка «Локации» и её модалки.
 * На широком окне (десктоп, сборка) не применяется.
 * Следующие вкладки добавлять секциями ниже, без ветвления в JS.
 */

@media (max-width: 991.98px) {
    /* —— оболочка —— */
    html {
        --erp-main-left: 0px;
        --erp-main-width: 100%;
        --erp-shell-inset-x: 0.75rem;
    }

    html,
    body.erp-viewport-locked {
        height: 100dvh;
    }

    body.erp-viewport-locked .container-fluid > .row {
        height: 100dvh;
        max-height: 100dvh;
    }

    /* Между 768 и 991 сайдбар уже offcanvas (fixed), но col-md-10 всё ещё 83% — дыра справа. */
    .col-md-10.erp-main-column {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
        padding-left: 0;
        padding-right: 0;
        max-height: 100dvh;
    }

    .erp-sidebar-toggle {
        min-width: 2.75rem;
        min-height: 2.75rem;
        flex: 0 0 auto;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
    }

    .erp-main-column > nav.navbar.navbar-with-modal-tabs {
        position: relative;
        z-index: 1070;
        flex-shrink: 0;
        background-color: #f8f9fa;
        padding-top: max(0.2rem, env(safe-area-inset-top));
        padding-left: max(0.5rem, env(safe-area-inset-left));
        padding-right: max(0.5rem, env(safe-area-inset-right));
        min-height: 2.75rem;
    }

    .erp-main-tab-content {
        padding: 0.75rem 0.75rem 1.25rem;
        padding-left: max(0.75rem, env(safe-area-inset-left));
        padding-right: max(0.75rem, env(safe-area-inset-right));
        padding-bottom: max(1.25rem, env(safe-area-inset-bottom));
    }

    /* Хаб и формы — не 83% десктопной колонки, а вся ширина телефона */
    .erp-right-panel,
    .modal-panel.modal {
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: none !important;
    }

    .modal-panel .modal-dialog {
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: none !important;
        top: var(--erp-shell-top, 42px) !important;
        height: calc(100dvh - var(--erp-shell-top, 42px)) !important;
    }

    /* —— сайдбар —— */
    .sidebar.offcanvas-lg {
        width: min(20rem, 92vw);
        padding-top: env(safe-area-inset-top);
        padding-bottom: env(safe-area-inset-bottom);
        box-shadow: 8px 0 28px rgba(0, 0, 0, 0.35);
    }

    .sidebar-offcanvas-close {
        position: absolute;
        top: 0.65rem;
        right: 0.65rem;
        z-index: 3;
        opacity: 0.85;
        padding: 0.45rem;
        box-sizing: content-box;
    }

    .sidebar-header {
        position: relative;
        padding-right: 2.75rem;
        padding-top: 1.1rem;
        padding-bottom: 0.85rem;
    }

    .sidebar .nav-link {
        min-height: 2.6rem;
        display: flex;
        align-items: center;
        padding: 0.55rem 0.9rem;
        font-size: 0.95rem;
    }

    .sidebar-bottom-dock {
        padding-bottom: max(0.35rem, env(safe-area-inset-bottom));
    }

    .offcanvas-backdrop {
        z-index: 1075;
    }

    /* —— парк локаций —— */
    #postamats .postamat-park-heading .card-body {
        padding: 0.75rem 0.85rem;
    }

    #postamats .erp-ref-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
    }

    #postamats .erp-ref-toolbar .erp-ref-actions {
        margin-left: 0;
        flex-wrap: wrap;
        width: 100%;
    }

    #postamats .erp-ref-toolbar .erp-ref-actions .btn,
    #postamats .erp-ref-toolbar .erp-ref-actions .btn-group {
        flex: 1 1 100%;
    }

    #postamats .erp-ref-toolbar .erp-ref-actions .btn {
        min-height: 2.5rem;
    }

    #postamats .postamat-park-kpis {
        gap: 0.55rem;
    }

    #postamats .postamat-park-kpi {
        padding: 0.7rem 0.8rem;
    }

    #postamats .postamat-park-filters {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.5rem;
        margin-bottom: 0.65rem;
    }

    #postamats .postamat-park-filter-result {
        justify-self: start;
        white-space: normal;
    }

    #postamats .postamat-park-list-card .card-body {
        padding: 0.75rem 0.65rem;
    }

    #postamats .postamat-park-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #postamats .postamat-park-table {
        min-width: 0;
        width: 100%;
        table-layout: fixed;
        font-size: 0.9rem;
    }

    #postamats .postamat-park-check-col,
    #postamats .postamat-park-col-organization,
    #postamats .postamat-park-col-counterparty,
    #postamats .postamat-park-col-remote-graff,
    #postamats .postamat-park-col-link,
    #postamats .postamat-park-capacity-cell,
    #postamats .postamat-park-col-signals {
        display: none;
    }

    #postamats .postamat-park-station-cell {
        width: auto;
        min-width: 0;
    }

    #postamats .btn.postamat-park-station-link {
        display: inline-flex;
        align-items: center;
        min-height: 2.5rem;
        font-size: 1rem;
        line-height: 1.3;
        text-align: left;
        white-space: normal;
    }

    #postamats .postamat-park-col-health {
        width: 8.5rem;
    }

    #postamats .postamat-park-state {
        white-space: normal;
    }

    #postamats .postamat-row-actions {
        width: 3.25rem;
        white-space: nowrap;
    }

    #postamats .postamat-park-table tbody td {
        padding: 0.85rem 0.5rem;
        vertical-align: middle;
    }

    body.erp-compact-mode #postamats .postamat-park-table > :not(caption) > * > * {
        padding: 0.85rem 0.5rem;
    }

    #postamats .postamat-row-actions .btn {
        min-width: 2.5rem;
        min-height: 2.5rem;
    }

    /* —— хаб / модуль —— */
    #postamatHubModal .postamat-hub-header,
    #postamatUnitModal .modal-header {
        padding-top: max(0.5rem, env(safe-area-inset-top));
        padding-left: max(0.75rem, env(safe-area-inset-left));
        padding-right: max(0.75rem, env(safe-area-inset-right));
    }

    #postamatHubModal .modal-body,
    #postamatUnitModal .modal-body {
        padding-left: max(0.75rem, env(safe-area-inset-left));
        padding-right: max(0.75rem, env(safe-area-inset-right));
        padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
    }

    #postamatHubModal .postamat-hub-header-top {
        align-items: flex-start;
        gap: 0.5rem;
        margin-bottom: 0.4rem;
    }

    #postamatHubModal .postamat-hub-header-main {
        flex-direction: column;
        align-items: stretch;
        gap: 0.45rem;
    }

    #postamatHubModal .postamat-hub-header-identity {
        max-width: none;
        flex: 1 1 auto;
        flex-shrink: 0;
        padding-right: 1.75rem;
    }

    #postamatHubModal .postamat-hub-header-statuses {
        width: 100%;
        flex-wrap: wrap;
        align-items: flex-start;
    }

    #postamatHubModal .postamat-status-chip {
        max-width: 100%;
        white-space: nowrap;
    }

    #postamatHubModal .postamat-hub-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        margin: 0 -0.25rem;
        padding-bottom: 0.15rem;
    }

    #postamatHubModal .postamat-hub-tabs::-webkit-scrollbar {
        display: none;
    }

    #postamatHubModal .postamat-hub-tabs .nav-item {
        flex: 0 0 auto;
    }

    #postamatHubModal .postamat-hub-tabs .nav-link {
        white-space: nowrap;
        padding: 0.55rem 0.7rem;
    }

    #postamatHubModal .postamat-hub-station-row {
        justify-content: flex-start;
        max-width: 100%;
        -webkit-overflow-scrolling: touch;
    }

    #postamatHubModal .postamat-hub-now-unit-rail {
        max-width: 100%;
    }

    #postamatUnitModal .postamat-unit-dialog,
    #postamatHubModal .postamat-hub-dialog {
        padding-bottom: env(safe-area-inset-bottom);
        max-width: none !important;
        width: 100% !important;
        margin: 0;
    }

    #postamatCompositionLayoutModal .postamat-layout-editor-dialog {
        max-width: none;
        width: 100%;
        height: 100%;
        margin: 0;
    }

    /* Формы локаций на весь экран — чуть крупнее поля */
    #addPostamatModal .modal-body,
    #editPostamatModal .modal-body,
    #importRemotePostamatsModal .modal-body,
    #addTurnstileModal .modal-body,
    #editTurnstileModal .modal-body,
    #turnstileHubModal .modal-body {
        padding-bottom: max(1rem, env(safe-area-inset-bottom));
    }

    body.erp-compact-mode #postamatHubModal .modal-header,
    body.erp-compact-mode #postamatUnitModal .modal-header,
    body.erp-compact-mode #addPostamatModal .modal-header,
    body.erp-compact-mode #editPostamatModal .modal-header {
        padding-top: max(0.55rem, env(safe-area-inset-top));
    }
}

@media (max-width: 991.98px) and (orientation: landscape),
       (max-width: 991.98px) and (max-height: 520px) {
    .sidebar-header {
        padding-top: 6px;
        padding-bottom: 4px;
        padding-right: 2.5rem;
    }

    .sidebar-offcanvas-close {
        top: 0.35rem;
        right: 0.45rem;
    }
}
