/*
 * v170 — gaya menu Portal Pendidikan disamakan dengan Konseling Eduvia v1.5 pada basis Portal Pendidikan v16.9.
 * Default  : latar pucat, outline hijau, indikator hijau tebal di kiri.
 * Hover/aktif: hijau penuh, teks dan ikon putih, indikator kiri lebih gelap.
 * Hanya menata tombol navigasi/menu; tombol aksi dan formulir tidak disentuh.
 */

:root {
  --pp-menu-control-green:#078ee8;
  --pp-menu-control-hover:#20a7ff;
  --pp-menu-control-border:#078ee8;
  --pp-menu-control-dark:#003f9e;
  --pp-menu-control-pale:#f3f8ff;
  --pp-menu-control-text:#006fd1;
  --pp-menu-control-focus:0 0 0 4px rgba(7,142,232,.18);
}

/* Daftar selector navigasi utama seluruh portal. */
html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
) {
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  border:1.5px solid var(--pp-menu-control-border) !important;
  border-radius:15px !important;
  background:var(--pp-menu-control-pale) !important;
  color:var(--pp-menu-control-text) !important;
  -webkit-text-fill-color:var(--pp-menu-control-text) !important;
  box-shadow:inset 6px 0 0 var(--pp-menu-control-border) !important;
  font-weight:700 !important;
  transition:
    background-color .18s ease,
    color .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease !important;
}

/* Hilangkan indikator lama (termasuk garis biru kanan) agar tidak bertumpuk. */
html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
)::before,
html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
)::after {
  content:none !important;
  display:none !important;
}

/* Pastikan isi dan ikon selalu berada di atas latar tombol. */
html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
) > * {
  position:relative !important;
  z-index:1 !important;
}

/* Keadaan hover/fokus dan semua variasi penanda menu aktif. */
html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
):is(
  :hover,
  :focus-visible,
  .active,
  .selected,
  .is-active,
  .bg-blue-500,
  .portal-accreditation-nav-active,
  [aria-current="page"],
  [aria-selected="true"],
  [aria-pressed="true"],
  [data-active="true"]
) {
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border-color:var(--pp-menu-control-border) !important;
  background:var(--pp-menu-control-green) !important;
  box-shadow:
    inset 7px 0 0 var(--pp-menu-control-dark),
    0 10px 22px rgba(0, 111, 209, .18) !important;
  transform:none !important;
}

html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
):focus-visible {
  outline:none !important;
  box-shadow:
    inset 7px 0 0 var(--pp-menu-control-dark),
    0 10px 22px rgba(0, 111, 209, .18),
    var(--pp-menu-control-focus) !important;
}

/* Warna teks/ikon mengikuti state tombol, termasuk SVG Lucide. */
html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
) :is(span,b,small,p,.admin-nav-label,.nav-label,svg,i,.admin-nav-icon,.nav-icon) {
  color:inherit !important;
  -webkit-text-fill-color:currentColor !important;
}

html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
) svg {
  stroke:currentColor !important;
}

/* Badge angka tetap terbaca seperti pada menu Konseling. */
html body :is(
  #groupNav > button,
  #subNav > button,
  #foundationNav > button,
  #ownerNav > button,
  .sidebar nav > button,
  .foundation-app aside nav > button,
  .portal-nav-desktop > button,
  .portal-nav-mobile > button,
  .student-mobile-nav > button,
  .unified-sidebar nav > button,
  .portal-groups > button,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-sidebar nav > button,
  .owner-sidebar nav > button
) :is(.side-count,.nav-count,.nav-badge,.menu-badge,.notification-badge) {
  color:var(--pp-menu-control-text) !important;
  -webkit-text-fill-color:var(--pp-menu-control-text) !important;
  background:#eaf5f0 !important;
}

