/* Responsive hardening across previously refreshed SignalSolid views.
   Tested by CSS contract and intended for 320, 360, 390, 430, 600, 768, 980px.
   This file loads last in both application shells. */
html,body{max-width:100%;overflow-x:clip}
.ss-app-frame,.ss-app-content,.ss3-workspace,.ss-dashboard,.ss-commerce,.admin-portal-main,main{min-width:0}
:where(.ss3-page-head,.ss3-health-strip,.ss3-dashboard-grid,.ss3-quick-grid,.ss-marketplace-grid,.ss-customer-quicklinks,.admin-portal-shell)>*{min-width:0}
:where(h1,h2,h3,.ss-app-topbar__title strong){overflow-wrap:break-word}
:where(.ss3-head-actions,.ss3-public-actions,.ss-commerce__header,.ss-customer-welcome){min-width:0}
:where(.ss-app-topbar__left,.ss-app-topbar__actions,.ss-app-topbar__title){min-width:0}
@media(max-width:980px){
 .ss-app-content{padding-bottom:calc(98px + env(safe-area-inset-bottom,0px))!important}
 .ss3-mobile-nav{bottom:calc(9px + env(safe-area-inset-bottom,0px))!important;inset-inline:9px!important;width:auto;max-width:calc(100vw - 18px);box-sizing:border-box}
 .ss3-mobile-nav>a{min-width:0;touch-action:manipulation}
 .ss-app-topbar{gap:10px!important;padding-inline:clamp(10px,2.5vw,20px)!important}
 .ss-app-topbar__left{display:flex;gap:10px;min-width:0;flex:1}
 .ss-app-topbar__title{flex:1;min-width:0}
 .ss-app-topbar__actions{flex-shrink:0;display:flex;align-items:center;gap:6px}
 .ss-app-topbar__actions :where(.ss3-control-button,.ss-icon-button,.ss-app-user-button,.ss3-command-trigger){flex-shrink:0}
 .ss3-workspace{max-width:100%;padding:24px 16px calc(116px + env(safe-area-inset-bottom,0px))!important}
 .ss3-page-head{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:16px!important;margin-bottom:22px}
 .ss3-page-head>div{min-width:0;max-width:100%}
 .ss3-head-actions{position:static!important;display:flex!important;justify-content:flex-start!important;flex-wrap:wrap!important;gap:8px!important;width:100%;max-width:100%;transform:none!important}
 .ss3-head-actions :where(a,button){flex:0 1 auto;max-width:100%;white-space:normal}
 .ss3-health-strip{grid-template-columns:1fr!important}
 .ss3-health-primary{grid-column:1 / -1;min-height:92px;display:flex;gap:12px}
 .ss3-health-stat{min-height:0!important;padding:16px 18px!important;border-left:0!important;border-top:1px solid var(--ss3-border)}
 .ss3-dashboard-grid{grid-template-columns:minmax(0,1fr)!important}
 .ss3-dashboard-grid>*{min-width:0;grid-column:auto!important}
 .ss3-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .ss-admin-refresh .admin-portal-shell{min-width:0}
}
@media(max-width:600px){
 .ss-app-topbar{min-height:66px!important;padding:7px 10px!important}
 .ss-app-topbar__title strong{font-size:clamp(.9rem,3.5vw,1.06rem)!important;line-height:1.2}
 .ss-app-topbar__actions{gap:5px!important}
 .ss-app-topbar__actions :where(.ss3-control-button,.ss-icon-button,.ss-app-user-button,.ss3-command-trigger){width:40px!important;min-width:40px!important;min-height:42px!important;padding:0!important}
 .ss-app-mobile-toggle{min-width:42px!important;width:42px;height:44px}
 .ss3-workspace{padding:22px 12px calc(110px + env(safe-area-inset-bottom,0px))!important}
 .ss3-page-head{gap:16px!important}
 .ss3-page-head h1{font-size:clamp(1.8rem,8vw,2.65rem)!important;line-height:1.12!important;margin-block:10px!important;overflow-wrap:anywhere}
 .ss3-page-head p{font-size:.95rem!important;line-height:1.65!important}
 .ss3-head-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
 .ss3-head-actions>:last-child:nth-child(odd){grid-column:1 / -1}
 .ss3-head-actions :where(a,button){width:100%!important;min-width:0!important;min-height:46px!important;margin:0!important;display:flex!important;align-items:center;justify-content:center;text-align:center;white-space:normal!important}
 .ss3-health-primary{padding:17px!important}
 .ss3-health-primary :where(strong,span){overflow-wrap:anywhere}
 .ss3-quick-grid{grid-template-columns:1fr!important}
 .ss3-panel{min-width:0;max-width:100%}
 .ss3-panel-head{flex-wrap:wrap;gap:8px}
 .ss3-mobile-nav{grid-template-columns:repeat(4,minmax(0,1fr))!important}
 .ss3-mobile-nav a{font-size:.75rem!important;gap:5px!important}
 .ss3-mobile-nav a i{font-size:1rem!important}
 .ss-customer-quicklinks{grid-template-columns:1fr!important}
 .ss-commerce{width:calc(100% - 24px)!important}
 .ss-commerce__grid{grid-template-columns:minmax(0,1fr)!important}
 .ss-commerce__card{overflow-wrap:anywhere}
 .ss-showcase{max-width:100%;transform:none!important}
 .ss-showcase-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ss-public-container{width:calc(100% - 24px)!important}
 .ss-marketplace-grid{grid-template-columns:minmax(0,1fr)!important}
 .ss-admin-refresh .ss-admin-heading{display:flex;flex-direction:column;align-items:stretch}
}
@media(max-width:370px){
 .ss-app-topbar__title strong{font-size:.84rem!important}
 .ss-app-topbar__actions{gap:3px!important}
 .ss-app-topbar__actions :where(.ss3-control-button,.ss-icon-button,.ss-app-user-button,.ss3-command-trigger){min-width:36px!important;width:36px!important}
 .ss3-page-head h1{font-size:1.8rem!important}
 .ss3-mobile-nav{inset-inline:5px!important;max-width:calc(100vw - 10px)}
 .ss3-mobile-nav a{font-size:.75rem!important}
}
@media(prefers-reduced-motion:reduce){.ss3-mobile-nav,.ss3-head-actions :where(a,button){transition:none!important;animation:none!important}}

