/* =====================================================================
   EDUHUNT V2.2.343 R128
   Principal five-destination navigation, vivid source icons, compact
   Test Key cards and equal mobile header controls.
   Presentation only: no API, database, permission or calculation changes.
   ===================================================================== */

/* Header: the hamburger and Profile controls use the same 44px footprint. */
@media screen and (max-width:1024px){
  body[data-portal-role="PRINCIPAL"] #drawerOpen,
  body[data-portal-role="PRINCIPAL"] #accountButton,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #drawerOpen,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #accountButton{
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    flex:0 0 44px!important;
    padding:0!important;
    border:1px solid #315a78!important;
    border-radius:13px!important;
    background:#0a2036!important;
  }
  body[data-portal-role="PRINCIPAL"] #drawerOpen svg,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #drawerOpen svg{
    width:23px!important;
    height:23px!important;
    color:#55e7ff!important;
    fill:none!important;
    stroke:currentColor!important;
  }
  body[data-portal-role="PRINCIPAL"] #topbarAvatar,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #topbarAvatar{
    width:32px!important;
    height:32px!important;
    color:#c7a6ff!important;
    background:#243f74!important;
    border-color:#617be1!important;
  }
  body[data-portal-role="PRINCIPAL"] #topbarAvatar svg,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #topbarAvatar svg{
    width:21px!important;
    height:21px!important;
    color:inherit!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:2.15!important;
    filter:drop-shadow(0 0 5px currentColor)!important;
  }
}

/* Desktop Principal sidebar has the same five destinations as mobile.
   Profile remains in the header, so no sixth sidebar action is required. */
@media screen and (min-width:1025px){
  body[data-portal-role="PRINCIPAL"] .sidebar-bottom{display:none!important}
  body[data-portal-role="PRINCIPAL"] .sidebar-nav{padding-bottom:18px!important}
}

