.workflow-dialog{width:min(720px,calc(100vw - 24px));max-height:calc(100dvh - 32px);border:1px solid var(--sand-light,#dedbd5);border-radius:14px;background:var(--bg,#f8f6f1);color:var(--text,#252522);padding:24px;overflow:auto;font:14px/1.55 var(--font-body,Inter,sans-serif)}
.workflow-dialog::backdrop{background:rgba(0,0,0,.4)}.workflow-dialog header{display:flex;align-items:start;justify-content:space-between;gap:16px}.workflow-dialog h2{font:500 25px/1.2 var(--font-heading,Georgia,serif);margin:0 0 16px}.workflow-dialog label{display:flex;flex-direction:column;gap:6px;margin:12px 0}.workflow-dialog input,.workflow-dialog select,.workflow-dialog textarea{font:inherit;color:inherit;background:var(--white,#fff);border:1px solid var(--sand-light,#dedbd5);border-radius:7px;padding:10px;min-width:0;width:100%;box-sizing:border-box}.workflow-dialog textarea{min-height:76px}.workflow-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}.workflow-dialog .workflow-consent{display:flex;flex-direction:row;align-items:flex-start}.workflow-consent input{width:auto;margin-top:6px}.workflow-review{display:grid;grid-template-columns:110px minmax(0,1fr);gap:9px}.workflow-review dt{font-weight:600}.workflow-review dd{margin:0}.workflow-dialog button{min-height:44px;cursor:pointer}.workflow-dialog [role=alert]{color:#a33228}.workflow-actions{display:flex;gap:12px;flex-wrap:wrap}.workflow-request{padding:16px 0;border-top:1px solid var(--sand-light,#dedbd5)}.workflow-dialog :focus-visible{outline:2px solid var(--accent,#6b5635);outline-offset:3px}@media(max-width:480px){.workflow-dialog{padding:16px}.workflow-fields{grid-template-columns:1fr}.workflow-review{grid-template-columns:90px minmax(0,1fr)}}

#workflowStaffForm{max-width:640px;padding:20px;border:1px solid #dedbd5;border-radius:10px}#workflowStaffForm label{display:block;margin:12px 0}#workflowStaffForm textarea,#workflowStaffForm select{display:block;width:100%;padding:10px;font:inherit;box-sizing:border-box}#workflowStaffForm textarea{min-height:90px}#amenityWorkflowQueue :focus-visible,:is(#workflowRequests, #myBookingsContainer) :focus-visible{outline:2px solid #6b5635;outline-offset:3px}:is(#workflowRequests, #myBookingsContainer) button,#amenityWorkflowQueue button{min-height:44px} .workflow-request{overflow-wrap:anywhere}

.workflow-dialog header button{border:1px solid #c8c2b8;border-radius:7px;padding:8px 12px;background:transparent;color:inherit;font:inherit;flex:none}.workflow-dialog .workflow-actions button{border:1px solid #c8c2b8;border-radius:7px;padding:10px 14px;font:inherit}.workflow-dialog .workflow-actions .btn-primary{background:#252522;color:#fff}.workflow-dialog .workflow-actions [data-workflow-edit]{background:transparent;color:inherit}.workflow-dialog .workflow-consent{gap:10px}.workflow-dialog [role=alert]:empty{display:none}

/* Center resident workflow dialogs and use the portal's working-control style. */
#workflowDialog{position:fixed;inset:0;margin:auto;width:min(680px,calc(100vw - 40px));max-height:calc(100dvh - 40px);padding:28px;box-sizing:border-box;border-radius:16px;border:1px solid #d8d3c9;background:var(--resident-paper,#fbfaf7);box-shadow:0 24px 80px rgba(20,20,20,.2);font:400 15px/1.6 var(--font-body,Inter,sans-serif)}
#workflowDialog::backdrop{background:rgba(25,24,22,.38);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
#workflowDialog header{align-items:start;gap:20px;margin-bottom:12px}
#workflowDialog #workflowTitle{font:500 30px/1.2 var(--font-heading,Georgia,serif);text-transform:none;letter-spacing:-.01em;outline:none;margin:0;overflow-wrap:anywhere}
#workflowDialog header button{min-height:42px;border-radius:8px;font:500 13px/1.5 var(--font-body,Inter,sans-serif);padding:9px 13px}
#workflowDialog>p:not([role="alert"]){font-size:14px;line-height:1.65;color:var(--resident-soft,#68665f);margin:0 0 24px}
#workflowDialog label{font:500 13px/1.5 var(--font-body,Inter,sans-serif);margin:0 0 20px;gap:8px;color:var(--dark,#252522);letter-spacing:0;text-transform:none}
#workflowDialog .workflow-fields{gap:0 18px;min-width:0}
#workflowDialog :is(input:not([type="hidden"]):not([type="checkbox"]),select,textarea){min-height:50px;border-radius:8px;padding:12px 14px;font:400 16px/1.5 var(--font-body,Inter,sans-serif);background:var(--resident-paper,#fff);color:var(--dark,#252522);border-color:var(--resident-line,#d8d3c9);min-width:0}
#workflowDialog select{-webkit-appearance:none;appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%2368665f' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
#workflowDialog textarea{min-height:100px;resize:vertical}
#workflowDialog .workflow-form-footer{display:flex;gap:12px;flex-wrap:wrap;padding-top:20px;margin-top:8px;border-top:1px solid var(--resident-line,#d8d3c9)}
#workflowDialog :is(.workflow-form-footer button,.workflow-actions button,form>button){font:500 14px/1.5 var(--font-body,Inter,sans-serif);letter-spacing:0;text-transform:none;min-height:46px;padding:12px 16px;border-radius:8px;border:1px solid var(--resident-line,#d8d3c9);background:transparent;color:var(--dark,#252522)}
#workflowDialog :is(.workflow-form-footer,.workflow-actions,form)>.btn-primary{background:var(--dark,#252522);color:var(--ivory,#f5f3ef);border-color:var(--dark,#252522)}
#workflowDialog button:disabled{opacity:.55;cursor:default}
@media(max-width:600px){#workflowDialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:22px 18px}#workflowDialog #workflowTitle{font-size:27px}#workflowDialog .workflow-fields{grid-template-columns:minmax(0,1fr)}#workflowDialog .workflow-form-footer button{flex:1}#workflowDialog header{gap:12px}}

/* A compact receipt gives the resident useful details and a next step. */
#workflowDialog.workflow-receipt-dialog{width:min(520px,calc(100vw - 24px));padding:28px}
#workflowDialog.workflow-receipt-dialog header{align-items:center;margin:0 0 20px}
#workflowDialog.workflow-receipt-dialog #workflowTitle{font-size:25px}
.workflow-receipt-symbol{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#eee9df;color:#685b42;margin-bottom:16px}
.workflow-receipt-symbol.is-confirmed{background:#e7eee6;color:#405c45}
.workflow-receipt-symbol svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#workflowDialog .workflow-receipt h3{font:500 29px/1.2 var(--font-heading,Georgia,serif);letter-spacing:-.02em;text-transform:none;margin:0 0 12px;overflow-wrap:anywhere}
.workflow-receipt-date{font-size:15px;line-height:1.65;margin:0 0 20px}.workflow-receipt-date span{display:block;color:#68665f;font-size:12px}
.workflow-receipt-facts{margin:0;border-block:1px solid #dedbd5;padding:8px 0}.workflow-receipt-facts>div{display:flex;justify-content:space-between;gap:24px;padding:8px 0}.workflow-receipt-facts dt{color:#68665f;font-size:13px}.workflow-receipt-facts dd{margin:0;text-align:right;overflow-wrap:anywhere}.workflow-receipt-total dd{font-weight:600}
.workflow-receipt-note{font-size:13px;color:#68665f;line-height:1.6;margin:16px 0 22px}.workflow-receipt .workflow-actions>.btn-primary{flex:1}.workflow-receipt .workflow-actions{gap:10px}
@media(max-width:480px){#workflowDialog.workflow-receipt-dialog{padding:22px 18px}#workflowDialog .workflow-receipt h3{font-size:26px}.workflow-receipt .workflow-actions{flex-direction:column}.workflow-receipt .workflow-actions button{width:100%}}

/* Resident history separates the reservation state from its billing outcome. */
#workflowRequests{margin-top:20px;font:400 15px/1.6 var(--font-body,Inter,sans-serif);color:var(--dark,#252522)}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:20px}
:is(#workflowRequests, #myBookingsContainer) h3{font:500 28px/1.25 var(--font-heading,Georgia,serif);text-transform:none;letter-spacing:0;margin:0 0 6px}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-header p{margin:0;color:var(--resident-soft,#68665f);font-size:14px}
:is(#workflowRequests, #myBookingsContainer) button{border:1px solid var(--resident-line,#dedbd5);border-radius:8px;background:transparent;color:inherit;font:500 13px/1.4 var(--font-body,Inter,sans-serif);padding:10px 14px;min-height:44px;cursor:pointer;letter-spacing:0;text-transform:none}
:is(#workflowRequests, #myBookingsContainer) button:hover{background:#f1eee7}#workflowRequests[aria-busy="true"]{opacity:.7}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 24px;border-top:1px solid var(--resident-line,#dedbd5);padding:24px 0;overflow-wrap:anywhere}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-card:last-child{padding-bottom:0}.workflow-history-heading{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-heading h4{font:600 17px/1.4 var(--font-body,Inter,sans-serif);letter-spacing:0;text-transform:none;margin:0}
:is(#workflowRequests, #myBookingsContainer) .workflow-status{font:500 12px/1.5 var(--font-body,Inter,sans-serif);border-radius:99px;padding:4px 10px;background:#eeeae3;color:#5c584f}
:is(#workflowRequests, #myBookingsContainer) .workflow-status[data-status="confirmed"],:is(#workflowRequests, #myBookingsContainer) .workflow-status[data-status="completed"]{background:#e8efe6;color:#3e5b3d}
:is(#workflowRequests, #myBookingsContainer) .workflow-status:is([data-status="pending_management"],[data-status="pending_provider"],[data-status="pending"]){background:#f2ead9;color:#735f39}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-date{font-size:14px;margin:10px 0 3px}:is(#workflowRequests, #myBookingsContainer) .workflow-history-place{font-size:13px;margin:0;color:#68665f}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-outcome{display:flex;flex-direction:column;gap:4px;align-items:flex-end;font-size:12px;color:#68665f}:is(#workflowRequests, #myBookingsContainer) .workflow-history-outcome strong{font-size:19px;font-weight:600;color:#252522}:is(#workflowRequests, #myBookingsContainer) .workflow-history-outcome.is-clear{color:#3e5b3d;font-weight:600;font-size:14px}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-details{grid-column:1/-1;font-size:13px}:is(#workflowRequests, #myBookingsContainer) .workflow-history-details > summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;min-height:40px;font-weight:500}:is(#workflowRequests, #myBookingsContainer) .workflow-history-details > summary::before{content:'+';font-size:18px;color:#68665f}:is(#workflowRequests, #myBookingsContainer) .workflow-history-details[open] > summary::before{content:'−'}:is(#workflowRequests, #myBookingsContainer) .workflow-history-details > summary::-webkit-details-marker{display:none}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-details dl{margin:10px 0;max-width:600px}:is(#workflowRequests, #myBookingsContainer) .workflow-history-details dl>div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;padding:5px 0}:is(#workflowRequests, #myBookingsContainer) dt{color:#68665f}:is(#workflowRequests, #myBookingsContainer) dd{margin:0}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-note{border-left:2px solid #dedbd5;padding:4px 0 4px 14px;margin:14px 0}:is(#workflowRequests, #myBookingsContainer) h5{font:600 12px/1.5 var(--font-body,Inter,sans-serif);text-transform:none;margin:0 0 4px}:is(#workflowRequests, #myBookingsContainer) .workflow-history-note p{margin:0;white-space:pre-line}:is(#workflowRequests, #myBookingsContainer) .workflow-history-reference{font-size:11px;color:#68665f}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-actions,:is(#workflowRequests, #myBookingsContainer) .workflow-history-pagination{display:flex;gap:10px;flex-wrap:wrap;grid-column:1/-1}:is(#workflowRequests, #myBookingsContainer) .workflow-history-pagination{justify-content:space-between;border-top:1px solid #dedbd5;padding-top:20px;margin-top:20px}
:is(#workflowRequests, #myBookingsContainer) .workflow-history-empty{border-top:1px solid #dedbd5;padding:28px 0 4px}:is(#workflowRequests, #myBookingsContainer) .workflow-history-empty p{font-size:14px;color:#68665f}:is(#workflowRequests, #myBookingsContainer) .workflow-text-action{border:0;padding:0;text-decoration:underline;text-underline-offset:3px}
#amenitiesBookingsView>section[hidden]{display:none!important}
@media(max-width:600px){:is(#workflowRequests, #myBookingsContainer) .workflow-history-header{align-items:flex-start;gap:12px}:is(#workflowRequests, #myBookingsContainer) h3{font-size:25px}:is(#workflowRequests, #myBookingsContainer) .workflow-history-header p{font-size:13px}:is(#workflowRequests, #myBookingsContainer) .workflow-history-card{grid-template-columns:minmax(0,1fr);gap:12px}:is(#workflowRequests, #myBookingsContainer) .workflow-history-outcome{align-items:flex-start;flex-direction:row;align-items:center;gap:10px}:is(#workflowRequests, #myBookingsContainer) .workflow-history-date span{display:block}:is(#workflowRequests, #myBookingsContainer) .workflow-history-details dl>div{grid-template-columns:90px minmax(0,1fr)}:is(#workflowRequests, #myBookingsContainer) .workflow-history-heading{align-items:flex-start}}

:is(#workflowRequests, #myBookingsContainer) .workflow-history-date span::before{content:'· '}
@media(max-width:600px){:is(#workflowRequests, #myBookingsContainer) .workflow-history-date span::before{content:''}}

.resident-booking-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px}
.resident-booking-header h3{margin:0!important}
#myBookingsContainer .workflow-history-card{border-top:0;border-bottom:1px solid var(--resident-line,#dedbd5)}
