/* Flow02 composes the existing DS theme and controls; no independent palette. */
.request-shell .overview-body {
  max-width: 1120px;
  padding: 31px 24px 90px;
}
.request-crumb {
  font-size: 12px;
  color: var(--ds-muted);
  margin-bottom: 17px;
  display: flex;
  gap: 10px;
}
.request-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}
.request-heading h1 {
  font: 730 30px/1.2 var(--ds-font);
  letter-spacing: -0.9px;
  margin: 0;
}
.request-heading p {
  font-size: 13px;
  color: var(--ds-muted);
  line-height: 1.5;
  margin: 8px 0;
}
.request-pill {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 100px;
  font-size: 12px;
  font-weight: 700;
  background: var(--ds-dashboard-held);
  color: var(--ds-dashboard-held-ink);
}
.request-pill[data-state='confirmed'] {
  background: var(--ds-dashboard-booked);
  color: var(--ds-dashboard-booked-ink);
}
.request-pill[data-state='rejected'],
.request-pill[data-state='cancelled'] {
  background: var(--ds-dashboard-blocked);
  color: var(--ds-muted);
}
.request-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.86fr);
  gap: 18px;
  align-items: start;
}
.request-col {
  display: grid;
  gap: 17px;
}
.request-card {
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-panel);
  padding: 24px;
  box-shadow: var(--ds-dashboard-shadow);
}
.request-card h2 {
  font: 700 17px/1.3 var(--ds-font);
  margin: 0 0 20px;
  letter-spacing: -0.2px;
}
.request-property,
.request-guest {
  display: flex;
  gap: 11px;
  align-items: center;
}
.request-property {
  margin-bottom: 19px;
}
.request-property > span {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  background: var(--ds-action-soft);
  color: var(--ds-action);
  border-radius: 12px;
  flex-shrink: 0;
}
.request-property strong,
.request-guest strong {
  font-size: 14px;
}
.request-property p,
.request-guest p {
  font-size: 13px;
  color: var(--ds-muted);
  margin: 4px 0 0;
  line-height: 1.5;
}
.request-dates {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.request-dates > div {
  background: var(--ds-dashboard-free);
  border-radius: 10px;
  padding: 14px;
}
.request-dates small {
  display: block;
  font-size: 11px;
  color: var(--ds-muted);
  margin-bottom: 5px;
}
.request-dates strong {
  font-size: 14px;
  overflow-wrap: anywhere;
}
.request-stay {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-top: 17px;
  font-size: 14px;
}
.request-stay > span:last-child {
  color: var(--ds-muted);
}
.request-total {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  margin: 12px 0 16px;
}
.request-total strong {
  font-size: 21px;
}
.request-money {
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--ds-line);
  padding-top: 16px;
  margin-top: 16px;
  font-size: 13px;
}
.request-card details {
  margin-top: 14px;
}
.request-card summary {
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  min-height: 44px;
  line-height: 1.5;
  padding: 8px 0;
}
.request-col > details.request-card > summary {
  font-size: 15px;
}
.request-guest > span {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  background: var(--ds-action-soft);
  color: var(--ds-action);
  font-weight: 700;
  border-radius: 50%;
  flex-shrink: 0;
}
.request-help {
  line-height: 1.6;
  color: var(--ds-muted);
  font-size: 13px;
  margin: 0 0 18px;
}
.request-shell .ds-button {
  white-space: normal;
}
.request-shell .request-primary {
  background: var(--ds-action);
  color: var(--ds-paper);
  border-color: var(--ds-action);
}
.request-shell .request-decline {
  color: var(--ds-danger);
  border-color: var(--ds-line);
  background: var(--ds-paper);
}
#request-actions {
  display: grid;
  gap: 9px;
}
#request-actions > .ds-button {
  width: 100%;
}
.request-notice {
  padding: 17px;
  background: var(--ds-dashboard-free);
  border: 1px solid var(--ds-line);
  border-radius: 11px;
  font-size: 13px;
  line-height: 1.6;
}
.request-notice p {
  margin: 10px 0;
}
.request-notice .ds-button {
  margin-top: 9px;
  width: 100%;
}
.request-form {
  display: grid;
  gap: 14px;
}
.request-form label,
#request-actions > label {
  display: grid;
  gap: 7px;
  font: 650 13px/1.5 var(--ds-font);
}
.request-form input,
.request-form textarea,
#request-actions input {
  margin: 0;
  font: 400 14px/1.5 var(--ds-font);
  color: var(--ds-ink);
  background: var(--ds-paper);
  border: 1px solid var(--ds-control-border);
  border-radius: var(--ds-radius-control);
  min-height: 44px;
  max-width: 100%;
}
.request-card .meta,
.request-card .request-price p {
  font-size: 13px;
}
.request-card p,
.request-card a,
.request-card span {
  overflow-wrap: anywhere;
}
.request-failure {
  padding: 32px 24px;
  max-width: 1120px;
  margin: auto;
}
.request-failure a {
  display: inline-flex;
  padding: 12px;
}
.request-shell [data-copy-result]:empty {
  display: none;
}
.request-shell #request-ui-error:empty {
  display: none;
}
.request-shell .hms-form {
  gap: 14px;
}
.request-shell .booking-terms {
  padding: 12px;
}
.request-shell .booking-terms h3 {
  font-size: 16px;
}
@media (max-width: 760px) {
  .request-shell .overview-body {
    padding: 25px 17px 100px;
  }
  .request-heading {
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 18px;
  }
  .request-heading h1 {
    font-size: 26px;
  }
  .request-heading .request-calendar {
    flex-direction: column;
    min-width: 85px;
    padding: 12px;
  }
  .request-heading > div {
    flex: 1;
  }
  .request-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }
  .request-col {
    gap: 14px;
  }
  .request-card {
    padding: 18px;
  }
  .request-shell .ds-button {
    min-height: 45px;
  }
}