/* Mobile visual certification candidate: marketplace, operations, customer data panels.
   Keep wide tables scrollable and dialogs inside the viewport. */
:where(.ss-ref-admin-row,.ss-ref-admin-kpis,.ss-ref-admin-system,.ss-reference-account-content,.ss-reference-summary,.ss3-bot-grid)>*{min-width:0}
:where(.table-responsive,[class*="table-scroll"]){max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
:where(.modal-dialog,.dropdown-menu){max-width:calc(100vw - 20px)}
:where(.ss-reference-product-row,.ss-ref-admin-payment)>div{min-width:0}
@media(max-width:980px){
 .ss-app-frame,.ss-app-content,.ss3-workspace{width:100%;max-width:100%;min-width:0}
 .ss-ref-admin-row{grid-template-columns:minmax(0,1fr)!important}
 .ss-reference-account-content{grid-template-columns:minmax(0,1fr)!important}
 .ss3-catalog-workspace .ss3-bot-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .ss-admin-live-layout{max-width:100%;overflow-wrap:anywhere}
}
@media(max-width:620px){
 .ss3-catalog-workspace .ss3-bot-grid{grid-template-columns:minmax(0,1fr)!important}
 .ss-ref-admin-kpis,.ss-reference-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .ss-ref-admin-chart-plot{height:180px;max-width:100%;overflow:hidden}
 .ss-ref-admin-panel-heading{align-items:flex-start;flex-direction:column}
 .ss-ref-admin-system{grid-template-columns:minmax(0,1fr)!important}
 .ss-reference-product-row{gap:8px}
 .ss-reference-product-row :where(.ss-reference-status,.ss-reference-order-status){margin-left:auto}
 .ss-reference-hero__inner,.ss-reference-hero__inner>*{min-width:0}
 .ss-reference-actions{display:flex;flex-direction:column;align-items:stretch}
 .ss-reference-actions>a{max-width:100%}
 .ss-showcase,.ss-reference-art,.ss-reference-chart{max-width:100%}
 .ss-admin-live-layout .admin-portal-grid{grid-template-columns:minmax(0,1fr)!important}
}
@media(max-width:360px){
 .ss-ref-admin-kpis,.ss-reference-summary{grid-template-columns:minmax(0,1fr)!important}
 .ss3-mobile-nav a{min-width:0;overflow-wrap:anywhere}
}

/* 2026-10-20: screenshot-confirmed mobile collision in customer operations cockpit.
   Ensure heading, actions and health strip stay in normal document flow. */
@media(max-width:767px){
 .ss3-workspace .ss3-page-head,
 .ss3-workspace .ss3-page-head>div,
 .ss3-workspace .ss3-head-actions,
 .ss3-workspace .ss3-health-strip,
 .ss3-workspace .ss3-health-primary{
   position:relative!important;inset:auto!important;transform:none!important;
   height:auto!important;min-height:0!important;max-height:none!important;
   float:none!important;
 }
 .ss3-workspace .ss3-page-head{
   display:flex!important;flex-direction:column!important;align-items:stretch!important;
   gap:18px!important;overflow:visible!important;margin:0 0 22px!important;
 }
 .ss3-workspace .ss3-page-head>div{width:100%!important;max-width:100%!important}
 .ss3-workspace .ss3-page-head h1{
   font-size:clamp(1.75rem,7vw,2.35rem)!important;line-height:1.2!important;
   overflow-wrap:anywhere!important;white-space:normal!important;margin:0 0 10px!important;
 }
 .ss3-workspace .ss3-page-head p{
   margin:0!important;font-size:.93rem!important;line-height:1.55!important;
   overflow-wrap:anywhere!important;white-space:normal!important;
 }
 .ss3-workspace .ss3-head-actions{
   display:grid!important;grid-template-columns:minmax(0,1fr)!important;
   align-items:stretch!important;gap:10px!important;width:100%!important;
   padding:0!important;margin:0!important;
 }
 .ss3-workspace .ss3-head-actions :where(a,button){
   position:static!important;transform:none!important;display:flex!important;
   align-items:center!important;justify-content:center!important;
   width:100%!important;max-width:100%!important;min-height:46px!important;
   padding:12px!important;white-space:normal!important;overflow-wrap:anywhere!important;
   line-height:1.35!important;flex:none!important;
 }
 .ss3-workspace .ss3-health-strip{
   display:grid!important;grid-template-columns:minmax(0,1fr)!important;
   margin:20px 0!important;overflow:visible!important;
 }
 .ss3-workspace .ss3-health-strip>*{
   grid-column:1/-1!important;width:100%!important;min-width:0!important;
   height:auto!important;max-height:none!important;
 }
 .ss3-workspace .ss3-health-primary{
   display:flex!important;flex-wrap:wrap!important;align-items:flex-start!important;
   gap:12px!important;padding:16px!important;
 }
 .ss3-workspace .ss3-health-primary>div:not(.ss3-health-primary__icon){
   min-width:0!important;flex:1 1 175px!important;
 }
 .ss3-workspace .ss3-health-primary :where(strong,span){
   position:static!important;display:block!important;
   white-space:normal!important;overflow-wrap:anywhere!important;
   line-height:1.45!important;margin:0!important;
 }
 .ss3-workspace .ss3-health-primary span{margin-top:5px!important}
}