/* ==========================================================
FITZUNIVERSE — SUIVI DES CANDIDATURES
========================================================== */

/* Compact sub-heading (pas un second hero) — le topbar affiche déjà
le titre de page (<h1> "Mes candidatures"), ce bloc ne sert plus qu'à
donner une ligne de contexte immédiate, à l'échelle --fs-h4 comme
.section-heading de dashboard.css plutôt qu'à l'échelle marketing
--fs-h2 d'avant. */
/* Le stepper vient de css/app-shell.css. Seule différence ici : il est
suivi de la checklist, donc il lui faut une respiration en dessous.
Sur le tableau de bord il termine sa carte et n'en a pas besoin. */
.application-journey{margin-bottom:14px;}

.apps-intro{
margin-bottom:18px;
}

.apps-intro p a{
font-weight:700;
color:var(--accent-color);
}

/* ---------- Stats ---------- */

.apps-stats{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
margin-bottom:28px;
}

/* Icône + hover-lift alignés sur .stat-card de dashboard.css — avant
ce correctif ces 3 blocs étaient de simples pavés de texte, sans le
chip d'icône ni le survol que porte chaque autre carte du tableau
de bord (incohérence relevée à l'audit Design System 2.0). */
.apps-stat{
display:flex;
align-items:center;
gap:16px;
background:var(--background-alt);
border:1px solid var(--border-color);
border-radius:var(--radius-lg);
padding:20px 22px;
box-shadow:var(--shadow-sm);
transition:var(--transition);
}

.apps-stat:hover{
transform:translateY(-8px);
box-shadow:var(--shadow-lg);
}

/* Pastille supprimée le 2026-08-22 — règle « Icônes » de
DESIGN_SYSTEM.md : aucun conteneur derrière une icône. L'icône
porte elle-même la couleur, et cette couleur signifie quelque
chose. Le fond, la taille fixe et le rayon ont été retirés ;
la mise en page (flex, marges) reste. */
.apps-stat-icon i,
.apps-stat-icon svg{ width:22px; height:22px; }

/* Variante « urgent » : c'était un FOND ambre sur la pastille, qui
survivait à la suppression de celle-ci et redonnait un carré coloré
à cette seule statistique. C'est l'ICÔNE qui porte l'alerte
maintenant — --warning-700, la seule valeur de cette famille lisible
sur fond clair (--warning n'y tient que 2,07:1). */
.apps-stat-urgent .apps-stat-icon{
color:var(--warning-700);
}

.apps-stat-body{
min-width:0;
display:flex;
flex-direction:column;
}

.apps-stat strong{
display:block;
font-family:var(--font-display);
font-size:var(--fs-stat);
font-weight:var(--fw-extrabold);
font-variant-numeric:tabular-nums;
color:var(--text-color);
margin-bottom:4px;
}

.apps-stat span{
font-size:var(--fs-small);
color:var(--text-muted);
}

.apps-stat-urgent strong{color:var(--warning);}

@media(max-width:768px){
.apps-stats{grid-template-columns:1fr;}
}

/* ---------- Toolbar ---------- */

/* Ni display, ni gap : la ligne d'état de Fitz (#fitzChoixEtat, bloc,
   sans marge) et le bouton « J'accepte les choix de Fitz » sont visibles
   EN MÊME TEMPS dès que Fitz a rempli deux places — c'est-à-dire le cas
   normal — et se touchaient. */
.apps-toolbar{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:12px;
margin-bottom:24px;
}

/* ---------- Empty state ---------- */

.apps-empty{
text-align:center;
padding:64px 24px;
border:1px dashed var(--border-color);
border-radius:var(--radius-lg);
}

.apps-empty-icon i,
.apps-empty-icon svg{ width:34px; height:34px; }

/* Pastille supprimée le 2026-08-22 — règle « Icônes » de
DESIGN_SYSTEM.md : aucun conteneur derrière une icône. L'icône
porte elle-même la couleur, et cette couleur signifie quelque
chose. Le fond, la taille fixe et le rayon ont été retirés ;
la mise en page (flex, marges) reste. */
.apps-empty-icon{
margin:0 auto 18px;
color:var(--amber-700);
display:flex;
align-items:center;
justify-content:center;
}

.apps-empty h3{
font-family:var(--font-display);
font-weight:600;
font-size:var(--fs-h4);
color:var(--text-color);
margin-bottom:8px;
}

.apps-empty p{
font-size:var(--fs-small);
color:var(--text-muted);
max-width:420px;
margin:0 auto;
}

/* ---------- List / cards ---------- */

.apps-list{
display:flex;
flex-direction:column;
gap:14px;
}

.app-card{
background:var(--background-alt);
border:1px solid var(--border-color);
border-radius:var(--radius-lg);
padding:22px 24px;
box-shadow:var(--shadow-sm);
transition:var(--transition);
}

.app-card:hover{
transform:translateY(-8px);
box-shadow:var(--shadow-lg);
}

.app-card-urgent{
border-color:rgba(234,168,61,.4);
}

.app-card-top{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:16px;
margin-bottom:12px;
}

.app-card-scholarship{
font-size:var(--fs-small);
color:var(--text-muted);
margin-top:2px;
}

