/* =========================================================
   FINAL VISUAL FIX V2
   - Game cards: genuinely large square cards
   - Profile: clean two-column professional layout
   ========================================================= */

#studentDashboard .portal-content{
  width:100%!important;
  max-width:none!important;
  padding:32px 40px 56px!important;
}

#studentDashboard .portal-view{
  width:100%!important;
  max-width:1180px!important;
  margin:0 auto!important;
}

/* ===== DASHBOARD GAME PANEL ===== */
#studentDashboard .dashboard-games-panel{
  width:100%!important;
  padding:28px!important;
  border-radius:20px!important;
}

#studentDashboard #dashboardGameGrid{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:22px!important;
  margin-top:22px!important;
  align-items:stretch!important;
}

/* Large, square, balanced cards */
#studentDashboard #dashboardGameGrid > .subject-card,
#studentDashboard #dashboardGameGrid .subject-card{
  width:100%!important;
  min-width:0!important;
  height:350px!important;
  min-height:350px!important;
  max-height:350px!important;
  aspect-ratio:auto!important;
  flex:none!important;
  border-radius:22px!important;
  overflow:hidden!important;
  display:block!important;
}

#studentDashboard #dashboardGameGrid .subject-card-content{
  width:100%!important;
  height:100%!important;
  min-height:350px!important;
  padding:28px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
}

#studentDashboard #dashboardGameGrid .subject-icon{
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  margin-bottom:18px!important;
  border-radius:16px!important;
  font-size:1.55rem!important;
}

#studentDashboard #dashboardGameGrid .card-game-tag{
  margin:0 0 13px!important;
  width:max-content!important;
  font-size:.62rem!important;
  padding:6px 10px!important;
}

#studentDashboard #dashboardGameGrid .subject-card h2{
  margin:0 0 10px!important;
  font-size:1.45rem!important;
  line-height:1.18!important;
}

#studentDashboard #dashboardGameGrid .subject-card p{
  max-width:100%!important;
  margin:0!important;
  font-size:.72rem!important;
  line-height:1.65!important;
}

#studentDashboard #dashboardGameGrid .play-label{
  width:100%!important;
  box-sizing:border-box!important;
  justify-content:center!important;
  margin-top:auto!important;
  padding:12px 14px!important;
  border-radius:11px!important;
  font-size:.68rem!important;
}

/* Make the decorative circles feel like the reference, not clipped stripes. */
#studentDashboard #dashboardGameGrid .subject-card::before{
  width:240px!important;height:240px!important;
  top:-92px!important;right:-75px!important;
  border-width:30px!important;
}
#studentDashboard #dashboardGameGrid .subject-card::after{
  width:190px!important;height:190px!important;
  bottom:-100px!important;right:16px!important;
}

/* ===== DASHBOARD STATS ===== */
#studentDashboard .dashboard-summary-cards{
  width:100%!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:18px!important;
  margin-bottom:22px!important;
}
#studentDashboard .dashboard-summary-cards .portal-stat{
  min-height:128px!important;
  padding:23px 25px!important;
  border-radius:18px!important;
}

/* ===== PROFILE PROFESSIONAL LAYOUT ===== */
#studentDashboard #studentViewProfile{
  width:100%!important;
}
#studentDashboard #studentViewProfile .profile-layout{
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 320px!important;
  gap:22px!important;
  align-items:start!important;
}

#studentDashboard #studentViewProfile .profile-card{
  width:100%!important;
  padding:28px!important;
  border-radius:20px!important;
  background:#fff!important;
}

#studentDashboard #studentViewProfile .profile-card-head{
  padding-bottom:18px!important;
  border-bottom:1px solid #efe9e1!important;
}
#studentDashboard #studentViewProfile .profile-card-head h2{
  font-size:1.25rem!important;
  margin:5px 0 7px!important;
}
#studentDashboard #studentViewProfile .profile-card-head p{
  font-size:.68rem!important;
  line-height:1.6!important;
}

#studentDashboard #studentViewProfile .profile-photo-area{
  min-height:118px!important;
  margin:0!important;
  padding:21px 0!important;
  display:flex!important;
  align-items:center!important;
  gap:20px!important;
  border-top:0!important;
  border-bottom:1px solid #efe9e1!important;
}

#studentDashboard #studentViewProfile .profile-avatar-large{
  width:92px!important;
  height:92px!important;
  min-width:92px!important;
  border-radius:50%!important;
  border:4px solid #efe9e1!important;
  box-shadow:0 6px 18px rgba(30,31,31,.10)!important;
}

#studentDashboard #studentViewProfile .profile-photo-area strong{
  display:block!important;
  font-size:.8rem!important;
  margin-bottom:4px!important;
}
#studentDashboard #studentViewProfile .profile-photo-area p{
  margin:0 0 11px!important;
  font-size:.59rem!important;
}

