/* Module navigation uses the shared Habitation sidebar; actions remain in the header. */
body #sysSecurityApp.has-security-sidebar:not(.is-security-authorizing) > .sysdash-shell{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}
body #sysSecurityApp .sys-security-workspace{display:grid;grid-template-columns:220px minmax(0,1fr);flex:1;min-height:0;gap:14px;overflow:hidden}
body #sysSecurityApp .sys-security-navigation{display:flex;flex-direction:column;gap:4px;align-self:stretch;min-height:0;overflow:auto}
body #sysSecurityApp .sys-security-navigation > button{width:100%;flex:none}
body #sysSecurityApp .sys-security-navigation .sys-security-advanced{padding:10px 0 0;margin:8px 0 0;border-top:1px solid var(--sysdash-line)}
body #sysSecurityApp .sys-security-navigation .sys-security-advanced summary{padding:8px;cursor:pointer;line-height:1.5}
body #sysSecurityApp .sys-security-navigation .sysimple-business-nav-group{display:flex;flex-direction:column;gap:4px}
body #sysSecurityApp .sys-security-main{min-width:0;min-height:0;overflow:auto;padding-bottom:14px}
body #sysSecurityApp .sys-security-main > .sys-security-panel{width:100%;min-width:0;overflow:visible}
body #sysSecurityApp .sys-security-main > .sys-security-panel > .sysdash-canvas{width:100%;min-width:0;overflow:visible}
body #sysSecurityApp:has(:is([data-security-panel="permissions"],[data-security-panel="specific-access"]).is-active) .sys-security-main > :is(.sys-security-guide,.sys-security-kpis){display:none}
body #sysSecurityApp .sys-security-menu-toggle{display:none!important}
html.sys-account-profile-page body #sysSecurityApp .sys-security-navigation{display:none!important}
html.sys-account-profile-page body #sysSecurityApp .sys-security-workspace{grid-template-columns:minmax(0,1fr)}
body #sysSecurityApp .sys-security-navigation :focus-visible{outline:2px solid var(--sysdash-accent);outline-offset:2px}
@layer sysimple-actions {
 html body #sysSecurityApp #securityNavigation button[aria-current="page"]:hover:not(:disabled){background:var(--sys-nav-fill)!important;color:var(--sys-nav-on-fill)!important}
}
/* Consistent work surfaces across every section, within the sidebar workspace. */
body #sysSecurityApp .sys-security-main > .sys-security-guide{margin-bottom:10px}
body #sysSecurityApp:not(:has([data-security-panel="users"].is-active,[data-security-panel="overview"].is-active)) .sys-security-main > :is(.sys-security-guide,.sys-security-kpis){display:none}
body #sysSecurityApp .sys-security-main .sysdash-canvas-head{display:flex;flex-wrap:wrap;gap:10px;padding:12px 14px;min-height:0}
body #sysSecurityApp .sys-security-main .sysdash-canvas-head > div:first-child{flex:1 0 100%;min-width:0}
body #sysSecurityApp .sys-security-main :is(.sysdash-canvas-head,.ofa-head) h2{font-size:18px;line-height:1.35;margin:0 0 4px}
body #sysSecurityApp .sysdash-canvas-head > .sys-security-toolbar{flex:1 0 100%;justify-content:flex-start;align-items:end;padding:0;min-width:0}
body #sysSecurityApp .sys-security-toolbar > label,body #sysSecurityApp .sys-security-field{display:flex;flex-direction:column;align-items:stretch;gap:5px;min-width:0;font-weight:400;font-size:12px;margin:0}
body #sysSecurityApp .sys-security-toolbar > label{flex:1 1 180px;max-width:380px}
body #sysSecurityApp .sys-security-toolbar label :is(input,select){width:100%;min-width:0;max-width:100%;box-sizing:border-box}
body #sysSecurityApp .sys-security-toolbar label [data-security-search="users"]{min-width:0}
body #sysSecurityApp .sys-security-filter-form{align-items:end}
body #sysSecurityApp .sys-security-main :is(.sysdash-widget,.sysdash-widget-body,.sys-security-layout,.sys-security-filter-grid,.sys-security-overview-grid){min-width:0}
body #sysSecurityApp .sys-security-overview-grid{height:auto;overflow:visible}
body #sysSecurityApp .sys-security-main > [data-security-panel="form-access"] > .sysdash-canvas{padding:14px;box-sizing:border-box}
body #sysSecurityApp .sys-security-main .sys-security-table-wrap{max-width:100%;overflow:auto}
@media(max-width:1100px){
 body #sysSecurityApp [data-security-tab="overview"]:not([hidden]){display:flex!important}
 body #sysSecurityApp [data-security-panel="overview"].is-active{display:block!important}
 body #sysSecurityApp .sys-security-overview-grid{grid-template-columns:minmax(0,1fr)}
 body #sysSecurityApp .sys-security-table :is(td,th){box-sizing:border-box;overflow-wrap:anywhere}
 body #sysSecurityApp [data-security-panel="users"] td[data-label="Actions"]{width:100%}
 /* Long historical lists use stacked cards at this width. Defer layout of
    off-screen cards while retaining native scrolling, search and keyboard access. */
 body #sysSecurityApp :is([data-security-panel="forms"],[data-security-panel="access"]) .sys-security-table tbody > tr{content-visibility:auto;contain-intrinsic-size:auto 360px}
}
@media(max-width:760px){
 body #sysSecurityApp .sys-security-toolbar > label{flex:1 0 100%;max-width:none}
 body #sysSecurityApp .sys-security-main :is(.ofa-selectors,.ofa-guided .ofa-selectors){grid-template-columns:minmax(0,1fr)}
}
@media(max-width:900px){
 body #sysSecurityApp .sysdash-commandbar .sysdash-actions{display:flex!important;flex-direction:row!important;flex-wrap:wrap;align-items:center;gap:8px;width:100%}
 body #sysSecurityApp .sysdash-commandbar .sysdash-actions > :is(a,button){flex:none;width:36px!important;min-height:36px}
 body #sysSecurityApp .sysdash-commandbar .sysdash-actions > .sys-security-menu-toggle{flex:1;width:auto!important}
 body #sysSecurityApp .sys-security-workspace{display:flex;flex-direction:column;gap:10px;overflow:auto}
 body #sysSecurityApp .sys-security-main{overflow:visible;flex:1 0 auto}
 body #sysSecurityApp .sys-security-menu-toggle{display:inline-flex!important;width:auto!important;gap:7px!important}
 body #sysSecurityApp .sys-security-navigation{display:none;flex:none;max-height:55vh}
 body #sysSecurityApp.is-security-nav-open .sys-security-navigation{display:flex}
}
/* Standalone Security fills the viewport below the live header and access notice.
   ViewSecurity is the injected view wrapper; it must pass the available height on. */