/* Créneau pré-rempli par la recommandation de Fitz (voir
applications.js:seedRecommendedSlots) — dégradé --gradient-fitz déjà
réservé à tout ce qui vient de Fitz (avatar, halo, badges), jamais
réutilisé ailleurs sur le site pour rester immédiatement identifiable.
--gradient-fitz est ambre depuis le 2026-08-27 (voir css/base.css) :
libellé en --primary-900, pas en blanc — même règle que --amber-500
en fond de bouton (2,16:1 en blanc contre 8,24:1 en --primary-900,
voir la note sur l'échelle ambre dans css/base.css). */
.app-recommendation-badge{
display:inline-flex;
align-items:center;
gap:5px;
padding:4px 10px;
border-radius:var(--radius-full);
margin-bottom:6px;
font-size:var(--fs-caption);
font-weight:700;
color:var(--primary-900);
background:var(--gradient-fitz);
}

.app-recommendation-badge i{width:12px;height:12px;}

/* Lot A (2026-09-07) : la pastille de parcours (« Bourse » /
« Préinscription ») vit à côté du statut. Gris neutre des pastilles
existantes, jamais une couleur d'alerte : un parcours n'est pas une
alerte. Le groupe passe à la ligne à 375px au lieu de déborder. */
.app-card-pills{
display:flex;
flex-wrap:wrap;
justify-content:flex-end;
gap:6px;
flex:0 1 auto;
}

.app-track-pill{
flex:0 0 auto;
padding:5px 12px;
border-radius:var(--radius-full);
font-size:var(--fs-caption);
font-weight:600;
white-space:nowrap;
background:var(--background-soft);
color:var(--text-light);
border:1px solid var(--border-color);
}

.app-status-pill{
flex:0 0 auto;
padding:5px 12px;
border-radius:var(--radius-full);
font-size:var(--fs-caption);
font-weight:600;
white-space:nowrap;
background:var(--background-soft);
color:var(--text-light);
}

/* Ambre et non violet (2026-08-27) : le texte utilisait déjà
var(--accent-color), donc déjà l'ambre — c'est le fond qui était
resté violet, en décalage avec lui. */
.app-status-deposee{color:var(--accent-color);background:rgba(233,163,25,.14);}
.app-status-en_attente{color:var(--warning);background:rgba(234,168,61,.14);}
.app-status-reponse_recue{color:var(--success);background:rgba(34,197,94,.14);}

/* Issues de réponse (2026-08-30) : l'admission en vert affirmé, la
liste d'attente dans la famille « attente », le refus sobre — un refus
est une information, pas une alarme rouge vif. */
.app-status-admise{color:var(--success);background:rgba(34,197,94,.18);font-weight:700;}
.app-status-liste_attente{color:var(--warning);background:rgba(234,168,61,.14);}
.app-status-refusee{color:#8F3E22;background:rgba(143,62,34,.12);}

.app-card-meta{
display:flex;
flex-wrap:wrap;
gap:16px;
margin-bottom:10px;
}

.app-card-meta span{
display:inline-flex;
align-items:center;
gap:6px;
font-size:var(--fs-small);
color:var(--text-light);
}

.app-card-meta i,
.app-card-meta svg{width:15px;height:15px;flex-shrink:0;}

.app-card-meta .is-urgent{color:var(--warning);font-weight:600;}
.app-card-meta .is-protected{color:var(--success);font-weight:600;}

.app-card-notes{
font-size:var(--fs-small);
color:var(--text-muted);
background:var(--background-soft);
border-radius:var(--radius-sm);
padding:10px 12px;
margin-bottom:14px;
}

.app-card-documents{
display:flex;
align-items:center;
gap:8px;
flex-wrap:wrap;
font-size:var(--fs-small);
color:var(--text-light);
background:var(--background-light);
border-radius:var(--radius-sm);
padding:10px 12px;
margin-bottom:14px;
}

.app-card-documents i,
.app-card-documents svg{width:15px;height:15px;color:var(--accent-color);flex-shrink:0;}

.app-doc-link{
margin-left:auto;
font-weight:700;
color:var(--accent-color);
}

.app-card-actions{
display:flex;
flex-wrap:wrap;
gap:10px;
}

/* ---------- Compact button variants ---------- */

.btn-sm{
padding:8px 14px;
font-size:var(--fs-small);
border-radius:var(--radius-sm);
}

.btn-ghost{
background:transparent;
border:1px solid var(--border-color);
color:var(--text-light);
}

.btn-ghost:hover{
background:var(--background-soft);
color:var(--text-color);
}

/* ---------- Dossier de candidature (checklist) ---------- */

.app-checklist{
border-radius:var(--radius-sm);
border:1px solid var(--border-color);
margin-bottom:14px;
overflow:hidden;
}

.app-checklist-toggle{
width:100%;
display:flex;
align-items:center;
gap:10px;
padding:10px 12px;
background:var(--background-soft);
border:none;
cursor:pointer;
font-size:var(--fs-small);
font-weight:600;
color:var(--text-color);
text-align:left;
}

.app-checklist-toggle > span:first-child{
display:inline-flex;
align-items:center;
gap:8px;
}

.app-checklist-toggle i,
.app-checklist-toggle svg{width:15px;height:15px;flex-shrink:0;}

.app-checklist-score{
margin-left:auto;
font-size:var(--fs-caption);
font-weight:700;
/* var(--accent-600) est pensé pour du texte sur fond clair (voir le
correctif universities.css) — sur ce fond sombre de tableau de bord,
il tombe sous l'AA. var(--accent-color) (plus clair) tient ~4,7:1 ici. */
color:var(--accent-color);
}

.app-checklist-score.is-empty{
color:var(--text-muted);
font-weight:600;
}

.app-checklist-chevron{
transition:transform .2s ease;
}

.app-checklist.is-open .app-checklist-chevron{
transform:rotate(180deg);
}

.checklist-groups{
padding:14px 12px;
display:flex;
flex-direction:column;
gap:16px;
}

.checklist-group-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
margin-bottom:8px;
flex-wrap:wrap;
}

