/* ============================================================
   Digitera V4.75.8 — Native Details Login Dropdown
   State open/close dikelola browser:
   klik Login -> buka, klik Login lagi -> tutup.
   ============================================================ */

.public-login-dropdown{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  flex:0 0 auto!important;
  z-index:90!important;
  margin:0!important;
  padding:0!important;
}

/* Hilangkan marker bawaan <summary>. */
.public-login-dropdown > summary{
  list-style:none!important;
}
.public-login-dropdown > summary::-webkit-details-marker{
  display:none!important;
}
.public-login-dropdown > summary::marker{
  display:none!important;
  content:""!important;
}

.public-login-dropdown-trigger{
  appearance:none!important;
  min-height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:8px 12px!important;
  margin:0!important;
  border:1px solid transparent!important;
  border-radius:12px!important;
  background:transparent!important;
  color:inherit!important;
  cursor:pointer!important;
  font:inherit!important;
  font-weight:700!important;
  line-height:1!important;
  white-space:nowrap!important;
  user-select:none!important;
  transition:background .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease!important;
}

.public-login-dropdown-trigger:hover,
.public-login-dropdown[open] .public-login-dropdown-trigger,
.public-login-dropdown.active .public-login-dropdown-trigger{
  background:#f1ebff!important;
  color:#6844d5!important;
  box-shadow:inset 0 0 0 1px #dfd4fb!important;
}

.public-login-dropdown-trigger:active{
  transform:translateY(1px)!important;
}

.public-login-dropdown-trigger .nav-menu-icon{
  display:inline-grid!important;
  place-items:center!important;
  flex:0 0 auto!important;
}

.public-login-dropdown-chevron{
  display:inline-grid!important;
  place-items:center!important;
  margin-left:1px!important;
  font-size:11px!important;
  line-height:1!important;
  transition:transform .16s ease!important;
}
.public-login-dropdown[open] .public-login-dropdown-chevron{
  transform:rotate(180deg)!important;
}

.public-login-dropdown-menu{
  position:absolute!important;
  top:calc(100% + 10px)!important;
  right:0!important;
  width:270px!important;
  min-width:270px!important;
  display:none!important;
  gap:7px!important;
  padding:9px!important;
  margin:0!important;
  border:1px solid #e4dcf4!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 18px 42px rgba(43,27,90,.18)!important;
  z-index:9999!important;
  pointer-events:auto!important;
  box-sizing:border-box!important;
}

/* Satu-satunya kondisi tampil: details memiliki atribut open. */
.public-login-dropdown[open] > .public-login-dropdown-menu{
  display:grid!important;
}

.public-login-dropdown-item{
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 24px!important;
  gap:10px!important;
  align-items:center!important;
  padding:10px!important;
  margin:0!important;
  border:1px solid transparent!important;
  border-radius:13px!important;
  background:#fff!important;
  color:#392d58!important;
  text-decoration:none!important;
  box-shadow:none!important;
  transition:background .14s ease,border-color .14s ease,transform .14s ease!important;
}
.public-login-dropdown-item:hover,
.public-login-dropdown-item:focus-visible{
  background:#f8f5ff!important;
  border-color:#ded3f6!important;
  transform:translateY(-1px)!important;
  outline:none!important;
}

