/* ============================================================================
   ARDALOS FORMATION — Portail Évaluations
   Calque additif au-dessus de la feuille de style COPIÉE de l'espace stagiaire
   du CRM (ardalos-portail.css). On n'y touche pas : on ajoute seulement
   (1) l'écran de connexion par code, (2) le comportement mobile de la sidebar.
   Mêmes jetons de marque : navy #0c1730 · or #C9A84C · crème #f6f3ea.
   ========================================================================= */

/* DÉFAUT CORRIGÉ (recette visuelle du 15/09) : `.auth-wrap{display:flex}` et
   `.stg-app{display:grid}` l'emportaient sur le `display:none` implicite de
   l'attribut [hidden] — l'écran de connexion restait donc posé, invisible mais
   cliquable, par-dessus l'espace et interceptait tous les clics de la sidebar. */
[hidden]{ display:none !important; }

/* ---------------------------------------------------------------- écran de connexion */
.auth-wrap{
  position:fixed; inset:0; z-index:9000; overflow:auto;
  display:flex; align-items:center; justify-content:center; padding:28px 18px;
  background:radial-gradient(1200px 620px at 50% -10%, #16255180, transparent 70%),
             linear-gradient(180deg,var(--navy),var(--navy-2));
}
.auth-card{
  width:100%; max-width:430px; background:#fff; border-radius:22px; padding:34px 30px 30px;
  box-shadow:0 30px 80px rgba(4,10,28,.5); animation:authIn .3s ease;
}
@keyframes authIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.auth-brand{display:flex;align-items:center;gap:13px;margin-bottom:26px;}
.auth-brand .em{
  width:54px;height:54px;border-radius:50%;flex:none;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(circle at 50% 35%,#fbf8ef,#efe7cf);border:2px solid var(--gold);
}
.auth-brand .em img{width:100%;height:100%;object-fit:contain;padding:4px;}
.auth-brand b{font-family:'Playfair Display',serif;font-size:21px;color:var(--navy);line-height:1;display:block;}
.auth-brand small{font-size:10px;letter-spacing:.2em;color:var(--gold-2);font-weight:700;text-transform:uppercase;}
.auth-card h1{font-family:'Playfair Display',serif;font-size:26px;color:var(--navy);margin:0 0 8px;font-weight:700;}
.auth-card .lede{color:var(--muted);font-size:14.5px;line-height:1.6;margin:0 0 24px;}
.auth-card .lede b{color:var(--ink);}
.auth-lab{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--gold-2);margin:0 0 8px;}
.auth-inp{
  width:100%;box-sizing:border-box;border:1.5px solid var(--line);border-radius:13px;
  padding:15px 16px;font:500 16px/1.3 'DM Sans',system-ui,sans-serif;color:var(--ink);
  background:#fff;outline:none;transition:border-color .16s,box-shadow .16s;
}
.auth-inp:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(201,168,76,.16);}
.auth-inp.code{
  text-align:center;font-family:'DM Sans',system-ui,monospace;font-size:30px;font-weight:700;
  letter-spacing:.42em;text-indent:.42em;padding:16px 10px;color:var(--navy);
}
.auth-btn{
  width:100%;margin-top:18px;border:0;border-radius:13px;padding:16px;cursor:pointer;
  font:700 14.5px/1 'DM Sans',system-ui,sans-serif;background:var(--navy);color:#fff;transition:.16s;
}
.auth-btn:hover:not(:disabled){background:#15234a;transform:translateY(-1px);}
.auth-btn:disabled{opacity:.55;cursor:default;transform:none;}
.auth-links{display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:center;margin-top:20px;}
.auth-link{
  border:0;background:none;padding:4px 0;cursor:pointer;color:var(--ard-blue);
  font:600 13.5px/1.4 'DM Sans',system-ui,sans-serif;text-decoration:underline;text-underline-offset:3px;
}
.auth-link:disabled{color:var(--muted);cursor:default;text-decoration:none;}
.auth-msg{margin-top:16px;border-radius:12px;padding:12px 14px;font-size:13.5px;line-height:1.55;display:none;}
.auth-msg.show{display:block;}
.auth-msg.err{background:#fdeeec;color:#a3291c;border:1px solid #f5cfc9;}
.auth-msg.ok{background:#eaf6f0;color:#136b41;border:1px solid #c9e6d8;}
.auth-msg.info{background:#eef2fb;color:#1c3b7a;border:1px solid #d3ddf3;}
.auth-foot{margin-top:24px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:11.5px;line-height:1.6;text-align:center;}
.auth-step{display:none;}
.auth-step.on{display:block;}

/* ------------------------------------------------------------------ vue Évaluations */
#vueEvaluations .bloc-titre{font-family:'Playfair Display',serif;font-size:24px;color:var(--navy);margin:34px 0 4px;}
#vueEvaluations .bloc-sous{color:var(--muted);font-size:13.5px;margin:0 0 16px;}
#stgQcmHost{margin-top:4px;}
#stgSatisfactionHost{margin-top:8px;}

/* --------------------------------------------------------------- profil / à propos */
.fiche{display:grid;grid-template-columns:150px 1fr;gap:12px 18px;}
.fiche dt{color:var(--muted);font-size:13px;padding-top:2px;}
.fiche dd{margin:0;color:var(--ink);font-size:15px;font-weight:600;word-break:break-word;}
@media(max-width:560px){ .fiche{grid-template-columns:1fr;gap:2px 0;} .fiche dd{margin-bottom:12px;} }

/* --------------------------------------------------------------------- MOBILE FIRST */
.stg-burger{
  display:none;border:0;background:none;padding:8px;margin:-8px 4px -8px -8px;cursor:pointer;
  color:var(--navy);border-radius:10px;
}
.stg-burger svg{width:24px;height:24px;display:block;}
.stg-voile{
  position:fixed;inset:0;background:rgba(8,16,40,.55);z-index:58;opacity:0;pointer-events:none;
  transition:opacity .22s;
}
body.menu-ouvert .stg-voile{opacity:1;pointer-events:auto;}

@media(max-width:900px){
  .stg-app{grid-template-columns:1fr;}
  .stg-burger{display:inline-flex;}
  .stg-side{
    position:fixed;top:0;left:0;bottom:0;width:272px;z-index:60;height:100dvh;
    transform:translateX(-102%);transition:transform .24s cubic-bezier(.2,.6,.2,1);
    box-shadow:0 0 50px rgba(0,0,0,.4);
  }
  body.menu-ouvert .stg-side{transform:none;}
  .stg-top{padding:14px 16px;gap:10px;}
  .stg-top h1{font-size:19px;}
  .stg-chip{padding:5px 12px 5px 5px;}
  .stg-chip .av{width:28px;height:28px;font-size:11.5px;}
  .stg-chip span{font-size:12.5px;max-width:34vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .stg-content{padding:20px 16px 56px;}
  .stg-hero{padding:26px 22px;border-radius:18px;}
  .stg-hero h2{font-size:28px;}
  .stg-stats{gap:26px;}
  .stg-card{padding:20px 18px;border-radius:16px;}
  .stg-next{flex-direction:column;gap:14px;}
  .stg-btn{width:100%;justify-content:center;}
  #stgQcmHost .sq-deck{padding:22px 18px !important;}
  #stgQcmHost .sq-title{font-size:21px !important;}
  #stgQcmHost .sq-qt{font-size:18.5px !important;}
  #stgQcmHost .sq-opt{font-size:15px !important;padding:15px 16px !important;}
  #stgQcmHost .sq-nav{flex-direction:column-reverse;gap:10px !important;}
  #stgQcmHost .sq-nav .sq-btn{width:100%;}
  #stgQcmHost .sq-idgrid{grid-template-columns:1fr !important;}
}
@media(max-width:420px){
  .auth-card{padding:26px 20px 24px;border-radius:18px;}
  .auth-inp.code{font-size:25px;letter-spacing:.3em;text-indent:.3em;}
}

/* Confort tactile : toutes les cibles cliquables ≥ 44 px, pas de zoom iOS. */
@media(max-width:900px){
  .stg-item{padding:14px;}
  input,select,textarea{font-size:16px !important;}
}

/* ------------------------------------------------------------------------- toast */
#stgToast{
  position:fixed;left:50%;bottom:26px;transform:translate(-50%,16px);z-index:9500;
  background:var(--navy);color:#fff;border-radius:13px;padding:13px 20px;
  font:600 13.5px/1.45 'DM Sans',system-ui,sans-serif;max-width:min(520px,92vw);
  box-shadow:0 16px 40px rgba(8,16,40,.4);opacity:0;pointer-events:none;transition:.22s;
}
#stgToast.show{opacity:1;transform:translate(-50%,0);}

/* ------------------------------------------------------------- écran de chargement */
.boot{position:fixed;inset:0;z-index:8000;display:flex;align-items:center;justify-content:center;
  background:var(--cream);color:var(--muted);font:500 14px/1.5 'DM Sans',system-ui,sans-serif;}
.boot .sp{width:26px;height:26px;border-radius:50%;border:3px solid #e4dcc6;border-top-color:var(--gold);
  animation:spin .8s linear infinite;margin-right:12px;}
@keyframes spin{to{transform:rotate(360deg)}}

/* --------------------------------------------------- correctifs recette 15/09 */
/* La carte profil de la sidebar empile deux lignes : sans display:block, le nom
   et le role se collaient ("RECETTESTAGIAIRE"). */
.stg-pf .nm, .stg-pf .rl{ display:block; }
.stg-pf > span:last-child{ min-width:0; }
.stg-pf .nm{ line-height:1.25; }

/* Pendant une evaluation en cours, la carte « Questionnaire de satisfaction »
   passe derriere : une seule chose a faire a l'ecran. */
#stgQcmHost:has(.sq-nav) ~ #stgSatisfactionHost{ display:none; }

/* --- En-tête mobile : le titre et la pastille ne doivent jamais se chevaucher.
   Un nom long (« Camille RECETTE-SEPT ») passait sur deux lignes et recouvrait
   le titre de la page. Le titre se réduit, la pastille reste sur une ligne. -- */
.stg-top h1{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stg-chip{ flex:none; max-width:56vw; }
.stg-chip #chipNom{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:820px){
  .stg-top h1{ flex:1 1 auto; }
  .stg-chip #chipNom{ max-width:38vw; font-size:12.5px; }
}