/* Roster responsive layout overrides in original cascade position. */

@media (max-width: 991.98px) {
    [data-roster-week-controls="manager-actions"] {
        justify-content: center;
    }

    .roster-week-overview-menu {
        width: min(100vw - 1rem, 30rem);
    }

    .roster-week-overview-panel {
        padding: 0.9rem;
    }

    .roster-week-overview-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .roster-week-overview-day,
    .roster-week-overview-day-spacer {
        min-height: 2.6rem;
    }

    .roster-grid {
        min-width: 48rem;
    }

    .roster-grid-header .dropdown-menu {
        z-index: 31;
    }

    .roster-grid-frame:not([data-roster-layout="day_columns"]) {
        --roster-day-column-width: 9.75rem;
        --roster-wage-column-width: 5.9rem;
    }

    .roster-grid-frame[data-roster-layout="day_columns"] {
        --roster-day-column-width: 15rem;
    }

    .roster-slots-scroller {
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        scrollbar-color: var(--app-control-border) transparent;
        scrollbar-width: thin;
    }

}

@media (min-width: 992px) {
    .roster-assignment-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .app-content {
        padding-left: 0.85rem;
        padding-right: 0.85rem;
    }

    .app-page {
        gap: 1.1rem;
    }

    .app-panel-header,
    .app-panel-body,
    .app-auth-body {
        padding: 1.1rem;
    }

    .roster-staff-panel .app-panel-body {
        padding: 1rem;
    }

    .roster-staff-table-head th {
        padding-bottom: 0.45rem;
        font-size: 0.62rem;
    }

    .roster-staff-panel-entry th,
    .roster-staff-panel-entry td {
        padding-top: 0.38rem;
        padding-bottom: 0.38rem;
    }

    .roster-staff-action,
    .roster-staff-action-head {
        display: table-cell;
    }

    .roster-staff-role {
        font-size: 0.62rem;
    }

    .roster-grid {
        font-size: var(--roster-text-xs);
    }

    .roster-day-rail-section .roster-day-label-row {
        padding: 0 0.25rem;
    }

    .roster-day-rail-section .roster-day-actions {
        gap: 0.22rem;
    }

    .roster-day-rail-section .roster-day-action {
        min-width: 1.45rem;
        min-height: 1.45rem;
        padding: 0 0.22rem;
        font-size: 0.8rem;
    }

    .roster-day-rail-section .roster-day-action-toggle {
        min-width: 1.6rem;
        font-size: 0.62rem;
    }

    .roster-day-rail-section .roster-day-action-toggle.is-active {
        min-width: 4.25rem;
    }

    .roster-grid-frame:not([data-roster-layout="day_columns"]) {
        --roster-day-column-width: 5.35rem;
    }

    .roster-slots-scroller {
        scroll-snap-type: x mandatory;
    }

    .roster-slots-scroller[data-horizontal-snap-dragging="true"] {
        scroll-snap-type: none;
    }

    .roster-grid-frame:not([data-roster-layout="day_columns"])[data-roster-end-times="false"] .roster-grid {
        --roster-grid-columns: repeat(var(--roster-slot-count), minmax(0, 0.88fr) minmax(0, 1.46fr) minmax(0, 0.86fr));
        min-width: 100%;
    }

    .roster-grid-frame:not([data-roster-layout="day_columns"])[data-roster-end-times="false"] .roster-slots-grid {
        min-width: calc(var(--roster-slot-count) * 100%);
    }

    .roster-grid-frame:not([data-roster-layout="day_columns"])[data-roster-end-times="true"] .roster-grid {
        --roster-grid-columns: repeat(var(--roster-slot-count), minmax(0, 0.82fr) minmax(0, 0.82fr) minmax(0, 1.44fr) minmax(0, 0.88fr));
        min-width: 100%;
    }

    .roster-grid-frame:not([data-roster-layout="day_columns"])[data-roster-end-times="true"] .roster-slots-grid {
        min-width: calc(var(--roster-slot-count) * 100%);
    }

    .roster-grid .slot-cell-static {
        padding-left: 0.08rem;
        padding-right: 0.08rem;
        font-size: var(--roster-text-xs);
    }

}