.public-login-dropdown-item-icon{
  width:42px!important;
  height:42px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  color:#fff!important;
}
.public-login-dropdown-item.is-teacher .public-login-dropdown-item-icon{
  background:linear-gradient(135deg,#6c46de,#8b58ed)!important;
}
.public-login-dropdown-item.is-student .public-login-dropdown-item-icon{
  background:linear-gradient(135deg,#159db2,#18b795)!important;
}

.public-login-dropdown-item-copy{
  min-width:0!important;
  display:grid!important;
  gap:3px!important;
  text-align:left!important;
}
.public-login-dropdown-item-copy strong{
  color:#33264f!important;
  font-size:12.5px!important;
  line-height:1.15!important;
}
.public-login-dropdown-item-copy small{
  color:#82788f!important;
  font-size:10.5px!important;
  line-height:1.3!important;
  white-space:normal!important;
}
.public-login-dropdown-item-arrow{
  width:24px!important;
  height:24px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:8px!important;
  background:#f0ebfa!important;
  color:#6a4dcc!important;
  font-size:13px!important;
  font-weight:900!important;
}

/* Navbar harus mengizinkan dropdown keluar dari tinggi bar. */
.topbar,
.topbar .container,
.nav-wrap,
.nav[data-nav]{
  overflow:visible!important;
}

/* Mobile: details tetap menggunakan state native open. */
@media(max-width:1199px){
  .public-login-dropdown{
    width:100%!important;
    display:block!important;
  }

  .public-login-dropdown-trigger{
    width:100%!important;
    justify-content:flex-start!important;
    min-height:44px!important;
    padding:10px 12px!important;
    box-sizing:border-box!important;
  }

  .public-login-dropdown-chevron{
    margin-left:auto!important;
  }

  .public-login-dropdown-menu{
    position:static!important;
    top:auto!important;
    right:auto!important;
    width:100%!important;
    min-width:0!important;
    margin:5px 0 2px!important;
    padding:7px!important;
    border-radius:13px!important;
    box-shadow:none!important;
    background:#f8f6fd!important;
  }

  .public-login-dropdown[open] > .public-login-dropdown-menu{
    display:grid!important;
  }

  .public-login-dropdown-item{
    min-height:52px!important;
    grid-template-columns:38px minmax(0,1fr) 22px!important;
    padding:8px!important;
  }

  .public-login-dropdown-item-icon{
    width:38px!important;
    height:38px!important;
  }
}


/* ============================================================
   Digitera V4.82.5 — Android / mobile dropdown hard fix
   Navbar publik berubah menjadi hamburger sampai 1199px, maka
   dropdown Login harus ikut menjadi bagian dari sheet pada rentang
   yang sama. Handler JS juga mengatur state open secara eksplisit.
   ============================================================ */
@media(max-width:1199px){
  .topbar .nav .public-login-dropdown,
  .nav[data-nav] .public-login-dropdown{
    width:100%!important;
    min-width:0!important;
    flex:0 0 auto!important;
    display:block!important;
    position:relative!important;
    z-index:2!important;
    overflow:visible!important;
  }

  .topbar .nav .public-login-dropdown-trigger,
  .nav[data-nav] .public-login-dropdown-trigger{
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:10px!important;
    padding:11px 14px!important;
    border-radius:14px!important;
    box-sizing:border-box!important;
    color:#625b70!important;
    background:transparent!important;
    -webkit-tap-highlight-color:transparent!important;
    touch-action:manipulation!important;
  }

  .topbar .nav .public-login-dropdown[open] > .public-login-dropdown-trigger,
  .nav[data-nav] .public-login-dropdown[open] > .public-login-dropdown-trigger{
    color:#6844d5!important;
    background:#f4efff!important;
    box-shadow:inset 0 0 0 1px rgba(104,68,213,.10)!important;
  }

  .topbar .nav .public-login-dropdown-chevron,
  .nav[data-nav] .public-login-dropdown-chevron{
    margin-left:auto!important;
    flex:0 0 auto!important;
  }

  .topbar .nav .public-login-dropdown-menu,
  .nav[data-nav] .public-login-dropdown-menu{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:6px 0 4px!important;
    padding:7px!important;
    border:1px solid #ebe6f5!important;
    border-radius:14px!important;
    background:#f8f6fd!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }

  .topbar .nav .public-login-dropdown:not([open]) > .public-login-dropdown-menu,
  .nav[data-nav] .public-login-dropdown:not([open]) > .public-login-dropdown-menu{
    display:none!important;
  }

  .topbar .nav .public-login-dropdown[open] > .public-login-dropdown-menu,
  .nav[data-nav] .public-login-dropdown[open] > .public-login-dropdown-menu{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    transform:none!important;
  }

  .topbar .nav .public-login-dropdown-item,
  .nav[data-nav] .public-login-dropdown-item{
    width:100%!important;
    min-width:0!important;
    min-height:58px!important;
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr) 24px!important;
    align-items:center!important;
    gap:10px!important;
    padding:9px 10px!important;
    border-radius:12px!important;
    background:#fff!important;
    border:1px solid #eee9f7!important;
    box-sizing:border-box!important;
  }

  .topbar .nav,
  .nav[data-nav]{
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
  }
}