/* ============================================================
   APPRENANT.CSS — PHANOS KOSMOS
   Responsive : mobile-first
   Breakpoints : 480px / 640px / 900px
   ============================================================ */

/* ── LOGIN ── */
.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--clr-dark);background-image:radial-gradient(ellipse at 20% 50%,rgba(200,147,58,0.06) 0%,transparent 60%),radial-gradient(ellipse at 80% 20%,rgba(200,147,58,0.04) 0%,transparent 50%);padding:1.25rem}
.login-box{background:var(--clr-dark-3);border:1px solid var(--clr-border);border-radius:var(--radius-lg);padding:2rem 1.5rem;width:100%;max-width:440px;text-align:center}
.login-logo{width:60px;height:60px;border-radius:12px;object-fit:cover;margin:0 auto 1.25rem}
.login-box h1{font-family:var(--ff-display);font-size:1.5rem;font-weight:700;color:var(--clr-white);margin-bottom:0.5rem}
.login-box h1 strong{color:var(--clr-primary)}
.login-box>p{font-size:0.88rem;color:var(--clr-text-sub);margin-bottom:1.5rem;line-height:1.65}
.login-form{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.25rem;text-align:left}
.login-back{display:inline-flex;align-items:center;gap:0.4rem;font-size:0.85rem;color:var(--clr-text-sub);transition:color var(--transition)}
.login-back:hover{color:var(--clr-primary)}

/* ── DASHBOARD LAYOUT ── */
.dashboard{display:block;min-height:100vh;background:var(--clr-dark)}
.dash-sidebar{background:var(--clr-dark-2);border-right:1px solid var(--clr-border);display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;width:260px;z-index:500;transform:translateX(-260px);transition:transform 0.3s ease;overflow-y:auto}
.dash-sidebar.open{transform:translateX(0);box-shadow:4px 0 40px rgba(0,0,0,0.7)}
body.sidebar-open::before{content:"";position:fixed;inset:0;background:rgba(0,0,0,0.55);z-index:499}
.ds-brand{display:flex;align-items:center;gap:0.75rem;padding:1.25rem 1.5rem;border-bottom:1px solid var(--clr-border)}
.ds-logo{width:38px;height:38px;border-radius:8px;object-fit:cover;flex-shrink:0}
.ds-brand strong{display:block;font-size:0.85rem;color:var(--clr-white);line-height:1.3}
.ds-brand span{font-size:0.72rem;color:var(--clr-text-sub)}
.ds-nav{flex:1;padding:0.75rem;display:flex;flex-direction:column;gap:0.2rem}
.ds-nav-item{display:flex;align-items:center;gap:0.75rem;padding:0.75rem 1rem;border-radius:8px;font-size:0.88rem;color:var(--clr-text-sub);transition:var(--transition)}
.ds-nav-item:hover{background:rgba(255,255,255,0.04);color:var(--clr-white)}
.ds-nav-item.active{background:rgba(200,147,58,0.12);color:var(--clr-primary);font-weight:600}
.ds-logout{padding:1rem 1.5rem;border-top:1px solid var(--clr-border)}
.dash-main{margin-left:0;display:flex;flex-direction:column;min-height:100vh;width:100%}

/* ── TOP BAR ── */
.dash-topbar{display:flex;align-items:center;justify-content:space-left;padding:0 0.75rem;height:55px;border-bottom:1px solid var(--clr-border);background:var(--clr-dark-2);position:sticky;top:0;z-index:100}
.dt-left{display:flex;align-items:center;gap:0.75rem;min-width:0;flex:1}

/* ── FIX HAMBURGER : visible sur mobile, masqué sur desktop ── */
/* Déclaration de base hors media query — priorité assurée */
.ds-toggle{
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:8px;
  background:rgba(200,147,58,0.12);
  border:1px solid rgba(200,147,58,0.25);
  color:var(--clr-primary);
  cursor:pointer;
  flex-shrink:0;
  transition:background 0.2s,border-color 0.2s;
  padding:0;
}
.ds-toggle:hover{
  background:rgba(200,147,58,0.22);
  border-color:rgba(200,147,58,0.45);
}
/* ── FIN FIX HAMBURGER ── */