.checklist-group-head > span{
display:inline-flex;
align-items:center;
gap:6px;
font-size:var(--fs-small);
font-weight:700;
color:var(--text-color);
}

.checklist-group-head i,
.checklist-group-head svg{width:15px;height:15px;color:var(--accent-600);flex-shrink:0;}

.checklist-add-btn{
display:inline-flex;
align-items:center;
gap:5px;
background:transparent;
border:1px dashed var(--border-color);
border-radius:var(--radius-full);
padding:5px 12px;
font-size:var(--fs-caption);
font-weight:600;
color:var(--text-light);
cursor:pointer;
}

.checklist-add-btn:hover{border-color:var(--accent-600);color:var(--accent-600);}

.checklist-add-btn i,
.checklist-add-btn svg{width:13px;height:13px;}

.checklist-group-empty{
font-size:var(--fs-small);
color:var(--text-muted);
}

.checklist-items{
display:flex;
flex-direction:column;
gap:8px;
}

.checklist-item{
display:flex;
align-items:flex-start;
gap:10px;
background:var(--background-soft);
border-radius:var(--radius-sm);
padding:10px 12px;
}

.checklist-item-body{
flex:1 1 auto;
min-width:0;
display:flex;
flex-direction:column;
gap:3px;
}

.checklist-item-body strong{
font-size:var(--fs-small);
color:var(--text-color);
}

.checklist-item-meta{
font-size:var(--fs-caption);
color:var(--text-muted);
}

.checklist-calibration{
display:inline-flex;
align-items:center;
gap:5px;
font-size:var(--fs-caption);
font-weight:700;
}

.checklist-calibration i,
.checklist-calibration svg{width:13px;height:13px;flex-shrink:0;}

.checklist-calibration.is-ok{color:var(--success);}
.checklist-calibration.is-warning{color:var(--warning);}

.checklist-status-chip{
flex-shrink:0;
white-space:nowrap;
border:none;
border-radius:var(--radius-full);
padding:5px 12px;
font-size:var(--fs-caption);
font-weight:700;
cursor:pointer;
background:var(--background-alt);
color:var(--text-light);
}

.checklist-status-en_cours{color:var(--warning);background:rgba(234,168,61,.14);}
.checklist-status-complete{color:var(--success);background:rgba(34,197,94,.14);}

.checklist-item-remove{
flex-shrink:0;
width:24px;
height:24px;
display:flex;
align-items:center;
justify-content:center;
border:none;
background:transparent;
color:var(--text-muted);
cursor:pointer;
border-radius:var(--radius-sm);
}

.checklist-item-remove:hover{background:var(--background-alt);color:var(--danger);}
.checklist-item-remove i,
.checklist-item-remove svg{width:14px;height:14px;}

.checklist-guide-link{
display:inline-flex;
align-items:center;
gap:6px;
margin-top:8px;
background:transparent;
border:none;
padding:0;
font-size:var(--fs-caption);
font-weight:700;
/* var(--accent-600)/var(--accent-color) tombent sous l'AA (~3,3-3,6:1)
sur les fonds de carte du tableau de bord — var(--text-light) tient
largement l'AA (7,6/7,2/6,9:1, voir css/base.css) ; l'icône reste
accentuée pour la touche de couleur, elle n'a pas besoin de tenir le
même ratio à côté d'un texte déjà lisible. */
color:var(--text-light);
cursor:pointer;
}

.checklist-guide-link i,
.checklist-guide-link svg{width:13px;height:13px;color:var(--accent-color);}

/* ---------- Guide lettres de recommandation ---------- */

.apps-modal-card-wide{max-width:640px;}

.rec-guide-body h4{
font-family:var(--font-display);
font-size:var(--fs-small);
font-weight:700;
color:var(--text-color);
margin:18px 0 8px;
}

.rec-guide-body h4:first-child{margin-top:0;}

.rec-guide-list{
display:flex;
flex-direction:column;
gap:8px;
padding-left:18px;
list-style:disc;
}

.rec-guide-list li{
font-size:var(--fs-small);
line-height:1.55;
color:var(--text-light);
}

.rec-guide-template{
width:100%;
font-family:var(--font-body);
font-size:var(--fs-small);
line-height:1.6;
padding:14px;
border-radius:var(--radius-sm);
border:1px solid var(--border-color);
background:var(--background-soft);
color:var(--text-color);
resize:vertical;
margin-bottom:10px;
}

/* ---------- Modal ---------- */

.apps-modal[hidden]{display:none;}

