/* Aldovra dashboard late styles: these load AFTER aldovra-dashboard.css and aldovra-brand.css and override them. */

/* ---- block 11 ---- */
/* ========================================================
   8C — SCREENING LOADING STATE
======================================================== */
.screening-loading{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:90px;
  color:var(--muted);
  font-size:11px;
  font-weight:700;
}
        .screening-empty{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:170px;
  padding:28px 20px;
  border:1px dashed var(--border);
  border-radius:14px;
  background:var(--surface-2);
  text-align:center;
}

.screening-empty-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:12px;
  background:#eef0ff;
  font-size:20px;
}

.screening-empty strong{
  color:var(--text);
  font-size:13px;
  font-weight:800;
}

.screening-empty span{
  max-width:360px;
  color:var(--muted);
  font-size:11px;
  line-height:1.5;
}

.screening-loading::before{
  content:"";
  width:14px;
  height:14px;
  margin-right:8px;
  border:2px solid var(--border);
  border-top-color:var(--primary);
  border-radius:50%;
  animation:screeningSpin .8s linear infinite;
}

@keyframes screeningSpin{
  to{
    transform:rotate(360deg);
  }
}

/* ---- block 12 ---- */
.ald-verified-search{margin:22px 0 26px;padding:clamp(18px,2.5vw,28px);border:1px solid var(--border,#e2e8f0);border-radius:18px;background:var(--surface,#fff);color:var(--text,#0d0d12);scroll-margin-top:100px}
            .ald-vj-hero{padding:clamp(20px,3vw,30px);border-radius:15px;background:linear-gradient(125deg,#111827 0%,#1b1730 65%,#3730a3 100%);color:#fff}
            .ald-vj-kicker{font-size:12px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase;color:#c7d2fe}
            .ald-vj-hero h2{font-size:clamp(25px,3vw,34px);line-height:1.18;letter-spacing:-.5px;margin:10px 0}
            .ald-vj-hero p{max-width:760px;margin:0;color:#e2e8f0;font-size:15px;line-height:1.7}
            .ald-vj-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:17px;font-size:14px;line-height:1.6}
            .ald-vj-status-pill{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.23);font-size:12px;font-weight:850}
            .ald-vj-status-pill.is-verified{background:#dcfce7;border-color:#bbf7d0;color:#166534}
            .ald-vj-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
            .ald-vj-button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 16px;border:1px solid #c7d2fe;border-radius:10px;background:#fff;color:#1e1b4b;font-size:14px;font-weight:850;cursor:pointer}
            .ald-vj-button-primary{background:#c7d2fe;border-color:#c7d2fe;color:#111827}
            .ald-vj-button:disabled{opacity:.55;cursor:not-allowed}
            .ald-vj-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:15px}
            .ald-vj-benefit{padding:16px;border:1px solid var(--border,#e2e8f0);border-radius:13px;background:var(--surface,#fff)}
            .ald-vj-benefit-icon{display:grid;place-items:center;width:36px;height:36px;margin-bottom:10px;border-radius:10px;background:#eef2ff;color:#4338ca;font-size:17px;font-weight:900}
            .ald-vj-benefit h3{margin:0 0 6px;font-size:15px;line-height:1.4}
            .ald-vj-benefit p{margin:0;color:var(--muted,#64748b);font-size:13px;line-height:1.65}
            .ald-vj-note{margin:13px 1px 0;color:var(--muted,#64748b);font-size:12px;line-height:1.6}
            .ald-vj-job-reason{display:grid;gap:4px;margin:10px 0;padding:12px 14px;border:1px solid #bbf7d0;border-radius:11px;background:#f0fdf4;color:#166534;font-size:13px;line-height:1.6}
            .ald-vj-job-reason strong{font-size:13px}
            .ald-vj-job-reason span{color:#166534}
            .ald-jobs-tab:disabled{opacity:.58;cursor:not-allowed}

            @media(max-width:850px){.ald-vj-benefits{grid-template-columns:1fr}}

/* ---- #ald-env-video-link-styles ---- */
.ald-env-link-card{margin:14px 0 18px;padding:16px;border:1px solid var(--border);border-radius:14px;background:var(--surface);display:grid;gap:10px}
.ald-env-link-card h3{margin:0;font-size:16px}
.ald-env-link-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}
.ald-env-link-card label{font-size:13px;font-weight:800}
.ald-env-link-card input{width:100%;min-width:0;border:1px solid var(--border);border-radius:10px;padding:12px;background:var(--surface);color:var(--text)}
.ald-env-link-card button{justify-self:start}
.ald-env-link-saved{border-color:#86efac;background:#f0fdf4}
.ald-env-link-saved a{font-weight:800;color:var(--primary);overflow-wrap:anywhere}

/* ---- block 14 ---- */
  .ald-assessment-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0,0,0,.55);
  }

  .ald-assessment-overlay.show { display: flex; }

  .ald-assessment-modal {
    width: min(620px, 100%);
    max-height: 90vh;
    overflow-y: auto;
    background: var(--surface);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 25px 80px rgba(0,0,0,.25);
  }

  .ald-assessment-header {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    align-items: flex-start;
    margin-bottom: 20px;
  }

  .ald-assessment-header h2 { margin: 0; font-size: 21px; }
  .ald-assessment-header p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 12px;
  }

  .ald-assessment-close {
    width: 36px;
    height: 36px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    border-radius: 10px;
    font-size: 20px;
  }

  .ald-assessment-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
  }

  .ald-assessment-message {
    padding: 14px;
    border-radius: 13px;
    background: var(--surface-2);
    color: var(--muted);
    font-size: 13px;
    line-height: 1.6;
    margin-bottom: 15px;
  }

  .ald-assessment-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  .ald-assessment-instructions {
    margin-top: 15px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 13px;
  }

  .ald-assessment-instructions strong {
    display: block;
    margin-bottom: 7px;
    font-size: 12px;
  }

  .ald-assessment-instructions div {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.6;
    white-space: pre-wrap;
  }

  .ald-assessment-verified {
    margin-top: 15px;
    padding: 14px;
    border-radius: 13px;
    background: var(--green-soft);
    color: var(--green);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.5;
  }

  @media (max-width: 600px) {
    .ald-assessment-grid { grid-template-columns: 1fr; }
    .ald-assessment-modal { padding: 18px; }
  }
  /* ==========================================
   COMPACT ASSESSMENT PERFORMANCE
========================================== */
.overview-performance .performance-grid{
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  align-items:center;
  gap:24px;
}

.overview-performance .chart-panel{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
}

.overview-performance .donut-chart{
  width:190px;
  height:190px;
  flex-shrink:0;
}

.overview-performance .chart-legend{
  max-height:260px;
  overflow-y:auto;
  overflow-x:hidden;
  padding-right:8px;
  scrollbar-width:thin;
}

.overview-performance .chart-legend::-webkit-scrollbar{
  width:5px;
}

.overview-performance .chart-legend::-webkit-scrollbar-thumb{
  background:#c7c3e8;
  border-radius:20px;
}

.overview-performance .legend-row{
  padding:10px 13px;
  margin-bottom:7px;
  border-radius:11px;
  font-size:12px;
}

.overview-performance .legend-row strong{
  font-size:12px;
}

@media(max-width:700px){
  .overview-performance .performance-grid{
    grid-template-columns:1fr;
    gap:20px;
  }

  .overview-performance .donut-chart{
    width:170px;
    height:170px;
  }

  .overview-performance .chart-legend{
    max-height:240px;
  }
}
  /* ==========================================
   BATCH F1 — MOBILE HEADER + SIDEBAR POLISH
========================================== */
@media(max-width:760px){
  /* Mobile top bar */
  .topbar{
    height:66px;
    padding:0 14px;
    position:sticky;
    top:0;
    z-index:300;
  }

  .brand{
    min-width:0;
    gap:9px;
  }

  .brand img{
    width:34px;
    height:34px;
  }

  .top-actions{
    display:flex;
    align-items:center;
    gap:7px;
  }

  .mobile-sidebar-btn{
    width:40px;
    height:40px;
    border-radius:12px;
    display:flex !important;
    align-items:center;
    justify-content:center;
    border:1px solid var(--border);
    background:var(--surface);
    color:var(--text);
    font-size:19px;
    cursor:pointer;
    box-shadow:0 3px 10px rgba(15,23,42,.04);
  }

  .mobile-sidebar-btn:active{
    transform:scale(.96);
  }

  .icon-btn{
    width:40px;
    height:40px;
    border-radius:12px;
  }

  .avatar{
    width:40px;
    height:40px;
    flex-shrink:0;
  }

  /* Mobile sidebar */
  .sidebar.mobile-open{
    display:block;
    position:fixed;
    top:66px;
    left:0;
    width:min(280px,86vw);
    height:calc(100vh - 66px);
    z-index:250;
    overflow-y:auto;
    border-right:1px solid var(--border);
    box-shadow:14px 0 38px rgba(15,23,42,.16);
    animation:mobileSidebarIn .18s ease-out;
  }

  .sidebar.mobile-open .nav-item{
    min-height:48px;
    margin-bottom:4px;
  }

  .sidebar.mobile-open .side-title{
    padding-top:8px;
  }
}

/* Sidebar opening animation */
@keyframes mobileSidebarIn{
  from{
    opacity:0;
    transform:translateX(-12px);
  }

  to{
    opacity:1;
    transform:translateX(0);
  }
}

/* Small phones */
@media(max-width:430px){
  .topbar{
    padding:0 11px;
  }

  .mobile-sidebar-btn,
  .icon-btn,
  .avatar{
    width:38px;
    height:38px;
  }

  .top-actions{
    gap:5px;
  }

  main{
    padding-left:12px;
    padding-right:12px;
  }
}
  /* ==========================================
   BATCH F2 — MOBILE OVERVIEW POLISH
========================================== */
@media(max-width:760px){
  /* Main content */
  main{
    max-width:100%;
  }

  /* Welcome section */
  .welcome{
    gap:14px;
    margin-bottom:16px;
  }

  .welcome h1{
    font-size:24px;
    line-height:1.2;
  }

  /* Hero */
  .overview-hero{
    padding:20px;
    border-radius:18px;
  }

  .overview-hero h2{
    font-size:24px;
    line-height:1.2;
  }

  .overview-hero p{
    font-size:12px;
    line-height:1.55;
  }

  /* Progress card */
  .overview-progress-card{
    grid-template-columns:1fr;
    gap:14px;
    padding:17px;
    margin-bottom:16px;
    border-radius:17px;
  }

  .overview-progress-header{
    flex-direction:column;
    align-items:flex-start;
    gap:9px;
    margin-bottom:16px;
  }

  .overview-progress-header h2{
    font-size:19px;
  }

  .overview-progress-header p{
    font-size:11px;
    line-height:1.55;
  }

  .overview-progress-link{
    padding:0;
  }

  .overview-progress-goal{
    padding:13px;
    border-radius:14px;
  }

  /* Stats */
  .grid-stats,
  .stats{
    width:100%;
    grid-template-columns:
      repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .stat {
    min-width:0;
    padding:14px;
    border-radius:15px;
  }

  /* Performance */
  .overview-performance{
    margin-top:16px;
    border-radius:17px;
  }

  .overview-performance .card-title{
    line-height:1.25;
  }

  .performance-score-badge{
    flex-shrink:0;
  }

  /* Recommended assessments */
}

/* ==========================================
   EXTRA SMALL PHONES
========================================== */
@media(max-width:430px){
  .welcome h1{
    font-size:22px;
  }

  .overview-hero{
    padding:18px;
  }

  .overview-hero h2{
    font-size:22px;
  }

  .overview-progress-card{
    padding:15px;
  }

  .grid-stats,
  .stats{
    grid-template-columns:1fr;
  }

  .stat {
    padding:13px;
  }
}
  /* ==========================================
   BATCH F3 — PERFORMANCE MOBILE POLISH
========================================== */
@media(max-width:760px){
  .overview-performance{
    overflow:hidden;
  }

  /* Header */
  .overview-performance .card-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
  }

  .overview-performance .performance-kicker{
    font-size:11px;
    letter-spacing:.12em;
  }

  .overview-performance .card-title{
    font-size:19px;
    margin-top:4px;
  }

  .overview-performance .card-subtitle{
    max-width:270px;
    margin-top:6px;
    font-size:11.5px;
    line-height:1.5;
  }

  .performance-score-badge{
    width:68px;
    min-width:68px;
    padding:9px 7px;
    border-radius:13px;
  }

  .performance-score-badge span{
    font-size:10.5px;
  }

  .performance-score-badge strong{
    font-size:18px;
  }

  /* Performance body */
  .overview-performance .performance-grid{
    grid-template-columns:1fr;
    gap:16px;
    margin-top:4px;
  }

  /* Donut */
  .overview-performance .chart-panel{
    min-height:165px;
  }

  .overview-performance .donut-chart{
    width:155px;
    height:155px;
  }

  /* Category list */
  .overview-performance .chart-legend{
    width:100%;
    max-height:230px;
    padding-right:5px;
  }

  .overview-performance .legend-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    min-height:42px;
    padding:9px 11px;
    margin-bottom:6px;
    border-radius:11px;
  }

  .overview-performance .legend-left{
    min-width:0;
    display:flex;
    align-items:center;
    gap:8px;
  }

  .overview-performance .legend-left span:last-child{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .overview-performance .legend-row strong{
    flex-shrink:0;
    font-size:11px;
  }
}

/* ==========================================
   EXTRA SMALL PHONES
========================================== */
@media(max-width:430px){
  .overview-performance{
    padding:15px;
  }

  .overview-performance .card-header{
    gap:8px;
  }

  .overview-performance .card-title{
    font-size:18px;
  }

  .overview-performance .card-subtitle{
    max-width:235px;
  }

  .performance-score-badge{
    width:62px;
    min-width:62px;
    padding:8px 6px;
  }

  .performance-score-badge strong{
    font-size:17px;
  }

  .overview-performance .chart-panel{
    min-height:150px;
  }

  .overview-performance .donut-chart{
    width:145px;
    height:145px;
  }

  .overview-performance .chart-legend{
    max-height:210px;
  }
}
  /* ==========================================
   BATCH F4 — SKILLS + ASSESSMENTS MOBILE
========================================== */
@media(max-width:760px){
  /* =========================
     MY SKILLS
  ========================== */
  #skillsSection{
    width:100%;
    overflow:hidden;
  }

  #skillsSection .card-header{
    gap:10px;
  }

  #skillsSection .card-title{
    font-size:19px;
  }

  #skillsSection .card-subtitle{
    font-size:11.5px;
    line-height:1.5;
  }

  #skillsSearchInput{
    width:100%;
    min-height:42px;
    padding:0 13px;
    border-radius:12px;
    font-size:12px;
  }

  .skills-search-wrap {
    width:100%;
  }

  .skills-grid{
    grid-template-columns:1fr;
    gap:10px;
  }

  .skill-category{
    padding:14px;
    border-radius:15px;
  }

  .skill-category h3{
    font-size:12px;
  }

  .skill-chip{
    min-height:42px;
    padding:9px 11px;
    border-radius:11px;
  }

  .skill-chip span{
    font-size:11px;
  }

  .skill-chip small{
    font-size:10.5px;
    padding:4px 6px;
  }

  /* =========================
     ASSESSMENTS
  ========================== */
  #assessmentsSection{
    width:100%;
    overflow:hidden;
  }

  #assessmentsSection .card-title{
    font-size:19px;
  }

  #assessmentsSection .card-subtitle{
    font-size:11.5px;
    line-height:1.5;
  }
}

/* ==========================================
   SMALL PHONES
========================================== */
@media(max-width:430px){
  #skillsSection .card-title,
  #assessmentsSection .card-title{
    font-size:18px;
  }

  .skill-category{
    padding:12px;
  }

  .skill-chip{
    min-height:40px;
  }
}
  /* ==========================================
   BATCH F5 — PROFILE + SCREENING MOBILE
========================================== */
@media(max-width:760px){
  /* =========================
     PROFILE SECTION
  ========================== */
  .field-full{
    grid-column:auto;
  }

  /* =========================
     SCREENING CALLS
  ========================== */

  /* =========================
     EMPTY STATES
  ========================== */
  .skills-empty,.screening-empty {
    width:100%;
    padding:22px 14px;
    text-align:center;
    border-radius:14px;
    font-size:11px;
    line-height:1.5;
  }
}

/* ==========================================
   SMALL PHONES
========================================== */

  /* ==========================================
   BATCH F6 — FINAL RESPONSIVE CLEANUP
========================================== */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}

