/* app.wia.digital — portail de connexion de la suite Manager. Charte WIA. Révision : 2026-09-28. */
@font-face{font-family:"Poppins";font-weight:500;font-display:swap;src:url(fonts/poppins-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:600 700;font-display:swap;src:url(fonts/poppins-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Nunito";font-weight:400;font-display:swap;src:url(fonts/nunito-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Nunito";font-weight:600 700;font-display:swap;src:url(fonts/nunito-latin-700-normal.woff2) format("woff2")}
:root{
  --brun:#865830; --or:#C4922A; --creme:#F3E8DB;
  --fond:#F3E8DB; --carte:#FFFDFA; --texte:#241A12; --doux:#5B4C3E; --trait:#E0D3C2;
  --champ:#FBF6F0; --accent:#865830; --accent-texte:#FFFFFF; --alerte:#A4462E; --alerte-fond:#F7E3DC;
  --logo-mot:#241A12;
  --titre:"Poppins",system-ui,sans-serif;
  --corps:"Nunito",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,"SF Mono",Consolas,"Liberation Mono",monospace;
}
:root[data-theme="sombre"]{
  --fond:#1A130D; --carte:#241A12; --texte:#F3E8DB; --doux:#C9B8A4; --trait:#3E3024;
  --champ:#2E2218; --accent:#C4922A; --accent-texte:#1A130D; --alerte:#E59A82; --alerte-fond:#3A2019;
  --logo-mot:#F3E8DB; color-scheme:dark;
}
*{box-sizing:border-box}
body{margin:0;background:var(--fond);color:var(--texte);font:16px/1.6 var(--corps);padding-inline:16px}
a{color:var(--accent)}
.page{max-width:1040px;margin:0 auto}
h1,h2,h3{font-family:var(--titre);text-wrap:balance;margin:0}
.mot{fill:var(--logo-mot)}
.defs{position:absolute;width:0;height:0;overflow:hidden}

/* En-tête */
.entete{display:flex;align-items:center;gap:16px;padding-block:22px;border-bottom:1px solid var(--trait)}
.entete svg{height:26px;width:auto;display:block}
.entete .lien-site{margin-left:auto;font:600 14px var(--corps);text-decoration:none;color:var(--doux)}
.entete .lien-site:hover{color:var(--accent)}
.theme{width:40px;height:40px;border-radius:10px;border:1px solid var(--trait);background:var(--carte);color:var(--texte);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none}
.theme:hover{border-color:var(--accent)}
.theme svg{width:18px;height:18px}
.theme .lune{display:none}
[data-theme="sombre"] .theme .lune{display:block}
[data-theme="sombre"] .theme .soleil{display:none}

/* Ouverture */
.ouverture{padding-block:48px 28px;max-width:720px}
.surtitre{font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin:0 0 16px}
h1{font-weight:700;font-size:clamp(30px,5.5vw,48px);line-height:1.1;letter-spacing:-.02em}
.chapo{font-size:18px;color:var(--doux);margin:16px 0 0}

/* Identifiant d'espace */
.espace{background:var(--carte);border:1px solid var(--trait);border-radius:16px;padding:20px 22px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 20px;align-items:end;margin-bottom:28px}
.espace label{display:block;font:600 15px var(--titre);margin-bottom:8px}
.saisie{display:flex;align-items:center;background:var(--champ);border:1.5px solid var(--trait);border-radius:10px;overflow:hidden}
.saisie:focus-within{border-color:var(--accent)}
.saisie span{padding:0 0 0 14px;color:var(--doux);font:500 14px var(--mono);white-space:nowrap}
.saisie input{flex:1;min-width:0;width:100%;border:0;background:transparent;color:var(--texte);font:600 17px var(--mono);padding:12px 14px 12px 2px;outline:none}
.espace .aide{grid-column:1 / -1;margin:0;font-size:14px;color:var(--doux)}
.espace .aide.alerte{color:var(--alerte);font-weight:700}
.espace.a-remplir{border-color:var(--alerte);background:var(--alerte-fond)}
.oublier{font:700 14px var(--corps);background:none;border:0;color:var(--doux);text-decoration:underline;cursor:pointer;padding:12px 0}
.oublier[hidden]{display:none}

/* Applications */
.grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.appli{background:var(--carte);border:1px solid var(--trait);border-radius:16px;padding:20px;display:flex;gap:16px;align-items:flex-start;text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.appli:hover{border-color:var(--accent);transform:translateY(-2px)}
.appli:focus-visible,.saisie input:focus-visible,.oublier:focus-visible,.bouton:focus-visible{outline:2px solid var(--or);outline-offset:2px}
.appli .logo{width:52px;height:52px;flex:none}
.appli .logo svg{width:100%;height:100%;display:block}
.appli h2{font-size:19px;font-weight:600;line-height:1.2}
.appli h2 b{color:var(--accent);font-weight:600}
.appli p{margin:4px 0 10px;color:var(--doux);font-size:15px;line-height:1.45}
.appli .adresse{display:block;font:500 13px var(--mono);color:var(--doux);overflow-wrap:anywhere}
.appli .adresse b{color:var(--texte);font-weight:600}
.appli .entrer{display:inline-block;margin-top:8px;font:700 15px var(--corps);color:var(--accent)}

/* Aide */
.aides{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-block:40px 32px}
.aides section{border-top:2px solid var(--or);padding-top:14px}
.aides h3{font-size:17px;font-weight:600;margin-bottom:6px}
.aides p{margin:0 0 10px;color:var(--doux);font-size:15px}
.bouton{display:inline-block;font:700 15px var(--corps);text-decoration:none;background:var(--accent);color:var(--accent-texte);padding:10px 18px;border-radius:999px}
.bouton.leger{background:transparent;color:var(--accent);border:1.5px solid var(--trait)}
.bouton.leger:hover{border-color:var(--accent)}

.pied{border-top:1px solid var(--trait);padding-block:24px 36px;display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;font-size:14px;color:var(--doux)}
.pied a{color:var(--doux)}

@media (max-width:760px){
  .espace{grid-template-columns:minmax(0,1fr);padding:18px 16px}
  .saisie span,.saisie input{font-size:14px}
  .oublier{padding:0;justify-self:start}
  .aides{grid-template-columns:1fr;gap:24px}
  .entete .lien-site{display:none}
  .theme{margin-left:auto}
}
@media (prefers-reduced-motion:reduce){.appli{transition:none}.appli:hover{transform:none}}