.request-price-line {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 14px;
  color: var(--ds-muted);
  margin: 12px 0;
}
.request-total {
  border-top: 1px solid var(--ds-line);
  padding-top: 16px;
  margin-top: 15px;
}
.request-shell .ds-button {
  font-size: 13px;
  font-weight: 650;
}
.request-heading h1:focus {
  outline: none;
}

/* Flow02 disclosures share the dashboard theme, including legacy action hosts. */
.request-card summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  list-style: none;
  color: var(--ds-action);
  font-weight: 700;
}
.request-card summary::-webkit-details-marker {
  display: none;
}
.request-card summary::after {
  content: '';
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  flex-shrink: 0;
  margin-right: 4px;
}
.request-card details[open] > summary::after {
  transform: rotate(225deg);
}
.request-card summary:focus-visible {
  outline: 2px solid var(--ds-focus);
  outline-offset: 3px;
  border-radius: var(--ds-radius-control);
}
.request-card details > .booking-terms,
.request-card details > .price-breakdown,
#request-deposit,
#request-notifications {
  background: var(--ds-dashboard-free);
  border: 0;
  border-radius: var(--ds-radius-panel);
  padding: 16px;
  font: 400 13px/1.6 var(--ds-font);
  color: var(--ds-muted);
}
.request-shell .booking-terms {
  margin: 0;
  border: 0;
  background: transparent;
  padding: 0;
  font: inherit;
}
.request-card details > .booking-terms {
  padding: 16px;
  background: var(--ds-dashboard-free);
}
.request-shell .booking-terms h4 {
  font: 700 13px/1.5 var(--ds-font);
  margin: 0 0 8px;
  color: var(--ds-ink);
}
.request-shell .booking-terms .terms-value {
  white-space: pre-wrap;
  margin: 0 0 16px;
}
.request-shell .booking-terms .meta {
  font-size: 11px;
  line-height: 1.5;
  color: var(--ds-muted);
}
.request-shell #request-deposit h3 {
  font: 700 14px/1.5 var(--ds-font);
  margin: 0 0 8px;
}
.request-shell #request-deposit p {
  margin: 0 0 12px;
}
.request-shell #request-deposit .hms-form {
  margin: 8px 0 16px;
  display: grid;
  gap: 12px;
}
.request-shell #request-deposit label {
  display: grid;
  gap: 6px;
  font: 600 12px/1.5 var(--ds-font);
}
.request-shell #request-deposit :is(input, select) {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--ds-control-border);
  border-radius: var(--ds-radius-control);
  background: var(--ds-paper);
  color: var(--ds-ink);
  font: 400 13px/1.5 var(--ds-font);
}
.request-shell #request-deposit .ds-button {
  border-radius: var(--ds-radius-control);
  font: 650 13px/1.5 var(--ds-font);
  padding: 10px 14px;
  min-height: 44px;
  background: var(--ds-paper);
  color: var(--ds-action);
  border: 1px solid var(--ds-line);
}
.request-shell #request-deposit .request-primary {
  background: var(--ds-action);
  color: var(--ds-paper);
  border-color: var(--ds-action);
}
.request-shell #request-deposit [role='alert']:empty,
.request-shell #request-notifications [role='alert']:empty {
  display: none;
}
.request-shell #request-notifications .panel {
  padding: 12px 0;
  margin: 0;
  border: 0;
  border-top: 1px solid var(--ds-line);
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}
.request-shell #request-notifications p {
  margin: 6px 0 12px;
}
.request-shell #request-notifications .meta {
  font-size: 11px;
  line-height: 1.5;
}
.request-card .price-breakdown h3 {
  display: none;
}
.request-card .price-breakdown p {
  margin: 8px 0;
  font-size: 13px;
}
.request-card .price-breakdown details {
  margin-top: 0;
}
#request-deposit {
  position: relative;
  background: transparent;
  padding: 0;
}
.request-shell #request-deposit .request-add {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  text-align: left;
  margin: 10px 0;
  background: var(--ds-dashboard-free);
  border-color: var(--ds-line);
  padding: 14px;
}
.request-add > span + span {
  font-size: 21px;
}
.request-dialog {
  width: min(480px, calc(100vw - 32px));
  box-sizing: border-box;
  max-height: 85dvh;
  overflow: auto;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-panel);
  padding: 24px;
  color: var(--ds-ink);
  background: var(--ds-paper);
}
.request-dialog::backdrop {
  background: rgb(0 0 0 / 0.35);
}
.request-dialog-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}
.request-dialog-heading h2 {
  margin: 0;
  font: 700 19px/1.4 var(--ds-font);
}
.request-dialog p {
  font-size: 13px;
  line-height: 1.6;
}
.request-ledger {
  margin-top: 20px;
  border-top: 1px solid var(--ds-line);
  padding-top: 16px;
}
.request-ledger h3 {
  font-size: 13px;
}
.request-ledger p {
  font-size: 12px;
  color: var(--ds-muted);
}
.request-ledger-row {
  padding: 12px 0;
  border-top: 1px solid var(--ds-line);
  font-size: 13px;
}
.request-ledger-row small {
  display: block;
  margin-top: 4px;
  color: var(--ds-muted);
  font-size: 11px;
}
.request-operation-menu {
  float: right;
  position: relative;
  margin: 0 !important;
}
.request-operation-menu > summary {
  justify-content: center;
  font-size: 24px;
  padding: 0;
  width: 44px;
}
.request-operation-menu > summary::after {
  display: none;
}
.request-operation-menu > div {
  position: absolute;
  right: 0;
  top: 44px;
  z-index: 2;
  min-width: 210px;
  padding: 8px;
  background: var(--ds-paper);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  box-shadow: var(--ds-dashboard-shadow);
}
.request-shell #request-deposit [hidden] {
  display: none !important;
}
@media (max-width: 760px) {
  .request-dialog {
    width: 100%;
    max-width: 100%;
    margin: auto 0 0;
    max-height: 90dvh;
    border-radius: var(--ds-radius-panel) var(--ds-radius-panel) 0 0;
    padding: 20px;
  }
}
.request-deposit-summary {
  clear: both;
  display: grid;
  gap: 16px;
  margin-bottom: 18px;
}
.deposit-state {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border-radius: var(--ds-radius-control);
  background: var(--ds-dashboard-free);
  font-size: 14px;
  color: var(--ds-ink);
}
.deposit-state[data-state='confirmed'] {
  background: var(--ds-accent-soft);
  color: var(--ds-accent);
}
.deposit-state > span {
  font-size: 19px;
}