.apps-modal-card{
width:100%;
/* 480 -> 560px (2026-09-02) : le sélecteur catalogue a besoin de
respirer — nom d'université + pays/bourse + échéance sur une carte. */
max-width:560px;
max-height:90vh;
overflow-y:auto;
/* Panneau verre — seule surface glass de la page, la modale flotte
au-dessus du fond assombri (.apps-modal) ; les .app-card de la liste
restent plates (règle "avec parcimonie"). */
background:var(--glass);
border:1px solid var(--glass-border);
backdrop-filter:blur(16px);
-webkit-backdrop-filter:blur(16px);
border-radius:var(--radius-lg);
padding:28px;
box-shadow:var(--shadow-lg);
}

.apps-modal-head{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:20px;
}

.apps-modal-close{
width:32px;
height:32px;
border-radius:var(--radius-sm);
display:flex;
align-items:center;
justify-content:center;
/* --text-muted ne tient que ~3,5:1 sur ce panneau verre posé sur le
fond assombri de .apps-modal — --text-light passe l'AA (~5,1:1). */
color:var(--text-light);
background:transparent;
border:none;
cursor:pointer;
}

.apps-modal-close:hover{background:var(--background-soft);color:var(--text-color);}

.apps-field{
display:flex;
flex-direction:column;
gap:6px;
margin-bottom:16px;
font-size:var(--fs-small);
color:var(--text-light);
}

.apps-field-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:14px;
}

.apps-field input,
.apps-field select,
.apps-field textarea{
font-family:var(--font-body);
font-size:var(--fs-body);
padding:10px 12px;
border-radius:var(--radius-sm);
border:1px solid var(--border-color);
background:var(--background-soft);
color:var(--text-color);
}

.apps-field textarea{resize:vertical;}

/* Note sous le select de parcours quand une bourse du catalogue le
verrouille (lot A). */
.apps-field-note{
font-size:var(--fs-caption);
color:var(--text-muted);
}
.apps-field-note[hidden]{display:none;}

.apps-field input:focus,
.apps-field select:focus,
.apps-field textarea:focus{
outline:none;
border-color:var(--accent-color);
}

.apps-modal-actions{
display:flex;
justify-content:flex-end;
gap:12px;
margin-top:8px;
}

/* ---------- La preuve de dépôt (lot E1) ---------- */

.apps-preuve{
border:1px solid var(--border-color);
border-radius:var(--radius-sm);
background:var(--background-soft);
padding:12px 14px 2px;
margin-bottom:16px;
}

.apps-preuve[hidden]{display:none;}

.apps-preuve-titre{
display:flex;
align-items:center;
gap:8px;
margin:0 0 6px;
font-weight:700;
font-size:var(--fs-small);
color:var(--text-color);
}

.apps-preuve-titre i,
.apps-preuve-titre svg{width:16px;height:16px;color:var(--text-muted);}

.apps-preuve-demande{margin:0 0 12px;}

.apps-preuve-actuelle{
margin:0 0 12px;
font-size:var(--fs-caption);
color:var(--success);
font-weight:600;
}

.apps-preuve .apps-field{margin-bottom:12px;}

.apps-preuve input[type="file"]{padding:8px;font-size:var(--fs-caption);}

#preuveEtat{margin:0 0 10px;}
#preuveEtat.is-ok{color:var(--success);}

/* La ligne sur la carte : « Déposée le … · dossier n° … ». */
.app-card-meta .app-preuve{color:var(--success);font-weight:600;}
.app-card-meta .app-preuve a{color:inherit;text-decoration:underline;}

@media(max-width:600px){
.apps-field-row{grid-template-columns:1fr;}
}

/* ---------- La procédure de portail (lot E2) ---------- */

.app-procedure{
border:1px solid var(--border-color);
border-radius:var(--radius-sm);
background:var(--background-soft);
margin-bottom:14px;
}

.app-procedure > summary{
display:flex;
align-items:center;
gap:8px;
padding:10px 14px;
cursor:pointer;
font-size:var(--fs-small);
font-weight:600;
color:var(--text-color);
list-style:none;
}

.app-procedure > summary::-webkit-details-marker{display:none;}

.app-procedure > summary i,
.app-procedure > summary svg{width:16px;height:16px;color:var(--text-muted);flex-shrink:0;}

.app-procedure-lead{
margin:0 14px 10px;
font-size:var(--fs-caption);
color:var(--text-muted);
line-height:1.5;
}

/* Lot S2-MODÈLE : l'avertissement que l'organisme officiel du pays
   publie lui-même (les intermédiaires privés non accrédités, au Maroc).
   Il vit HORS du <details> : visible sans un clic, non repliable — un
   avertissement qu'il faut déplier n'avertit personne. Ton ambre, pas
   rouge : c'est une mise en garde de la source, pas une erreur de
   l'étudiant. */
.app-procedure-avertissement{
display:flex;
gap:10px;
align-items:flex-start;
margin:0 0 10px;
padding:12px 14px;
border:1px solid color-mix(in srgb, var(--amber-500) 40%, transparent);
border-radius:var(--radius-md);
background:color-mix(in srgb, var(--amber-500) 8%, transparent);
font-size:var(--fs-caption);
line-height:1.55;
color:var(--text-primary);
}

.app-procedure-avertissement i{
flex:none;
width:16px;
height:16px;
margin-top:2px;
color:var(--amber-700);
}

