/* BagelOps enterprise motion system: short, purposeful transitions with reduced-motion parity. */
:root {
    --bs-motion-fast: 120ms;
    --bs-motion-standard: 200ms;
    --bs-motion-emphasis: 320ms;
    --bs-ease-standard: cubic-bezier(.2, 0, 0, 1);
    --bs-ease-emphasis: cubic-bezier(.2, .8, .2, 1);
}

html {
    scroll-behavior: smooth;
}

.bs-operations-app .ops-page-body {
    animation: bs-page-enter var(--bs-motion-emphasis) var(--bs-ease-emphasis) both;
}

.bs-operations-app .ops-page-body > * {
    animation: bs-content-enter var(--bs-motion-emphasis) var(--bs-ease-emphasis) both;
}

.bs-operations-app .ops-page-body > :nth-child(2) { animation-delay: 35ms; }
.bs-operations-app .ops-page-body > :nth-child(3) { animation-delay: 70ms; }
.bs-operations-app .ops-page-body > :nth-child(4) { animation-delay: 105ms; }
.bs-operations-app .ops-page-body > :nth-child(n+5) { animation-delay: 130ms; }

.bs-operations-app .card,
.bs-operations-app .ops-command,
.bs-operations-app .btn,
.bs-operations-app button,
.bs-operations-app .nav-link,
.bs-operations-app .dropdown-item {
    transition-duration: var(--bs-motion-standard);
    transition-timing-function: var(--bs-ease-standard);
}

.bs-operations-app .card {
    transition-property: transform, box-shadow, border-color;
}

@media (hover: hover) and (pointer: fine) {
    .bs-operations-app .card:not(.modal-content):hover {
        border-color: rgba(154, 106, 36, .42);
        box-shadow: 0 18px 38px rgba(71, 42, 19, .16);
        transform: translateY(-2px);
    }

    .bs-operations-app .btn:hover,
    .bs-operations-app .ops-command:hover {
        transform: translateY(-1px);
    }
}

.bs-operations-app .btn:active,
.bs-operations-app button:active,
.bs-operations-app .ops-command:active {
    transform: translateY(0) scale(.98);
    transition-duration: var(--bs-motion-fast);
}

.bs-operations-app .form-control,
.bs-operations-app .form-select,
.bs-operations-app .form-check-input {
    transition: border-color var(--bs-motion-fast) var(--bs-ease-standard),
        box-shadow var(--bs-motion-fast) var(--bs-ease-standard),
        background-color var(--bs-motion-fast) var(--bs-ease-standard);
}

.bs-operations-sidebar .nav-group.is-flyout-open > .nav-flyout {
    animation: bs-flyout-enter var(--bs-motion-standard) var(--bs-ease-emphasis) both;
    transform-origin: left top;
}

.bs-operations-app .dropdown-menu.show,
.bs-operations-app .ops-account-menu:hover > .dropdown-menu,
.bs-operations-app .ops-account-menu:focus-within > .dropdown-menu {
    animation: bs-dropdown-enter var(--bs-motion-standard) var(--bs-ease-emphasis) both;
    transform-origin: right top;
}

.bs-operations-app .modal.show .modal-dialog {
    animation: bs-dialog-enter var(--bs-motion-emphasis) var(--bs-ease-emphasis) both;
}

.bs-operations-app .toast.show {
    animation: bs-toast-enter var(--bs-motion-emphasis) var(--bs-ease-emphasis) both;
}

.bs-operations-app table tbody tr {
    transition: background-color var(--bs-motion-fast) var(--bs-ease-standard),
        box-shadow var(--bs-motion-fast) var(--bs-ease-standard);
}

.bs-operations-app table tbody tr:hover {
    background-color: rgba(212, 162, 63, .075);
}

.bs-operations-app .badge,
.bs-operations-app .progress-bar {
    transition: width var(--bs-motion-emphasis) var(--bs-ease-emphasis),
        color var(--bs-motion-fast) linear,
        background-color var(--bs-motion-fast) linear;
}

@keyframes bs-page-enter {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes bs-content-enter {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes bs-flyout-enter {
    from { opacity: 0; transform: translateX(-8px) scale(.985); }
    to { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes bs-dropdown-enter {
    from { opacity: 0; translate: 0 -6px; scale: .985; }
    to { opacity: 1; translate: 0 0; scale: 1; }
}

@keyframes bs-dialog-enter {
    from { opacity: 0; transform: translateY(12px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes bs-toast-enter {
    from { opacity: 0; transform: translateX(18px); }
    to { opacity: 1; transform: translateX(0); }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }

    .bs-operations-app *,
    .bs-operations-app *::before,
    .bs-operations-app *::after {
        animation-delay: 0s !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-delay: 0s !important;
        transition-duration: .01ms !important;
    }
}