.deposit-reserve {
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  padding: 14px;
  background: var(--ds-dashboard-free);
}
.request-shell #request-deposit .deposit-reserve h3 {
  color: var(--ds-ink);
  font-size: 14px;
  margin: 0 0 8px;
}
.request-shell #request-deposit .deposit-reserve p {
  font-size: 12px;
  line-height: 1.6;
  margin: 0 0 8px;
}
.deposit-reserve small {
  display: block;
  font-size: 11px;
  line-height: 1.5;
  color: var(--ds-muted);
}
.deposit-deadline {
  display: grid;
  gap: 4px;
  margin: 12px 0;
  font-size: 12px;
}
.deposit-deadline strong {
  font-size: 14px;
  color: var(--ds-ink);
}
.deposit-required strong {
  display: block;
  color: var(--ds-ink);
  margin-top: 4px;
}
.deposit-warning {
  border-top: 1px solid var(--ds-line);
  padding-top: 10px;
}
.request-shell #request-deposit .request-ledger h3 {
  font-size: 12px;
  color: var(--ds-muted);
  margin-bottom: 12px;
}
.request-ledger-row strong {
  color: var(--ds-ink);
  font-size: 14px;
}
.request-ledger-row p {
  padding: 8px 10px;
  background: var(--ds-dashboard-free);
  border-radius: var(--ds-radius-control);
  margin-top: 8px !important;
}
.request-guest-message {
  border-top: 1px solid var(--ds-line);
  margin-top: 16px;
  padding-top: 12px;
  font-size: 13px;
  line-height: 1.6;
}
.request-guest-message small {
  color: var(--ds-muted);
  font-size: 11px;
}
.request-guest-message p {
  margin: 6px 0 0;
  white-space: pre-wrap;
}
.request-management {
  width: min(620px, calc(100vw - 32px));
}
.request-management .hms-form {
  display: grid;
  gap: 14px;
}
.request-management label {
  display: grid;
  gap: 6px;
  font: 600 13px/1.5 var(--ds-font);
}
.request-management :is(input:not([type='checkbox']):not([type='radio']), select, textarea) {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--ds-control-border);
  border-radius: var(--ds-radius-control);
  padding: 10px 12px;
  color: var(--ds-ink);
  background: var(--ds-paper);
  font: 400 14px/1.5 var(--ds-font);
}
.request-management input[type='checkbox'] {
  width: 18px;
  height: 18px;
  margin: 0;
}
.request-management .hms-form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.request-management button:disabled {
  opacity: 0.5;
  cursor: default;
}
.request-management .panel {
  border: 1px solid var(--ds-line);
  padding: 14px;
  border-radius: var(--ds-radius-control);
  background: var(--ds-dashboard-free);
}
.request-management h3 {
  font-size: 16px;
}
.request-management .meta {
  font-size: 12px;
  color: var(--ds-muted);
}
.request-management [hidden] {
  display: none !important;
}
.request-management [role='alert']:empty {
  display: none;
}
@media (max-width: 760px) {
  .request-management {
    width: 100%;
    max-width: 100%;
  }
  .request-management .hms-form-row {
    grid-template-columns: 1fr;
  }
}
.request-management label:has(> input[type='checkbox']) {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.request-management input[type='checkbox'] {
  flex-shrink: 0;
  margin-top: 2px;
}
.request-stay-actions {
  margin: 12px 0;
}
.request-stay-actions > .ds-button {
  width: 100%;
}
.request-payment-actions {
  display: grid;
  gap: 8px;
  margin: 14px 0;
}
.request-payment-actions > .ds-button {
  width: 100%;
}

/* Date fields and calendar form one anchored, non-modal surface. */
.request-management .ds-calendar-fields {
  margin-bottom: 0;
}
.proposal-calendar-popup {
  position: fixed;
  margin: 0;
  padding: 0;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  background: var(--ds-paper);
  color: var(--ds-ink);
  box-sizing: border-box;
  overflow: auto;
  box-shadow: 0 12px 32px rgb(0 0 0 / 0.18);
}
.proposal-calendar-popup:not(:popover-open) {
  display: none;
}
.proposal-calendar-popup::backdrop {
  background: transparent;
  pointer-events: none;
}
.proposal-calendar-header {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--ds-paper);
  border-bottom: 1px solid var(--ds-line);
}
.proposal-calendar-header .ds-calendar-fields {
  margin: 0;
  border: 0;
}
.proposal-calendar-header .ds-calendar-fields > .ds-button {
  min-width: 0;
}
.proposal-calendar-body {
  padding: 14px 16px 16px;
}
.proposal-calendar-body .ds-calendar-month > h3 {
  display: none;
}
.proposal-calendar-body .ds-calendar-bottom {
  flex-wrap: wrap;
  gap: 10px;
}
.proposal-calendar-body .ds-calendar-bottom > .ds-help {
  flex-basis: 100%;
  max-width: none;
}
.proposal-calendar-body .ds-calendar-bottom > .ds-button:last-child {
  margin-left: auto;
}