.app-procedure-liste{
list-style:none;
margin:0;
padding:0 14px 12px;
display:flex;
flex-direction:column;
gap:10px;
}

.app-procedure-etape{
border-top:1px solid var(--border-color);
padding-top:10px;
font-size:var(--fs-small);
}

.app-procedure-tete{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:8px;
}

.app-procedure-tete i,
.app-procedure-tete svg{width:16px;height:16px;color:var(--text-muted);flex-shrink:0;}

.app-procedure-etape.is-faite .app-procedure-tete i,
.app-procedure-etape.is-faite .app-procedure-tete svg{color:var(--success);}

.app-procedure-etape.is-prematuree .app-procedure-tete strong{color:var(--text-light);}

.app-procedure-fiabilite{
font-size:var(--fs-caption);
padding:2px 8px;
border-radius:999px;
border:1px solid var(--border-color);
color:var(--text-muted);
}

.app-procedure-fiabilite.is-a_confirmer{border-color:rgba(234,168,61,.5);color:var(--amber-700);}
.app-procedure-fiabilite.is-verifie_source_officielle{border-color:rgba(34,197,94,.35);color:var(--success);}

.app-procedure-consigne{
margin:6px 0 0;
color:var(--text-light);
line-height:1.55;
}

.app-procedure-echeance,
.app-procedure-attente{
display:flex;
align-items:center;
gap:6px;
margin:6px 0 0;
font-size:var(--fs-caption);
color:var(--text-muted);
}

.app-procedure-echeance i,
.app-procedure-echeance svg,
.app-procedure-attente i,
.app-procedure-attente svg{width:14px;height:14px;flex-shrink:0;}

.app-procedure-echeance.is-proche{color:var(--amber-700);font-weight:600;}

.app-procedure-pieces{
margin:6px 0 0;
padding-left:18px;
font-size:var(--fs-caption);
color:var(--text-light);
}

.app-procedure-pieces span{color:var(--text-muted);}

.app-procedure-faire{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:8px 12px;
margin-top:8px;
}

.app-procedure-faire label{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-caption);}