#studentDashboard #studentViewProfile .profile-photo-area .profile-upload,
#studentDashboard #studentViewProfile .profile-photo-area #removeProfilePhotoBtn{
  min-height:35px!important;
  padding:8px 12px!important;
  border-radius:9px!important;
  font-size:.59rem!important;
}

#studentDashboard #studentViewProfile .profile-form{
  padding-top:20px!important;
}
#studentDashboard #studentViewProfile .profile-grid{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
}

#studentDashboard #studentViewProfile .profile-form input,
#studentDashboard #studentViewProfile .profile-form select{
  height:44px!important;
  border-radius:10px!important;
  background:#fff!important;
  font-size:.68rem!important;
}

#studentDashboard #studentViewProfile .profile-password-box{
  width:100%!important;
  margin-top:20px!important;
  padding:21px!important;
  border-radius:15px!important;
  border:1px solid #efe9e1!important;
  background:linear-gradient(180deg,#f6f3ee,#f6f3ee)!important;
}

#studentDashboard #studentViewProfile .password-stack{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:14px!important;
}

#studentDashboard #studentViewProfile .password-field{
  width:100%!important;
}
#studentDashboard #studentViewProfile .password-field input{
  height:45px!important;
  padding-right:48px!important;
  border-radius:10px!important;
  background:#fff!important;
}
#studentDashboard #studentViewProfile .password-toggle{
  width:36px!important;
  height:35px!important;
  right:5px!important;
  top:5px!important;
  border-radius:8px!important;
  font-size:1rem!important;
}

#studentDashboard #studentViewProfile .profile-actions{
  width:100%!important;
  display:flex!important;
  justify-content:flex-end!important;
  margin-top:18px!important;
}
#studentDashboard #studentViewProfile .profile-actions .btn-primary{
  min-width:120px!important;
  min-height:42px!important;
  border-radius:10px!important;
}

/* Summary card: aligned, not floating randomly. */
#studentDashboard #studentViewProfile .profile-summary{
  width:100%!important;
  min-height:400px!important;
  padding:25px!important;
  border-radius:20px!important;
  background:#fff!important;
  position:sticky!important;
  top:98px!important;
}

#studentDashboard #studentViewProfile .profile-summary .summary-avatar{
  width:96px!important;
  height:96px!important;
  margin:4px auto 14px!important;
  border-radius:50%!important;
}
#studentDashboard #studentViewProfile .profile-summary h3{
  margin:0!important;
  text-align:center!important;
  font-size:1rem!important;
}
#studentDashboard #studentViewProfile .profile-summary>p{
  margin:5px 0 17px!important;
  text-align:center!important;
  font-size:.61rem!important;
}
#studentDashboard #studentViewProfile .summary-list{
  border-top:1px solid #efe9e1!important;
}
#studentDashboard #studentViewProfile .summary-list>div{
  min-height:44px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  border-bottom:1px solid #efe9e1!important;
}
#studentDashboard #studentViewProfile .summary-list span{
  color:#84817d!important;
}
#studentDashboard #studentViewProfile .summary-list strong{
  color:#3a3936!important;
  text-align:right!important;
}
#studentDashboard #studentViewProfile .profile-tip{
  margin-top:18px!important;
  border-radius:11px!important;
  line-height:1.5!important;
}

/* Desktop is intentionally spacious; tablet/mobile become one column. */
@media (max-width:1100px){
  #studentDashboard .portal-content{
    padding:28px 25px 50px!important;
  }
  #studentDashboard #dashboardGameGrid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:14px!important;
  }
  #studentDashboard #dashboardGameGrid .subject-card,
  #studentDashboard #dashboardGameGrid .subject-card-content{
    height:310px!important;
    min-height:310px!important;
    max-height:310px!important;
  }
  #studentDashboard #dashboardGameGrid .subject-card-content{
    padding:21px!important;
  }
  #studentDashboard #studentViewProfile .profile-layout{
    grid-template-columns:minmax(0,1fr) 285px!important;
  }
}

@media (max-width:850px){
  #studentDashboard #dashboardGameGrid{
    grid-template-columns:1fr!important;
  }
  #studentDashboard #dashboardGameGrid .subject-card,
  #studentDashboard #dashboardGameGrid .subject-card-content{
    height:300px!important;
    min-height:300px!important;
    max-height:300px!important;
  }
  #studentDashboard #studentViewProfile .profile-layout{
    grid-template-columns:1fr!important;
  }
  #studentDashboard #studentViewProfile .profile-summary{
    position:static!important;
    min-height:0!important;
  }
}

@media (max-width:620px){
  #studentDashboard .portal-content{
    padding:20px 14px 35px!important;
  }
  #studentDashboard .dashboard-summary-cards,
  #studentDashboard #studentViewProfile .profile-grid{
    grid-template-columns:1fr!important;
  }
  #studentDashboard .dashboard-games-panel{
    padding:17px!important;
  }
}