@media(max-width:760px){
  *{
    max-width:100%;
  }

  main{
    width:100%;
    min-width:0;
    overflow-x:hidden;
  }

  section,.card,.panel,.grid,.grid-stats {
    min-width:0;
    max-width:100%;
  }

  /* Prevent long text from breaking layout */
  h1,
  h2,
  h3,
  h4,
  p,
  span,
  strong,
  small{
    overflow-wrap:anywhere;
  }

  /* Buttons */
  button,
  .btn{
    max-width:100%;
  }

  /* Images */
  img{
    max-width:100%;
    height:auto;
  }

  /* Generic horizontal containers */
  .card-header{
    min-width:0;
    max-width:100%;
  }

  .card-header > *{
    min-width:0;
  }

  /* Tables / wide content */
  table{
    max-width:100%;
  }

  /* Modals */
  #profileDetailsModal,.modal {
    padding:12px;
  }

  .profile-modal-inner {
    width:100%;
    max-width:100%;
    max-height:calc(100vh - 24px);
    overflow-y:auto;
    overflow-x:hidden;
  }

  /* Bottom spacing */
  main{
    padding-bottom:40px;
  }
}

/* ==========================================
   VERY SMALL DEVICES
========================================== */
@media(max-width:360px){
  main{
    padding-left:10px;
    padding-right:10px;
  }

  .card{
    padding:14px;
  }

  .topbar{
    padding-left:9px;
    padding-right:9px;
  }

  .top-actions{
    gap:4px;
  }

  .mobile-sidebar-btn,
  .icon-btn,
  .avatar{
    width:36px;
    height:36px;
  }
}
  /* ==========================================
   SIDEBAR HEIGHT FIX
========================================== */
@media(min-width:761px){
  .sidebar{
    align-self:stretch;
  }
}
  /* ==========================================
   FINAL SIDEBAR FIX — DESKTOP
========================================== */
@media(min-width:761px){
}
  /* ==========================================
   FINAL HEADER + SIDEBAR ALIGNMENT FIX
========================================== */
@media(min-width:761px){
  /* Keep header permanently at the top */

  /* Sidebar starts exactly below header */

  /* Main content starts in the same layout row */
  .layout{
    margin-top:0 !important;
  }
}
  /* ==========================================
   FINAL DESKTOP HEADER + SIDEBAR SYSTEM
========================================== */
@media(min-width:761px){
  /* FIXED TOP HEADER */
  .topbar{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:74px !important;
    box-sizing:border-box;
    z-index:1000 !important;
  }

  /* CREATE SPACE FOR FIXED HEADER */
  .app{
    padding-top:74px !important;
    box-sizing:border-box;
  }

  /* FIXED SIDEBAR */
  .sidebar{
    position:fixed !important;
    top:74px !important;
    left:0 !important;
    width:245px !important;
    height:calc(100vh - 74px) !important;
    min-height:0 !important;
    box-sizing:border-box;
    overflow-y:auto;
    z-index:900 !important;
  }

  /* MAIN CONTENT */
  .layout{
    display:grid !important;
    grid-template-columns:
      245px minmax(0,1fr) !important;
    min-height:
      calc(100vh - 74px) !important;
    margin:0 !important;
  }

  .layout > main{
    grid-column:2;
    min-width:0;
  }
}
  /* ==========================================
   PHASE 5 — RESULT PAGE
   BATCH A — RESULT HERO
========================================== */

  /* ==========================================
   PHASE 5 — RESULT PAGE
   BATCH B — CATEGORY PERFORMANCE
========================================== */

  /* ==========================================
   PHASE 5 — RESULT PAGE
   BATCH C — RESULT ACTIONS + SAVED INFO
========================================== */

