/* GYPTO Electrical V155.1 — stable full-width recovery + hover sidebar */
html,body{width:100%!important;max-width:100%!important;margin:0!important;overflow-x:hidden!important}

/* The application workspace must always occupy the viewport. */
#app.app:not(.hidden){display:block!important;position:relative!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;grid-template-columns:none!important;overflow:visible!important}
#app.app>.main{display:block!important;position:relative!important;inset:auto!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;transform:none!important;box-sizing:border-box!important;visibility:visible!important;opacity:1!important}
#app.app>.main>.top{width:100%!important;max-width:100%!important;left:0!important;right:auto!important;margin:0!important;box-sizing:border-box!important}
#app.app>.main>#view.content{display:block!important;width:100%!important;max-width:none!important;margin:0!important;box-sizing:border-box!important;visibility:visible!important;opacity:1!important}

/* Legacy compatibility mounts are retained for JavaScript but never shown. */
#app .electrical-top-nav,#app #nav,#app footer,#app .footer,#app .section-footer{display:none!important;visibility:hidden!important}

@media (min-width:1121px){
  #app.app>.side{
    display:flex!important;
    flex-direction:column!important;
    position:fixed!important;
    left:0!important;right:auto!important;top:0!important;bottom:0!important;
    width:258px!important;max-width:258px!important;height:100vh!important;
    margin:0!important;
    transform:translate3d(-100%,0,0)!important;
    visibility:visible!important;opacity:1!important;pointer-events:auto!important;
    z-index:2147483000!important;
    transition:transform .22s cubic-bezier(.2,.75,.25,1),box-shadow .22s ease!important;
    box-shadow:10px 0 28px rgba(14,55,90,.10)!important;
    will-change:transform!important;
  }
  body.v154-sidebar-open #app.app>.side,
  body.v154-sidebar-pinned #app.app>.side,
  body.v1551-sidebar-open #app.app>.side,
  #app.app>.side:hover,
  #app.app>.side:focus-within{
    transform:translate3d(0,0,0)!important;
    box-shadow:22px 0 54px rgba(14,55,90,.24)!important;
  }
  #v154SidebarHotzone{
    display:block!important;
    position:fixed!important;
    left:0!important;top:0!important;bottom:0!important;
    width:18px!important;
    z-index:2147482999!important;
    background:linear-gradient(90deg,#0874d4 0 4px,rgba(8,116,212,.10) 4px 8px,transparent 8px)!important;
    cursor:pointer!important;
    visibility:visible!important;opacity:1!important;pointer-events:auto!important;
  }
  body.v154-sidebar-open #v154SidebarHotzone,
  body.v154-sidebar-pinned #v154SidebarHotzone,
  body.v1551-sidebar-open #v154SidebarHotzone{pointer-events:none!important;opacity:0!important}
}

@media (max-width:1120px){
  #v154SidebarHotzone{display:none!important}
  #app.app>.side{visibility:visible!important;opacity:1!important}
}


/* V155.2 login isolation: never render the dashboard shell behind authentication. */
#app.app.hidden,
body.auth-ready #app.app{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}
body.auth-ready #v154SidebarHotzone,
body.auth-ready #floatingQrCard,
body.auth-ready #installAppFab,
body.auth-ready #installModalBackdrop{display:none!important;visibility:hidden!important;pointer-events:none!important}
body.auth-ready{overflow:auto!important}
body.auth-ready .auth-screen:not(.hidden){display:grid!important;visibility:visible!important;opacity:1!important}
.auth-actions button:disabled,.google-login-btn:disabled{opacity:.62!important;cursor:wait!important;transform:none!important}
#authMsg{min-height:22px}
