/* ═══════════════════════════════════════════════════════════════
   DirectÉcole — améliorations d'ergonomie et de lisibilité
   ─────────────────────────────────────────────────────────────────
   Ce fichier se charge APRÈS styles.css et améliore la lecture sans
   modifier les fonctionnalités. Pour revenir en arrière, il suffit de
   retirer la ligne <link> ajoutée dans index.html.
   ═══════════════════════════════════════════════════════════════ */

/* ─── Plancher de lisibilité : plus aucun texte sous ~13,5 px ─── */
body {
  font-size: 15px; /* base remontée depuis 14px */
}

/* Les libellés étaient en 12px : on les remonte */
.brand span,
.sidebar-footer span,
.eyebrow,
.login-demo-accounts p,
.panel-header p,
.metric span,
.metric em,
.field span,
.credential-foot,
.empty-inline,
.repartition-read-cell,
.pastel-material span,
.knowledge-rights > span,
.code-identifier,
.data-table th,
.calendar .time,
.event-pill,
.month-cell strong,
.month-cell span {
  font-size: 13.5px;
}

/* Les plus petits (11px) : on les remonte davantage */
.status,
.audience-badge,
.annual-distribution-table th span,
.annual-origin-cell,
.occupancy-table td span,
.service-person,
.service-note {
  font-size: 13px;
}

/* ─── Zones cliquables plus confortables (surtout au doigt) ─── */
.nav-item {
  min-height: 44px;
}

.primary-button,
.secondary-button,
.icon-button {
  min-height: 40px;
}

/* ─── Confort de lecture sur très grands écrans ───
   Le contenu occupait toute la largeur : sur un grand moniteur,
   les lignes devenaient trop longues. On plafonne la zone de travail
   tout en la gardant pleine largeur sur écrans normaux. */
@media (min-width: 1600px) {
  body {
    font-size: 16px;
  }
  .workspace {
    max-width: 1500px;
  }
}

/* ─── Message de succès (ex. mot de passe mis à jour) ─── */
.login-success {
  border-radius: var(--radius-sm);
  background: #e7f6ec;
  color: var(--green);
  padding: 9px 11px;
  font-weight: 800;
}

/* ─── Palier intermédiaire tablette (l'appli n'en avait pas) ─── */
@media (min-width: 981px) and (max-width: 1200px) {
  .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}