/* =========================
   SAVED RESULT / ATTEMPT
========================= */

/*
   The attempt note is created dynamically
   inside .result by showResult().
*/

/* =========================
   RESULT ACTION AREA
========================= */

/* =========================
   DASHBOARD BUTTON
========================= */

/* =========================
   MOBILE
========================= */

  /* ==========================================
   PHASE 5 — RESULT PAGE
   BATCH D — VERIFICATION + RESULT MESSAGE
========================================== */

/* =========================
   RESULT MESSAGE BASE
========================= */

/* =========================
   VERIFIED / ELIGIBLE
========================= */

/* =========================
   PENDING / REATTEMPT
========================= */

/* =========================
   VERIFICATION BOX
========================= */

/* =========================
   MOBILE
========================= */

  /* ==========================================
   PHASE 5 — RESULT PAGE
   BATCH E — FINAL RESPONSIVE + QA
========================================== */

/* =========================
   RESULT PAGE SAFETY
========================= */

/* Prevent long category / result text
   from creating horizontal overflow */

/* =========================
   TABLET
========================= */

/* =========================
   MOBILE
========================= */

/* =========================
   VERY SMALL PHONES
========================= */

  /* ==========================================
   PROFILE MODAL — SIDEBAR OVERLAP FIX
========================================== */
@media(min-width:761px){
  /*
     Do not create a stacking context on main.
     This allows the profile modal to use its
     own z-index above the fixed sidebar.
  */
  .layout > main{
    position:relative;
    z-index:auto !important;
  }

  #profileDetailsModal{
    z-index:2000 !important;
  }
}
  /* ==========================================
   PHASE 6 — VERIFIED PROFILE
   BATCH 6A — VERIFIED PROFILE FOUNDATION
========================================== */