@media(min-width:901px){
 body[data-workspace-module="security"]{display:flex;flex-direction:column;height:100dvh;min-height:0;overflow:hidden}
 body[data-workspace-module="security"] > *{flex-shrink:0}
 body[data-workspace-module="security"] > .workspace-content{flex:1 1 0;height:auto;min-height:0;overflow:hidden}
 body[data-workspace-module="security"] #ViewSecurity{height:100%;min-height:0}
 body[data-workspace-module="security"] #sysSecurityApp{height:100%}
 body[data-workspace-module="security"] #sysSecurityApp .sysdash-shell{padding:8px 10px}
 body[data-workspace-module="security"] #sysSecurityApp .sys-security-main > .sys-security-guide:not([open]){float:right;max-width:45%;padding:4px 10px;margin:0 0 6px;border:0;line-height:1.5}
 body[data-workspace-module="security"] #sysSecurityApp .sys-security-kpis{padding:0;margin:0 0 8px;gap:6px}
 body[data-workspace-module="security"] #sysSecurityApp .sys-security-panel{clear:both}
 body[data-workspace-module="security"] #sysSecurityApp [data-security-panel="users"] .sysdash-canvas-head{display:flex;flex-direction:row;align-items:end;gap:16px;padding:10px 12px}
 body[data-workspace-module="security"] #sysSecurityApp [data-security-panel="users"] .sysdash-canvas-head > div:first-child{flex:0 1 320px}
 body[data-workspace-module="security"] #sysSecurityApp [data-security-panel="users"] .sys-security-toolbar{flex:1;justify-content:flex-end;padding:0}
 body[data-workspace-module="security"] #sysSecurityApp .sys-security-user-tabs{padding:8px 12px}
}
@media(max-width:900px){
 body[data-workspace-module="security"] > .workspace-content{height:auto;overflow:visible}
 body[data-workspace-module="security"] #ViewSecurity,
 body[data-workspace-module="security"] #sysSecurityApp,
 body[data-workspace-module="security"] #sysSecurityApp > .sysdash-shell{height:auto;overflow:visible}
 body[data-workspace-module="security"] #sysSecurityApp .sys-security-workspace{overflow:visible}
}