/* ============ Import de diplômes (spec profil pro 2026-09-23 § 2) — styles .imp-* ============
   Monté dans la section « Vérification et compte » du profil (lanceur .cv-import). Jetons uniquement (aucune
   couleur en dur, lisible dans les deux thèmes) ; mobile d'abord (360 px) ; actions en bas du formulaire. */

.cv-import{display:flex; flex-direction:column; gap:var(--sp-3); min-width:0}
.cv-import-btn{align-self:flex-start; min-height:44px}
.cv-import-hote{min-width:0}

.imp{display:block; min-width:0}
.imp-ecran{
  display:flex; flex-direction:column; gap:var(--sp-3); min-width:0;
  padding:var(--sp-3); border:1px solid var(--line-2); border-radius:var(--r-md); background:var(--surface-3);
}

/* Dépôt : deux déclencheurs (fichier, photo sur écran tactile) portant chacun leur <input type=file>. */
.imp-choix{display:flex; flex-wrap:wrap; gap:var(--sp-2)}
.imp-declencheur{
  position:relative; display:inline-flex; align-items:center; gap:10px; min-height:48px; padding:0 18px;
  border:1px solid var(--accent); border-radius:var(--r-sm); background:var(--surface-2); color:var(--accent);
  font-size:.9rem; font-weight:600; cursor:pointer; flex:1 1 200px; justify-content:center;
}
.imp-declencheur:hover{background:var(--survol-fond)}
.imp-declencheur:focus-within{outline:2px solid var(--accent); outline-offset:2px}
.imp-declencheur-ico{display:inline-flex; width:18px; height:18px}
.imp-declencheur-ico .ico{width:18px; height:18px}
/* Champ fichier invisible mais atteignable au clavier (le <label> fait office de bouton). */
.imp-fichier{position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer}

/* Lecture en cours. */
.imp-fichier-nom{margin:0; font-size:.84rem; color:var(--text-2); overflow-wrap:anywhere}
.imp-barre{width:100%; height:8px; appearance:none; border:0; border-radius:999px; background:var(--surface-2); overflow:hidden}
.imp-barre::-webkit-progress-bar{background:var(--surface-2); border-radius:999px}
.imp-barre::-webkit-progress-value{background:var(--accent); border-radius:999px}
.imp-barre::-moz-progress-bar{background:var(--accent); border-radius:999px}
.imp-statut{margin:0; font-size:.84rem; color:var(--text)}

/* Formulaire « voici ce que j'ai lu ». */
.imp-source{color:var(--text-2)}
.imp-grille{display:grid; grid-template-columns:minmax(0, 1fr); gap:var(--sp-3)}
.imp-grille .auth-input{width:100%; min-width:0}
.imp-alerte{margin:0; padding:9px 12px; font-size:.82rem; line-height:1.45; border-radius:var(--r-sm); border:1px solid var(--line-2)}
.imp-alerte--attention{color:var(--warn); background:var(--warn-bg); border-color:var(--warn-line)}
.imp-alerte--refus{color:var(--crit); background:var(--crit-bg); border-color:var(--crit-line)}
.imp-autre{align-self:flex-start}

.imp-contexte{margin:0; display:flex; flex-direction:column; gap:6px; padding:10px 12px; border-radius:var(--r-sm); background:var(--surface-2)}
.imp-contexte-ligne{display:flex; flex-wrap:wrap; gap:4px 10px; min-width:0}
.imp-contexte dt{font-size:.68rem; color:var(--text-3); letter-spacing:.06em; text-transform:uppercase; min-width:88px}
.imp-contexte dd{margin:0; font-size:.84rem; color:var(--text); overflow-wrap:anywhere; min-width:0}

.imp-detectees{margin:0; padding:10px 12px; border:1px solid var(--line); border-radius:var(--r-sm); min-width:0}
.imp-detectees legend{padding:0 4px; font-size:.7rem; color:var(--text-2); letter-spacing:.05em; text-transform:uppercase}
.imp-detectee{display:flex; align-items:flex-start; gap:10px; min-height:44px; padding:4px 0; font-size:.86rem; line-height:1.45; color:var(--text); cursor:pointer}
.imp-detectee input{flex:none; width:20px; height:20px; margin:1px 0 0; accent-color:var(--accent); cursor:pointer}

.imp-remplace{color:var(--text-2); font-size:.8rem}
.imp-piece{margin:0; font-size:.8rem; line-height:1.45; color:var(--text-3); overflow-wrap:anywhere}
.imp-actions{padding-top:var(--sp-1)}

.imp-fait-liste{margin:0; padding-left:18px; font-size:.86rem; color:var(--text); display:flex; flex-direction:column; gap:4px}

@media (min-width:720px){
  .imp-grille{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .imp-declencheur{flex:0 1 auto}
}
@media (max-width:640px){
  .imp-actions .auth-submit{flex:1 1 auto}
}

/* `hidden` l'emporte sur les display des classes ci-dessus. */
.imp [hidden], .cv-import [hidden], .cv-import-hote[hidden]{display:none !important}