/* =========================
   PROFILE MODAL BASE
========================= */
#profileDetailsModal .profile-modern-modal{
  width:min(920px,100%);
  height:calc(100vh - 40px);
  max-height:calc(100vh - 40px);
  overflow:hidden;
  padding:0;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:22px;
  box-shadow:
    0 24px 80px rgba(15,23,42,.18);
  display:flex;
  flex-direction:column;
}

/* =========================
   PROFILE HEADER
========================= */
#profileDetailsModal .profile-modal-head{
  position:relative;
  flex:0 0 auto;
  z-index:100;
  margin:0;
  padding:23px 27px;
  background:
    linear-gradient(
      135deg,
      #eef0ff,
      #ffffff
    );
  border-bottom:1px solid var(--border);
  box-shadow:
    0 4px 14px rgba(15,23,42,.06);
}
  #profileDetailsModal .profile-modal-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:20px 27px 27px;
}

#profileDetailsModal .profile-modal-kicker{
  margin-bottom:5px;
  color:var(--primary);
  font-size:11px;
  font-weight:950;
  letter-spacing:.14em;
  text-transform:uppercase;
}

#profileDetailsModal .profile-modal-head h3{
  color:var(--text);
  font-size:22px;
  font-weight:950;
  letter-spacing:-.025em;
}

/* =========================
   PROFILE HERO
========================= */
#profileDetailsModal .profile-hero{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:20px;
  margin:0 0 20px;
  padding:22px;
  border:1px solid rgba(79,70,229,.14);
  border-radius:19px;
  background:
    linear-gradient(
      135deg,
      #f8fbff 0%,
      #ffffff 55%,
      #f1f6ff 100%
    );
  box-shadow:
    0 8px 25px rgba(79,70,229,.045);
  overflow:hidden;
}

#profileDetailsModal .profile-hero::after{
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  right:-95px;
  top:-105px;
  border-radius:50%;
  background:rgba(79,70,229,.055);
  pointer-events:none;
}

#profileDetailsModal .profile-hero > *{
  position:relative;
  z-index:1;
}
/* =====================================================
   8B — PROFILE RESUME SNAPSHOT
===================================================== */
#profileDetailsModal .profile-resume-snapshot-card{
  min-width:0;
  padding:13px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface);
}

#profileDetailsModal .profile-resume-snapshot-card-title{
  margin-bottom:9px;
  color:var(--text);
  font-size:11px;
  font-weight:850;
}

#profileDetailsModal .profile-resume-snapshot-list{
  display:flex;
  flex-direction:column;
  gap:6px;
}

#profileDetailsModal .profile-resume-snapshot-item{
  display:block;
  padding:7px 9px;
  border:1px solid var(--border);
  border-radius:8px;
  background:var(--surface-2);
  color:var(--muted);
  font-size:11.5px;
  line-height:1.45;
  overflow-wrap:anywhere;
}

/* =========================
   PHOTO
========================= */
#profileDetailsModal .profile-photo{
  width:94px;
  height:94px;
  border:4px solid var(--surface);
  box-shadow:
    0 8px 20px rgba(15,23,42,.10);
  background:
    linear-gradient(
      135deg,
      var(--primary-soft),
      #e0e7ff
    );
}

#profileDetailsModal .profile-photo span{
  font-size:30px;
  font-weight:950;
}

/* =========================
   IDENTITY
========================= */
#profileDetailsModal .profile-hero-copy{
  min-width:0;
}

#profileDetailsModal .profile-hero-copy h4{
  margin:0;
  color:var(--text);
  font-size:24px;
  font-weight:950;
  letter-spacing:-.035em;
  overflow-wrap:anywhere;
}

#profileDetailsModal .profile-hero-copy p{
  margin:5px 0 11px;
  color:var(--muted);
  font-size:12px;
  overflow-wrap:anywhere;
}

#profileDetailsModal .profile-hero-badges{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

#profileDetailsModal .profile-badge{
  min-height:27px;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:var(--surface);
  border:1px solid var(--border);
  color:var(--muted);
  font-size:11px;
  font-weight:850;
}

/* =========================
   EDIT BUTTON
========================= */
#profileDetailsModal .profile-edit-toggle{
  min-height:42px;
  padding:10px 15px;
  border-radius:11px;
  font-size:11.5px;
  font-weight:900;
  white-space:nowrap;
  box-shadow:
    0 7px 17px rgba(79,70,229,.14);
}

/* =========================
   PROFESSIONAL STATUS
========================= */
#profileDetailsModal .profile-hero::before{
  content:"PROFILE";
  position:absolute;
  top:14px;
  right:17px;
  padding:5px 8px;
  border-radius:999px;
  background:var(--blue-soft);
  color:var(--primary);
  font-size:10.5px;
  font-weight:950;
  letter-spacing:.08em;
  z-index:2;
}

/* =========================
   MOBILE
========================= */
@media(max-width:700px){
  #profileDetailsModal .profile-modern-modal{
    width:100%;
    max-height:calc(100vh - 24px);
    padding:17px;
    border-radius:18px;
  }

  #profileDetailsModal .profile-modal-head{
    margin-bottom:12px;
    padding-bottom:12px;
  }

  #profileDetailsModal .profile-modal-head h3{
    font-size:20px;
  }

  #profileDetailsModal .profile-hero{
    grid-template-columns:1fr;
    gap:12px;
    margin-bottom:16px;
    padding:18px;
    text-align:center;
  }

  #profileDetailsModal .profile-photo-wrap{
    justify-self:center;
  }

  #profileDetailsModal .profile-hero-copy h4{
    font-size:21px;
  }

  #profileDetailsModal .profile-hero-badges{
    justify-content:center;
  }

  #profileDetailsModal .profile-edit-toggle{
    justify-self:center;
  }

  #profileDetailsModal .profile-hero::before{
    top:10px;
    right:10px;
  }
}

/* =========================
   VERY SMALL PHONES
========================= */
@media(max-width:380px){
}
  /* ==========================================
   PHASE 6 — VERIFIED PROFILE
   BATCH 6B — VERIFIED SKILLS EXPERIENCE
========================================== */

/* =========================
   VERIFICATION PANEL
========================= */
#profileDetailsModal .profile-verification-panel{
  margin:20px 0 0;
  padding:20px;
  border:1px solid rgba(79,70,229,.14);
  border-radius:18px;
  background:
    linear-gradient(
      135deg,
      #f8fbff 0%,
      #ffffff 58%,
      #f5f8ff 100%
    );
  box-shadow:
    0 8px 25px rgba(79,70,229,.045);
  overflow:hidden;
}

/* =========================
   HEADER
========================= */
#profileDetailsModal .profile-verification-kicker{
  margin-bottom:5px;
  color:var(--primary);
  font-size:11px;
  font-weight:950;
  letter-spacing:.13em;
  text-transform:uppercase;
}

