/* Mantem sidebar, cabecalho e conteudo SaaS na mesma grade em todos os tamanhos. */
body.saas-active{--saas-sidebar-width:244px;overflow-x:hidden}
.saas-shell{display:block!important;width:100%;min-height:100vh;overflow-x:hidden}
.saas-sidebar{width:var(--saas-sidebar-width)!important}
.saas-main{width:calc(100% - var(--saas-sidebar-width))!important;min-width:0;margin-left:var(--saas-sidebar-width)!important}
.saas-main>header{width:100%;box-sizing:border-box}
.saas-main>header>div:first-child{min-width:260px;max-width:440px}
.saas-main>header>div:first-child strong{white-space:nowrap}
.saas-content{width:100%!important;max-width:none!important;box-sizing:border-box}
.saas-content>.page-heading{width:100%!important;max-width:100%}
.saas-sidebar nav{padding-right:3px;overflow-y:auto}
.saas-sidebar nav a{flex-shrink:0}
.saas-sidebar nav a svg{margin-right:1px}
.saas-sidebar::-webkit-scrollbar,.saas-sidebar nav::-webkit-scrollbar{width:4px}
.saas-sidebar::-webkit-scrollbar-thumb,.saas-sidebar nav::-webkit-scrollbar-thumb{background:#ffffff20;border-radius:8px}

@media(max-width:1180px) and (min-width:761px){
  body.saas-active{--saas-sidebar-width:222px}
  .saas-main>header>div:first-child{min-width:200px}
}

@media(max-width:760px){
  body.saas-active{--saas-sidebar-width:100%}
  .saas-sidebar{width:100%!important}
  .saas-main{width:100%!important;margin-left:0!important}
  .saas-main>header>div:first-child{min-width:0;max-width:58vw}
  .saas-main>header>div:first-child strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .saas-sidebar nav{overflow-x:auto;overflow-y:hidden}
}