@import url('/quality-runtime-v293.css?v=293');
/* Smart layout safety — keeps the approved typography; no font overrides. */
:root{--smart-gap:10px;--smart-safe-bottom:max(14px,env(safe-area-inset-bottom));--smart-external-bottom:0px;}
html.smart-layout,html.smart-layout body{max-width:100%;overflow-x:hidden}
html.smart-layout *,html.smart-layout *::before,html.smart-layout *::after{box-sizing:border-box}
html.smart-layout :where(.card,.panel,.staff-panel,.booking-card,.staff-booking,.admin-booking,.permission-role,.settings-row,.service-row,.shop,.row,.page-head,.staff-panel-head,.system-bar,.hero-actions,.top-actions,.actions,.action-row,.service-actions,.staff-actions,.cashier-actions,.quick-links)>*{min-width:0}
html.smart-layout :where(img,svg,video,canvas){max-width:100%;height:auto}
html.smart-layout :where(h1,h2,h3,h4,p,b,strong,span,small,a,button,label){overflow-wrap:anywhere}
html.smart-layout :where(input,select,textarea,button,.btn,a.btn){max-width:100%}
html.smart-layout input[type="checkbox"],html.smart-layout input[type="radio"]{width:auto!important;min-width:18px!important;min-height:18px!important;height:18px!important;padding:0!important;flex:0 0 18px!important}
html.smart-layout :where(.adjust-list,.permission-list,.feature-row,.day-state) label,html.smart-layout :where(.adjust-list,.permission-list,.feature-row,.day-state){min-width:0}
html.smart-layout .adjust-list label{display:grid!important;grid-template-columns:22px minmax(0,1fr)!important;align-items:center!important;gap:10px!important;width:100%!important}
html.smart-layout .adjust-list label>span{min-width:0!important;overflow-wrap:anywhere!important}
html.smart-layout :where(.checkout-dialog,.modal-card) :where(details,summary,label,span,b,strong,p){max-width:100%;min-width:0}
html.smart-layout :where(.hero-actions,.top-actions,.actions,.action-row,.service-actions,.staff-actions,.cashier-actions,.quick-links,.system-actions){flex-wrap:wrap}
html.smart-layout :where(.grid-2,.grid-3,.grid-4,.stats,.plans,.cashier-kpis,.staff-stats,.metric-grid,.mini-metrics)>*{min-width:0}
html.smart-layout .smart-tight:where(.page-head,.staff-panel-head,.system-bar,.card-head,.attention-head){align-items:flex-start!important;flex-wrap:wrap!important}
html.smart-layout .smart-tight:where(.hero-actions,.top-actions,.actions,.action-row,.service-actions,.staff-actions,.cashier-actions,.quick-links,.system-actions)>*{flex:1 1 150px!important;width:auto!important;min-width:0!important}
html.smart-layout .smart-collision:where(.hero-actions,.top-actions,.actions,.action-row,.service-actions,.staff-actions,.cashier-actions,.quick-links,.system-actions){display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(145px,100%),1fr))!important;gap:8px!important;width:100%!important}
html.smart-layout .smart-collision:where(.hero-actions,.top-actions,.actions,.action-row,.service-actions,.staff-actions,.cashier-actions,.quick-links,.system-actions)>*{width:100%!important;min-width:0!important;margin:0!important;position:static!important;transform:none!important}
html.smart-layout .smart-overflow{max-width:100%!important;overflow-x:auto!important;overscroll-behavior-inline:contain}
html.smart-layout .bottom-nav{bottom:var(--smart-external-bottom)!important}
html.smart-layout #nextBtn.easy-ready,html.smart-layout .settings-subpage form>button,html.smart-layout .staff-hero-actions,html.smart-layout .barber-now .staff-actions{bottom:calc(12px + var(--smart-external-bottom) + env(safe-area-inset-bottom))!important}
html.smart-layout .owner-system .ix-more,html.smart-layout .owner-system .ix-swipe-action{display:none!important}
html.smart-layout .owner-system .ix-swipe-shell{overflow:visible!important;margin:0!important;border-radius:0!important}
html.smart-layout .owner-system .ix-swipe-shell>.admin-booking{transform:none!important}
html.smart-layout .admin-booking,html.smart-layout .booking-card,html.smart-layout .staff-booking{container-type:inline-size}
@container (max-width:520px){
  html.smart-layout .booking-card .booking-top,html.smart-layout .staff-booking .staff-top{align-items:flex-start!important;flex-wrap:wrap!important}
  html.smart-layout .booking-card .booking-customer,html.smart-layout .staff-booking .booking-customer{grid-template-columns:1fr!important}
  html.smart-layout .staff-actions,html.smart-layout .cashier-actions{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important}
  html.smart-layout .staff-actions>*:only-child,html.smart-layout .cashier-actions>*:only-child{grid-column:1/-1}
}
@container (max-width:360px){
  html.smart-layout .staff-actions,html.smart-layout .cashier-actions{grid-template-columns:1fr!important}
  html.smart-layout .staff-actions>*,html.smart-layout .cashier-actions>*{grid-column:auto!important;width:100%!important}
}
@media(max-width:700px){
 html.smart-layout :where(.page-head,.card-head,.attention-head,.staff-panel-head,.system-bar){gap:10px!important}
 html.smart-layout :where(.page-head,.card-head,.attention-head,.staff-panel-head,.system-bar)>:where(button,.btn,a.btn){max-width:100%;white-space:normal}
 html.smart-layout .top-actions{gap:6px!important}
 html.smart-layout .top-actions>*{flex:0 1 auto!important}
 html.smart-layout :where(.sheet-panel,.modal-card,.checkout-dialog){max-width:100vw!important}
 html.smart-layout.smart-has-bottom-nav body{padding-bottom:0!important}
 html.smart-layout.smart-has-bottom-nav body.owner-system .owner-content{padding-bottom:calc(var(--smart-nav-height,76px) + var(--smart-safe-bottom) + 10px)!important}
 html.smart-layout.smart-has-bottom-nav body:not(.owner-system) .app-main{padding-bottom:calc(var(--smart-nav-height,76px) + var(--smart-safe-bottom) + 10px)!important}
 html.smart-layout.smart-has-bottom-nav .bottom-nav{bottom:var(--smart-external-bottom)!important}
 html.smart-layout.smart-page-overflow body{overflow-x:hidden!important}
}
@media(max-width:430px){
 html.smart-layout :where(.actions,.action-row,.service-actions,.staff-actions,.cashier-actions,.hero-actions,.quick-links){display:grid!important;grid-template-columns:1fr!important;width:100%!important}
 html.smart-layout :where(.actions,.action-row,.service-actions,.staff-actions,.cashier-actions,.hero-actions,.quick-links)>*{width:100%!important;min-width:0!important;margin-inline:0!important}
 html.smart-layout :where(.grid-2,.grid-3,.grid-4,.stats,.plans){grid-template-columns:1fr!important}
}