/* =========================================================
   CERDASPLAY STUDENT — V6
   Exact dashboard structure requested:
   sidebar = Profile + Dashboard
   dashboard = 2 stats + 3 square game cards + flow
   profile = student data + current/new/confirm password with eye
   ========================================================= */

#studentDashboard{background:#f6f3ee!important;min-height:100vh!important}

/* ---------- TOPBAR ---------- */
#studentDashboard .student-topbar{
  height:78px!important;min-height:78px!important;padding:0 40px!important;
  background:#fff!important;border-bottom:1px solid #e5e0d9!important
}
#studentDashboard .student-top-actions{display:flex!important;align-items:center!important;gap:12px!important}
#studentDashboard .student-search{
  width:322px!important;height:39px!important;box-sizing:border-box!important;
  display:flex!important;align-items:center!important;gap:8px!important;
  padding:0 12px!important;border:1px solid #e5e0d9!important;border-radius:11px!important;
  background:#f6f3ee!important
}
#studentDashboard .student-search input{
  width:100%!important;border:0!important;outline:0!important;background:transparent!important;
  color:#3a3936!important;font-size:.72rem!important
}
#studentDashboard .student-notification{
  width:40px!important;height:40px!important;border:1px solid #e5e0d9!important;
  border-radius:11px!important;background:#fff!important;position:relative!important;
  display:grid!important;place-items:center!important
}
#studentDashboard .student-notification i{
  position:absolute!important;right:7px!important;top:6px!important;width:7px!important;height:7px!important;
  border-radius:50%!important;background:#ef5575!important
}
#studentDashboard #logoutBtn{
  min-height:40px!important;padding:8px 15px!important;border-radius:10px!important;
  border:1px solid #ffd3dc!important;background:#fff5f7!important;color:#eb476c!important;font-weight:900!important
}

/* ---------- SIDEBAR: ONLY PROFILE + DASHBOARD ---------- */
#studentDashboard .student-sidebar-modern{
  width:247px!important;flex:0 0 247px!important;box-sizing:border-box!important;
  padding:24px 20px!important;background:#fff!important;border-right:1px solid #e5e0d9!important;
  box-shadow:none!important
}
#studentDashboard .student-sidebar-modern .sidebar-brand{
  display:flex!important;align-items:center!important;gap:11px!important;padding:0 0 28px!important
}
#studentDashboard .student-sidebar-modern .sidebar-brand .brand-icon{
  width:44px!important;height:44px!important;border-radius:13px!important;
  background:linear-gradient(135deg,#1e1f1f,#ba9d7f)!important;
  box-shadow:0 8px 18px rgba(30,31,31,.2)!important
}
#studentDashboard .student-sidebar-modern .sidebar-user{
  min-height:59px!important;box-sizing:border-box!important;margin:0 0 24px!important;padding:10px!important;
  display:flex!important;align-items:center!important;gap:10px!important;
  border:1px solid #e5e0d9!important;border-radius:16px!important;background:#f6f3ee!important
}
#studentDashboard .student-sidebar-modern .side-nav{display:grid!important;gap:7px!important}
#studentDashboard .student-sidebar-modern .side-nav button{
  width:100%!important;min-height:44px!important;padding:10px 13px!important;
  display:flex!important;align-items:center!important;gap:11px!important;
  border:0!important;border-radius:11px!important;background:transparent!important;
  color:#2a2a29!important;font-size:.75rem!important;font-weight:900!important
}
#studentDashboard .student-sidebar-modern .side-nav button.active{
  background:#efe9e1!important;color:#1e1f1f!important
}
#studentDashboard .student-sidebar-modern .side-nav button:hover{
  background:#f6f3ee!important;color:#1e1f1f!important
}
#studentDashboard .student-sidebar-modern .sidebar-help{
  margin-top:auto!important;padding:12px!important;border:1px solid #e5e0d9!important;
  border-radius:15px!important;background:#f6f3ee!important
}

