.reservation-attendance{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-top:5px;min-width:0}
.reservation-attendance .attendance-button{flex:0 1 auto;min-height:36px;margin:0;padding:6px 8px;border:1px solid #bfd4c9;border-radius:7px;background:#fff;color:#245b47;font:600 11px/1.25 var(--sans,Arial,sans-serif);letter-spacing:0;text-transform:none;box-shadow:none;white-space:normal;cursor:pointer}
.reservation-attendance .attendance-button.is-selected{background:#e1f0e7;border-color:#487a60;color:#154e37;box-shadow:inset 0 -2px #487a60}
.reservation-attendance .attendance-button[disabled]{opacity:.65;cursor:default}
.reservation-attendance .attendance-button.is-selected[disabled]{opacity:1}
.reservation-row .reservation-row-open{display:block;width:100%;margin:0;padding:0;border:0;border-radius:2px;box-shadow:none;background:transparent;color:inherit;text-align:left;font:inherit;letter-spacing:0;text-transform:none;cursor:pointer}
.reservation-row .reservation-row-open:focus-visible{outline:2px solid #456d55;outline-offset:3px}
.reservation-row:focus-within{background:#eff5ef}
.reservation-row[data-selected="true"]{background:#eff5ef;box-shadow:inset 4px 0 #456d55}
@media(max-width:600px){.reservation-attendance .attendance-button{min-height:44px;padding:5px 6px;font-size:11px;flex:1 1 55px}}

.reservation-attendance-wrap{display:flex;gap:4px;align-items:flex-start;flex-wrap:wrap}
.reservation-departure{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.reservation-departure .attendance-button{min-height:36px;padding:6px 8px;border:1px solid #bfd4c9;border-radius:7px;background:#fff;color:#245b47;font:600 11px/1.25 var(--sans,Arial,sans-serif);text-transform:none;letter-spacing:0;box-shadow:none;cursor:pointer;margin:0}
.departure-choices{display:flex;flex-wrap:wrap;gap:4px}.departure-choices[hidden]{display:none}.reservation-departure .is-selected{background:#e1f0e7}.reservation-departure button:disabled{opacity:.65;cursor:default}
@media(max-width:600px){.reservation-departure .attendance-button{min-height:44px}}
.reservation-service-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;align-items:stretch;width:100%}
.reservation-service-actions>.attendance-button[data-attendance="arrived"]{grid-column:1;grid-row:1}
.reservation-service-actions>.attendance-button[data-attendance="no_show"]{grid-column:3;grid-row:1}
.reservation-service-actions .reservation-departure{display:contents}
.reservation-service-actions [data-departure-id]{grid-column:2;grid-row:1}
.reservation-service-actions .attendance-button{min-width:0;padding:6px 4px;overflow-wrap:anywhere}
.reservation-service-actions .departure-choices{grid-column:1/-1;grid-row:2;gap:4px}
.reservation-service-actions .departure-feedback{grid-column:1/-1;grid-row:3;font-size:12px;overflow-wrap:anywhere}
.departure-feedback:empty,#reservation-action-feedback:empty{display:none}
.reservation-service-actions .is-selected[disabled]{opacity:1}

/* Pending reservations use the whole row, while the actual status stays readable. */
.reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]),
.reservations-app .reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]){background:#ffe0b2;color:#3c2814;border-color:#d87920;border-radius:10px;box-shadow:inset 0 0 0 1px #d87920}
.reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]):is(:hover,:focus-within,[data-selected="true"]),
.reservations-app .reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]):is(:hover,:focus-within,[data-selected="true"]){background:#ffe0b2;color:#3c2814;box-shadow:inset 0 0 0 2px #b35c13}
.reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]) :is(.reservation-row-phone,.reservation-row-table){color:#5a3715}
.reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]) .attendance-button{background:#fff4e3;color:#5a3715;border-color:#c49b65}
.reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]) .reservation-row-status{color:#773800;font-weight:650}
.reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]) .reservation-row-status i{display:none}
.reservation-pending-label{display:table;padding:4px 8px;border-radius:6px;background:#ffd095;color:#773800;font-weight:650}
@media(max-width:820px){
 .reservations-app .reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]) .reservation-row-status{grid-column:2/4;grid-row:3;justify-content:flex-start;justify-self:start;margin-top:3px;padding:4px 8px;border-radius:6px;background:#ffd095;font-size:12px}
 .reservations-app .reservation-row:is([data-state^="awaiting"],[data-state="payment_review"]) .reservation-row-status>span{display:inline}
}