/* Reservierungsarbeit: Status vor Herkunft, Tischbezug und seltenen Optionen. */
.reservation-row__badges {
    flex-direction: column;
    align-items: flex-end;
    gap: .4rem;
}

.reservation-row__table {
    display: inline-flex;
    align-items: flex-start;
    gap: .35rem;
    max-width: 24rem;
    color: var(--muted);
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.45;
    text-align: right;
    overflow-wrap: anywhere;
}

.reservation-row__table.is-unassigned {
    font-weight: 700;
}

.reservation-row__table svg {
    flex: 0 0 1rem;
    width: 1rem;
    height: 1rem;
    margin-top: .1rem;
}

.reservation-detail-card .detail-facts dd {
    min-width: 0;
    overflow-wrap: anywhere;
}

.reservation-dialog .dialog-status-panel > header > a,
.reservation-dialog .dialog-status-more > summary {
    min-height: 44px;
    align-content: center;
}

.reservation-dialog .dialog-status-quick-actions > button,
.reservation-dialog .dialog-status-more button {
    min-height: 44px;
}

.reservation-dialog .reservation-table-disclosure {
    min-width: 0;
    margin-bottom: 1.35rem;
    border: 1px solid var(--line);
    background: var(--surface-soft);
}

.reservation-table-disclosure > summary {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-height: 44px;
    padding: .85rem;
    list-style: none;
    cursor: pointer;
}
.reservation-table-disclosure > summary::-webkit-details-marker { display: none; }
.reservation-table-disclosure > summary > span { min-width: 0; flex: 1; overflow-wrap: anywhere; }
.reservation-table-disclosure > summary small { display: block; margin-top: .2rem; color: var(--muted); }
.reservation-table-disclosure > summary > .ui-icon:last-child { flex: 0 0 1.2em; }
.reservation-table-disclosure[open] > summary > .ui-icon:last-child { transform: rotate(180deg); }
.reservation-table-disclosure > .dialog-table-assignment { margin: 0; border: 0; border-top: 1px solid var(--line); }

.reservation-dialog .dialog-body { container: reservation-dialog-body / inline-size; }
.reservation-dialog .table-candidate-list,
.reservation-dialog .table-candidate-group,
.reservation-dialog .table-candidate-group legend,
.reservation-dialog .table-candidate,
.reservation-dialog .table-candidate > span {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}
.reservation-dialog .dialog-body button,
.reservation-dialog .dialog-body select {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}

@container reservation-dialog-body (max-width: 30rem) {
    .reservation-dialog .dialog-status-panel,
    .reservation-dialog .dialog-table-assignment,
    .reservation-dialog .table-candidate-group { padding-inline: min(.85rem, 3vw); }
    .reservation-dialog .table-candidate-list { grid-template-columns: minmax(0, 1fr); }
    .reservation-dialog .table-candidate { grid-template-columns: auto minmax(0, 1fr); }
}

.open-request-list { container: open-request-list / inline-size; }
.open-request-list .open-request,
.open-request-list .open-request__actions,
.open-request-list .open-request__deadline,
.open-request-list .open-request-commandbar > div,
.open-request-list .open-request-bulk { min-width: 0; max-width: 100%; }
.open-request-list .open-request__actions { flex-wrap: wrap; }
.open-request-list .button,
.open-request-list .state-badge {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}

@container open-request-list (max-width: 60rem) {
    .open-request-list .open-request { grid-template-columns: minmax(0, 1fr); }
    .open-request-list .open-request__actions .button { flex: 1 1 9rem; }
}

@container open-request-list (max-width: 36rem) {
    .open-request-list .open-request__main { grid-template-columns: minmax(0, 1fr); }
    .open-request-list .open-request__when { display: flex; flex-wrap: wrap; gap: .4rem; }
    .open-request-list .open-request__deadline { white-space: normal; }
}

@media (max-width: 54rem) {
    .reservation-list li.reservation-row .reservation-row__badges {
        align-items: flex-start;
    }

    .reservation-row__table {
        text-align: left;
    }

    .open-request__deadline {
        min-width: 0;
        white-space: normal;
    }

    .open-request__deadline .state-badge {
        max-width: 100%;
        white-space: normal;
    }
}