html body :is(
  #groupNav > button,
  #subNav > button,
  #foundationNav > button,
  #ownerNav > button,
  .sidebar nav > button,
  .foundation-app aside nav > button,
  .portal-nav-desktop > button,
  .portal-nav-mobile > button,
  .student-mobile-nav > button,
  .unified-sidebar nav > button,
  .portal-groups > button,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-sidebar nav > button,
  .owner-sidebar nav > button
):is(
  :hover,
  :focus-visible,
  .active,
  .selected,
  .is-active,
  .bg-blue-500,
  .portal-accreditation-nav-active,
  [aria-current="page"],
  [aria-selected="true"],
  [aria-pressed="true"],
  [data-active="true"]
) :is(.side-count,.nav-count,.nav-badge,.menu-badge,.notification-badge) {
  color:var(--pp-menu-control-text) !important;
  -webkit-text-fill-color:var(--pp-menu-control-text) !important;
  background:#ffffff !important;
}

/* Menu nonaktif/disabled tidak berubah menjadi hijau saat disentuh. */
html body :is(
  #groupNav > button,
  #subNav > button,
  #foundationNav > button,
  #ownerNav > button,
  .sidebar nav > button,
  .foundation-app aside nav > button,
  .portal-nav-desktop > button,
  .portal-nav-mobile > button,
  .student-mobile-nav > button,
  .unified-sidebar nav > button,
  .portal-groups > button,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-sidebar nav > button,
  .owner-sidebar nav > button
):disabled {
  cursor:not-allowed !important;
  opacity:.55 !important;
  color:var(--pp-menu-control-text) !important;
  -webkit-text-fill-color:var(--pp-menu-control-text) !important;
  border-color:#9bbccf !important;
  background:#f4f8f6 !important;
  box-shadow:inset 6px 0 0 #9bbccf !important;
}

@media (max-width:850px) {
  html body :is(
    #groupNav > button,
    #groupNav > a,
    #subNav > button,
    #subNav > a,
    #foundationNav > button,
    #foundationNav > a,
    #ownerNav > button,
    #ownerNav > a,
    .sidebar nav > button,
    .sidebar nav > a,
    .foundation-app aside nav > button,
    .foundation-app aside nav > a,
    .portal-nav-mobile > button,
    .portal-nav-mobile > a,
    .student-mobile-nav > button,
    .student-mobile-nav > a,
    .unified-sidebar nav > button,
    .unified-sidebar nav > a,
    .portal-groups > button,
    .portal-groups > a,
    .nav-button,
    .admin-mobile-dock > button,
    .admin-mobile-dock > a,
    .admin-sidebar nav > button,
    .admin-sidebar nav > a,
    .owner-sidebar nav > button,
    .owner-sidebar nav > a
  ) {
    border-radius:14px !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  html body :is(
    #groupNav > button,
    #groupNav > a,
    #subNav > button,
    #subNav > a,
    #foundationNav > button,
    #foundationNav > a,
    #ownerNav > button,
    #ownerNav > a,
    .sidebar nav > button,
    .sidebar nav > a,
    .foundation-app aside nav > button,
    .foundation-app aside nav > a,
    .portal-nav-desktop > button,
    .portal-nav-desktop > a,
    .portal-nav-mobile > button,
    .portal-nav-mobile > a,
    .student-mobile-nav > button,
    .student-mobile-nav > a,
    .unified-sidebar nav > button,
    .unified-sidebar nav > a,
    .portal-groups > button,
    .portal-groups > a,
    .nav-button,
    .admin-mobile-dock > button,
    .admin-mobile-dock > a,
    .admin-sidebar nav > button,
    .admin-sidebar nav > a,
    .owner-sidebar nav > button,
    .owner-sidebar nav > a
  ) {
    transition:none !important;
  }
}

/* =========================================================
   Penutup v170 — override khusus komponen v16.9 yang dimuat
   setelah stylesheet menu lama (Eskul Guru dan dock Sekolah).
   Geometri/responsivitas tetap milik v16.9; hanya visual state
   tombol menu yang diseragamkan dengan Konseling Eduvia.
   ========================================================= */

/* Ikon menu dibuat sederhana seperti referensi: tanpa kapsul/ubin tambahan. */
html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
) > :is(.nav-icon,.admin-nav-icon,svg) {
  border-color:transparent !important;
  border-radius:0 !important;
  padding:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
  color:inherit !important;
  -webkit-text-fill-color:currentColor !important;
}

