/* Joblog Schedule Workspace — domain-specific temporal UI only. */
.jl-schedule-card {
    overflow: hidden;
    container-type: inline-size;
}

.jl-schedule-scroll {
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}

.jl-schedule-grid {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(15rem, 1.35fr) repeat(7, minmax(9.5rem, 1fr));
    min-width: 82rem;
}

.jl-schedule-grid__header,
.jl-schedule-grid__identity,
.jl-schedule-grid__day {
    border-right: 1px solid var(--tblr-border-color);
    border-bottom: 1px solid var(--tblr-border-color);
}

.jl-schedule-grid__header {
    position: sticky;
    top: 0;
    z-index: 3;
    min-height: 4.75rem;
    padding: 0.75rem;
    background: var(--tblr-bg-surface);
}

.jl-schedule-grid__identity {
    min-width: 0;
    min-height: 6.5rem;
    padding: 0.875rem;
    overflow: hidden;
    background: var(--tblr-bg-surface);
}

.jl-schedule-grid__day {
    min-width: 0;
    min-height: 6.5rem;
    padding: 0.625rem;
    background: var(--tblr-bg-surface);
}

.jl-schedule-grid__today {
    background: var(--jl-blue-50);
}

.jl-schedule-grid__empty {
    display: inline-block;
    padding: 0.5rem 0.25rem;
    color: var(--tblr-secondary-color);
}

.jl-shift-block {
    width: 100%;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--jl-slate-300);
    border-radius: var(--tblr-border-radius);
    background: var(--jl-slate-100);
    color: var(--jl-slate-900);
    text-align: left;
    cursor: pointer;
}

.jl-shift-block:hover {
    border-color: var(--jl-slate-800);
}

.jl-shift-block:focus-visible {
    outline: 2px solid var(--tblr-primary);
    outline-offset: 2px;
}

.jl-shift-block__group-dot,
.jl-shift-drawer__group-dot {
    flex: 0 0 auto;
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 999px;
    background: var(--jl-shift-group-color, var(--tblr-primary));
}

.jl-shift-block__meta {
    display: block;
    margin-top: 0.25rem;
    overflow: hidden;
    font-size: 0.75rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.jl-shift-drawer__group-dot {
    width: 0.75rem;
    height: 0.75rem;
}

@container (min-width: 65rem) {
    .jl-schedule-grid {
        min-width: 0;
        grid-template-columns: minmax(12rem, 1.35fr) repeat(7, minmax(0, 1fr));
    }

    .jl-schedule-grid__day {
        padding: 0.375rem;
    }

    .jl-shift-block {
        padding: 0.375rem;
    }

    .jl-shift-block .fw-semibold {
        font-size: 0.875rem;
    }
}