/* Hide any accidental third menu if an older DOM has one. */
#studentDashboard .student-sidebar-modern .side-nav button[data-student-view="nilai"]{display:none!important}

/* ---------- MAIN CONTENT ---------- */
#studentDashboard .student-sidebar-modern + .portal-content{
  min-width:0!important;padding:32px 40px 50px!important;background:#f6f3ee!important
}
#studentDashboard .portal-top{margin:0 0 20px!important}
#studentDashboard #studentPageTitle{
  margin:0!important;color:#2a2a29!important;font-size:1.58rem!important;font-weight:1000!important
}
#studentDashboard #studentPageSubtitle{
  margin:6px 0 0!important;color:#84817d!important;font-size:.7rem!important
}
#studentDashboard .join-room-btn{display:inline-flex!important;align-items:center;justify-content:center;gap:8px!important;min-height:44px!important;padding:0 18px!important;border-radius:14px!important;font-weight:900!important;box-shadow:0 8px 18px rgba(34,197,94,.16)!important}
#studentDashboard .student-header-join{min-height:40px!important;padding:0 15px!important;border-radius:12px!important;box-shadow:none!important}
@media(max-width:760px){#studentDashboard .student-header-join{display:inline-flex!important;padding:0 10px!important;font-size:.78rem!important}.student-search{display:none!important}}

/* ---------- DASHBOARD: TWO STATS ---------- */
#studentDashboard .dashboard-summary-cards{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;margin:0 0 20px!important
}
#studentDashboard .dashboard-summary-cards .portal-stat{
  min-height:112px!important;padding:20px 22px!important;box-sizing:border-box!important;
  border:1px solid #e5e0d9!important;border-radius:17px!important;background:#fff!important;
  box-shadow:0 8px 25px rgba(42,42,41,.055)!important
}
#studentDashboard .dashboard-summary-cards .portal-stat span{
  display:block!important;color:#84817d!important;font-size:.68rem!important;font-weight:800!important
}
#studentDashboard .dashboard-summary-cards .portal-stat strong{
  display:block!important;margin:8px 0 3px!important;color:#2a2a29!important;font-size:1.62rem!important;font-weight:1000!important
}
#studentDashboard .dashboard-summary-cards .portal-stat small{
  display:block!important;color:#a9a49e!important;font-size:.56rem!important
}

/* ---------- GAME PANEL ---------- */
#studentDashboard .dashboard-games-panel{
  margin:0!important;padding:24px!important;border:1px solid #e5e0d9!important;
  border-radius:18px!important;background:#fff!important;box-shadow:0 8px 26px rgba(42,42,41,.055)!important
}
#studentDashboard .dashboard-section-head{margin:0 0 20px!important}
#studentDashboard .dashboard-section-head .section-kicker{
  display:block!important;color:#4a4a49!important;font-size:.75rem!important;font-weight:900!important
}
#studentDashboard .dashboard-section-head h2{
  margin:5px 0!important;color:#2a2a29!important;font-size:1.05rem!important
}
#studentDashboard .dashboard-section-head p{
  margin:0!important;color:#84817d!important;font-size:.66rem!important;line-height:1.55!important
}

/* THE IMPORTANT PART: 3 EQUAL SQUARE CARDS */
#studentDashboard #dashboardGameGrid{
  width:100%!important;display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:20px!important;
  align-items:stretch!important
}
#studentDashboard #dashboardGameGrid .subject-card{
  width:100%!important;min-width:0!important;min-height:0!important;height:auto!important;
  aspect-ratio:1 / 1!important;box-sizing:border-box!important;
  border-radius:22px!important;overflow:hidden!important
}
#studentDashboard #dashboardGameGrid .subject-card-content{
  width:100%!important;height:100%!important;box-sizing:border-box!important;
  padding:24px!important;display:flex!important;flex-direction:column!important
}
#studentDashboard #dashboardGameGrid .subject-icon{
  width:50px!important;height:50px!important;min-width:50px!important;
  display:grid!important;place-items:center!important;border-radius:14px!important;
  margin-bottom:14px!important
}
#studentDashboard #dashboardGameGrid .card-game-tag{
  align-self:flex-start!important
}
#studentDashboard #dashboardGameGrid .subject-card h2{
  margin:14px 0 8px!important;font-size:1.27rem!important;line-height:1.15!important
}
#studentDashboard #dashboardGameGrid .subject-card p{
  margin:0!important;max-width:none!important;font-size:.68rem!important;
  line-height:1.55!important
}
#studentDashboard #dashboardGameGrid .play-label{
  display:block!important;margin-top:auto!important;padding:11px 14px!important;
  border-radius:10px!important;text-align:center!important;font-size:.66rem!important
}

