.mobile-booking-bar { display: none; }
@media (max-width: 700px) {
  html { scroll-padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px)); }
  .salon-site:not(.page-booking) { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
  .mobile-booking-bar { position: fixed; inset: auto 0 0; z-index: 55; display: grid; grid-template-columns: 1fr 1.6fr; align-items: center; gap: 12px; padding: 10px 20px calc(10px + env(safe-area-inset-bottom, 0px)); background: #fffaf8; border-top: 1px solid #e6cdd8; box-shadow: 0 -6px 25px #4023310c; }
  .mobile-booking-call { display: flex; justify-content: center; align-items: center; gap: 8px; min-height: 48px; font-size: 12px; color: #79465d; }
  .mobile-booking-call .icon { width: 17px; height: 17px; }
  .salon-site .mobile-booking-bar .button { min-height: 48px; padding: 14px 16px; font-size: 12px; gap: 13px; }
  .mobile-booking-bar .button .icon { width: 17px; height: 17px; }
  .page-booking .mobile-booking-bar,
  body:has(dialog[open]) .mobile-booking-bar,
  body:has(.header-search-disclosure[open], .mobile-navigation[open]) .mobile-booking-bar,
  body:has(input:focus, textarea:focus, select:focus) .mobile-booking-bar { display: none; }
}
@media (max-width: 360px) {
  .mobile-booking-bar { padding-inline: 12px; gap: 7px; grid-template-columns: 1fr 1.5fr; }
  .mobile-booking-call, .salon-site .mobile-booking-bar .button { font-size: 11px; }
}