#profileDetailsModal .profile-verification-title{
  color:var(--text);
  font-size:17px;
  font-weight:950;
  letter-spacing:-.02em;
}

#profileDetailsModal .profile-verification-subtitle{
  max-width:680px;
  margin-top:5px;
  color:var(--muted);
  font-size:11.5px;
  line-height:1.55;
}

/* =========================
   SUMMARY STATS
========================= */
#profileDetailsModal .profile-verification-summary{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:9px;
  margin-top:16px;
}

#profileDetailsModal .profile-verification-stat{
  padding:13px;
  border:1px solid var(--border);
  border-radius:13px;
  background:rgba(255,255,255,.88);
}

#profileDetailsModal .profile-verification-stat strong{
  display:block;
  color:var(--text);
  font-size:20px;
  font-weight:950;
}

#profileDetailsModal .profile-verification-stat span{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}

/* =========================
   VERIFIED SKILL LIST
========================= */
#profileDetailsModal .profile-verification-list{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:9px;
  margin-top:16px;
}

#profileDetailsModal .profile-verification-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
  padding:11px 12px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface);
  transition:
    border-color .18s ease,
    transform .18s ease,
    box-shadow .18s ease;
}

#profileDetailsModal .profile-verification-item:hover{
  transform:translateY(-1px);
  border-color:rgba(79,70,229,.22);
  box-shadow:
    0 6px 16px rgba(15,23,42,.05);
}

#profileDetailsModal .profile-verification-item > div{
  min-width:0;
}

#profileDetailsModal .profile-verification-item strong{
  display:block;
  color:var(--text);
  font-size:11px;
  font-weight:850;
  overflow-wrap:anywhere;
}

#profileDetailsModal .profile-verification-item small{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:10.5px;
}

/* =========================
   STATUS BADGES
========================= */
#profileDetailsModal .profile-verification-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  min-height:24px;
  padding:5px 8px;
  border-radius:999px;
  font-size:10.5px;
  font-weight:950;
  white-space:nowrap;
}

#profileDetailsModal .profile-verification-status.verified{
  background:#ecfdf3;
  color:#15803d;
  border:1px solid rgba(22,163,74,.14);
}

#profileDetailsModal .profile-verification-status.reattempt{
  background:#fff7ed;
  color:#c2410c;
  border:1px solid rgba(234,88,12,.14);
}

#profileDetailsModal .profile-verification-status.pending{
  background:#eef0ff;
  color:#4f46e5;
  border:1px solid rgba(79,70,229,.14);
}

/* =========================
   VERIFICATION NOTE
========================= */

/* =========================
   MOBILE
========================= */
@media(max-width:700px){
  #profileDetailsModal .profile-verification-panel{
    margin-top:16px;
    padding:15px;
    border-radius:15px;
  }

  #profileDetailsModal .profile-verification-summary{
    grid-template-columns:
      repeat(3,minmax(0,1fr));
    gap:7px;
  }

  #profileDetailsModal .profile-verification-stat{
    padding:10px;
  }

  #profileDetailsModal .profile-verification-stat strong{
    font-size:17px;
  }

  #profileDetailsModal .profile-verification-stat span{
    font-size:10.5px;
  }

  #profileDetailsModal .profile-verification-list{
    grid-template-columns:1fr;
    gap:8px;
  }
}

/* =========================
   VERY SMALL PHONES
========================= */
@media(max-width:380px){
  #profileDetailsModal .profile-verification-summary{
    grid-template-columns:1fr;
  }

  #profileDetailsModal .profile-verification-stat{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }

  #profileDetailsModal .profile-verification-stat span{
    margin-top:0;
  }
}
  /* ==========================================
   PHASE 6 — VERIFIED PROFILE
   BATCH 6C — EDUCATION + EXPERIENCE + PROJECTS
========================================== */

/* =========================
   PROFILE INFORMATION GROUPS
========================= */
#profileDetailsModal .profile-group{
  margin:20px 0 0;
  padding:18px;
  border:1px solid var(--border);
  border-radius:17px;
  background:var(--surface);
  box-shadow:
    0 6px 18px rgba(15,23,42,.035);
}

/* =========================
   GROUP HEADER
========================= */
#profileDetailsModal .profile-group-title{
  color:var(--text);
  font-size:15px;
  font-weight:950;
  letter-spacing:-.015em;
}

/* =========================
   EDUCATION / EXPERIENCE GRID
========================= */

/* =========================
   PROJECT / EXPERIENCE ITEMS
========================= */

/* =========================
   FRESHER INDICATOR
========================= */

/* =========================
   PROJECT TECHNOLOGY TAGS
========================= */

/* =========================
   EMPTY STATE
========================= */

/* =========================
   MOBILE
========================= */
@media(max-width:700px){
  #profileDetailsModal .profile-group{
    margin-top:15px;
    padding:15px;
    border-radius:15px;
  }
}

/* =========================
   VERY SMALL PHONES
========================= */
@media(max-width:380px){
  #profileDetailsModal .profile-group{
    padding:13px;
  }
}
  /* ==========================================
   PHASE 6 — VERIFIED PROFILE
   BATCH 6D — PROFILE STRENGTH + EMPLOYER SIGNALS
========================================== */

/* =========================
   PROFILE COMPLETION
========================= */
#profileDetailsModal .profile-completion{
  position:relative;
  margin:20px 0 0 !important;
  padding:19px;
  border:1px solid rgba(79,70,229,.15);
  border-radius:17px;
  background:
    linear-gradient(
      135deg,
      #f8fbff 0%,
      #ffffff 58%,
      #eef0ff 100%
    );
  box-shadow:
    0 8px 24px rgba(79,70,229,.045);
  overflow:hidden;
}

#profileDetailsModal .profile-completion::after{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  right:-75px;
  bottom:-90px;
  border-radius:50%;
  background:rgba(79,70,229,.045);
  pointer-events:none;
}

/* =========================
   COMPLETION HEADER
========================= */
#profileDetailsModal .profile-completion-top{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
}

#profileDetailsModal .profile-completion-title{
  color:var(--text);
  font-size:14px;
  font-weight:950;
}

#profileDetailsModal .profile-completion-text{
  max-width:600px;
  margin-top:4px;
  color:var(--muted);
  font-size:11px;
  line-height:1.5;
}
/* =====================================================
   8B — RESUME COMPLETION STATUS
===================================================== */
#profileDetailsModal .profile-resume-completion-status{
  display:inline-flex;
  align-items:center;
  margin-top:6px;
  color:var(--muted);
  font-size:11.5px;
  font-weight:700;
  line-height:1.4;
}

#profileDetailsModal .profile-resume-completion-status::before{
  content:"";
  width:6px;
  height:6px;
  margin-right:6px;
  border-radius:50%;
  background:#94a3b8;
  flex-shrink:0;
}
#profileDetailsModal #profileCompletionPercent{
  flex-shrink:0;
  color:var(--primary);
  font-size:24px;
  font-weight:950;
  letter-spacing:-.03em;
}

/* =========================
   PROGRESS BAR
========================= */
#profileDetailsModal .profile-completion-bar{
  position:relative;
  z-index:1;
  width:100%;
  height:9px;
  margin-top:13px;
  overflow:hidden;
  background:#dbe7f5;
  border-radius:999px;
}

