/* Responsive layer v4 — desktop theme intentionally unchanged. */
html{box-sizing:border-box;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}*,*::before,*::after{box-sizing:inherit}body{min-width:0;overflow-x:hidden}img,svg,video,canvas,iframe{max-width:100%}iframe{width:100%}button,a,input,select,textarea{touch-action:manipulation}input,select,textarea,button{max-width:100%}.mobile-only{display:none!important}.safe-break{overflow-wrap:anywhere;word-break:break-word}.touch-target{min-height:44px}.mobile-scroll-x{-webkit-overflow-scrolling:touch;scrollbar-width:thin}.mobile-scroll-x::-webkit-scrollbar{height:5px}.mobile-scroll-x::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}

/* Make accidental wide content harmless without changing desktop layout. */
.admin-shell main,.user-shell main,.public-site main{min-width:0}.admin-card,.u-card{min-width:0}.admin-card *,.u-card *{min-width:0}

@media (max-width:1023px){
  .admin-shell #adminSidebar,.user-shell #userSidebar{width:min(19rem,calc(100vw - 3rem));max-width:92vw;box-shadow:0 24px 60px rgba(15,23,42,.28);will-change:transform}
  .admin-shell #adminSidebar.open,.user-shell #userSidebar.open{transform:translateX(0)}
  .admin-shell #adminSidebar,.user-shell #userSidebar{padding-bottom:max(1rem,env(safe-area-inset-bottom))}
  .admin-shell #sideOverlay,.user-shell #userOverlay{backdrop-filter:blur(2px)}
}

