.site-booking {
  position: fixed; inset: 0 0 0 auto; margin: 0; padding: 0; border: 0;
  width: min(560px, 100%); max-width: 100%; height: 100%; height: 100dvh;
  max-height: 100dvh; background: #f8f5ef; color: #161514;
  font-family: var(--site-font-body); box-shadow: -20px 0 60px #1615143d;
}
.site-booking[open] { display: flex; flex-direction: column; }
.site-booking::backdrop { background: #16151480; backdrop-filter: blur(3px); }
.site-booking [hidden] { display: none !important; }
.site-booking__header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 28px; border-bottom: 1px solid #e7e1d7; }
.site-booking__brand { font: 22px var(--site-font-display); letter-spacing: .08em; }
.site-booking__header button { width: 40px; height: 40px; border: 1px solid #dcd5ca; border-radius: 50%; background: transparent; font-size: 24px; flex-shrink: 0; }
.site-booking__intro { padding: 20px 28px 12px; }
.site-booking__intro h2 { font: 32px/1.1 var(--site-font-display); margin: 8px 0; }
.site-booking__intro p { margin: 8px 0; font-size: 14px; color: #655e57; }
.site-booking__intro button { border: 0; background: transparent; padding: 4px 0; color: inherit; font: inherit; }
.site-booking__catalog { overflow-y: auto; padding: 8px 28px 28px; min-height: 0; flex: 1; }
.site-booking__catalog label { display: block; font-size: 13px; margin-bottom: 8px; }
.site-booking__catalog input { width: 100%; box-sizing: border-box; padding: 14px 16px; border: 1px solid #dcd5ca; border-radius: var(--site-radius); background: white; color: inherit; font: inherit; margin-bottom: 16px; }
.site-booking__service { display: flex; flex-direction: column; gap: 7px; width: 100%; text-align: left; margin-bottom: 10px; padding: 18px; border: 1px solid #e7e1d7; border-radius: var(--site-radius); background: white; color: inherit; font: inherit; cursor: pointer; }
.site-booking__service:hover { border-color: var(--site-primary); }
.site-booking__service--photo { flex-direction: row; align-items: center; gap: 14px; padding: 17px 18px 17px 14px; }
.site-booking__service--photo > div { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.site-booking__item { position: relative; }
.site-booking__item .site-booking__service { padding-right: 76px; }
.site-booking__item .site-media-chip { position: absolute; top: 16px; right: 16px; background: white; }
.site-booking__item .site-media-chip:hover { background: color-mix(in srgb, var(--site-primary) 8%, white); }
.site-booking__thumb { flex: 0 0 auto; width: 56px; height: 56px; border-radius: 8px; object-fit: cover; }
.site-booking__group { border-bottom: 1px solid #dcd5ca; margin-bottom: 12px; }
.site-booking__group summary { padding: 18px 4px; cursor: pointer; font-weight: 600; }
.site-booking__group summary:focus-visible { outline: 2px solid var(--site-primary); outline-offset: 2px; }
.site-booking__service span { color: #655e57; font-size: 13px; }
.site-booking__frame { flex: 1; width: 100%; border: 0; min-height: 0; background: #f8f5ef; }
.site-booking__status { padding: 12px 28px; }
.site-booking__retry { margin: 0 28px 20px; }
.site-booking__preview { padding: 16px 28px; margin: 0; border-top: 1px solid #e7e1d7; font-size: 13px; line-height: 1.5; }
body.site-booking-open { overflow: hidden; }
.site-booking :focus-visible { outline: 2px solid var(--site-primary); outline-offset: 3px; }
@media (max-width: 600px) {
  .site-booking { width: 100%; }
  .site-booking__header { padding-top: max(16px, env(safe-area-inset-top)); }
  .site-booking__catalog { padding-bottom: max(28px, env(safe-area-inset-bottom)); }
}