.proposal-compact {
  display: grid;
  gap: 0 !important;
}
.proposal-context {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 0 16px;
  color: var(--ds-ink);
}
.proposal-context > span {
  font-size: 13px;
  color: var(--ds-muted);
}
.proposal-compact .proposal-row {
  padding: 16px 0;
  border-bottom: 1px solid var(--ds-line);
}
.proposal-row-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.proposal-row-top > div {
  min-width: 0;
  flex: 1;
}
.proposal-row-top h3 {
  margin: 0 0 6px;
  font: 650 14px/1.5 var(--ds-font);
  color: var(--ds-ink);
}
.proposal-row-top > div > div {
  display: grid;
  gap: 4px;
  font-size: 14px;
  overflow-wrap: anywhere;
}
.proposal-row-top small {
  font-size: 12px;
  color: var(--ds-muted);
}
.proposal-row-top strong {
  font-weight: 650;
  color: var(--ds-action);
}
.proposal-row-top > .ds-button {
  flex-shrink: 0;
  min-height: 44px;
  padding: 8px 12px;
  font-size: 13px;
}
.proposal-row-editor:not([hidden]) {
  display: grid;
  gap: 12px;
  padding: 16px;
  margin-top: 12px;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  background: var(--ds-soft);
}
.proposal-compact > label {
  margin-top: 18px;
}
.proposal-compact .proposal-footer {
  position: sticky;
  bottom: -24px;
  background: var(--ds-paper);
  border-top: 1px solid var(--ds-line);
  padding: 14px 0 6px;
  margin-top: 18px;
  z-index: 4;
  display: grid;
  gap: 8px;
}
.proposal-footer > p {
  margin: 0;
}
.proposal-footer [role='status'] {
  font-size: 12px;
  color: var(--ds-muted);
}
.proposal-footer > .request-primary {
  width: 100%;
}
.proposal-delta {
  font-weight: 650;
  color: var(--ds-action);
}
.proposal-delta:empty {
  display: none;
}
@media (max-width: 760px) {
  .proposal-compact .proposal-footer {
    bottom: -20px;
    padding-bottom: max(8px, env(safe-area-inset-bottom));
  }
  .proposal-row-top {
    gap: 10px;
  }
  .proposal-row-editor:not([hidden]) {
    padding: 12px;
  }
}
.request-management:has(.proposal-compact) > .request-dialog-heading {
  position: sticky;
  top: -24px;
  background: var(--ds-paper);
  z-index: 6;
  padding: 8px 0;
}
@media (max-width: 760px) {
  .request-management:has(.proposal-compact) > .request-dialog-heading {
    top: -20px;
  }
}

