.booking-dialog {
  position: fixed;
  top: calc(50dvh - 5px);
  left: 50vw;
  width: var(--booking-width, min(811px, calc(100vw - 60px)));
  max-width: none;
  max-height: calc(100dvh - 60px);
  margin: 0;
  transform: translate(-50%, -50%);
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  color: var(--black);
  background: #fff;
  font: 400 var(--booking-type, 14px)/1.3 "Inter", Arial, sans-serif;
  letter-spacing: -0.03em;
}

.booking-dialog::backdrop { background: rgba(10, 10, 10, 0.3); }
.booking-dialog[open] { display: flex; flex-direction: column; }
html.booking-open { overflow: hidden; scrollbar-gutter: auto; }

.booking-header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  height: 47px;
  padding: 0 12px 0 18px;
}

.booking-header h2 {
  margin: 0;
  color: var(--gray);
  font-size: inherit;
  font-weight: 400;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}
.booking-close {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--gray);
  background: transparent;
  cursor: pointer;
}
.booking-close svg { display: block; width: var(--booking-icon-width, 10.72px); height: var(--booking-icon-height, 9.92px); }
.booking-close:hover { color: var(--black); }
.booking-close:focus-visible,
.booking-footer a:focus-visible { outline: 1px solid var(--black); outline-offset: 3px; }

.booking-scroll { min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
.booking-calendar-viewport { position: relative; overflow: clip; margin: 0 14px; height: var(--booking-calendar-height, 466px); }
.booking-calendar { width: 960px; min-height: 570px; padding: 0; transform: translateX(calc(-1 * var(--booking-calendar-offset, 0px))) scale(var(--booking-calendar-scale, 0.816667)); transform-origin: top left; }
.booking-calendar iframe { display: block; min-height: 570px; }
.booking-status { padding: 20px; color: var(--gray); }
.booking-status[hidden] { display: none; }
.booking-footer {
  flex: 0 0 auto;
  padding: 14px 20px;
  border-top: 1px solid var(--surface);
  color: var(--gray);
  font-size: 12px;
}
.booking-footer[hidden] { display: none; }
.booking-footer a { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 600px) {
  .booking-dialog { width: calc(100vw - 30px); max-height: calc(100dvh - 30px); }
  .booking-header { padding: 0 15px; }
  .booking-calendar-viewport { height: auto; margin: 0 12px; }
  .booking-calendar { width: 100%; min-height: 400px; transform: none; }
  .booking-calendar iframe { min-height: 400px; }
  .booking-footer { padding: 12px 15px; }
}