html body :is(
  #groupNav > button,
  #groupNav > a,
  #subNav > button,
  #subNav > a,
  #foundationNav > button,
  #foundationNav > a,
  #ownerNav > button,
  #ownerNav > a,
  .sidebar nav > button,
  .sidebar nav > a,
  .foundation-app aside nav > button,
  .foundation-app aside nav > a,
  .portal-nav-desktop > button,
  .portal-nav-desktop > a,
  .portal-nav-mobile > button,
  .portal-nav-mobile > a,
  .student-mobile-nav > button,
  .student-mobile-nav > a,
  .unified-sidebar nav > button,
  .unified-sidebar nav > a,
  .portal-groups > button,
  .portal-groups > a,
  .nav-button,
  .admin-mobile-dock > button,
  .admin-mobile-dock > a,
  .admin-sidebar nav > button,
  .admin-sidebar nav > a,
  .owner-sidebar nav > button,
  .owner-sidebar nav > a
) > :is(.nav-icon,.admin-nav-icon) svg {
  border:0 !important;
  border-radius:0 !important;
  padding:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
  color:inherit !important;
  stroke:currentColor !important;
}

/* Portal Guru: tombol Eskul tetap memakai struktur native v16.9,
   namun state visualnya mengikuti seluruh tombol menu lain. */
html[data-portal-brand="guru"] body #root
  :is(.portal-nav-desktop,.portal-nav-mobile:not(.student-mobile-nav))
  > button[data-open-portal-eskul] {
  border:1.5px solid var(--pp-menu-control-border) !important;
  border-radius:15px !important;
  background:var(--pp-menu-control-pale) !important;
  color:var(--pp-menu-control-text) !important;
  -webkit-text-fill-color:var(--pp-menu-control-text) !important;
  box-shadow:inset 6px 0 0 var(--pp-menu-control-border) !important;
  text-shadow:none !important;
}

html[data-portal-brand="guru"] body #root
  :is(.portal-nav-desktop,.portal-nav-mobile:not(.student-mobile-nav))
  > button[data-open-portal-eskul]:is(
    :hover,
    :focus-visible,
    .active,
    .selected,
    .is-active,
    .bg-blue-500,
    [aria-current="page"],
    [aria-selected="true"],
    [aria-pressed="true"],
    [data-active="true"]
  ) {
  border-color:var(--pp-menu-control-border) !important;
  background:var(--pp-menu-control-green) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  box-shadow:inset 7px 0 0 var(--pp-menu-control-dark),0 10px 22px rgba(0, 111, 209, .18) !important;
  text-shadow:none !important;
}

html[data-portal-brand="guru"] body #root
  :is(.portal-nav-desktop,.portal-nav-mobile:not(.student-mobile-nav))
  > button[data-open-portal-eskul]
  > :is(svg,.nav-icon,.admin-nav-icon),
html[data-portal-brand="guru"] body #root
  :is(.portal-nav-desktop,.portal-nav-mobile:not(.student-mobile-nav))
  > button[data-open-portal-eskul]
  > :is(.nav-icon,.admin-nav-icon) svg {
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:inherit !important;
  -webkit-text-fill-color:currentColor !important;
  stroke:currentColor !important;
}

html[data-portal-brand="guru"] body #root
  :is(.portal-nav-desktop,.portal-nav-mobile:not(.student-mobile-nav))
  > button[data-open-portal-eskul]:is(
    :hover,
    :focus-visible,
    .active,
    .selected,
    .is-active,
    .bg-blue-500,
    [aria-current="page"],
    [aria-selected="true"],
    [aria-pressed="true"],
    [data-active="true"]
  ) > :is(svg,.nav-icon,.admin-nav-icon),