/* ---------- GAME FLOW ---------- */
#studentDashboard .dashboard-flow{
  margin:18px 0 0!important;padding:21px 22px!important;border:1px solid #e5e0d9!important;
  border-radius:17px!important;background:#fff!important;box-shadow:0 8px 25px rgba(42,42,41,.045)!important
}
#studentDashboard .dashboard-flow h2{
  margin:4px 0 14px!important;color:#2a2a29!important;font-size:.98rem!important
}
#studentDashboard .game-flow{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important
}
#studentDashboard .game-flow>div{
  min-height:74px!important;padding:13px 14px!important;box-sizing:border-box!important;
  border:1px solid #efe9e1!important;border-radius:12px!important;background:#f6f3ee!important
}

/* ---------- PROFILE ---------- */
#studentDashboard .profile-layout{
  display:grid!important;grid-template-columns:minmax(0,1fr) 300px!important;gap:20px!important
}
#studentDashboard .profile-card,#studentDashboard .profile-summary{
  box-sizing:border-box!important;border:1px solid #e5e0d9!important;border-radius:18px!important;
  background:#fff!important;box-shadow:0 8px 26px rgba(42,42,41,.055)!important
}
#studentDashboard .profile-card{padding:27px!important}
#studentDashboard .profile-card-head h2{
  margin:4px 0 5px!important;color:#2a2a29!important;font-size:1.1rem!important
}
#studentDashboard .profile-card-head p{
  margin:0!important;color:#84817d!important;font-size:.65rem!important
}
#studentDashboard .profile-photo-area{
  display:flex!important;align-items:center!important;gap:18px!important;margin:21px 0!important;
  padding:18px 0!important;border-top:1px solid #efe9e1!important;border-bottom:1px solid #efe9e1!important
}
#studentDashboard .profile-avatar-large{
  width:88px!important;height:88px!important;min-width:88px!important;
  border:4px solid #efe9e1!important;border-radius:50%!important;overflow:hidden!important;background:#f6f3ee!important
}
#studentDashboard .profile-avatar-large img{width:100%!important;height:100%!important;object-fit:cover!important}
#studentDashboard .profile-photo-area strong{font-size:.78rem!important;color:#3a3936!important}
#studentDashboard .profile-photo-area p{margin:4px 0 10px!important;font-size:.58rem!important;color:#84817d!important}
#studentDashboard .profile-grid{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important
}
#studentDashboard .profile-form label{
  display:block!important;margin:0 0 6px!important;font-size:.63rem!important;color:#4a4a49!important;font-weight:800!important
}
#studentDashboard .profile-form input,#studentDashboard .profile-form select{
  width:100%!important;height:41px!important;box-sizing:border-box!important;padding:9px 11px!important;
  border:1px solid #e5e0d9!important;border-radius:10px!important;background:#f6f3ee!important;
  color:#3a3936!important;font-size:.67rem!important;outline:0!important
}