/* The compact date row opens range selection without repeating date fields. */
.proposal-compact [data-proposal-dates] > .ds-calendar > .ds-calendar-fields,
.proposal-compact [data-proposal-dates] > .ds-calendar > .ds-calendar-status {
  display: none;
}
.proposal-compact [data-summary-row='dates'] > .proposal-row-editor:not([hidden]) {
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  gap: 0;
}
.proposal-calendar-header:has([role='status']) {
  padding: 14px 16px;
}
.proposal-calendar-header > strong {
  display: block;
  font: 700 18px/1.4 var(--ds-font);
  color: var(--ds-ink);
}
.proposal-calendar-header > p {
  margin: 5px 0 0;
  font: 400 13px/1.5 var(--ds-font);
  color: var(--ds-muted);
}
.proposal-calendar-header > [role='status'] {
  color: var(--ds-action);
  font-weight: 600;
}

.proposal-guest-context {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0 12px;
  min-width: 0;
}
.proposal-guest-avatar {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--ds-action-soft);
  color: var(--ds-action);
  font: 650 14px/1 var(--ds-font);
}
.proposal-guest-context > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.proposal-guest-context strong {
  font-size: 15px;
  overflow-wrap: anywhere;
}
.proposal-guest-context a {
  font: 500 12px/1.5 var(--ds-font);
  color: var(--ds-action);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.proposal-guest-context a:focus-visible {
  outline: 2px solid var(--ds-action);
  outline-offset: 3px;
  border-radius: 3px;
}

.proposal-calendar-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.proposal-calendar-actions > .ds-button {
  min-height: 44px;
  padding: 8px 12px;
  font-size: 13px;
}
.proposal-calendar-header > .ds-calendar-toolbar {
  margin: 12px 0 0;
}
.proposal-calendar-header > .ds-calendar-toolbar > .ds-button {
  min-width: 44px;
  min-height: 44px;
}

/* Keep the range summary and actions together instead of stacking empty rows. */
.proposal-calendar-header:has([role='status']) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 16px;
  row-gap: 3px;
  padding: 12px 16px;
}
.proposal-calendar-header > strong {
  grid-column: 1;
  grid-row: 1;
}
.proposal-calendar-header > p {
  grid-column: 1;
  margin: 0;
}
.proposal-calendar-header > .proposal-calendar-actions {
  grid-column: 2;
  grid-row: 1 / 4;
  align-self: start;
  margin: 0;
  gap: 8px;
}
.proposal-calendar-header > .ds-calendar-toolbar {
  grid-column: 1 / -1;
  margin: 6px 0 0;
}
@media (max-width: 480px) {
  .proposal-calendar-header:has([role='status']) {
    column-gap: 8px;
    padding: 10px 12px;
  }
  .proposal-calendar-header > .proposal-calendar-actions {
    gap: 2px;
  }
  .proposal-calendar-actions > .ds-button {
    padding: 8px;
    font-size: 12px;
  }
  .proposal-calendar-header > strong {
    font-size: 16px;
  }
  .proposal-calendar-header > p {
    font-size: 12px;
  }
}