.dt-breadcrumb{font-size:0.88rem;font-weight:600;color:var(--clr-white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dt-right{display:flex;align-items:center;flex-shrink:0;margin-left:0.5rem}

/* ── Barre widgets (horloge/météo/chrono) — ligne indépendante sous la
   topbar principale, sur TOUS les écrans. Ne partage jamais l'espace
   avec le hamburger, donc ne peut plus jamais l'écraser. ── */
.dt-widgets{
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;
  gap:0.6rem 1rem;padding:0.4rem 0.75rem;
  background:var(--clr-dark-3);border-bottom:1px solid var(--clr-border);
  position:sticky;top:55px;z-index:99;
}
.dt-widgets>div{display:flex;align-items:center;gap:0.3rem;font-size:0.74rem;color:var(--clr-text-sub);white-space:nowrap}
.dt-widgets iconify-icon{color:var(--clr-primary);flex-shrink:0}
.dt-apprenant{display:flex;align-items:center;gap:0.5rem}
.dt-avatar{width:34px;height:34px;border-radius:50%;background:rgba(200,147,58,0.2);border:2px solid var(--clr-primary);display:flex;align-items:center;justify-content:center;font-size:0.9rem;font-weight:700;color:var(--clr-primary);flex-shrink:0}
.dt-apprenant strong,.dt-apprenant span{display:none}

/* ── PANELS ── */
.dash-panels{padding:0.875rem;flex:1}
.panel{display:none}
.panel.active{display:block;animation:fadeIn 0.3s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.panel-header{margin-bottom:1.25rem}
.panel-header h2{font-family:var(--ff-display);font-size:1.3rem;font-weight:700;color:var(--clr-white);margin-bottom:0.3rem}
.panel-header p{color:var(--clr-text-sub);font-size:0.88rem}

/* ── KPI GRID ── */
.kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem;margin-bottom:1.25rem}
.kpi-card{background:var(--clr-dark-3);border:1px solid rgba(255,255,255,0.06);border-radius:var(--radius);padding:1rem;display:flex;align-items:center;gap:0.75rem;transition:var(--transition)}
.kpi-card:hover{border-color:var(--clr-border)}
.kpi-card iconify-icon{color:var(--clr-primary);flex-shrink:0}
.kpi-info{min-width:0;flex:1}
.kpi-info span{display:block;font-size:0.72rem;color:var(--clr-text-sub);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:0.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi-info strong{font-size:0.92rem;color:var(--clr-white);display:block;word-break:break-word;line-height:1.3}

/* ── PROGRESS SECTION ── */
.progress-section{background:var(--clr-dark-3);border:1px solid rgba(255,255,255,0.06);border-radius:var(--radius-lg);padding:1.25rem;margin-bottom:1.25rem}
.ps-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:0.875rem}
.ps-header h4{font-weight:700;color:var(--clr-white);font-size:0.95rem}
.ps-header span{font-size:0.88rem;color:var(--clr-primary);font-weight:700}
.ps-tranches{display:flex;flex-direction:column;gap:0.6rem;margin-top:1rem}
.ps-tranche{background:var(--clr-dark-4);border-radius:var(--radius);padding:0.875rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:0.75rem;border:1px solid rgba(255,255,255,0.04)}
.ps-tranche-label{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--clr-text-sub);flex:1;min-width:0}
.ps-tranche-amount{font-size:0.95rem;font-weight:700;color:var(--clr-white);white-space:nowrap}
.ps-tranche .badge{flex-shrink:0;font-size:0.72rem;padding:0.2rem 0.6rem}
.ps-tranche.paid{border-color:rgba(76,175,80,0.2)}
.ps-tranche.paid .ps-tranche-label{color:#4caf50}
.ps-tranche.locked{opacity:0.5}

/* ── NEXT ACTION ── */
.next-action-block{background:linear-gradient(135deg,rgba(200,147,58,0.08) 0%,rgba(200,147,58,0.03) 100%);border:1px solid var(--clr-border);border-radius:var(--radius-lg);padding:1.25rem;margin-bottom:1.25rem;display:flex;flex-direction:column;gap:1rem}
.na-info h4{font-weight:700;color:var(--clr-white);margin-bottom:0.25rem;font-size:0.95rem}
.na-info p{font-size:0.85rem;color:var(--clr-text-sub);line-height:1.55}
.next-action-block .btn{width:100%;justify-content:center;padding:0.875rem 1.5rem}

/* ── ABSENCE WARNING ── */
.absence-warning{display:flex;align-items:flex-start;gap:0.875rem;background:rgba(229,57,53,0.08);border:1px solid rgba(229,57,53,0.25);border-radius:var(--radius);padding:1rem;margin-bottom:1.25rem}
.absence-warning iconify-icon{color:#e53935;flex-shrink:0}
.absence-warning strong{display:block;color:#e53935;font-weight:700;margin-bottom:0.2rem;font-size:0.9rem}
.absence-warning p{font-size:0.85rem;color:var(--clr-text-sub)}

/* ── PAIEMENTS ── */
.paiements-summary{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem;margin-bottom:1.5rem}
.ps-item{background:var(--clr-dark-3);border:1px solid rgba(255,255,255,0.06);border-radius:var(--radius);padding:1rem;text-align:center}
.ps-item span{display:block;font-size:0.72rem;color:var(--clr-text-sub);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:0.35rem}
.ps-item strong{font-size:1.05rem;font-weight:700;color:var(--clr-white);word-break:break-word}
.table-wrap{background:var(--clr-dark-3);border:1px solid rgba(255,255,255,0.06);border-radius:var(--radius-lg);padding:1rem;overflow-x:auto}
.table-wrap h4{font-weight:700;color:var(--clr-white);margin-bottom:1rem;font-size:0.95rem}

/* ── DOCUMENTS ── */
.docs-grid{display:grid;grid-template-columns:1fr;gap:1rem}
.doc-card{background:var(--clr-dark-3);border:1px solid rgba(255,255,255,0.06);border-radius:var(--radius-lg);padding:1.5rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:0.6rem}
.doc-card iconify-icon{color:var(--clr-primary)}
.doc-card strong{font-weight:700;color:var(--clr-white);font-size:0.9rem}
.doc-card span{font-size:0.8rem;color:var(--clr-text-sub)}

/* ── ATTESTATION ── */
#attestation-status-block{width:100%}
.attest-locked{background:var(--clr-dark-3);border:1px dashed rgba(255,255,255,0.1);border-radius:var(--radius-lg);padding:2rem 1.5rem;text-align:center}
.attest-locked iconify-icon{color:var(--clr-text-sub);margin-bottom:0.875rem;opacity:0.4}
.attest-locked h4{font-weight:700;color:var(--clr-text-sub);margin-bottom:0.4rem}
.attest-locked p{font-size:0.85rem;color:rgba(160,152,136,0.6)}
.attest-available{background:linear-gradient(135deg,rgba(76,175,80,0.08) 0%,rgba(76,175,80,0.03) 100%);border:1px solid rgba(76,175,80,0.25);border-radius:var(--radius-lg);padding:2rem 1.5rem;text-align:center}
.attest-available iconify-icon{color:#4caf50;margin-bottom:0.875rem}
.attest-available h4{font-weight:700;color:var(--clr-white);margin-bottom:0.4rem}
.attest-available p{font-size:0.85rem;color:var(--clr-text-sub);margin-bottom:1.25rem}

/* ════════════════════════════════════════════════════════════
   COURS — cartes redesignées
   ════════════════════════════════════════════════════════════ */
.cours-grid{display:flex;flex-direction:column;gap:1rem}

.cours-card{
  background:var(--clr-dark-3);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:var(--radius-lg);
  padding:1.25rem;
  display:flex;
  align-items:center;
  gap:1rem;
  transition:border-color 0.2s,transform 0.2s;
  position:relative;
  overflow:hidden;
}
.cours-card::before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  background:var(--clr-primary);
  border-radius:3px 0 0 3px;
  opacity:0;
  transition:opacity 0.2s;
}
.cours-card:hover{border-color:rgba(200,147,58,0.3);transform:translateY(-1px)}
.cours-card:hover::before{opacity:1}

.cours-card-icon{
  flex-shrink:0;
  width:48px;height:48px;
  border-radius:12px;
  background:rgba(200,147,58,0.08);
  display:flex;align-items:center;justify-content:center;
}

.cours-card-body{flex:1;min-width:0}
.cours-card-titre{font-size:0.95rem;font-weight:700;color:var(--clr-white);margin-bottom:0.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cours-card-desc{font-size:0.82rem;color:var(--clr-text-sub);line-height:1.5;margin-bottom:0.4rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cours-card-meta{font-size:0.75rem;color:rgba(160,152,136,0.6);display:flex;align-items:center;gap:0.3rem}

.cours-card-btn{
  flex-shrink:0;
  padding:0.5rem 1rem;
  font-size:0.82rem;
  border-radius:8px;
  display:flex;align-items:center;gap:0.4rem;
  white-space:nowrap;
}

.cours-empty-state{
  text-align:center;
  padding:3rem 1.5rem;
  color:var(--clr-text-sub);
}
.cours-empty-state iconify-icon{opacity:0.25;margin-bottom:1rem;display:block}
.cours-empty-state p{font-size:0.9rem;margin-bottom:0.4rem}
.cours-empty-state small{font-size:0.8rem;opacity:0.6}

/* ════════════════════════════════════════════════════════════
   EXERCICES
   ════════════════════════════════════════════════════════════ */
.exercice-liste{display:flex;flex-direction:column;gap:1rem}

.exercice-card{
  background:var(--clr-dark-3);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:var(--radius-lg);
  overflow:hidden;
  transition:border-color 0.2s;
}
.exercice-card:hover{border-color:rgba(200,147,58,0.25)}
.exercice-card.statut-nouveau{border-left:3px solid var(--clr-primary)}
.exercice-card.statut-en-cours{border-left:3px solid #1e88e5}
.exercice-card.statut-soumis{border-left:3px solid #43a047}
.exercice-card.statut-expire{border-left:3px solid #e53935;opacity:0.7}

.exercice-card-header{
  padding:1rem 1.25rem;
  display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;
  cursor:pointer;
}
.exercice-card-title{font-size:0.95rem;font-weight:700;color:var(--clr-white);margin-bottom:0.25rem}
.exercice-card-meta{font-size:0.78rem;color:var(--clr-text-sub)}

.exercice-card-body{
  padding:0 1.25rem 1.25rem;
  border-top:1px solid rgba(255,255,255,0.05);
  display:none;
}
.exercice-card.ouvert .exercice-card-body{display:block}

.exercice-enonce{
  background:rgba(200,147,58,0.04);
  border:1px solid rgba(200,147,58,0.12);
  border-radius:var(--radius);
  padding:1rem;
  font-size:0.9rem;
  color:var(--clr-white);
  line-height:1.7;
  margin:1rem 0;
  white-space:pre-wrap;
}

/* Timer compte à rebours */
.exercice-timer{
  display:flex;align-items:center;gap:0.5rem;
  padding:0.6rem 1rem;
  background:rgba(229,57,53,0.08);
  border:1px solid rgba(229,57,53,0.2);
  border-radius:var(--radius);
  margin-bottom:1rem;
  font-size:0.88rem;
  color:#e53935;
  font-weight:600;
}
.exercice-timer.timer-ok{background:rgba(30,136,229,0.08);border-color:rgba(30,136,229,0.2);color:#1e88e5}
.exercice-timer.timer-warning{background:rgba(245,124,0,0.08);border-color:rgba(245,124,0,0.2);color:#f57c00}
.exercice-timer-value{font-size:1.1rem;font-family:monospace;letter-spacing:0.05em}

/* Champ réponse */
.exercice-reponse-wrap{margin-top:1rem}
.exercice-reponse-wrap label{display:block;font-size:0.82rem;color:var(--clr-text-sub);margin-bottom:0.5rem;font-weight:600;text-transform:uppercase;letter-spacing:0.05em}
.exercice-reponse{
  width:100%;
  min-height:120px;
  background:var(--clr-dark-4);
  border:1px solid var(--clr-border);
  border-radius:var(--radius);
  padding:0.875rem;
  color:var(--clr-white);
  font-size:0.9rem;
  line-height:1.6;
  resize:vertical;
  transition:border-color 0.2s;
  font-family:var(--ff-body);
}
.exercice-reponse:focus{outline:none;border-color:var(--clr-primary)}
.exercice-reponse:disabled{opacity:0.5;cursor:not-allowed;resize:none}

.exercice-reponse-soumise{
  background:rgba(67,160,71,0.06);
  border:1px solid rgba(67,160,71,0.2);
  border-radius:var(--radius);
  padding:1rem;
  font-size:0.9rem;
  color:var(--clr-white);
  line-height:1.6;
  white-space:pre-wrap;
  margin-top:0.75rem;
}

.exercice-actions{display:flex;gap:0.75rem;margin-top:1rem;flex-wrap:wrap}
.exercice-actions .btn{flex:1;justify-content:center;min-width:120px}

/* Badge statut exercice */
.badge-statut-nouveau{background:rgba(200,147,58,0.15);color:var(--clr-primary);padding:0.2rem 0.7rem;border-radius:20px;font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;white-space:nowrap}
.badge-statut-en-cours{background:rgba(30,136,229,0.15);color:#1e88e5;padding:0.2rem 0.7rem;border-radius:20px;font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;white-space:nowrap}
.badge-statut-soumis{background:rgba(67,160,71,0.15);color:#43a047;padding:0.2rem 0.7rem;border-radius:20px;font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;white-space:nowrap}
.badge-statut-expire{background:rgba(229,57,53,0.15);color:#e53935;padding:0.2rem 0.7rem;border-radius:20px;font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;white-space:nowrap}

/* ════════════════════════════════════════════════════════════
   ÉVALUATION
   ════════════════════════════════════════════════════════════ */
.eval-header-block{
  background:linear-gradient(135deg,rgba(200,147,58,0.08) 0%,rgba(200,147,58,0.02) 100%);
  border:1px solid rgba(200,147,58,0.15);
  border-radius:var(--radius-lg);
  padding:1.5rem;
  margin-bottom:1.5rem;
  display:flex;align-items:center;gap:1.25rem;
  flex-wrap:wrap;
}

/* Badge niveau / mention */
.eval-niveau{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:80px;height:80px;border-radius:50%;flex-shrink:0;
  border:3px solid var(--clr-primary);
  background:rgba(200,147,58,0.1);
}
.eval-niveau-label{font-size:0.65rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--clr-text-sub);margin-top:0.2rem}
.eval-niveau-icone{font-size:1.8rem;line-height:1}

.eval-info{flex:1;min-width:0}
.eval-info h3{font-size:1.1rem;font-weight:700;color:var(--clr-white);margin-bottom:0.3rem}
.eval-info p{font-size:0.85rem;color:var(--clr-text-sub)}
.eval-note-globale{font-size:2rem;font-weight:800;color:var(--clr-primary);line-height:1}
.eval-note-globale small{font-size:0.9rem;color:var(--clr-text-sub);font-weight:400}

/* Étapes progression */
.eval-etapes{display:flex;flex-direction:column;gap:0.75rem;margin-bottom:1.5rem}

.eval-etape{
  background:var(--clr-dark-3);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:var(--radius);
  padding:1rem 1.25rem;
  display:flex;align-items:center;gap:1rem;
  position:relative;
}
.eval-etape.active{border-color:rgba(200,147,58,0.3);background:rgba(200,147,58,0.05)}
.eval-etape.validee{border-color:rgba(67,160,71,0.3);background:rgba(67,160,71,0.04)}
.eval-etape.locked{opacity:0.45}

.eval-etape-num{
  width:36px;height:36px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:0.85rem;font-weight:700;
  background:var(--clr-dark-4);
  color:var(--clr-text-sub);
  border:2px solid rgba(255,255,255,0.08);
}
.eval-etape.active .eval-etape-num{background:rgba(200,147,58,0.2);color:var(--clr-primary);border-color:var(--clr-primary)}
.eval-etape.validee .eval-etape-num{background:rgba(67,160,71,0.2);color:#43a047;border-color:#43a047}

.eval-etape-info{flex:1;min-width:0}
.eval-etape-titre{font-size:0.9rem;font-weight:700;color:var(--clr-white);margin-bottom:0.15rem}
.eval-etape-desc{font-size:0.78rem;color:var(--clr-text-sub)}

.eval-etape-note{
  font-size:1.1rem;font-weight:800;
  color:var(--clr-white);
  white-space:nowrap;
  text-align:right;
  min-width:60px;
}
.eval-etape-note small{font-size:0.72rem;color:var(--clr-text-sub);font-weight:400}
.eval-etape.validee .eval-etape-note{color:#43a047}

/* Barre progression étape */
.eval-etape-bar{
  position:absolute;bottom:0;left:0;right:0;height:2px;
  background:rgba(255,255,255,0.04);border-radius:0 0 var(--radius) var(--radius);
  overflow:hidden;
}
.eval-etape-bar-fill{height:100%;background:var(--clr-primary);transition:width 0.6s ease}
.eval-etape.validee .eval-etape-bar-fill{background:#43a047}

/* Badges mention */
.mention-debutant{background:rgba(120,144,156,0.15);color:#90a4ae;border:1px solid rgba(120,144,156,0.25);padding:0.35rem 0.875rem;border-radius:20px;font-size:0.8rem;font-weight:700}
.mention-intermediaire{background:rgba(30,136,229,0.12);color:#1e88e5;border:1px solid rgba(30,136,229,0.25);padding:0.35rem 0.875rem;border-radius:20px;font-size:0.8rem;font-weight:700}
.mention-avance{background:rgba(200,147,58,0.12);color:var(--clr-primary);border:1px solid rgba(200,147,58,0.25);padding:0.35rem 0.875rem;border-radius:20px;font-size:0.8rem;font-weight:700}
.mention-certifie{background:linear-gradient(135deg,rgba(67,160,71,0.15),rgba(76,175,80,0.08));color:#43a047;border:1px solid rgba(67,160,71,0.3);padding:0.35rem 0.875rem;border-radius:20px;font-size:0.8rem;font-weight:700;display:inline-flex;align-items:center;gap:0.3rem}

/* ── TABLETTE ≥ 480px ── */
@media(min-width:480px){
  .login-box{padding:2.5rem 2rem}
  .dash-panels{padding:1.25rem}
  .dash-topbar{padding:0 1.25rem}
  .dt-apprenant strong{display:block;font-size:0.85rem;color:var(--clr-white);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .dt-apprenant span{display:block;font-size:0.72rem;color:var(--clr-text-sub)}
  .kpi-grid{gap:1rem}
  .kpi-card{padding:1.25rem}
  .docs-grid{grid-template-columns:repeat(2,1fr)}
  .cours-grid{display:grid;grid-template-columns:repeat(2,1fr)}
}

/* ── TABLETTE ≥ 640px ── */
@media(min-width:640px){
  .dash-topbar{height:60px;padding:0 1.5rem}
  .dt-widgets{top:60px}
  .panel-header h2{font-size:1.5rem}
  .dash-panels{padding:1.5rem}
  .ps-tranches{flex-direction:row}
  .ps-tranche{flex:1;flex-direction:column;align-items:flex-start;gap:0.5rem}
  .ps-tranche-amount{font-size:1rem}
  .paiements-summary{grid-template-columns:repeat(3,1fr)}
  .next-action-block{flex-direction:row;align-items:center}
  .next-action-block .btn{width:auto;white-space:nowrap}
  .eval-header-block{flex-wrap:nowrap}
}

/* ── DESKTOP ≥ 901px ── */
@media(min-width:901px){
  /* Sidebar fixe — hamburger inutile */
  .ds-toggle{display:none !important}

  .dashboard{display:grid;grid-template-columns:260px 1fr}
  .dash-sidebar{position:sticky;top:0;transform:none !important;height:100vh}
  body.sidebar-open::before{display:none}
  .dash-main{margin-left:0;width:100%}
  .dash-topbar{height:65px;padding:0 2rem}
  .dt-widgets{top:65px}
  .dash-panels{padding:2rem}
  .kpi-grid{grid-template-columns:repeat(2,1fr);gap:1.25rem}
  .kpi-card{padding:1.5rem}
  .kpi-info strong{font-size:1.05rem}
  .dt-apprenant strong{max-width:none}
  .progress-section{padding:2rem}
  .next-action-block{padding:2rem}
  .ps-tranches{flex-direction:row}
  .ps-tranche{flex:1;flex-direction:column;align-items:flex-start;gap:0.5rem}
  .paiements-summary{grid-template-columns:repeat(3,1fr)}
  .docs-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
  #attestation-status-block{max-width:600px}
  .cours-grid{grid-template-columns:repeat(2,1fr)}
  .eval-etapes{gap:1rem}
}

/* ── LARGE DESKTOP ≥ 1200px ── */
@media(min-width:1200px){
  .kpi-grid{grid-template-columns:repeat(4,1fr)}
  .cours-grid{grid-template-columns:repeat(3,1fr)}
}