html[data-portal-brand="guru"] body #root
  :is(.portal-nav-desktop,.portal-nav-mobile:not(.student-mobile-nav))
  > button[data-open-portal-eskul]:is(
    :hover,
    :focus-visible,
    .active,
    .selected,
    .is-active,
    .bg-blue-500,
    [aria-current="page"],
    [aria-selected="true"],
    [aria-pressed="true"],
    [data-active="true"]
  ) > :is(.nav-icon,.admin-nav-icon) svg {
  border:0 !important;
  border-radius:0 !important;
  padding:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  stroke:currentColor !important;
}

/* Portal Admin Sekolah: pertahankan ukuran dan scroll dock v16.9,
   tetapi samakan warna, outline, indikator kiri, ikon, dan state aktif. */
@media(max-width:850px) {
  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group] {
    border:1.5px solid var(--pp-menu-control-border) !important;
    background:var(--pp-menu-control-pale) !important;
    color:var(--pp-menu-control-text) !important;
    -webkit-text-fill-color:var(--pp-menu-control-text) !important;
    box-shadow:inset 6px 0 0 var(--pp-menu-control-border) !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group]:is(
    :hover,
    :focus-visible,
    .active,
    .selected,
    .is-active,
    [aria-current="page"],
    [aria-selected="true"],
    [aria-pressed="true"],
    [data-active="true"]
  ) {
    border-color:var(--pp-menu-control-border) !important;
    background:var(--pp-menu-control-green) !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    box-shadow:inset 7px 0 0 var(--pp-menu-control-dark),0 10px 22px rgba(0, 111, 209, .18) !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group]
    > :is(.admin-nav-icon,.nav-icon),
  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group]
    > :is(.admin-nav-icon,.nav-icon) svg {
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    color:inherit !important;
    -webkit-text-fill-color:currentColor !important;
    stroke:currentColor !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group]
    > .admin-nav-label {
    color:inherit !important;
    -webkit-text-fill-color:currentColor !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group]:is(
    :hover,
    :focus-visible,
    .active,
    .selected,
    .is-active,
    [aria-current="page"],
    [aria-selected="true"],
    [aria-pressed="true"],
    [data-active="true"]
  ) > :is(.admin-nav-icon,.nav-icon),
  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group]:is(
    :hover,
    :focus-visible,
    .active,
    .selected,
    .is-active,
    [aria-current="page"],
    [aria-selected="true"],
    [aria-pressed="true"],
    [data-active="true"]
  ) > :is(.admin-nav-icon,.nav-icon) svg {
    border:0 !important;
    border-radius:0 !important;
    padding:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    stroke:currentColor !important;
  }
}


/* =========================================================
   v171 — koreksi Portal Yayasan + menu Portal Sekolah lebih ringkas.
   ========================================================= */

/* Portal Yayasan: selector eksplisit agar gaya tetap diterapkan walau
   stylesheet navigasi lama memiliki spesifisitas tinggi atau masih tercache. */
html[data-portal-brand="yayasan"] body #foundationApp.foundation-app #foundationNav > button[data-page] {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  gap: 10px !important;
  border: 1.5px solid var(--pp-menu-control-border) !important;
  border-radius: 15px !important;
  background: var(--pp-menu-control-pale) !important;
  color: var(--pp-menu-control-text) !important;
  -webkit-text-fill-color: var(--pp-menu-control-text) !important;
  box-shadow: inset 6px 0 0 var(--pp-menu-control-border) !important;
  font-size: 12.5px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  text-shadow: none !important;
  transform: none !important;
}

html[data-portal-brand="yayasan"] body #foundationApp.foundation-app #foundationNav > button[data-page]::before,
html[data-portal-brand="yayasan"] body #foundationApp.foundation-app #foundationNav > button[data-page]::after {
  content: none !important;
  display: none !important;
}

html[data-portal-brand="yayasan"] body #foundationApp.foundation-app #foundationNav > button[data-page] > .nav-icon {
  flex: 0 0 20px !important;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  fill: none !important;
  box-shadow: none !important;
}

html[data-portal-brand="yayasan"] body #foundationApp.foundation-app #foundationNav > button[data-page] > span {
  min-width: 0 !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  font: inherit !important;
  white-space: normal !important;
}