.app-procedure-faire input[type="text"]{
flex:1 1 180px;
min-width:0;
font:inherit;
font-size:var(--fs-caption);
padding:6px 10px;
border:1px solid var(--border-color);
border-radius:var(--radius-sm);
background:var(--surface-color, #fff);
}

.app-procedure-source{
display:inline-block;
margin-top:6px;
font-size:var(--fs-caption);
color:var(--text-muted);
text-decoration:underline;
text-underline-offset:3px;
}

/* ---------- Vérification finale avant dépôt (Fitz) ---------- */

.app-readiness{
border-radius:var(--radius-sm);
border:1px solid var(--border-color);
background:var(--background-soft);
padding:12px 14px;
margin-bottom:14px;
display:flex;
flex-direction:column;
gap:10px;
}

.app-readiness.is-ready{border-color:rgba(34,197,94,.35);}
.app-readiness.is-not-ready{border-color:rgba(234,168,61,.35);}

.app-readiness-verdict{
display:flex;
align-items:center;
gap:8px;
font-size:var(--fs-small);
font-weight:700;
color:var(--text-color);
}

.app-readiness-verdict i,
.app-readiness-verdict svg{width:17px;height:17px;flex-shrink:0;}

.app-readiness.is-ready .app-readiness-verdict i{color:var(--success);}
.app-readiness.is-not-ready .app-readiness-verdict i{color:var(--warning);}

.app-readiness-items{margin:0;}

/* Variante cliquable de .ai-checklist-item (css/ai-suite.css) — même
langage visuel, juste un curseur et un léger hover, pas un nouveau
composant. */
.app-readiness-item{
width:100%;
text-align:left;
cursor:pointer;
transition:var(--transition);
}

.app-readiness-item:hover{border-color:var(--accent-color);color:var(--text-color);}

.app-readiness-meta{
font-size:var(--fs-caption);
color:var(--text-muted);
}

/* color:var(--primary-900) et non blanc depuis le 2026-08-27, comme
.app-recommendation-badge plus haut — --gradient-fitz est ambre. */
.app-readiness-advisor-cta{
display:inline-flex;
align-items:center;
gap:6px;
align-self:flex-start;
font-size:var(--fs-caption);
font-weight:700;
color:var(--primary-900);
background:var(--gradient-fitz);
border-radius:var(--radius-full);
padding:6px 14px;
box-shadow:var(--glow-fitz);
}

.app-readiness-advisor-cta i,
.app-readiness-advisor-cta svg{width:13px;height:13px;}

/* ---------- Parcours guidé (stepper 5 étapes) ---------- */

/* ==========================================================
ETAT DE CHARGEMENT (SKELETON)
==========================================================
Classe CSS prête à l'emploi pour la liste de candidatures pendant
fetchApplications()/loadApplications() (lecture Firestore, voir
applications.js). Pas encore branchée côté JS (hors périmètre de
cette passe couleurs) : à appliquer sur des cartes placeholder
(ex. clones de .app-card sans contenu) pendant le chargement, puis
à retirer une fois applications rendu. */

/* ==========================================================
SÉLECTEUR CATALOGUE (refonte 2026-09-02) — le modal « Nouvelle
candidature » ne fait plus taper l'étudiant : Fitz propose les
universités du catalogue classées par compatibilité, la recherche
couvre tout le catalogue, la sélection remplit le reste. Voir le
commentaire du bloc dans applications.js.
========================================================== */

.sr-only{
position:absolute;
width:1px;height:1px;
padding:0;margin:-1px;
overflow:hidden;
clip:rect(0,0,0,0);
white-space:nowrap;
border:0;
}

.apps-picker-lead{
display:flex;
align-items:flex-start;
gap:10px;
font-size:var(--fs-small);
line-height:1.5;
color:var(--text-color);
background:rgba(233,163,25,.08);
border:1px solid rgba(233,163,25,.28);
border-radius:var(--radius-sm);
padding:10px 12px;
margin-bottom:14px;
}

.apps-picker-lead i,
.apps-picker-lead svg{width:16px;height:16px;color:var(--amber-700);flex-shrink:0;margin-top:2px;}

.apps-picker-searchfield{margin-bottom:10px;}

.apps-picker-list{
display:flex;
flex-direction:column;
gap:8px;
max-height:300px;
overflow-y:auto;
margin-bottom:12px;
}

.apps-picker-label{
font-size:var(--fs-caption);
font-weight:700;
text-transform:uppercase;
letter-spacing:.06em;
color:var(--text-muted);
margin:2px 0 2px;
}

.apps-pick{
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:10px;
width:100%;
text-align:left;
padding:12px 14px;
border:1px solid var(--border-color);
border-radius:var(--radius-sm);
background:var(--background-soft);
cursor:pointer;
transition:border-color .15s ease, background .15s ease;
}

.apps-pick:hover,
.apps-pick:focus-visible{border-color:var(--accent-color);background:#FFFFFF;}

.apps-pick-main{display:flex;flex-direction:column;gap:3px;min-width:0;}

.apps-pick strong{
font-family:var(--font-display);
font-size:var(--fs-small);
font-weight:700;
color:var(--text-color);
}

.apps-pick-meta{font-size:var(--fs-caption);color:var(--text-light);}

/* --amber-700 : la seule valeur ambre admise pour du texte (voir
css/app-shell.css §11) — ici sur fond crème, largement AA en
caption grasse. */
.apps-pick-reason{font-size:var(--fs-caption);font-weight:600;color:var(--amber-700);}

.apps-pick-deadline{
flex-shrink:0;
max-width:132px;
text-align:right;
font-size:var(--fs-caption);
font-weight:600;
color:var(--text-light);
}

.apps-picker-manual{
background:none;
border:none;
padding:0;
margin-bottom:14px;
font-size:var(--fs-caption);
font-weight:700;
color:var(--text-light);
text-decoration:underline;
text-decoration-color:rgba(233,163,25,.45);
text-underline-offset:3px;
cursor:pointer;
}

.apps-picker-manual:hover{color:var(--text-color);text-decoration-color:var(--amber-500);}

.apps-picker-empty{
font-size:var(--fs-small);
line-height:1.5;
color:var(--text-light);
padding:14px;
border:1px dashed var(--border-color);
border-radius:var(--radius-sm);
}

/* Résumé de la sélection — la carte ambrée confirme ce que Fitz a
rempli, avant les détails (statut, date, relances). */

.apps-selection{
border:1px solid rgba(233,163,25,.35);
background:rgba(233,163,25,.07);
border-radius:var(--radius-sm);
padding:14px;
margin-bottom:16px;
}

.apps-selection-head{display:flex;align-items:flex-start;gap:10px;}

.apps-selection-head > i,
.apps-selection-head > svg{width:18px;height:18px;color:var(--amber-700);flex-shrink:0;margin-top:2px;}

.apps-selection-head strong{
display:block;
font-family:var(--font-display);
font-size:var(--fs-small);
font-weight:700;
color:var(--text-color);
}

.apps-selection-head span{font-size:var(--fs-caption);color:var(--text-light);}

.apps-selection-change{
margin-left:auto;
flex-shrink:0;
background:none;
border:none;
padding:0;
font-size:var(--fs-caption);
font-weight:700;
color:var(--text-light);
text-decoration:underline;
text-underline-offset:3px;
cursor:pointer;
}

.apps-selection-change:hover{color:var(--text-color);}

.apps-selection-facts{
list-style:none;
display:flex;
flex-direction:column;
gap:6px;
margin:10px 0 0;
padding:0;
}

.apps-selection-facts li{
display:flex;
align-items:flex-start;
gap:8px;
font-size:var(--fs-caption);
line-height:1.45;
color:var(--text-light);
}

.apps-selection-facts i,
.apps-selection-facts svg{width:13px;height:13px;color:var(--amber-700);flex-shrink:0;margin-top:2px;}

/* Mobile (doctrine regles_mobile) : cartes en colonne, échéance
rapatriée sous le nom — jamais de débordement horizontal. */
@media(max-width:600px){

.apps-pick{flex-direction:column;}

.apps-pick-deadline{max-width:none;text-align:left;}

}

/* Texte libre d'échéance parfois long (« rentrée de printemps —
prochaine échéance ») : borné à 2 lignes, jamais de débordement. */
.apps-pick-deadline{
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
}

/* ==========================================================
   ÉCHÉANCE LUE DANS LE CATALOGUE (passe espace étudiant 1/3, 2026-09-06)
   Une candidature liée à sa fiche affiche l'état que la fiche publie
   (etatCandidature, js/echeance.js) — le ton vient de `etat.ton`, jamais
   d'un calcul local sur la date gelée. Tokens encre chaude / ambre
   uniquement, aucune couleur en dur.
   ========================================================== */
.app-card-meta .app-echeance{
display:inline-flex;
flex-wrap:wrap;
align-items:baseline;
gap:4px 8px;
font-weight:600;
color:var(--text-color);
}
.app-card-meta .app-echeance.is-ouverte{color:var(--success-700);}
.app-card-meta .app-echeance.is-attente{color:var(--amber-700);}
.app-card-meta .app-echeance.is-close{color:var(--text-muted);}
.app-card-meta .app-echeance.is-inconnue{color:var(--text-light);}

.app-echeance-detail,
.app-echeance-verifie,
.app-echeance-votre{
display:block;
width:100%;
font-size:var(--fs-caption);
font-weight:500;
color:var(--text-muted);
}
.app-echeance-votre{color:var(--text-light);font-weight:600;}

/* La divergence : constat + un bouton que l'étudiant clique lui-même.
   Le seul chemin par lequel une date du catalogue atteint sa fiche. */
.app-echeance-alerte{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:8px 14px;
margin:0 0 12px;
padding:10px 14px;
border:1px solid var(--warning-500);
border-radius:var(--radius-sm);
background:var(--warning-50);
font-size:var(--fs-small);
color:var(--text-color);
}
.app-echeance-alerte > i,
.app-echeance-alerte > svg{width:16px;height:16px;flex-shrink:0;color:var(--warning-700);}
.app-echeance-alerte p{margin:0;flex:1 1 240px;}
.app-echeance-alerte .app-echeance-reprendre{
display:inline-flex;
align-items:center;
gap:6px;
padding:6px 12px;
border:1px solid var(--warning-700);
border-radius:var(--radius-xs);
background:transparent;
font-size:var(--fs-caption);
font-weight:700;
color:var(--warning-700);
cursor:pointer;
}
.app-echeance-alerte .app-echeance-reprendre:hover,
.app-echeance-alerte .app-echeance-reprendre:focus-visible{background:var(--warning-500);color:var(--primary-900);}
.app-echeance-alerte .app-echeance-reprendre[disabled]{opacity:.6;cursor:default;}

/* Le sélecteur : une bourse close ou pas encore ouverte le dit sur la
   pastille au lieu d'une « Échéance : … » qui ment. */
.apps-pick-deadline.is-close{color:var(--text-muted);}
.apps-pick-deadline.is-attente{color:var(--amber-700);}
.apps-pick-deadline.is-ouverte{color:var(--success-700);}

/* ==========================================================
   CE QUE LA BOURSE EXIGE (passe espace étudiant 3/3, 2026-09-06)
   ==========================================================
   `exigences` était renseigné sur 99 bourses et lu par personne. Le
   bloc le plus important est le premier : sur 27 bourses, l'étudiant ne
   dépose pas son dossier lui-même. Ton informatif — ce n'est pas une
   mauvaise nouvelle, c'est une démarche différente.
   ========================================================== */
.app-exigences{
display:flex;
flex-direction:column;
gap:12px;
margin:0 0 14px;
}

/* La voie de dépôt : encadré, parce qu'il change la nature de ce que
   l'étudiant doit surveiller. Ambre et non rouge : on informe. */
.app-exigence-voie{
display:flex;
gap:10px;
padding:12px 14px;
border:1px solid var(--amber-500);
border-radius:var(--radius-sm);
background:var(--warning-50);
font-size:var(--fs-small);
color:var(--text-color);
}
.app-exigence-voie > i,
.app-exigence-voie > svg{width:17px;height:17px;flex-shrink:0;color:var(--amber-700);margin-top:1px;}
.app-exigence-voie strong{display:block;margin-bottom:4px;}
.app-exigence-voie p{margin:0;color:var(--text-muted);}
.app-exigence-voie p + p{margin-top:6px;}

.app-exigence-ordre{
display:flex;
align-items:flex-start;
gap:8px;
margin:0;
font-size:var(--fs-small);
color:var(--text-muted);
}
.app-exigence-ordre i,
.app-exigence-ordre svg{width:15px;height:15px;flex-shrink:0;color:var(--amber-700);margin-top:2px;}

/* Conditions et pièces : une liste sobre, jamais des cases à cocher —
   on ne « fait » pas une condition d'éligibilité. */
.app-exigence-liste{
border:1px solid var(--border-color);
border-radius:var(--radius-sm);
padding:12px 14px;
background:var(--background-soft);
}
.app-exigence-titre{
display:block;
margin-bottom:8px;
font-size:var(--fs-caption);
font-weight:700;
letter-spacing:.02em;
text-transform:uppercase;
color:var(--text-light);
}
.app-exigence-liste ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;}
.app-exigence-liste li{font-size:var(--fs-small);color:var(--text-color);}
.app-exigence-liste li strong{display:block;}
.app-exigence-liste li span{color:var(--text-muted);}

/* La suggestion de dossier : SUGGÉRER, JAMAIS ÉCRIRE. Le bouton est le
   seul chemin par lequel une exigence entre dans le dossier. */
.app-exigence-suggestion{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:8px 14px;
margin-bottom:14px;
padding:10px 14px;
border:1px dashed var(--amber-500);
border-radius:var(--radius-sm);
background:var(--background);
font-size:var(--fs-small);
color:var(--text-color);
}
.app-exigence-suggestion > i,
.app-exigence-suggestion > svg{width:16px;height:16px;flex-shrink:0;color:var(--amber-700);}
.app-exigence-suggestion p{margin:0;flex:1 1 220px;}
.app-exigence-ajouter{
display:inline-flex;
align-items:center;
gap:6px;
min-height:36px;
padding:6px 14px;
border:1px solid var(--amber-700);
border-radius:var(--radius-xs);
background:transparent;
font-size:var(--fs-caption);
font-weight:700;
color:var(--amber-700);
cursor:pointer;
}
.app-exigence-ajouter:hover,
.app-exigence-ajouter:focus-visible{background:var(--amber-500);color:var(--primary-900);}
.app-exigence-ajouter[disabled]{opacity:.6;cursor:default;}

/* Le sélecteur : la voie de dépôt, dite avant d'ouvrir un créneau. */
.apps-selection-facts .apps-selection-depot span{font-weight:700;color:var(--amber-700);}

/* ==========================================================
Lot FITZ-CHOISIT (2026-09-11) — c'est Fitz qui choisit
========================================================== */

/* La règle, dite en tête de « Mes candidatures » (espace bourses). */
.fitz-regle{
margin:0 0 18px;
padding:12px 16px;
border-left:3px solid var(--amber-500);
background:var(--background-light);
border-radius:var(--radius-sm);
color:var(--text-muted);
font-size:var(--fs-body-sm, .92rem);
line-height:1.5;
}

/* La ligne d'état qui remplace « Nouvelle candidature ». */
.fitz-choix-etat{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:10px 14px;
padding:12px 16px;
border:1px solid var(--border-color);
border-radius:var(--radius-md);
background:var(--background-alt);
font-weight:600;
color:var(--text-color);
}
.fitz-choix-etat i,
.fitz-choix-etat svg{ width:18px; height:18px; flex-shrink:0; color:var(--amber-600); }
.fitz-choix-etat[data-etat="complet"] i,
.fitz-choix-etat[data-etat="complet"] svg{ color:var(--success-color, #2E7D32); }
.fitz-choix-etat .btn{ margin-left:auto; }

/* Les champs d'identité en lecture seule dans le formulaire. */
.apps-field.is-verrouille input{
background:var(--background-light);
color:var(--text-muted);
cursor:not-allowed;
}
.apps-identite-note{
display:flex;
gap:10px;
align-items:flex-start;
margin:0 0 14px;
padding:10px 12px;
border-radius:var(--radius-sm);
background:var(--background-light);
color:var(--text-muted);
font-size:var(--fs-caption, .85rem);
line-height:1.45;
}
.apps-identite-note i,
.apps-identite-note svg{ width:16px; height:16px; flex-shrink:0; margin-top:2px; }

/* ==========================================================
LOT ACCEPTATION (2026-09-11) — l'étudiant accepte le choix de Fitz.
Le bloc d'acceptation vit sous les notes, avant les outils : bouton
principal « J'accepte cette université », refus restants, proposition
finale, pastille « Acceptée le … », ou bourse fermée par l'organisme.
Mêmes tokens que la ligne d'état (.fitz-choix-etat) : jamais une
couleur d'alerte pour une proposition, l'ambre de Fitz seulement.
========================================================== */
.app-acceptation{
display:flex;
flex-direction:column;
gap:10px;
padding:12px 14px;
border:1px solid var(--border-color);
border-radius:var(--radius-md);
background:var(--background-alt);
}
.app-acceptation p{
display:flex;
align-items:flex-start;
gap:8px;
margin:0;
font-size:var(--fs-body-sm, .92rem);
line-height:1.5;
color:var(--text-color);
}
.app-acceptation p i,
.app-acceptation p svg{ width:16px; height:16px; flex-shrink:0; margin-top:2px; color:var(--amber-600); }
.app-acceptation p a{ font-weight:700; color:var(--accent-color); text-decoration:underline; }
.app-acceptation-actions{ display:flex; flex-wrap:wrap; gap:10px; }
.app-refus-restants{
font-size:var(--fs-caption);
color:var(--text-muted);
font-weight:600;
}
.app-acceptation--acceptee{ padding:0; border:0; background:none; }
.app-acceptee-pill{
display:inline-flex;
align-items:center;
gap:6px;
padding:5px 12px;
border-radius:var(--radius-full);
font-size:var(--fs-caption);
font-weight:700;
color:var(--success-700);
background:color-mix(in srgb, var(--success-700) 12%, transparent);
}
.app-acceptee-pill i,
.app-acceptee-pill svg{ width:14px; height:14px; }
.app-acceptation--fermee p i,
.app-acceptation--fermee p svg{ color:var(--amber-700); }
/* Les outils fermés : une ligne, à leur place, sans lien. */
.app-outils-fermes i,
.app-outils-fermes svg{ color:var(--text-muted); }
.app-outils-fermes span{ color:var(--text-muted); font-weight:600; }
/* Le bouton « J'accepte les N choix de Fitz » suit la ligne d'état. */
#accepterToutBtn{ white-space:nowrap; }