@media (max-width:767px){
  html{scroll-padding-top:4.5rem}
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea{font-size:16px!important;min-height:44px}
  input[type="file"]{min-height:44px;padding:.55rem!important}
  button,.btn,a[class*="px-"][class*="py-"]{min-height:42px}
  textarea{line-height:1.45}
  code,pre{white-space:pre-wrap!important;overflow-wrap:anywhere}

  /* Shell spacing */
  .admin-shell main,.user-shell main{padding:.75rem!important}
  .admin-shell header,.user-shell header{height:auto!important;min-height:3.75rem;padding:.65rem .75rem!important;gap:.5rem}
  .admin-shell header>div:first-of-type,.user-shell header>strong{min-width:0}
  .admin-shell header strong,.user-shell header strong{font-size:.92rem;line-height:1.2;display:block;max-width:44vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .admin-shell header .admin-user-name,.user-shell header .user-display-name{display:none!important}
  .admin-shell #adminMenuBtn,.user-shell #userMenuBtn{width:44px;height:44px;border-radius:.75rem;display:inline-flex;align-items:center;justify-content:center;background:#f3f4f6;font-size:1.35rem}
  .admin-card,.u-card{border-radius:.875rem!important}
  .admin-card.p-6,.u-card.p-6{padding:1rem!important}.admin-card.p-5,.u-card.p-5{padding:.9rem!important}
  .admin-shell h1,.user-shell h1{font-size:1.35rem!important;line-height:1.25}.admin-shell h2,.user-shell h2{line-height:1.3}

  /* Forms and filters */
  .admin-shell form.grid,.user-shell form.grid,.mobile-form-grid{grid-template-columns:minmax(0,1fr)!important}
  .admin-shell .mobile-actions,.user-shell .mobile-actions,.public-site .mobile-actions{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;gap:.5rem!important}
  .admin-shell .mobile-actions>* ,.user-shell .mobile-actions>* ,.public-site .mobile-actions>*{width:100%!important;justify-content:center!important;text-align:center!important}
  .admin-shell .sticky.bottom-4{bottom:max(.65rem,env(safe-area-inset-bottom));padding:.5rem;background:rgba(244,245,249,.92);backdrop-filter:blur(8px);border-radius:1rem;z-index:30}
  .admin-shell .sticky.bottom-4 button{width:100%;min-height:48px}
  .admin-shell label.flex.items-center,.user-shell label.flex.items-center{min-height:42px}

  /* Mobile table → readable cards. JS supplies data-label from table headers. */
  table.mobile-card-table{display:block!important;width:100%!important;border-collapse:separate!important;border-spacing:0!important}
  table.mobile-card-table thead{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
  table.mobile-card-table tbody{display:block!important;width:100%!important}
  table.mobile-card-table tbody tr{display:block!important;width:100%!important;padding:.7rem 0!important;border-top:1px solid #e5e7eb!important;background:#fff}
  table.mobile-card-table tbody tr:first-child{border-top:0!important}
  table.mobile-card-table tbody td{display:grid!important;grid-template-columns:minmax(6.75rem,38%) minmax(0,1fr)!important;align-items:start!important;gap:.65rem!important;width:100%!important;max-width:none!important;padding:.5rem .85rem!important;border:0!important;text-align:left!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
  table.mobile-card-table tbody td::before{content:attr(data-label);font-size:.7rem;line-height:1.25;text-transform:uppercase;letter-spacing:.035em;font-weight:800;color:#64748b;padding-top:.12rem}
  table.mobile-card-table tbody td[data-label=""],table.mobile-card-table tbody td:not([data-label]){grid-template-columns:1fr!important}
  table.mobile-card-table tbody td[data-label=""]::before,table.mobile-card-table tbody td:not([data-label])::before{display:none!important}
  table.mobile-card-table tbody td .flex{flex-wrap:wrap!important;justify-content:flex-start!important}
  table.mobile-card-table tbody td form{max-width:100%!important}
  table.mobile-card-table tbody td select{width:100%!important}
  .overflow-x-auto:has(>table.mobile-card-table){overflow:visible!important}

  /* Public navigation */
  .public-site .site-nav-inner{height:4rem!important;gap:.45rem}
  .public-site .site-brand{min-width:0;max-width:48vw;gap:.5rem!important}
  .public-site .site-brand-logo{width:2.6rem!important;height:2.6rem!important;flex:none}
  .public-site .site-brand-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.95rem!important}
  .public-site .site-nav-actions{gap:.35rem!important}
  .public-site .desktop-login-cta{display:none!important}
  .public-site .booking-cta{padding:.55rem .7rem!important;font-size:.78rem!important;min-height:40px!important;white-space:nowrap}
  .public-site #mobileToggle{width:42px;height:42px;border-radius:.7rem;background:#f3f4f6;display:inline-flex;align-items:center;justify-content:center}
  .public-site #mobileMenu{box-shadow:0 18px 35px rgba(15,23,42,.10)}
  .public-site #mobileMenu a{display:flex;align-items:center;min-height:44px;padding:.55rem .25rem;border-bottom:1px solid #f1f5f9;font-weight:600;color:#334155}
  .public-site #mobileMenu a:last-child{border-bottom:0}

  /* Public content */
  .public-site .container{max-width:100%}
  .public-site .hero-mobile{padding-top:4rem!important;padding-bottom:4rem!important}
  .public-site .hero-mobile h1{font-size:2.25rem!important;line-height:1.08!important;margin-bottom:1rem!important;overflow-wrap:anywhere}
  .public-site .hero-mobile .hero-subtitle{font-size:1rem!important;line-height:1.55!important;margin-bottom:1.5rem!important}
  .public-site .hero-mobile .hero-actions{width:100%;gap:.5rem!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .public-site .hero-mobile .hero-actions>a{width:100%;min-width:0;justify-content:center;min-height:46px;padding:.7rem .35rem!important;font-size:.72rem!important;line-height:1.2!important;text-align:center;white-space:normal}
  .public-site .hero-mobile .hero-stats{margin-top:1.75rem!important;gap:.55rem!important}
  .public-site .hero-mobile .hero-stats>div{padding:.75rem .45rem!important}
  .public-site .hero-mobile .hero-stats .text-3xl{font-size:1.35rem!important}
  .public-site section,.public-site .section-mobile{scroll-margin-top:5rem}
  .public-site .py-20{padding-top:3.5rem!important;padding-bottom:3.5rem!important}.public-site .py-16{padding-top:3rem!important;padding-bottom:3rem!important}.public-site .py-14{padding-top:2.75rem!important;padding-bottom:2.75rem!important}.public-site .py-12{padding-top:2.5rem!important;padding-bottom:2.5rem!important}
  .public-site .text-5xl,.public-site .text-6xl,.public-site .text-7xl{font-size:2.15rem!important;line-height:1.15!important}.public-site .text-4xl{font-size:1.9rem!important}.public-site .text-3xl{font-size:1.55rem!important}
  .public-site .p-8{padding:1.25rem!important}.public-site .p-6{padding:1rem!important}
  .public-site .faq-question{padding:1rem!important;gap:.75rem}.public-site .faq-answer{padding:0 1rem 1rem!important}
  .public-site footer{margin-top:2rem!important}.public-site footer .py-10{padding-top:2rem!important;padding-bottom:2rem!important}

  /* Booking/pricing cards */
  .public-site .service-card,.public-site .pkg-card{padding:1rem!important}
  .public-site .pkg-card h3{font-size:1.1rem!important}.public-site .pkg-card .text-3xl{font-size:1.65rem!important}
  .public-site #summary{font-size:.9rem;overflow-wrap:anywhere}

  /* Popup/modals */
  #promoPopup{padding:.75rem!important;align-items:flex-end!important}
  #promoPopup>div{max-height:calc(100dvh - 1.5rem);overflow-y:auto;border-radius:1.25rem 1.25rem .75rem .75rem!important}
  #promoPopup .p-6{padding:1rem!important}
  #promoPopup h3{font-size:1.45rem!important}

  /* FullCalendar */
  .admin-shell .fc{font-size:.82rem}.admin-shell .fc .fc-toolbar{display:grid!important;grid-template-columns:1fr auto!important;gap:.55rem!important;align-items:center!important}.admin-shell .fc .fc-toolbar-chunk:nth-child(2){grid-column:1/-1;grid-row:1;text-align:center}.admin-shell .fc .fc-toolbar-chunk:first-child{grid-column:1;grid-row:2}.admin-shell .fc .fc-toolbar-chunk:last-child{grid-column:2;grid-row:2}.admin-shell .fc .fc-toolbar-title{font-size:1.05rem!important}.admin-shell .fc .fc-button{padding:.45rem .55rem!important;font-size:.75rem!important}.admin-shell .fc .fc-daygrid-day-number{font-size:.72rem;padding:2px!important}.admin-shell .fc .fc-event{font-size:.67rem;line-height:1.15}.admin-shell .fc .fc-col-header-cell-cushion{font-size:.68rem;padding:4px 1px!important}

  /* Horizontal chip/tab strips keep one row on small screens. */
  .mobile-tab-strip{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;padding-bottom:.35rem;scrollbar-width:none;gap:.45rem!important;margin-left:-.1rem;margin-right:-.1rem}
  .mobile-tab-strip::-webkit-scrollbar{display:none}.mobile-tab-strip>*{flex:0 0 auto!important;white-space:nowrap!important;min-height:40px}

  .mobile-only{display:initial!important}.desktop-only-mobile-hide{display:none!important}
}

@media (max-width:420px){
  .public-site .site-brand{max-width:39vw}.public-site .booking-cta{padding:.5rem .55rem!important;font-size:.72rem!important}
  .admin-shell header strong,.user-shell header strong{max-width:40vw}
  table.mobile-card-table tbody td{grid-template-columns:minmax(5.8rem,35%) minmax(0,1fr)!important;padding:.45rem .7rem!important;gap:.5rem!important}
}

@media (max-width:360px){
  .public-site .site-brand-name{display:none}.public-site .site-brand{max-width:none}.public-site .booking-cta{font-size:.7rem!important}
  .admin-shell header strong,.user-shell header strong{max-width:35vw;font-size:.85rem}
}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media (max-width:767px){
  .mobile-wrap-row{flex-wrap:wrap!important;gap:.65rem!important;align-items:flex-start!important}
  .mobile-wrap-row>a,.mobile-wrap-row>button{max-width:100%}
  .admin-shell .admin-card>.p-5.border-b,.user-shell .u-card>.p-5.border-b{padding:.9rem!important}
  .admin-shell .admin-card>.p-5.border-b.flex,.user-shell .u-card>.p-5.border-b.flex{flex-wrap:wrap!important;gap:.6rem!important}
  .admin-shell .admin-card>.p-5.border-b.flex>a,.user-shell .u-card>.p-5.border-b.flex>a{width:100%;text-align:center;display:flex;align-items:center;justify-content:center}
  .public-site .grid.grid-cols-2:not(.hero-stats)>*{min-width:0}
}
@media (max-width:767px){.public-site .alert-popup{left:.75rem!important;right:.75rem!important;top:.75rem!important;max-width:none!important;width:auto!important}.public-site .alert-popup>div{min-width:0!important}}

/* v4 mobile usability refinements */
@media (max-width:420px){
  .public-site .booking-time-summary{grid-template-columns:1fr!important}
}
@media (max-width:767px){
  .admin-shell .fc .fc-list-event-title,.admin-shell .fc .fc-list-event-time{font-size:.78rem!important}
  .admin-shell .fc .fc-list-day-cushion{padding:.55rem .65rem!important}
  .admin-shell .fc .fc-list-event td{padding:.55rem .45rem!important}
  .admin-shell .fc .fc-list-empty{padding:1.25rem!important}
}

@media (max-width:767px){
  .public-site .p-12{padding:1.5rem!important}
}
@media (max-width:420px){
  .admin-shell .grid.grid-cols-2,.user-shell .grid.grid-cols-2{grid-template-columns:minmax(0,1fr)!important}
}