/*
 * v237 — samakan indikator menu aktif Portal Sekolah dengan Dasbor.
 * Selector dibuat lebih spesifik agar aturan lama Kepegawaian dan Akreditasi
 * tidak lagi mengembalikan warna aktif ke mint.
 */
@media (min-width: 851px) {
  html[data-portal-brand="sekolah"][data-clay-theme="v228"]
    body
    .app
    #groupNav
    > button[data-group].active {
    border-color: rgba(167, 243, 208, 0.3) !important;
    background: linear-gradient(145deg, #117862 0%, #075847 100%) !important;
    color: #f7fffc !important;
    -webkit-text-fill-color: #f7fffc !important;
    box-shadow:
      4px 5px 10px rgba(5, 74, 58, 0.22),
      -2px -2px 6px rgba(255, 255, 255, 0.62),
      inset 1px 1px 0 rgba(255, 255, 255, 0.17) !important;
    text-shadow: 0 1px 1px rgba(2, 43, 34, 0.2) !important;
    transform: none !important;
    filter: none !important;
  }

  html[data-portal-brand="sekolah"][data-clay-theme="v228"]
    body
    .app
    #groupNav
    > button[data-group].active::before {
    background: #10b981 !important;
  }

  html[data-portal-brand="sekolah"][data-clay-theme="v228"]
    body
    .app
    #groupNav
    > button[data-group].active
    :is(span, b, small, .admin-nav-label) {
    color: #f7fffc !important;
    -webkit-text-fill-color: #f7fffc !important;
  }

  html[data-portal-brand="sekolah"][data-clay-theme="v228"]
    body
    .app
    #groupNav
    > button[data-group].active
    > .admin-nav-icon {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 30px !important;
    width: 30px !important;
    height: 30px !important;
    padding: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.58) !important;
    border-radius: 9px !important;
    background: linear-gradient(145deg, #effff8, #ccefe3) !important;
    color: #075847 !important;
    -webkit-text-fill-color: #075847 !important;
    box-shadow:
      0 3px 7px rgba(2, 44, 35, 0.16),
      inset 1px 1px 0 rgba(255, 255, 255, 0.88) !important;
  }

  html[data-portal-brand="sekolah"][data-clay-theme="v228"]
    body
    .app
    #groupNav
    > button[data-group].active
    > .admin-nav-icon
    > svg {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #075847 !important;
    -webkit-text-fill-color: #075847 !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.9 !important;
    box-shadow: none !important;
  }
}
