/* ============================================================
   Student & Login — styles for the logged-in student workspace
   (dashboard, profile, tracker, FastTrak, scores). Extracted from
   style.css; loaded only on student/login pages (public doesn't
   need these). Relies on :root tokens + brand utilities in style.css.
   ============================================================ */

/* student bonus point buttons */
.bonus-card .grid { display:flex; flex-wrap:wrap; gap:.5rem}
.bonus-card .grid>a { margin:0}
.bonus-card .pill { display:inline-flex; align-items:center; gap:.5rem; padding:.45rem .9rem .5rem .9rem; border-radius:9999px; border:1px solid transparent; text-decoration:none; font-weight:600; transition:background-color .2s ease,color .2s ease,box-shadow .2s ease}
.bonus-card .pill:focus-visible { outline:0; box-shadow:0 0 0 .2rem rgba(30,158,111,.35)} /* a11y focus */
.bonus-card .pill i { font-size:.9rem; position:relative; top:1px}
.bonus-card .pill-claim { background-color:var(--site-available); color:var(--bs-white); border-color:var(--site-available)}
.bonus-card .pill-claim i { color:var(--bs-white)}
.bonus-card .pill-claim:hover { background-color:var(--site-available-accent); border-color:var(--site-available-accent); color:var(--bs-white); text-decoration:none}
.bonus-card .pill-claim .points { background-color:var(--bs-white); color:var(--site-available-accent); display:inline-block; padding:.2rem .5rem; border-radius:.5rem; font-size:.8em; font-weight:700; line-height:1; margin-left:.25rem; box-shadow:0 1px 2px rgba(0,0,0,.08); transition:background-color .2s ease,color .2s ease,transform .12s ease}
.bonus-card .pill-claim:hover .points { background-color:var(--site-base-100); color:var(--site-available)}
.bonus-card .pill-claimed { background-color:var(--site-complete); color:var(--bs-white); border-color:var(--site-complete)}
.bonus-card .pill-claimed .points { background-color:var(--bs-white); color:var(--site-complete); display:inline-block; padding:.2rem .5rem; border-radius:.5rem; font-size:.8em; font-weight:700; line-height:1; margin-left:.25rem; box-shadow:0 1px 2px rgba(0,0,0,.08); transition:background-color .2s ease,color .2s ease,transform .12s ease}
@media (max-width:576px) {
  .bonus-card .pill { font-size:.90rem; font-weight:600; }
}

/* student score meter */
.score-card .btn[aria-expanded='true'] .fa-chevron-down { transform: rotate(0deg); transition: transform .2s ease; }
.score-card .btn[aria-expanded='false'] .fa-chevron-down { transform: rotate(270deg);    transition: transform .2s ease; }

/* student profile image + upload */
#profile_image { width: 112px; height: 112px; }
@media (min-width: 992px) { #profile_image { width: 168px; height: 168px; } }
#image_roll.thumbnail-sm img { width: 118px; height: 118px; padding: 3px; }
#image_roll.thumbnail-md img { width: 160px; height: 160px; padding: 3px; }
#profile_input { top: 0; left: 0; opacity: 0; }
.profile-crop-wrapper { width: 300px; height: 300px; margin-bottom: 48px; }
.image-menu-btn { top: -60px; right: 10px; }
.profile-card .avatar {  width:96px; height:96px; object-fit:cover; display:block; }
.profile-card .upload-btn {  position:absolute; bottom:-2px; right:-2px; opacity: 1!important; padding:0; font-size:15px; }

/* student tracker quickbar */
.student-quickbar { position: sticky; top: var(--fixed-header-h, 74px); z-index: 1020; background: var(--bs-white); padding: .5rem 0; box-shadow: 0 1px 0 rgba(0,0,0,.06); }
.quickbar-scroll { overflow-x: auto; white-space: nowrap; padding-bottom: .25rem; }

/* FastTrak progress */
.ft-progress { height:30px; }
.ft-progress .progress-bar { font-size: 1rem; font-weight: 600; color:var(--site-base-800)!important; background-color: var(--site-base-500); }