/* Manual booking uses the same DS controls and range surface as owner proposals. */
.hms-form.new-booking-form {
  display: grid;
  gap: 18px;
}
.new-booking-form > .hms-form-row[hidden] {
  display: none;
}
.new-booking-form label {
  font: 600 13px/1.5 var(--ds-font);
  color: var(--ds-ink);
}
.new-booking-form input:not([type='checkbox']):not([type='hidden']),
.new-booking-form textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  padding: 11px 14px;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  background: var(--ds-paper);
  color: var(--ds-ink);
  font: 400 14px/1.5 var(--ds-font);
}
.new-booking-form input[type='checkbox'] {
  width: 18px;
  height: 18px;
  accent-color: var(--ds-action);
  flex-shrink: 0;
}
.new-booking-form label:has(> input[type='checkbox']) {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.new-booking-form fieldset {
  min-width: 0;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  padding: 16px;
  display: grid;
  gap: 14px;
  margin: 0;
}
.new-booking-form legend {
  font: 650 15px/1.5 var(--ds-font);
  padding: 0 6px;
}
.new-booking-form .meta {
  font: 400 12px/1.5 var(--ds-font);
  color: var(--ds-muted);
  margin: 0;
}
.new-booking-form .hms-form-row {
  gap: 12px;
}
.new-booking-form #hms-new-guest {
  display: grid;
  gap: 12px;
}
.new-booking-form #hms-new-guest[hidden] {
  display: none;
}
.new-booking-date-trigger {
  width: 100%;
  min-height: 52px;
  text-align: left;
  white-space: normal;
}
.new-booking-form #hms-save {
  min-height: 44px;
  background: var(--ds-action);
  color: var(--ds-paper);
  border: 1px solid var(--ds-action);
  border-radius: var(--ds-radius-control);
  font: 650 14px/1.5 var(--ds-font);
}
.new-booking-form #hms-save:disabled {
  opacity: 0.5;
}
.new-booking-form [role='status'] {
  font: 500 13px/1.5 var(--ds-font);
}
.new-booking-form .ds-field {
  max-width: none;
}
.new-booking-form .ds-select-root {
  width: 100%;
}
.new-booking-date-trigger {
  justify-content: flex-start;
  font-weight: 500;
}
.new-booking-form [data-requote] {
  background: var(--ds-soft);
  color: var(--ds-action);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  min-height: 44px;
}
.new-booking-form #hms-save {
  position: sticky;
  bottom: -24px;
  z-index: 3;
}
.new-booking-form #hms-rates-details h3 {
  font-size: 15px;
}
@media (max-width: 760px) {
  .new-booking-form #hms-save {
    bottom: -20px;
  }
}
.new-booking-form [data-price-result] h3 {
  font: 650 15px/1.5 var(--ds-font);
}

