/* Connexion, inscription, mot de passe oublié — forme des pages de LiveCRM (auth/_signup_styles.html),
   couleurs et fond d'Atitra. */
.auth{min-height:100vh;padding:40px 20px;display:flex;justify-content:center;align-items:flex-start}
.auth a{text-decoration:none}
.auth button{cursor:pointer;border:none;font-family:inherit}
.auth-shell{width:100%;max-width:1040px;display:grid;grid-template-columns:320px 1fr;background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 20px 60px rgba(35,36,90,.14)}
.auth-shell.etroit{max-width:900px}

/* ---- Panneau latéral ---- */
.auth-aside{background:var(--grad);color:#fff;padding:38px 32px;position:relative;overflow:hidden}
.auth-aside::after{content:"";pointer-events:none;position:absolute;width:320px;height:320px;border-radius:50%;border:1px dashed rgba(255,255,255,.25);right:-150px;bottom:-120px}
.auth-aside::before{content:"";pointer-events:none;position:absolute;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.07);left:-80px;top:120px}
.auth-logo{display:inline-flex;align-items:center;gap:9px;color:#fff;font-weight:800;font-size:1.2rem;letter-spacing:-.02em;margin-bottom:44px;position:relative}
.auth-logo svg{width:32px;height:25px}
.auth-aside h2{font-size:1.5rem;font-weight:800;line-height:1.25;margin:0 0 10px;position:relative;color:#fff}
.auth-aside p{font-size:.88rem;line-height:1.6;color:rgba(255,255,255,.9);position:relative;margin:0}
.auth-aside ul{list-style:none;margin:32px 0 0;padding:0;position:relative}
.auth-aside ul li{display:flex;gap:10px;align-items:flex-start;font-size:.85rem;margin-bottom:14px;color:rgba(255,255,255,.95)}
.auth-aside ul li b{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.22);flex:none;font-size:.7rem;margin-top:1px}
.auth-essai{position:relative;margin-top:36px;background:rgba(255,255,255,.14);border-radius:14px;padding:14px 16px;font-size:.82rem;line-height:1.5}

/* ---- Zone principale ---- */
.auth-main{padding:38px 40px 34px;display:flex;flex-direction:column;min-width:0}
.auth-topbar{display:flex;justify-content:flex-end;margin-bottom:26px}
.auth-topbar a{background:#fff;border:1px solid var(--line);border-radius:50px;padding:8px 18px;font-size:.8rem;font-weight:700;color:var(--accent)}
.auth-topbar a:hover{background:var(--accent-soft)}
.auth-form{max-width:420px;width:100%;margin:0 auto}
.auth-form.large{max-width:none}
.auth h1{font-size:1.4rem;font-weight:800;color:var(--ink);margin:0 0 5px}
.auth .sub{font-size:.85rem;color:var(--muted);margin:0 0 24px}

/* ---- Champs ---- */
.auth-grille{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.auth-champ{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.auth-grille .auth-champ{margin-bottom:0}
.auth-champ.full{grid-column:1/-1}
.auth-champ>label{font-size:.88rem;font-weight:800;color:var(--ink)}
.auth-input{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:12px;padding:11px 13px;background:#fff;transition:.2s;position:relative}
.auth-input:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.auth-input>svg{width:15px;height:15px;stroke:var(--muted);fill:none;stroke-width:1.8;flex:none}
.auth-input input,.auth-input select{border:none;outline:none;font-size:.88rem;width:100%;min-width:0;color:var(--ink);background:none;padding:0;box-shadow:none}
.auth-input input::placeholder{color:#A7AAC6}
.auth-input.bad{border-color:var(--err);background:#FFFAFA}
.auth-input.avec-oeil{padding-right:46px}
.auth-aide{font-size:.76rem;color:var(--muted);line-height:1.45}
.auth-err{font-size:.74rem;color:var(--err);font-weight:700}
.oeil{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:none;background:none;border-radius:9px;cursor:pointer;display:grid;place-items:center;color:#A7AAC6}
.oeil svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
.oeil.on{color:var(--accent);background:var(--accent-soft)}
.oublie{display:block;text-align:right;font-size:.76rem;font-weight:700;color:var(--accent);margin:-4px 0 6px}

/* ---- Messages ---- */
.notice{display:flex;gap:10px;align-items:flex-start;background:var(--err-bg);border-radius:12px;padding:12px 14px;font-size:.8rem;color:var(--err);font-weight:600;margin-bottom:18px;line-height:1.5}
.notice b{flex:none;width:18px;height:18px;border-radius:50%;background:var(--err);color:#fff;display:grid;place-items:center;font-size:.68rem}
.notice.info{background:var(--accent-soft);color:var(--ink-2)}
.notice.info b{background:var(--accent)}
.notice.ok{background:var(--ok-bg);color:var(--ok)}
.notice.ok b{background:var(--ok)}

/* ---- Case à cocher ---- */
.auth-check{display:flex;align-items:flex-start;gap:9px;font-size:.8rem;color:var(--muted);margin:4px 0 8px;cursor:pointer;position:relative;line-height:1.5}
.auth-check input{position:absolute;opacity:0;width:1px;height:1px}
.auth-check i{width:17px;height:17px;border-radius:5px;border:2px solid var(--line);display:grid;place-items:center;flex:none;transition:.2s;margin-top:1px}
.auth-check:has(input:checked) i{background:var(--accent);border-color:var(--accent)}
.auth-check:has(input:focus-visible) i{box-shadow:0 0 0 3px var(--accent-soft)}
.auth-check i svg{width:9px;height:9px;stroke:#fff;fill:none;stroke-width:3.5;opacity:0}
.auth-check:has(input:checked) i svg{opacity:1}
.auth-check a{color:var(--accent);font-weight:700;text-decoration:underline}

/* ---- Actions ---- */
.auth-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px}
.btn-auth{border-radius:50px;padding:13px 24px;font-size:.85rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.2s;background:var(--grad);color:#fff;box-shadow:0 6px 18px rgba(91,94,224,.32)}
.btn-auth:hover{transform:translateY(-1px)}
.btn-auth.plein{width:100%;margin-top:10px}
.btn-auth svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.6}
.auth-bas{margin-top:26px;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px}
.auth-bas a{font-size:.72rem;font-weight:600;color:var(--muted)}
.auth-bas a:hover{color:var(--accent)}

/* ---- Confirmation ---- */
.auth-fait{text-align:center;padding:26px 0 10px}
.auth-fait .marque{width:64px;height:64px;border-radius:50%;background:var(--grad);display:grid;place-items:center;margin:0 auto 20px;box-shadow:0 10px 26px rgba(91,94,224,.34)}
.auth-fait .marque svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:2.2}
.auth-fait p{font-size:.87rem;color:var(--muted);line-height:1.6;max-width:380px;margin:0 auto 24px}

@media(max-width:860px){
  .auth{padding:0}
  .auth-shell{grid-template-columns:1fr;border-radius:0;min-height:100vh;box-shadow:none}
  .auth-aside{padding:26px 24px}
  .auth-aside ul,.auth-essai{display:none}
  .auth-logo{margin-bottom:22px}
  .auth-main{padding:26px 22px 24px}
  .auth-grille{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.auth *{transition:none!important}}

/* ---- Pages d'erreur (403, 404, 500) ---- */
.code-erreur{display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--accent);background:var(--accent-soft);border-radius:20px;padding:4px 12px;margin-bottom:12px}
.actions-erreur{display:flex;flex-direction:column;align-items:center;gap:14px}
.actions-erreur form{margin:0}
.auth .lien-erreur{font-size:.82rem;font-weight:700;color:var(--muted);background:none;padding:0;text-decoration:underline;text-underline-offset:3px}
.auth .lien-erreur:hover{color:var(--accent)}