/* Shared responsive foundations for public pages and all application shells. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:80px}
*,*::before,*::after{box-sizing:border-box}
:where(main,.main,.container,.page,.app,.app-shell,.shell,.portal-shell,.slq-staff-content){min-width:0}
:where(img,video,canvas,iframe){max-width:100%}
:where(img,video){height:auto}
:where(input,select,textarea){max-width:100%;min-width:0}
:where(h1,h2,h3,p,dd,.message,.error-box){overflow-wrap:anywhere}
:where(button,a,input,select,textarea,summary){-webkit-tap-highlight-color:rgba(15,118,110,.14)}
:where(input,select,textarea){scroll-margin-block:90px}
.slq-responsive-table{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.slq-responsive-table:focus-visible{outline:2px solid var(--brand-primary,#087f6b);outline-offset:2px}
.slq-admin-toggle{display:none}
@media screen and (max-width:1000px){
 .slq-staff-nav{max-width:calc(100vw - 24px);max-height:100dvh;padding-bottom:max(18px,env(safe-area-inset-bottom))!important}
 .slq-mobile-bar{padding-top:max(10px,env(safe-area-inset-top))!important}
}
@media screen and (max-width:760px){
 body{min-width:0}
 :where(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]):not([type=color]),select,textarea){font-size:16px!important;min-height:44px}
 :where(button,input[type=submit],input[type=button],summary,.btn,.cd-btn,.ca-btn,.rp-btn,.op-btn,.slq-nav-link){min-height:44px}
 :where(input[type=checkbox],input[type=radio]){min-width:20px;min-height:20px;vertical-align:middle;flex-shrink:0}
 :where(.main,.portal-shell,.public-shell){padding-inline-start:max(14px,env(safe-area-inset-right))!important;padding-inline-end:max(14px,env(safe-area-inset-left))!important}
 :where(.portal-shell,.main){padding-bottom:max(20px,env(safe-area-inset-bottom))}
 :where(.topbar,.portal-top,.public-brand,.section-head,.page-header){flex-wrap:wrap;gap:12px}
 :where(.portal-brand,.public-brand-main,.public-brand-copy,.task-head>div){min-width:0}
 :where(.portal-brand strong,.public-brand-name){overflow-wrap:anywhere}
 .portal-top .top-actions{margin-inline-start:auto;flex-wrap:wrap}
 .portal-top .bell{min-width:44px;min-height:44px}
 .task-head{flex-wrap:wrap}.task-head time{margin-inline-start:auto}.task-actions{gap:10px}
 :where(.day-picker,.reception-search,.rp-sort){max-width:100%;flex-wrap:wrap}
 .reception-search input{min-width:0;flex-basis:100%;width:100%}
 .public-secure-badge{white-space:normal}
 .shell>.sidebar{display:block!important;padding:18px}
 .shell>.sidebar.slq-admin-collapsed{display:none!important}
 .slq-admin-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:48px;padding:12px 18px;border:0;background:#102f35;color:white;font:inherit;cursor:pointer}
 .shell>.sidebar .brand{margin-bottom:18px}.shell>.sidebar .brand p{display:none}
 .shell>.sidebar .menu a{min-height:44px}
 .slq-responsive-table table{margin:0}
}
@media screen and (max-width:480px){
 :where(.topbar,.card,.stat){padding:16px!important}
 :where(.public-grid,.manage-grid,.rp-filters,.ca-form,.op-filters){grid-template-columns:minmax(0,1fr)!important}
 .rp-quick{width:100%;margin:0}.rp-filter-actions{align-items:stretch}
 .cd-header{flex-wrap:wrap}.cd-header-actions{width:100%}
 .cd-hero-actions{flex-direction:column}
 .ca-person .ca-badge{max-width:100%;overflow-wrap:anywhere}
 .op-actions{padding-right:0!important;width:100%}.op-actions .op-btn{flex:1}
 .rp-month-pair{gap:3px}.rp-bars{gap:4px}
 .reception-actions :where(a,form,button){width:100%}
 .patient-entry .password-toggle{min-height:36px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media print{.slq-admin-toggle{display:none!important}.slq-responsive-table{overflow:visible}}
/* Grid children must shrink so wide patient tables scroll inside their panel. */
.cd-columns > *, .cd-panel, .cd-table-wrap{min-width:0;max-width:100%}