/* Scroll only the form body; heading and primary action stay in view. */
.hms-dialog[open]:has(.new-booking-form) {
  display: flex;
  flex-direction: column;
  height: min(92dvh, 1000px);
  max-height: 92dvh;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
}
.hms-form.new-booking-form {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  gap: 0;
  margin: 0;
}
.new-booking-scroll {
  min-height: 0;
  flex: 1;
  overflow: auto;
  display: grid;
  gap: 18px;
  padding: 20px 24px;
  scroll-padding: 16px;
}
.new-booking-scroll > .hms-form-row[hidden] {
  display: none;
}
.new-booking-footer {
  flex-shrink: 0;
  padding: 14px 24px max(14px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--ds-line);
  background: var(--ds-paper);
}
.new-booking-form .new-booking-footer #hms-save {
  position: static;
  width: 100%;
  margin: 0;
}
.new-booking-scroll > label,
.new-booking-scroll > div {
  min-width: 0;
}
@media (max-width: 760px) {
  .new-booking-scroll {
    padding: 18px 20px;
  }
  .new-booking-footer {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* Reuse the approved proposal heading, including its close-button component. */
.hms-dialog[open]:has(.new-booking-form) {
  width: min(620px, calc(100vw - 32px));
}
.hms-dialog:has(.new-booking-form) > .request-dialog-heading {
  flex-shrink: 0;
  margin: 0;
  padding: 32px 24px 8px;
  background: var(--ds-paper);
  z-index: 4;
  gap: 12px;
}
.hms-dialog:has(.new-booking-form) > .request-dialog-heading h2 {
  font: 700 19px/1.4 var(--ds-font);
  margin: 0;
}
.new-booking-scroll {
  padding-top: 18px;
}
@media (max-width: 760px) {
  .hms-dialog[open]:has(.new-booking-form) {
    width: 100%;
    max-width: 100%;
  }
  .hms-dialog:has(.new-booking-form) > .request-dialog-heading {
    padding: 28px 20px 8px;
  }
}

/* Preserve the proposal header's slight upward compaction on scroll. */
.hms-dialog:has(.new-booking-form) > .request-dialog-heading {
  padding-top: calc(32px - var(--ds-dialog-header-shift, 0px));
}
@media (max-width: 760px) {
  .hms-dialog:has(.new-booking-form) > .request-dialog-heading {
    padding-top: calc(28px - var(--ds-dialog-header-shift, 0px));
  }
}

/* Flow 05 v0.4: stay → guest/services → review, using the existing controls. */
.hms-dialog[open].booking-create-flow {
  width: min(1040px, calc(100vw - 32px));
}
.create-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 12px 24px 18px;
  flex-shrink: 0;
  background: var(--ds-paper);
}
.create-steps li {
  display: flex;
  align-items: center;
  gap: 8px;
  border-bottom: 3px solid var(--ds-line);
  padding-bottom: 12px;
  font: 500 12px/1.4 var(--ds-font);
  color: var(--ds-muted);
}
.create-step-number {
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--ds-soft);
  width: 26px;
  height: 26px;
  flex-shrink: 0;
}
.create-steps [data-state='current'],
.create-steps [data-state='done'] {
  border-color: var(--ds-action);
  color: var(--ds-action);
}
.create-steps [data-state='current'] .create-step-number {
  background: var(--ds-action);
  color: var(--ds-paper);
}
.create-step {
  min-width: 0;
}
.create-step[hidden],
.new-booking-footer [hidden] {
  display: none !important;
}
.create-stay {
  max-width: 620px;
  width: 100%;
  margin: auto;
  display: grid;
  gap: 18px;
}
.create-step h3 {
  margin: 0 0 6px;
  font: 700 18px/1.4 var(--ds-font);
}
.create-columns {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.create-review-card {
  display: grid;
  gap: 16px;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  padding: 20px;
  min-width: 0;
}
.create-property-title {
  font-size: 17px;
}
.create-stay-summary,
.create-note {
  padding: 14px;
  background: var(--ds-soft);
  border-radius: var(--ds-radius-control);
  overflow-wrap: anywhere;
}
.create-review-card p {
  margin: 0;
}
.create-guest-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  background: var(--ds-soft);
  padding: 4px;
  border-radius: var(--ds-radius-control);
}
.create-guest-tabs .ds-button {
  background: transparent;
  border-color: transparent;
}
.create-guest-tabs .ds-button[aria-pressed='true'] {
  background: var(--ds-paper);
  color: var(--ds-action);
  border-color: var(--ds-line);
}
.create-guest-search {
  display: grid;
  gap: 8px;
  position: relative;
}
.create-guest-hits {
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  padding: 8px;
  max-height: 240px;
  overflow: auto;
  background: var(--ds-paper);
}
.create-guest-hits[hidden] {
  display: none;
}
.create-guest-hit {
  display: grid;
  gap: 4px;
  width: 100%;
  min-height: 44px;
  padding: 10px;
  background: var(--ds-paper);
  border: 0;
  border-radius: 8px;
  text-align: left;
  color: var(--ds-ink);
  font: 400 13px/1.5 var(--ds-font);
}
.create-guest-hit:hover,
.create-guest-hit:focus-visible {
  background: var(--ds-action-soft);
}
.create-guest-hit small {
  color: var(--ds-muted);
}
.create-guest-summary {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  background: var(--ds-soft);
  border-radius: var(--ds-radius-control);
}
.create-guest-summary[hidden] {
  display: none;
}
.create-guest-summary > div {
  min-width: 0;
  display: grid;
  gap: 4px;
  flex: 1;
  overflow-wrap: anywhere;
}
.create-guest-summary small {
  font-size: 11px;
  color: var(--ds-muted);
}
.create-guest-summary button {
  flex-shrink: 0;
  padding: 8px;
}
.create-step-error {
  color: var(--ds-danger);
  margin: 0;
}
.create-step-error:empty {
  display: none;
}
.booking-create-flow .new-booking-footer {
  display: flex;
  gap: 12px;
  justify-content: space-between;
}
.booking-create-flow .new-booking-footer > #hms-save {
  width: auto;
  margin-left: auto;
}
.booking-create-flow .new-booking-footer > button {
  min-height: 44px;
}
.booking-create-flow .new-booking-scroll {
  display: block;
  background: var(--ds-paper);
}
.booking-create-flow .new-booking-scroll > #hms-form-error {
  margin: 12px 0 0;
}
.booking-create-flow [data-requote] {
  background: var(--ds-soft) !important;
  color: var(--ds-action) !important;
}
@media (max-width: 760px) {
  .hms-dialog[open].booking-create-flow {
    width: 100%;
  }
  .create-columns {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .create-steps {
    gap: 6px;
    padding: 8px 20px 12px;
  }
  .create-steps li {
    font-size: 10px;
    gap: 5px;
    align-items: flex-start;
  }
  .create-step-number {
    width: 22px;
    height: 22px;
  }
  .create-review-card {
    padding: 16px;
  }
  .create-guest-summary {
    gap: 8px;
    padding: 10px;
  }
  .create-guest-summary .proposal-guest-avatar {
    width: 32px;
    height: 32px;
  }
  .booking-create-flow .new-booking-footer > button {
    flex: 1;
  }
  .booking-create-flow .new-booking-footer > #hms-save {
    width: auto;
  }
}
.booking-create-flow .create-stay {
  box-sizing: border-box;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-control);
  padding: 20px;
}
.booking-create-flow fieldset > [data-price-choices]:empty {
  display: none;
}
.booking-create-flow [data-price-result] {
  padding: 14px;
  background: var(--ds-soft);
  border-radius: var(--ds-radius-control);
}
.booking-create-flow [data-price-result] h3 {
  margin: 0 0 10px;
}
.booking-create-flow .new-booking-footer .request-primary {
  background: var(--ds-action);
  color: var(--ds-paper);
  border-color: var(--ds-action);
}
.hms-dialog[open].booking-create-flow {
  height: fit-content;
  max-height: 92dvh;
}
.hms-dialog[open].booking-create-flow[data-create-step='1'] {
  width: min(760px, calc(100vw - 32px));
}
@media (max-width: 760px) {
  .hms-dialog[open].booking-create-flow[data-create-step='1'] {
    width: 100%;
  }
}
.booking-create-flow .hms-form.new-booking-form,
.booking-create-flow .new-booking-scroll {
  flex: 0 1 auto;
}
/* Flow 05: server quote rows and a single review summary. */
.booking-create-flow .create-price-lines > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 8px 0;
}
.booking-create-flow .create-price-lines span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.booking-create-flow .create-price-lines strong {
  white-space: nowrap;
}
.booking-create-flow .create-price-total {
  border-top: 1px solid var(--ds-line);
  margin-top: 8px;
}
.booking-create-flow .create-stay-summary {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 16px;
  margin: 20px 0;
}
.booking-create-flow .create-stay-summary > div {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.booking-create-flow .create-stay-summary > div + div {
  border-left: 1px solid var(--ds-line);
  padding-left: 16px;
}
.booking-create-flow .create-stay-summary small,
.booking-create-flow .create-review-guest small {
  color: var(--ds-muted);
}
.booking-create-flow .create-review-guest {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 0;
  border-top: 1px solid var(--ds-line);
  margin-bottom: 12px;
}
.booking-create-flow .create-review-guest > div {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  overflow-wrap: anywhere;
}
/* Flow 05 v0.6: compact read-only terms and actual received payment. */
.booking-create-flow .create-conditions {
  border-top: 1px solid var(--ds-line);
  padding-top: 14px;
  margin-top: 14px;
  font-size: 13px;
}
.booking-create-flow .create-conditions h4 {
  margin: 0 0 10px;
  font-size: 15px;
}
.booking-create-flow .create-conditions p {
  margin: 7px 0;
  overflow-wrap: anywhere;
  white-space: pre-line;
}
.booking-create-flow .create-conditions summary {
  cursor: pointer;
  color: var(--ds-action);
  font-weight: 600;
  padding: 10px 0;
}
.booking-create-flow .create-conditions details > strong {
  display: block;
  margin-top: 10px;
}
.booking-create-flow .create-balance {
  font-weight: 650;
  color: var(--ds-action);
}
.booking-create-flow .create-payment-status:not(:empty) {
  padding: 12px;
  border-radius: var(--ds-radius-control);
  background: var(--ds-dashboard-held);
  font-size: 13px;
  overflow-wrap: anywhere;
}
.booking-create-flow .create-guest-hits {
  max-height: 220px;
  overflow: auto;
}
/* SEC-04: guest link section */
.request-shell #request-guest-link {
  display: grid;
  gap: var(--ds-space-3);
  justify-items: start;
  font: 400 var(--ds-text-sm)/var(--ds-leading-body) var(--ds-font);
  color: var(--ds-ink);
}
.request-shell #request-guest-link p {
  margin: 0;
}
.request-shell #request-guest-link .meta {
  font-size: var(--ds-text-xs);
  color: var(--ds-muted);
}
.request-shell #request-guest-link > div {
  display: grid;
  gap: var(--ds-space-2);
  width: 100%;
}
.request-shell #request-guest-link .ds-alert p {
  overflow-wrap: anywhere;
}

/* Discounts v1 (01.11.2026): military discount request and an own discount in the request, removal form. */
.request-discount {
  display: grid;
  gap: var(--ds-space-2);
  margin-bottom: var(--ds-space-3);
}
.request-discount > .ds-button {
  justify-self: start;
}
.discount-removal-sum {
  display: grid;
  gap: var(--ds-space-1);
  margin: 0;
}
.discount-removal-sum div {
  display: flex;
  justify-content: space-between;
  gap: var(--ds-space-3);
}
.discount-removal-sum dd {
  margin: 0;
  font-weight: var(--ds-weight-semibold);
}

.discount-removal .ds-radio-group label {
  display: flex;
  align-items: center;
  gap: var(--ds-space-2);
  font-weight: var(--ds-weight-regular);
}
.discount-removal .ds-radio {
  margin: 0;
  padding: 0;
}