#profileDetailsModal .profile-completion-bar span{
  display:block;
  width:0%;
  height:100%;
  border-radius:inherit;
  background:
    linear-gradient(
      90deg,
      #4f46e5,
      #6366f1,
      #a5b4fc
    );
  transition:width .35s ease;
}

/* =========================
   EMPLOYER SIGNALS
========================= */

/* =========================
   READY STATE
========================= */

/* =========================
   MOBILE
========================= */
@media(max-width:700px){
  #profileDetailsModal .profile-completion{
    margin-top:16px !important;
    padding:15px;
    border-radius:15px;
  }

  #profileDetailsModal .profile-completion-top{
    align-items:flex-start;
  }

  #profileDetailsModal #profileCompletionPercent{
    font-size:21px;
  }
}

/* =========================
   VERY SMALL PHONES
========================= */
@media(max-width:380px){
  #profileDetailsModal .profile-completion{
    padding:13px;
  }

  #profileDetailsModal .profile-completion-top{
    gap:8px;
  }

  #profileDetailsModal #profileCompletionPercent{
    font-size:19px;
  }
}
  /* ==========================================
   PHASE 6 — VERIFIED PROFILE
   BATCH 6E — FINAL RESPONSIVE + OVERFLOW POLISH
========================================== */

/* =========================
   GLOBAL PROFILE SAFETY
========================= */
#profileDetailsModal,
#profileDetailsModal *{
  box-sizing:border-box;
}

#profileDetailsModal .profile-modal-inner{
  min-width:0;
  width:min(920px,100%);
  max-width:100%;
}

#profileDetailsModal .profile-modal-head,
#profileDetailsModal .profile-hero,
#profileDetailsModal .profile-edit-grid,
#profileDetailsModal .profile-group,
#profileDetailsModal .profile-verification-panel,
#profileDetailsModal .resume-intelligence,
#profileDetailsModal .profile-completion,
#profileDetailsModal .profile-modal-actions,
#profileDetailsModal .profile-message{
  min-width:0;
  max-width:100%;
}

#profileDetailsModal input,
#profileDetailsModal textarea,
#profileDetailsModal select{
  max-width:100%;
  min-width:0;
}

/* =========================
   DESKTOP SCROLL
========================= */
@media(min-width:761px){
  #profileDetailsModal{
    padding:20px;
  }

  #profileDetailsModal .profile-modern-modal{
    max-height:calc(100vh - 40px);
  }
}

/* =========================
   TABLET
========================= */
@media(max-width:760px){
  #profileDetailsModal{
    padding:10px;
  }

  #profileDetailsModal .profile-modern-modal{
    width:100%;
    max-height:calc(100vh - 20px);
    border-radius:18px;
  padding:0;
  }

  #profileDetailsModal .profile-modal-head{
    gap:10px;
  }

  #profileDetailsModal .profile-modal-head h3{
    font-size:20px;
  }

  #profileDetailsModal .profile-hero{
    grid-template-columns:1fr;
    text-align:center;
  }

  #profileDetailsModal .profile-photo-wrap{
    justify-self:center;
  }

  #profileDetailsModal .profile-hero-copy{
    width:100%;
  }

  #profileDetailsModal .profile-hero-badges{
    justify-content:center;
  }

  #profileDetailsModal .profile-edit-toggle{
    justify-self:center;
  }

  #profileDetailsModal .profile-edit-grid{
    grid-template-columns:1fr;
  }

  #profileDetailsModal .profile-edit-grid .field-full{
    grid-column:auto;
  }
}

/* =========================
   SMALL MOBILE
========================= */
@media(max-width:520px){
  #profileDetailsModal{
    padding:7px;
  }

  #profileDetailsModal .profile-modern-modal{
    max-height:calc(100vh - 14px);
  padding:0;
    border-radius:16px;
  }

  #profileDetailsModal .profile-modal-head{
    align-items:flex-start;
  }

  #profileDetailsModal .profile-modal-head h3{
    font-size:19px;
  }

  #profileDetailsModal .profile-modal-head p{
    font-size:11px !important;
  }

  #profileDetailsModal .close-btn{
    min-width:58px;
    padding:7px 9px;
    font-size:11px;
  }

  #profileDetailsModal .profile-hero{
    gap:10px;
    padding:15px;
  }

  #profileDetailsModal .profile-photo{
    width:82px;
    height:82px;
  }

  #profileDetailsModal .profile-hero-copy h4{
    font-size:19px;
  }

  #profileDetailsModal .profile-verification-summary{
    grid-template-columns:1fr;
  }

  #profileDetailsModal .profile-modal-actions{
    flex-direction:column;
  }

  #profileDetailsModal .profile-modal-actions button{
    width:100%;
  }
}

/* =========================
   VERY SMALL DEVICES
========================= */
@media(max-width:380px){
  #profileDetailsModal{
    padding:5px;
  }

  #profileDetailsModal .profile-modern-modal{
    padding:10px;
    border-radius:14px;
  }

  #profileDetailsModal .profile-modal-head{
    gap:7px;
  }

  #profileDetailsModal .profile-modal-head h3{
    font-size:18px;
  }

  #profileDetailsModal .profile-hero{
    padding:13px;
  }

  #profileDetailsModal .profile-photo{
    width:76px;
    height:76px;
  }

  #profileDetailsModal .profile-hero-copy h4{
    font-size:18px;
  }

  #profileDetailsModal .profile-verification-panel,
  #profileDetailsModal .profile-group,
  #profileDetailsModal .resume-intelligence,
  #profileDetailsModal .profile-completion{
    padding:12px;
  }
}

/* =========================
   TEXT / LONG VALUE SAFETY
========================= */
#profileDetailsModal h1,
#profileDetailsModal h2,
#profileDetailsModal h3,
#profileDetailsModal h4,
#profileDetailsModal p,
#profileDetailsModal strong,
#profileDetailsModal span,
#profileDetailsModal small{
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* =========================
   BUTTON SAFETY
========================= */
#profileDetailsModal button{
  max-width:100%;
}

#profileDetailsModal .profile-edit-toggle,
#profileDetailsModal .close-btn{
  flex-shrink:0;
}
  /* =====================================================
   PHASE 7A — EXPLORE STUDENTS STYLING
===================================================== */
.explore-section{
  margin-top:24px;
}

.explore-tab{
  border:0;
  background:transparent;
  padding:10px 14px;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  border-bottom:2px solid transparent;
}

.explore-tab.active{
  color:#4f46e5;
  border-bottom-color:#4f46e5;
}

/* =====================================================
   PHASE 7C-2E — EXPLORE LOAD ERROR
===================================================== */
.explore-load-error{
  grid-column:1 / -1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:180px;
  padding:28px 20px;
  border:1px solid #fecaca;
  border-radius:14px;
  background:#fff7f7;
  text-align:center;
}

.explore-load-error strong{
  color:#b42318;
  font-size:13px;
  font-weight:800;
}

.explore-load-error span{
  max-width:360px;
  color:var(--muted);
  font-size:11px;
  line-height:1.5;
}