/* PASSWORD: one professional vertical stack, exactly current/new/confirm */
#studentDashboard .profile-password-box{
  margin-top:20px!important;padding:19px!important;border:1px solid #e5e0d9!important;
  border-radius:14px!important;background:#f6f3ee!important
}
#studentDashboard .password-section-head h3{
  margin:4px 0 4px!important;font-size:.82rem!important;color:#3a3936!important
}
#studentDashboard .password-section-head p{
  margin:0 0 15px!important;font-size:.58rem!important;color:#84817d!important
}
#studentDashboard .password-stack{display:grid!important;grid-template-columns:1fr!important;gap:13px!important}
#studentDashboard .password-field{position:relative!important;width:100%!important}
#studentDashboard .password-field input{
  width:100%!important;height:43px!important;box-sizing:border-box!important;
  padding:9px 45px 9px 12px!important;border:1px solid #e5e0d9!important;
  border-radius:10px!important;background:#fff!important;color:#3a3936!important;font-size:.68rem!important;
  outline:0!important
}
#studentDashboard .password-field input:focus{
  border-color:#ba9d7f!important;box-shadow:0 0 0 3px rgba(30,31,31,.10)!important
}
#studentDashboard .password-toggle{
  position:absolute!important;right:5px!important;top:5px!important;
  width:34px!important;height:33px!important;border:0!important;border-radius:8px!important;
  background:transparent!important;color:#84817d!important;cursor:pointer!important;font-size:.92rem!important
}
#studentDashboard .password-toggle:hover{background:#efe9e1!important;color:#1e1f1f!important}
#studentDashboard .password-hint{
  display:block!important;margin-top:5px!important;font-size:.54rem!important;color:#84817d!important
}
#studentDashboard .profile-actions{
  margin-top:17px!important;display:flex!important;justify-content:flex-end!important;gap:9px!important
}
#studentDashboard .profile-actions .btn{
  min-height:40px!important;padding:9px 18px!important;border-radius:10px!important;font-size:.66rem!important
}
/* User requested a single Simpan action. */
#studentDashboard #profileResetBtn{display:none!important}
#studentDashboard .profile-actions .btn-primary{
  min-width:105px!important
}
#studentDashboard .profile-summary{padding:24px!important}
#studentDashboard .profile-summary .summary-avatar{
  width:88px!important;height:88px!important;margin:2px auto 12px!important;
  border:4px solid #efe9e1!important;border-radius:50%!important;overflow:hidden!important;background:#f6f3ee!important
}
#studentDashboard .profile-summary .summary-avatar img{width:100%!important;height:100%!important;object-fit:cover!important}
#studentDashboard .profile-summary h3{font-size:.92rem!important;color:#3a3936!important}
#studentDashboard .profile-summary>p{font-size:.6rem!important;color:#84817d!important}
#studentDashboard .summary-list{margin-top:15px!important}
#studentDashboard .summary-list>div{padding:11px 0!important;font-size:.63rem!important}
#studentDashboard .profile-tip{margin-top:15px!important;padding:11px!important;font-size:.57rem!important;border-radius:10px!important}

/* Responsive: preserve the square-card intent until the screen is too narrow. */
@media(max-width:1050px){
  #studentDashboard .student-sidebar-modern{width:220px!important;flex-basis:220px!important}
  #studentDashboard .student-sidebar-modern + .portal-content{padding:28px 25px 45px!important}
  #studentDashboard #dashboardGameGrid{gap:14px!important}
  #studentDashboard #dashboardGameGrid .subject-card-content{padding:20px!important}
  #studentDashboard .profile-layout{grid-template-columns:1fr!important}
}
@media(max-width:820px){
  #studentDashboard #dashboardGameGrid{grid-template-columns:1fr!important}
  #studentDashboard #dashboardGameGrid .subject-card{aspect-ratio:auto!important;min-height:300px!important}
  #studentDashboard .game-flow{grid-template-columns:1fr!important}
}
@media(max-width:650px){
  #studentDashboard .dashboard-summary-cards,#studentDashboard .profile-grid{grid-template-columns:1fr!important}
  #studentDashboard .portal-shell{flex-direction:column!important}
  #studentDashboard .student-sidebar-modern{width:100%!important;flex-basis:auto!important}
  #studentDashboard .student-search{display:none!important}
}

/* Never show the old standalone Game navigation/view on the student shell. */
#studentDashboard #studentViewGame{display:none!important}