/* Reservation compositions built on the shared customer design tokens. */
.customer-app .restaurant-content-sheet { position: relative; background: var(--nomuvo-page); border-radius: 26px 26px 0 0; margin-top: -1px; }
.customer-app .reservation-container { max-width: 1440px; padding: 26px clamp(24px,4.8vw,72px) 60px; }
.customer-app .reservation-progress { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; margin: 28px 0 32px; }
.customer-app .reservation-step { display: flex; align-items: center; gap: 10px; color: #939994; font-size: 13px; white-space: nowrap; }
.customer-app .reservation-step-icon { display: grid; place-items: center; width: 20px; height: 20px; border: 1.5px solid #a3aaa4; border-radius: 50%; flex: none; }
.customer-app .reservation-step-icon svg { width: 13px; height: 13px; }
.customer-app .reservation-step-line { height: 1px; flex: 1; background: #dce0d8; }
.customer-app .reservation-step.is-complete { color: #3e7767; }
.customer-app .is-complete .reservation-step-icon { border-color: #3e7767; }
.customer-app .is-complete .reservation-step-line { background: #3e7767; }
.customer-app .reservation-step.is-current { color: var(--nomuvo-forest); font-weight: 650; }
.customer-app .is-current .reservation-step-icon { background: var(--nomuvo-forest); border-color: var(--nomuvo-forest); }
.customer-app .reservation-step-icon i { width: 6px; height: 6px; background: #fff; transform: rotate(45deg); }
.customer-app .reservation-checkout .booking-layout { grid-template-columns: minmax(0,1fr) 350px; gap: 20px; align-items: start; }
.customer-app .reservation-details-card { padding: 28px; }
.customer-app .reservation-details-card > header { margin-bottom: 24px; }
.customer-app .reservation-details-card h1 { font-size: clamp(28px,3vw,38px); font-weight: 600; margin: 6px 0; line-height: 1.18; letter-spacing: -.045em; }
.customer-app .reservation-details-card header > p { margin: 7px 0 0; font-size: 15px; color: var(--nomuvo-muted); }
.customer-app .reservation-fields { gap: 22px 20px; }
.customer-app .reservation-fields .field { gap: 8px; }
.customer-app .reservation-fields label { font-size: 13px; font-weight: 550; }
.customer-app .reservation-input { position: relative; }
.customer-app .reservation-input > span { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); display: flex; width: 21px; height: 21px; color: var(--nomuvo-forest); pointer-events: none; }
.customer-app .reservation-input > .control { min-height: 49px; padding: 12px 15px 12px 48px; font-size: 14px; background: var(--nomuvo-surface-raised); border-radius: var(--nomuvo-radius-input); }
.customer-app .reservation-textarea > span { top: 17px; transform: none; }
.customer-app .reservation-textarea > textarea.control { min-height: 84px; padding-top: 14px; resize: vertical; }
.customer-app .menu-preselection-card { margin-top: 22px; padding: 18px; border: 1px solid #e9eae3; border-radius: 17px; background: linear-gradient(115deg,#f4f4ed,#f9f8f3); }
.customer-app .menu-preselection-intro { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.customer-app .menu-preselection-intro > div:first-child { min-width: 0; }
.customer-app .menu-preselection-card h2 { font-size: 17px; font-weight: 600; margin: 0 0 4px; letter-spacing: -.025em; }
.customer-app .menu-preselection-card p { color: var(--nomuvo-muted); font-size: 13px; margin: 0 0 13px; line-height: 1.5; }
.customer-app .menu-preselection-card .btn { min-height: 38px; gap: 8px; font-size: 12px; }
.customer-app .menu-preselection-card .btn svg { width: 17px; height: 17px; }
.customer-app .menu-preselection-images { flex: none; width: 210px; display: flex; align-items: flex-end; gap: 8px; }
.customer-app .menu-preselection-images img { width: 57px; height: 64px; object-fit: cover; border-radius: 12px; }
.customer-app .menu-preselection-images img:nth-child(2) { width: 82px; height: 95px; }
.customer-app .menu-preselection-card .checkout-menu { margin: 16px 0 0; padding: 14px 0 0; background: transparent; border: 0; border-top: 1px solid var(--nomuvo-border); border-radius: 0; }
.customer-app .menu-preselection-card .checkout-menu .panel-heading-row { display: none; }
.customer-app .menu-preselection-card .checkout-menu-row { font-size: 13px; }
.customer-app .reservation-notice { display: flex; align-items: center; gap: 15px; padding: 13px 15px; border-radius: 12px; margin: 16px 0 0; }
.customer-app .reservation-notice > svg { width: 22px; height: 22px; flex: none; }
.customer-app .reservation-notice p { font-size: 12px; line-height: 1.6; margin: 0; }
.customer-app .reservation-submit-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 18px; }
.customer-app .reservation-submit-row .check-row { align-items: center; font-size: 12px; line-height: 1.7; gap: 10px; }
.customer-app .reservation-submit-row .check-row input { width: 18px; height: 18px; margin: 0; flex: none; }
.customer-app .inline-policy-link { color: inherit; padding: 0; background: none; border: 0; text-decoration: underline; text-underline-offset: 3px; font: inherit; }
.customer-app .reservation-submit-row .btn { flex: none; min-height: 48px; padding-inline: 27px; gap: 12px; font-size: 13px; }
.customer-app .reservation-submit-row .btn svg { width: 18px; height: 18px; }
.customer-app .reservation-summary-card { padding: 26px 24px; border-radius: var(--nomuvo-radius-card); }
.customer-app .reservation-summary-card h2 { font-size: 20px; margin: 0 0 18px; font-weight: 600; }
.customer-app .reservation-photo { width: 100%; height: 154px; object-fit: cover; object-position: center 68%; border-radius: 10px; background: var(--nomuvo-hero); }
.customer-app .reservation-photo-empty { display: grid; place-items: center; color: #e4e7d9; }
.customer-app .reservation-photo-empty svg { width: 50px; height: 50px; }
.customer-app .reservation-facts { margin: 24px 0; display: grid; gap: 18px; }
.customer-app .reservation-facts > div { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; font-size: 12px; }
.customer-app .reservation-facts dt { display: flex; gap: 10px; align-items: center; color: var(--nomuvo-muted); }
.customer-app .reservation-facts dt svg { width: 18px; height: 18px; flex: none; color: var(--nomuvo-forest); }
.customer-app .reservation-facts dd { margin: 0; text-align: right; font-weight: 600; color: var(--nomuvo-ink); max-width: 58%; overflow-wrap: anywhere; }
.customer-app .reservation-change { width: 100%; gap: 8px; min-height: 46px; border-color: var(--nomuvo-forest); background: transparent; }
.customer-app .reservation-change svg { width: 17px; height: 17px; }
.customer-app .reservation-assurance { display: flex; align-items: flex-start; gap: 12px; color: var(--nomuvo-muted); font-size: 11px; line-height: 1.7; margin: 30px 4px 7px; }
.customer-app .reservation-assurance svg { width: 23px; height: 23px; flex: none; color: #57746a; }
.customer-app .seating-atmosphere { width: 100%; margin: 15px 0 20px; border-radius: 11px; overflow: hidden; }
.customer-app .seating-atmosphere .reservation-photo { height: 150px; border-radius: 11px; }
.customer-app .seating-moment .field { position: relative; padding-left: 60px; }
.customer-app .seating-moment-icon { position: absolute; left: 21px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; color: var(--nomuvo-forest); }
.customer-app .seating-moment-icon svg { width: 100%; height: 100%; }
.customer-app .reservation-checkout .breadcrumb { margin: 0; }
.customer-app .dining-success .restaurant-content-sheet { padding-top: 1px; }
@media(max-width:1120px) {
  .customer-app .reservation-checkout .booking-layout { grid-template-columns: minmax(0,1fr) 300px; gap: 18px; }
  .customer-app .reservation-container { padding-inline: 28px; }
  .customer-app .reservation-details-card { padding: 24px; }
  .customer-app .menu-preselection-images { width: 126px; gap: 5px; }
  .customer-app .menu-preselection-images img { width: 37px; height: 48px; }
  .customer-app .menu-preselection-images img:nth-child(2) { width: 47px; height: 76px; }
  .customer-app .reservation-submit-row { align-items: flex-start; flex-direction: column; gap: 15px; }
  .customer-app .reservation-submit-row .btn { align-self: flex-end; }
}
@media(max-width:860px) {
  .customer-app .reservation-checkout .booking-layout { grid-template-columns: 1fr; }
  .customer-app .reservation-summary-card { position: static; }
  .customer-app .reservation-photo { height: 200px; }
  .customer-app .reservation-facts { grid-template-columns: 1fr 1fr; column-gap: 30px; }
  .customer-app .reservation-progress { gap: 12px; }
  .customer-app .reservation-step { font-size: 12px; gap: 8px; }
  .customer-app .reservation-submit-row { flex-direction: row; align-items: center; }
  .customer-app .reservation-submit-row .btn { align-self: auto; }
}
@media(max-width:660px) {
  .customer-app .restaurant-content-sheet { border-radius: 22px 22px 0 0; }
  .customer-app .reservation-container { padding: 22px 16px 40px; }
  .customer-app .reservation-progress { gap: 8px; margin: 25px 0; }
  .customer-app .reservation-step { gap: 5px; font-size: 10px; }
  .customer-app .reservation-step-icon { width: 17px; height: 17px; }
  .customer-app .reservation-details-card { padding: 21px 18px; }
  .customer-app .reservation-details-card h1 { font-size: 30px; }
  .customer-app .reservation-details-card header > p { font-size: 13px; line-height: 1.6; }
  .customer-app .reservation-fields { gap: 18px; }
  .customer-app .reservation-input > .control { font-size: 16px; }
  .customer-app .menu-preselection-intro { align-items: flex-start; flex-direction: column; gap: 15px; }
  .customer-app .menu-preselection-images { width: auto; align-items: center; }
  .customer-app .menu-preselection-images img, .customer-app .menu-preselection-images img:nth-child(2) { width: 62px; height: 62px; }
  .customer-app .reservation-notice { align-items: flex-start; gap: 10px; padding: 13px; }
  .customer-app .reservation-notice p { font-size: 11px; }
  .customer-app .reservation-submit-row { flex-direction: column; align-items: stretch; }
  .customer-app .reservation-submit-row .btn { width: 100%; font-size: 14px; }
  .customer-app .reservation-facts { grid-template-columns: 1fr; }
  .customer-app .reservation-summary-card { padding: 22px; }
  .customer-app .seating-atmosphere .reservation-photo { height: 135px; }
  .customer-app .seating-moment .field { padding-left: 12px; }
  .customer-app .seating-moment-icon { display: none; }
}
