/* Smart School v0.9.06 — canonical platform header. One source for every operational portal. */
:root{
  --ssgh-h:62px;
  --ssgh-bg:rgba(255,255,255,.98);
  --ssgh-ink:#12384d;
  --ssgh-muted:#66808d;
  --ssgh-line:rgba(18,56,77,.12);
  --ssgh-accent:#0f607a;
  --ssgh-shadow:0 8px 24px rgba(12,48,65,.09);
}

html.ss-global-header-active body{
  padding-top:var(--ssgh-h)!important;
}

#ssPlatformHeader{
  position:fixed!important;
  inset:0 0 auto 0!important;
  z-index:5000!important;
  height:var(--ssgh-h)!important;
  min-height:var(--ssgh-h)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:8px 16px!important;
  margin:0!important;
  background:var(--ssgh-bg)!important;
  border:0!important;
  border-bottom:1px solid var(--ssgh-line)!important;
  box-shadow:var(--ssgh-shadow)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  direction:rtl!important;
  color:var(--ssgh-ink)!important;
  overflow:hidden!important;
}
#ssPlatformHeader,#ssPlatformHeader *{box-sizing:border-box!important}

.ssgh-brand{
  min-width:0!important;
  flex:1 1 auto!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  overflow:hidden!important;
}
.ssgh-logo{
  width:38px!important;
  height:38px!important;
  flex:0 0 38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  color:#fff!important;
  background:linear-gradient(145deg,#0e5064,#1778bd)!important;
  box-shadow:0 7px 18px rgba(15,96,122,.18)!important;
}
.ssgh-logo svg{width:21px!important;height:21px!important;display:block!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.ssgh-brand-copy{min-width:0!important;overflow:hidden!important}
.ssgh-product{
  margin:0!important;
  color:var(--ssgh-ink)!important;
  font:900 15px/1.25 system-ui,-apple-system,"Segoe UI",Tahoma,Arial,sans-serif!important;
  white-space:nowrap!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.ssgh-context{
  margin-top:2px!important;
  color:var(--ssgh-muted)!important;
  font:700 10px/1.25 system-ui,-apple-system,"Segoe UI",Tahoma,Arial,sans-serif!important;
  white-space:nowrap!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  max-width:min(48vw,560px)!important;
}
.ssgh-actions{display:flex!important;align-items:center!important;gap:7px!important;flex:0 0 auto!important}
.ssgh-action{
  min-height:38px!important;
  height:38px!important;
  padding:0 11px!important;
  border:1px solid var(--ssgh-line)!important;
  border-radius:11px!important;
  background:#fff!important;
  color:var(--ssgh-ink)!important;
  font:850 11px/1 system-ui,-apple-system,"Segoe UI",Tahoma,Arial,sans-serif!important;
  text-decoration:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  cursor:pointer!important;
  white-space:nowrap!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
}
.ssgh-action svg{width:18px!important;height:18px!important;display:block!important;fill:none!important;stroke:currentColor!important;stroke-width:2!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.ssgh-menu{background:var(--ssgh-accent)!important;color:#fff!important;border-color:var(--ssgh-accent)!important}
.ssgh-action[hidden]{display:none!important}

/* The canonical header replaces shell-level headers only. Page headings remain in content. */
html.ss-global-header-active body.portal-role-manager .main>.topbar,
html.ss-global-header-active body .workspace-header.ss-shell-header,
html.ss-global-header-active body .portal-shell-header{
  display:none!important;
}
html.ss-global-header-active body.portal-role-manager .school-global-menu-btn{display:none!important}

/* Generic drawer contract: JS marks a local sidebar with .ssgh-drawer. */
@media(max-width:900px){
  :root{--ssgh-h:58px}
  #ssPlatformHeader{padding:7px 9px!important;gap:7px!important}
  .ssgh-logo{width:34px!important;height:34px!important;flex-basis:34px!important;border-radius:10px!important}
  .ssgh-logo svg{width:19px!important;height:19px!important}
  .ssgh-product{font-size:13px!important}
  .ssgh-context{font-size:9px!important;max-width:44vw!important}
  .ssgh-action{width:38px!important;min-width:38px!important;height:36px!important;min-height:36px!important;padding:0!important;border-radius:10px!important}
  .ssgh-action span{display:none!important}

  .ssgh-drawer{
    position:fixed!important;
    top:var(--ssgh-h)!important;
    bottom:0!important;
    inset-inline-start:0!important;
    z-index:4900!important;
    width:min(86vw,340px)!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    transform:translateX(110%)!important;
    transition:transform .2s ease!important;
    box-shadow:-18px 0 44px rgba(5,24,33,.22)!important;
    overscroll-behavior:contain!important;
  }
  html[dir="ltr"] .ssgh-drawer{transform:translateX(-110%)!important}
  .ssgh-drawer.ssgh-open{transform:none!important}

  #ssPlatformBackdrop{
    position:fixed!important;
    inset:var(--ssgh-h) 0 0 0!important;
    z-index:4800!important;
    border:0!important;
    padding:0!important;
    margin:0!important;
    background:rgba(5,26,35,.38)!important;
    backdrop-filter:blur(2px)!important;
    -webkit-backdrop-filter:blur(2px)!important;
  }
  #ssPlatformBackdrop[hidden]{display:none!important}
}

/* School manager fallback: the sidebar is never allowed to become a huge mobile header again,
   even if the global-header JS is blocked or delayed. */
@media(max-width:900px){
  body.portal-role-manager #appView.app-shell{display:block!important;min-height:100dvh!important}
  body.portal-role-manager #appView>.main{width:100%!important;min-width:0!important}
  body.portal-role-manager #appView>.sidebar{
    position:fixed!important;
    inset-block:0!important;
    inset-inline-start:0!important;
    z-index:4900!important;
    width:min(86vw,340px)!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:none!important;
    display:flex!important;
    flex-direction:column!important;
    padding:12px!important;
    overflow:hidden!important;
    transform:translateX(110%)!important;
    transition:transform .2s ease!important;
    background:linear-gradient(180deg,#0b3043 0%,#0b4c48 100%)!important;
    box-shadow:-18px 0 44px rgba(5,24,33,.22)!important;
  }
  html[dir="ltr"] body.portal-role-manager #appView>.sidebar{transform:translateX(-110%)!important}
  html.ss-global-header-active body.portal-role-manager #appView>.sidebar{top:var(--ssgh-h)!important;height:calc(100dvh - var(--ssgh-h))!important}
  body.portal-role-manager #appView>.sidebar:is(.mobile-nav-open,.ssgh-open){transform:none!important}
  body.portal-role-manager #appView>.sidebar .brand-row.compact{display:flex!important;min-height:48px!important;flex:0 0 auto!important}
  body.portal-role-manager #appView>.sidebar #schoolPrimaryNav{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:4px!important;
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    margin:6px 0 0!important;
    padding:6px!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:14px!important;
    background:rgba(5,36,46,.72)!important;
  }
  body.portal-role-manager #appView>.sidebar #schoolPrimaryNav .sidebar-group-label{
    grid-column:1!important;
    margin:8px 4px 3px!important;
    padding:0 4px!important;
    color:#9fd6c7!important;
    font-size:10px!important;
    text-align:right!important;
    white-space:nowrap!important;
    word-break:keep-all!important;
  }
  body.portal-role-manager #appView>.sidebar #schoolPrimaryNav :is(.nav-btn,.sidebar-direct-link){
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-height:42px!important;
    padding:9px 11px!important;
    text-align:right!important;
    font-size:12px!important;
    line-height:1.45!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
  }
  body.portal-role-manager #appView>.sidebar #schoolPrimaryNav .nav-btn.active{min-height:42px!important;background:#fff!important;color:#0b5148!important;border-radius:10px!important}
  html.ss-global-header-active body.portal-role-manager .school-mobile-nav-toggle{display:none!important}
  html.ss-global-header-active body.portal-role-manager .school-mobile-nav-backdrop{display:none!important}
}