html[data-portal-brand="yayasan"] body #foundationApp.foundation-app #foundationNav > button[data-page]:is(
  :hover,
  :focus-visible,
  .active,
  [aria-current="page"],
  [aria-selected="true"],
  [data-active="true"]
) {
  border-color: var(--pp-menu-control-border) !important;
  background: var(--pp-menu-control-green) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: inset 7px 0 0 var(--pp-menu-control-dark), 0 9px 20px rgba(0, 111, 209, .17) !important;
}

html[data-portal-brand="yayasan"] body #foundationApp.foundation-app #foundationNav > button[data-page]:is(
  :hover,
  :focus-visible,
  .active,
  [aria-current="page"],
  [aria-selected="true"],
  [data-active="true"]
) > :is(.nav-icon,span) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  stroke: currentColor !important;
}

/* Portal Sekolah desktop/tablet: menu sidebar diringkas tanpa mengubah fungsi. */
@media (min-width: 851px) {
  html[data-portal-brand="sekolah"] body .app > aside #groupNav {
    gap: 5px !important;
  }

  html[data-portal-brand="sekolah"] body .app > aside #groupNav > button[data-group] {
    min-height: 42px !important;
    padding: 8px 10px !important;
    gap: 9px !important;
    border-radius: 13px !important;
    font-size: 12.5px !important;
    line-height: 1.2 !important;
  }

  html[data-portal-brand="sekolah"] body .app > aside #groupNav > button[data-group] > .admin-nav-icon {
    flex: 0 0 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
  }

  html[data-portal-brand="sekolah"] body .app > aside #groupNav > button[data-group] > .admin-nav-icon svg {
    width: 18px !important;
    height: 18px !important;
  }
}

/* Portal Sekolah mobile: dock dan kartu menu dibuat lebih kecil, tetap satu baris
   dan tetap dapat digeser horizontal. */
@media (max-width: 850px) {
  html[data-portal-brand="sekolah"] body {
    padding-bottom: calc(82px + env(safe-area-inset-bottom)) !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock {
    height: calc(82px + env(safe-area-inset-bottom)) !important;
    min-height: calc(82px + env(safe-area-inset-bottom)) !important;
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom)) !important;
    gap: 6px !important;
    scroll-padding-inline: 8px !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group] {
    flex: 0 0 84px !important;
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    padding: 5px 5px !important;
    gap: 3px !important;
    border-width: 1.5px !important;
    border-radius: 14px !important;
    box-shadow: inset 5px 0 0 var(--pp-menu-control-border) !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group]:is(
    :hover,
    :focus-visible,
    .active,
    .selected,
    .is-active,
    [aria-current="page"],
    [aria-selected="true"],
    [aria-pressed="true"],
    [data-active="true"]
  ) {
    box-shadow: inset 6px 0 0 var(--pp-menu-control-dark), 0 7px 16px rgba(0, 111, 209, .15) !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group] > .admin-nav-icon {
    flex: 0 0 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group] > .admin-nav-icon > svg {
    width: 19px !important;
    height: 19px !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group] > .admin-nav-label {
    font-size: 9px !important;
    line-height: 11px !important;
    font-weight: 750 !important;
  }
}

@media (max-width: 430px) {
  html[data-portal-brand="sekolah"] body {
    padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock {
    height: calc(76px + env(safe-area-inset-bottom)) !important;
    min-height: calc(76px + env(safe-area-inset-bottom)) !important;
    padding: 5px 7px calc(5px + env(safe-area-inset-bottom)) !important;
    gap: 5px !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group] {
    flex-basis: 76px !important;
    width: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
    border-radius: 13px !important;
    padding: 4px !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group] > .admin-nav-icon {
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group] > .admin-nav-icon > svg {
    width: 18px !important;
    height: 18px !important;
  }

  html[data-portal-brand="sekolah"] body > #groupNav.admin-mobile-dock > button[data-group] > .admin-nav-label {
    font-size: 8.5px !important;
    line-height: 10px !important;
  }
}