.explore-retry-btn{
  min-height:36px;
  margin-top:6px;
  padding:0 14px;
  border:1px solid #c7d2fe;
  border-radius:9px;
  background:#fff;
  color:#4f46e5;
  font-size:11px;
  font-weight:750;
  cursor:pointer;
}

.explore-retry-btn:hover{
  background:#eef0ff;
}

@media(max-width:600px){
  .explore-tab{
    flex:0 0 auto;
  }
}
  /* =====================================================
   PHASE 7A-5 — EXPLORE STUDENT CARD
===================================================== */
.explore-student-action{
  width:100%;
  min-height:38px;
  border:1px solid #d9e0ee;
  border-radius:9px;
  background:var(--surface);
  color:#4f46e5;
  font-size:11px;
  font-weight:750;
  cursor:pointer;
  margin-top:auto;
}

.explore-student-action:hover{
  background:#eef0ff;
  border-color:#c7d2fe;
}

  /* =====================================================
   PHASE 7B-6B — PUBLIC STUDENT PROFILE MODAL
===================================================== */
.explore-student-profile-modal{
  position:fixed;
  inset:0;
  z-index:2200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(15,23,42,.58);
}

.explore-student-profile-modal.hidden{
  display:none;
}

.explore-student-profile-dialog{
  position:relative;
  width:min(820px,100%);
  max-height:min(88vh,820px);
  overflow-y:auto;
 background:
  linear-gradient(
    180deg,
    #f8fbff 0%,
    #ffffff 190px
  );
  border-radius:22px;
  border:1px solid #dbe7ff;
  padding:28px;
  box-shadow:0 24px 70px rgba(15,23,42,.24);
}

.explore-student-profile-close{
  position:absolute;
  top:16px;
  right:16px;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:var(--surface-2);
  color:var(--muted);
  cursor:pointer;
  font-size:15px;
}

.explore-profile-hero{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
  padding-right:46px;
  background:
  linear-gradient(
    135deg,
    #eef0ff 0%,
    #ffffff 72%
  );
border:1px solid #e0eaff;
border-radius:16px;
padding:20px;
}

.explore-profile-avatar{
  width:78px;
  height:78px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#eef2ff;
  color:#4f46e5;
  font-size:25px;
  font-weight:850;
  overflow:hidden;
}

.explore-profile-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.explore-profile-name-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}

.explore-profile-name-row h2{
  margin:0;
  color:var(--text);
  font-size:24px;
  font-weight:850;
}

.explore-profile-verified{
  display:inline-flex;
  align-items:center;
  padding:5px 8px;
  border-radius:999px;
  background:#ecfdf3;
  color:#087443;
  font-size:11.5px;
  font-weight:800;
}

.explore-profile-identity p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:12px;
}

.explore-profile-rank{
  min-width:76px;
  padding:11px 12px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface-2);
  text-align:center;
}

.explore-profile-rank span{
  display:block;
  color:var(--muted);
  font-size:11.5px;
}

.explore-profile-rank strong{
  display:block;
  margin-top:3px;
  color:var(--text);
  font-size:20px;
  font-weight:850;
}

.explore-profile-stats{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:24px;
}

.explore-profile-stat{
  padding:15px;
  border:1px solid var(--border);
  border-radius:13px;
  background:var(--surface-2);
  text-align:center;
  transition:
  transform .18s ease,
  box-shadow .18s ease;
}
  .explore-profile-stat:hover{
  transform:translateY(-2px);
  box-shadow:
    0 8px 20px rgba(79,70,229,.08);
}

.explore-profile-stat strong{
  display:block;
  color:var(--text);
  font-size:20px;
  font-weight:850;
}

.explore-profile-stat span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:11.5px;
}

.explore-profile-section{
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid var(--border);
}

.explore-profile-section h3{
  margin:0 0 12px;
  color:var(--text);
  font-size:14px;
  font-weight:800;
}
/* =====================================================
   PHASE 7B-7C — PUBLIC ASSESSMENT PERFORMANCE
===================================================== */
.explore-profile-section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}

.explore-profile-section-kicker{
  display:block;
  margin-bottom:5px;
  color:#4f46e5;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
}

.explore-profile-performance-stats{
  display:grid;
  grid-template-columns:
    repeat(4, minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}

.explore-profile-performance-stat{
  padding:13px 12px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface-2);
}

.explore-profile-performance-stat strong{
  display:block;
  color:var(--text);
  font-size:18px;
  font-weight:850;
  line-height:1.1;
}

.explore-profile-performance-stat span{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:11px;
  font-weight:650;
}

.explore-profile-skill-performance{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:14px;
}

.explore-profile-skill-performance-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface);
}

.explore-profile-skill-performance-info{
  min-width:0;
}

.explore-profile-skill-performance-name{
  color:var(--text);
  font-size:11px;
  font-weight:750;
}

.explore-profile-skill-performance-bar{
  width:120px;
  height:6px;
  margin-top:6px;
  overflow:hidden;
  border-radius:999px;
  background:var(--surface-2);
}

.explore-profile-skill-performance-fill{
  height:100%;
  border-radius:inherit;
  background:#4f46e5;
}

.explore-profile-skill-performance-score{
  flex:0 0 auto;
  color:var(--text);
  font-size:11px;
  font-weight:800;
}

.explore-profile-performance-empty{
  padding:14px;
  border:1px dashed var(--border);
  border-radius:11px;
  color:var(--muted);
  font-size:11px;
  line-height:1.5;
  text-align:center;
}

@media(max-width:600px){
  .explore-profile-performance-stats{
    grid-template-columns:
      repeat(2, minmax(0,1fr));
  }

  .explore-profile-skill-performance-row{
    align-items:flex-start;
  }

  .explore-profile-skill-performance-bar{
    width:90px;
  }
}
.explore-profile-skills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.explore-profile-skill{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:7px 10px;
  border-radius:9px;
  background:#ecfdf3;
  color:#087443;
  font-size:11px;
  font-weight:700;
}

.explore-profile-about{
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.65;
}

.explore-profile-actions{
  display:flex;
  justify-content:flex-end;
  margin-top:24px;
}

@media(max-width:600px){
  .explore-student-profile-modal{
    padding:12px;
  }

  .explore-student-profile-dialog{
    max-height:92vh;
    padding:20px;
    border-radius:18px;
  }

  .explore-profile-hero{
    grid-template-columns:1fr;
    text-align:center;
    justify-items:center;
    padding-right:30px;
  }

  .explore-profile-name-row{
    justify-content:center;
  }

  .explore-profile-stats{
    grid-template-columns:1fr;
  }

  .explore-profile-actions{
    justify-content:stretch;
  }

  .explore-profile-actions button{
    width:100%;
  }
}

