/* ── Плавные анимации модалок и скролла ── */

/* ── Десктоп (≥1024px): scale-entrance вместо резкого Bootstrap slide-down ──
   Opacity оставляем Bootstrap'у (.modal.fade/.modal.show) — он слушает
   transitionend на .modal-dialog и управляет backdrop-кликами через opacity. */
@media (min-width: 1024px) {
    .modal.fade .modal-dialog {
        transform: scale(0.95) translateY(10px);
        transition: transform 0.22s cubic-bezier(0.34, 1.1, 0.64, 1);
        will-change: transform;
    }

    .modal.show .modal-dialog {
        transform: scale(1) translateY(0);
    }
}

/* ── Мобильный (≤1023px): slide-up для bottom-sheet модалок ── */
@media (max-width: 1023.98px) {
    #orderModal.modal.fade .modal-dialog,
    #warehouseModal.modal.fade .modal-dialog {
        transform: translateY(32px);
        transition: transform 0.26s cubic-bezier(0.34, 1.05, 0.64, 1);
        will-change: transform;
    }

    #orderModal.modal.show .modal-dialog,
    #warehouseModal.modal.show .modal-dialog {
        transform: translateY(0);
    }
}

/* ── Shake при первом клике мимо orderModal ── */
@keyframes modal-shake {
    0%   { transform: scale(1) translateX(0); }
    20%  { transform: scale(1) translateX(-7px); }
    40%  { transform: scale(1) translateX(7px); }
    60%  { transform: scale(1) translateX(-4px); }
    80%  { transform: scale(1) translateX(4px); }
    100% { transform: scale(1) translateX(0); }
}

.modal-shake {
    animation: modal-shake 0.38s ease;
}

/* ── Backdrop — чуть быстрее стандартного Bootstrap ── */
.modal-backdrop.fade {
    transition: opacity 0.18s ease;
}

/* ── Скроллируемое тело модалки ── */
.modal-dialog-scrollable .modal-body {
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

/* ── Предотвращаем прыжок страницы при открытии модалки ── */
body.modal-open {
    overflow: hidden;
}

/* ── Канбан: плавный горизонтальный скролл доски ── */
.kanban-board {
    scroll-behavior: smooth;
    overscroll-behavior-x: contain;
}

/* ── Канбан: плавный вертикальный скролл колонки ── */
.kanban-column-body {
    scroll-behavior: smooth;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

/* ── Горизонтальный скролл таблицы заказов и фильтров ── */
.orders-table-wrap,
.board-user-filters {
    scroll-behavior: smooth;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
}
