/* Phase 40 — hard-fixed topbar / header shell
   The desktop/mobile ERP header is anchored to the viewport. The normal document layout reserves
   exactly the measured header height through --erp-shell-top (maintained by app.js), so fixing the
   header never causes page content to slide underneath it. Phase 39's fixed sidebar consumes the
   same variable, keeping both shell edges aligned. */

/* Structural rule applies to the ERP shell regardless of the selected visual theme. */
body.ui-v2 .topbar{
  position:fixed!important;
  top:0!important;
  right:0!important;
  left:0!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  box-sizing:border-box!important;
  z-index:90!important;
  transform:none!important;
}

/* A fixed header is removed from normal flow. Reserve its live measured height before the layout.
   Keep margin (instead of body padding) so overlays/modals and existing body-level positioning do
   not inherit an unexpected vertical offset. */
body.ui-v2 .layout{
  margin-top:var(--erp-shell-top)!important;
}

/* Keep short pages filling the viewport below the fixed header and avoid a synthetic blank band. */
body.ui-v2 .main{
  min-height:calc(100vh - var(--erp-shell-top))!important;
  min-height:calc(100dvh - var(--erp-shell-top))!important;
}

/* Native anchor/focus navigation should land below the fixed header instead of underneath it. */
html{scroll-padding-top:calc(var(--erp-shell-top) + 12px)}
body.ui-v2 [id]{scroll-margin-top:calc(var(--erp-shell-top) + 12px)}

/* Prevent an old translucent/blurred topbar declaration from making scrolling content visually
   bleed through the fixed shell when Clarity Pro is active. Other themes keep their own colours. */
body[data-theme="clarity-pro"] .topbar{
  background:#fff!important;
  border-bottom:1px solid #e5e8ec!important;
}

/* Mobile uses the same fixed header. Phase 39 already positions the off-canvas sidebar from the
   measured --erp-shell-top, so no duplicated 60/66/70px constants are needed here. */
@media(max-width:880px){
  body.ui-v2 .topbar{position:fixed!important;top:0!important}
  body.ui-v2 .layout{margin-top:var(--erp-shell-top)!important}
}

/* Printing should not reserve an invisible fixed-header gap. */
@media print{
  body.ui-v2 .topbar{display:none!important}
  body.ui-v2 .layout{margin-top:0!important}
  body.ui-v2 .main{min-height:0!important}
}