/* =====================================================
   STUDENT DASHBOARD — FINAL RESPONSIVE / ACCESSIBILITY POLISH
   Additive overrides only; existing layout and functionality retained.
===================================================== */
:where(button, a, input, select, textarea, [tabindex]):focus-visible{
  outline:3px solid rgba(79,70,229,.55);
  outline-offset:3px;
}
button:disabled,
input:disabled,
select:disabled,
textarea:disabled{
  cursor:not-allowed;
  opacity:.62;
}
img, video, canvas, svg{
  max-width:100%;
}
.layout, main, .container, .card, .assessment-category,
.assessment-row, .assessment-info, .assessment-right{
  min-width:0;
}
.assessment-info h4,
.assessment-meta,
.card-subtitle,
.resume-upload-subtitle,
.resume-intelligence-subtitle{
  overflow-wrap:anywhere;
}
@media (max-width:1050px){
  main{padding:24px;}
  .overview-hero{grid-template-columns:minmax(0,1fr) 190px;gap:20px;padding:24px;}
  .overview-hero-circle{width:145px;height:145px;}
  .overview-hero-circle::before{width:112px;height:112px;}
}
@media (max-width:760px){
  .topbar{gap:8px;}
  .top-actions{gap:7px;}
  .icon-btn{width:38px;height:38px;}
  .mobile-sidebar-btn{flex:0 0 39px;}
  .sidebar.mobile-open{max-width:calc(100vw - 24px);}
  main{padding:18px 14px 30px;}
  .overview-hero{grid-template-columns:minmax(0,1fr);padding:22px;}
  .overview-hero-visual{justify-content:flex-start;}
  .overview-hero-circle{width:125px;height:125px;}
  .overview-hero-circle::before{width:96px;height:96px;}
  .overview-hero h2{font-size:clamp(23px,6vw,30px);}
  .grid-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .overview-stat{padding:14px;}
  .assessment-guidance{grid-template-columns:1fr;}
  .assessments-page-hero{flex-direction:column;align-items:stretch;padding:20px;}
  .assessment-benchmark-card{align-self:flex-start;}

  .assessment-result-stats{grid-template-columns:repeat(2,minmax(0,1fr));}
  .assessment-result-head{flex-wrap:wrap;}
}
@media (max-width:520px){
  .grid-stats{grid-template-columns:1fr 1fr;}
  .overview-stat-value{font-size:21px;}
  .card{padding:16px;}
  .assessments-page-card .assessment-row{gap:12px;padding:13px;}
  .assessments-page-card .assessment-right{
    width:100%;min-width:0;align-items:flex-start;justify-content:flex-start;
    flex-direction:row;flex-wrap:wrap;
  }
  .assessment-result-stats{grid-template-columns:1fr;}
  .assessment-result-panel{padding:14px;}
  .subject-score-row{grid-template-columns:minmax(75px,.8fr) minmax(45px,1fr) 40px;gap:7px;}
  .resume-upload-box{padding:16px;}
  .resume-upload-actions > *{max-width:100%;}
  .skill-assessment-dialog{max-height:calc(100dvh - 24px);overflow:auto;}
  #profileDetailsModal{padding:10px;}
  #profileDetailsModal .profile-modal-inner{max-height:calc(100dvh - 20px);}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}

/* ---- #ald-learning-plan-styles ---- */
.ald-learning-trigger{margin-top:8px;border:1px solid #c7d2fe;background:#eef0ff;color:#4338ca;border-radius:10px;padding:9px 12px;font-weight:700;cursor:pointer}.ald-learning-trigger:hover{background:#e0e7ff}.ald-learning-overlay{position:fixed;inset:0;background:rgba(15,23,42,.58);z-index:99999;display:flex;align-items:center;justify-content:center;padding:18px}.ald-learning-dialog{width:min(680px,100%);max-height:85vh;overflow:auto;background:#fff;color:#172033;border-radius:18px;padding:22px;box-shadow:0 24px 70px rgba(0,0,0,.25)}.ald-learning-dialog h2{margin:0 0 8px;font-size:22px}.ald-learning-dialog p{color:#64748b;line-height:1.55}.ald-learning-item{border:1px solid #e2e8f0;border-radius:12px;padding:13px;margin:10px 0}.ald-learning-item strong{display:block;margin-bottom:5px}.ald-learning-item a{color:#4338ca;font-weight:600;text-decoration:underline}.ald-learning-close{float:right;border:0;background:#f1f5f9;border-radius:9px;padding:7px 10px;cursor:pointer}.ald-learning-note{font-size:12px;color:#64748b}

/* ---- #ald-application-insights-style ---- */
.ald-application-insights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0 18px}.ald-insight-card{padding:13px;border:1px solid var(--border);background:var(--surface);border-radius:13px;min-width:0}.ald-insight-label{font-size:11px;color:var(--muted);font-weight:700}.ald-insight-value{font-size:24px;font-weight:850;line-height:1.3;margin-top:4px;color:var(--text)}.ald-insight-sub{font-size:11px;color:var(--muted);margin-top:3px}.ald-insight-progress{height:7px;border-radius:999px;background:var(--surface-2);overflow:hidden;margin-top:12px;grid-column:1/-1}.ald-insight-progress span{display:block;height:100%;background:var(--primary);border-radius:999px;transition:width .2s}.ald-insight-summary{grid-column:1/-1;font-size:12px;color:var(--muted)}@media(max-width:760px){.ald-application-insights{grid-template-columns:repeat(2,minmax(0,1fr))}.ald-insight-card:last-of-type{grid-column:1/-1}}

/* ---- #aldovra-compact-student-rows ---- */
/* Compact Explore Students: keep long lists inside their own scroll region. */
#exploreStudentsDropdown{min-width:0}

.explore-student-row{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:58px;
  padding:8px 12px;
  border-bottom:1px solid var(--border);
  background:var(--surface);
}
.explore-student-row:last-child{border-bottom:0}
.explore-student-row-rank{
  flex:0 0 54px;
  text-align:center;
  border:1px solid var(--border);
  border-radius:8px;
  padding:7px 4px;
  background:var(--surface-2);
  color:var(--text);
  font-size:11px;
  font-weight:800;
}
.explore-student-row-main{
  display:flex;
  align-items:center;
  gap:8px;
  flex:1;
  min-width:0;
}
.explore-student-row-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--text);
  font-size:13px;
  font-weight:800;
}
.explore-student-row-verified{
  flex:0 0 auto;
  color:var(--green);
  font-size:11.5px;
  font-weight:800;
}
.explore-student-row-action{
  flex:0 0 auto;
  width:auto;
  min-height:34px;
  margin:0;
  padding:7px 12px;
  font-size:11px;
}
@media(max-width:600px){
  .explore-student-row{gap:8px;padding:8px}
  .explore-student-row-rank{flex-basis:46px}
  .explore-student-row-name{font-size:12px}
  .explore-student-row-verified{display:none}
  .explore-student-row-action{padding:7px 9px}
}

/* Profile modal verification list on phones: stack name above status/actions (29 Oct 2026).
   The flex row above squeezed the skill name to one letter per line. */
@media (max-width: 640px){
  #profileDetailsModal .profile-verification-item{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  #profileDetailsModal .profile-verification-item > div,
  #profileDetailsModal .profile-verification-item > *{ width:100%; min-width:0; }
  #profileDetailsModal .profile-verification-item strong{ font-size:14px; overflow-wrap:normal; word-break:normal; }
  #profileDetailsModal .profile-verification-item small{ font-size:12.5px; }
  #profileDetailsModal .profile-verification-right{
    display:flex !important; flex-direction:row !important; flex-wrap:wrap; align-items:center !important; justify-content:flex-start !important; gap:8px; width:100%; text-align:left;
  }
  #profileDetailsModal .profile-verification-right > *{ width:auto !important; margin:0 !important; }
  #profileDetailsModal .profile-verification-score{ display:none !important; }
}