/* Source line icons always inherit a vivid semantic colour, never black. */
body[data-portal-role="PRINCIPAL"] :is(.principal-nav-toggle,.principal-nav-direct,.principal-nav-child,.principal-hub-item) svg{
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2.15!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
body[data-portal-role="PRINCIPAL"] [data-principal-sidebar-group="people"]>svg{color:#55e7ff!important}
body[data-portal-role="PRINCIPAL"] [data-principal-sidebar-group="exams"]>svg{color:#ff9c4a!important}
body[data-portal-role="PRINCIPAL"] [data-principal-sidebar-group="resources"]>svg{color:#c58cff!important}
body[data-portal-role="PRINCIPAL"] [data-principal-sidebar-group="downloads"]>svg{color:#55e9b3!important}
body[data-portal-role="PRINCIPAL"] .principal-nav-direct[data-module="dashboard"]>svg{color:#ffd34e!important}
body[data-portal-role="PRINCIPAL"] .principal-nav-child:nth-child(5n+1)>svg{color:#55e7ff!important}
body[data-portal-role="PRINCIPAL"] .principal-nav-child:nth-child(5n+2)>svg{color:#c58cff!important}
body[data-portal-role="PRINCIPAL"] .principal-nav-child:nth-child(5n+3)>svg{color:#ff9c4a!important}
body[data-portal-role="PRINCIPAL"] .principal-nav-child:nth-child(5n+4)>svg{color:#55e9b3!important}
body[data-portal-role="PRINCIPAL"] .principal-nav-child:nth-child(5n+5)>svg{color:#ff78aa!important}

/* Each card icon receives its own vivid foreground colour. The surrounding
   badge can stay dark without allowing the SVG artwork to become black. */
body[data-portal-role="PRINCIPAL"] .principal-hub-color-1 .principal-hub-emoji{color:#57c8ff!important}
body[data-portal-role="PRINCIPAL"] .principal-hub-color-2 .principal-hub-emoji{color:#c9a1ff!important}
body[data-portal-role="PRINCIPAL"] .principal-hub-color-3 .principal-hub-emoji{color:#ffad55!important}
body[data-portal-role="PRINCIPAL"] .principal-hub-color-4 .principal-hub-emoji{color:#61e9b7!important}
body[data-portal-role="PRINCIPAL"] .principal-hub-color-5 .principal-hub-emoji{color:#7da5ff!important}
body[data-portal-role="PRINCIPAL"] .principal-hub-color-6 .principal-hub-emoji{color:#ffe066!important}
body[data-portal-role="PRINCIPAL"] .principal-hub-color-7 .principal-hub-emoji{color:#58e7f2!important}
body[data-portal-role="PRINCIPAL"] .principal-hub-color-8 .principal-hub-emoji{color:#ff8fc8!important}

/* The bottom bar mirrors Home, People, Exams, Resources and Downloads. */
@media screen and (max-width:1024px){
  body[data-portal-role="PRINCIPAL"] .principal-bottom-nav [data-principal-nav="downloads"] i,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] .principal-bottom-nav [data-principal-nav="downloads"] i{
    color:#55e9b3!important;
  }

  /* Hub cards retain the reference icon-above/text-below layout. Labels are
     two pixels larger and may wrap instead of being clipped. */
  body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-item,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-item{
    min-height:116px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
  }
  body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-item b,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-item b{
    display:block!important;
    width:100%!important;
    margin:0!important;
    color:#f4f9ff!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.18!important;
    text-align:center!important;
    white-space:normal!important;
    overflow:visible!important;
    overflow-wrap:anywhere!important;
  }
  body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-emoji,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-emoji{
    order:-1!important;
  }
}

/* The public Test Key card shows Class and key stage only. Historical
   year/new/reasoning/version text and repeated helper copy stay absent. */
body[data-portal-role="PRINCIPAL"] .r862-key-meta{display:none!important}
body[data-portal-role="PRINCIPAL"] .r862-key-top{align-items:center!important}

/* Dark is the first R128 state. Light remains available from the switcher. */
@media screen and (max-width:1024px){
  body[data-portal-role][data-desktop-theme="dark"],
  html.eh-force-mobile body[data-portal-role][data-desktop-theme="dark"]{
    color-scheme:dark;
    background:#020813!important;
    color:#eef7ff!important;
  }
  body[data-portal-role][data-desktop-theme="dark"] :is(.portal-view,.portal-main,.content),
  html.eh-force-mobile body[data-portal-role][data-desktop-theme="dark"] :is(.portal-view,.portal-main,.content){
    background:#020813!important;
    color:#eef7ff!important;
  }
}

@media screen and (max-width:380px){
  body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-item,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-item{
    min-height:112px!important;
    padding:8px 3px!important;
  }
  body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-item b,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] .principal-mobile-hub .principal-hub-item b{
    font-size:14px!important;
  }
}

@media print{
  body[data-portal-role="PRINCIPAL"] .principal-bottom-nav{display:none!important}
}


/* =====================================================================
   EDUHUNT V2.2.344 R129 - PRINCIPAL NAV NAME + THEME CONTROL REPAIR
   Principal only. Restores the pre-R128 fifth navigation destination
   (Profile), fixes mobile navigation label size at 13px, and keeps the
   existing Light / Dark pair visible in the Principal top bar on every page.
   No API, DB, permissions, calculations, uploads or other-role logic changed.
   ===================================================================== */
@media screen and (max-width:1024px){
  body[data-portal-role="PRINCIPAL"] .principal-bottom-nav button span,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] .principal-bottom-nav button span{
    font-size:13px!important;
    line-height:1.1!important;
  }

  body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher{
    display:inline-flex!important;
    align-items:center!important;
    gap:2px!important;
    min-height:36px!important;
    padding:2px!important;
    flex:0 0 auto!important;
    border:1px solid #315a78!important;
    border-radius:10px!important;
    background:#07192c!important;
    box-shadow:none!important;
  }
  body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher[hidden],
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher[hidden]{
    display:none!important;
  }
  body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;
    min-width:0!important;
    min-height:30px!important;
    height:30px!important;
    padding:4px 6px!important;
    border:0!important;
    border-radius:7px!important;
    background:transparent!important;
    color:#a9bed2!important;
    font-size:13px!important;
    font-weight:700!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice span,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice span{
    font-size:13px!important;
    line-height:1!important;
  }
  body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice.is-active,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice.is-active{
    background:#17344f!important;
    color:#ffffff!important;
  }
  body[data-portal-role="PRINCIPAL"] #studentThemeToggle,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #studentThemeToggle{
    display:none!important;
  }
}

@media screen and (max-width:430px){
  body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice{
    padding-left:5px!important;
    padding-right:5px!important;
  }
  body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice>span,
  html.eh-force-mobile body[data-portal-role="PRINCIPAL"] #desktopThemeSwitcher .desktop-theme-choice>span{
    display:none!important;
  }
}
