/* The provider keeps its own layout. This shell reserves a reachable close row. */
.booking-dialog-toolbar{display:contents}
.booking-dialog-heading{display:none}
.booking-dialog-close:focus-visible{outline:3px solid #bd976a;outline-offset:3px}

@media(max-width:760px),(max-height:520px){
  .booking-dialog{
    inset:auto 0 auto;
    top:var(--booking-visible-top,0px);
    width:100%;
    height:100svh;
    height:var(--booking-visible-height,100dvh);
    padding:0 env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);
    box-sizing:border-box;
    background:#faf6ef;
    overscroll-behavior:none;
  }
  .booking-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr);animation:booking-mobile-enter .2s ease-out}
  .booking-dialog-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:8px 16px 8px 20px;
    padding-top:calc(8px + env(safe-area-inset-top,0px));
    border-bottom:1px solid #e2d7c7;
    background:#faf6ef;
  }
  .booking-dialog-heading{display:block;color:#5a3824;font:600 15px/1.35 Onest,Arial,sans-serif}
  .booking-dialog-close{
    position:static;
    flex:0 0 44px;
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
    margin:0;
    border-color:#d6c4ac;
    background:#5a3824;
    color:#fff5e5;
    font:300 30px/1 Arial,sans-serif;
    -webkit-tap-highlight-color:transparent;
  }
  .booking-dialog iframe{width:100%;height:100%;min-width:0;min-height:0;background:#fff}
  .booking-frame-body>p{margin:28px 20px;font-size:15px;line-height:1.65}
  .booking-frame-body #booking-fallback a{display:inline-block;min-height:44px;padding:8px 0;box-sizing:border-box;color:#6c4328;text-underline-offset:3px}
  /* In our embedded shell the close row is already outside the provider frame. */
  .booking-embedded #vanillaOverlay>svg{display:none}
  .booking-embedded #hr-modal .hotel-detail{top:0;height:100%;max-height:100%;margin:0;margin-top:0!important;border-radius:0}
}
@keyframes booking-mobile-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.booking-dialog[open]{animation:none}}
/* Full-width dates keep the provider's labels readable at phone widths. */
@media(max-width:430px){
  .booking-embedded .hotel-detail__container>.inputs{grid-template-columns:minmax(0,1fr)!important}
  .booking-embedded .hotel-detail__container>.inputs>.form-input,
  .booking-embedded .hotel-detail__container>.inputs>.inputs__input{grid-column:1/-1!important}
}