/* =================================================
   Étanchéité de l'Arsenal — app.css
   Complements de la maquette pour la mise en
   production : champs RGPD, messages d'erreur,
   piege a robots, etats de chargement.
   Charge apres site.css et enhance.css.
   ================================================= */

/* ───────── Consentement RGPD ─────────────────── */
.rgpd-consent{
  display:flex;gap:10px;align-items:flex-start;
  margin:6px 0 2px;cursor:pointer;
  font-size:12.5px;line-height:1.5;color:var(--c-muted);
}
.rgpd-consent input{
  margin-top:2px;flex-shrink:0;
  accent-color:var(--c-brand);width:16px;height:16px;cursor:pointer;
}
.rgpd-consent a{color:var(--c-brand-deep);text-decoration:underline;text-underline-offset:2px}
.rgpd-consent a:hover{color:var(--c-accent)}

/* ───────── Messages d'erreur de formulaire ───── */
.form-error{
  margin-top:14px;padding:12px 14px;
  border:1px solid rgba(194,83,44,.35);
  background:rgba(194,83,44,.08);
  border-radius:var(--r-m);
  color:var(--c-accent-deep);
  font-size:13.5px;line-height:1.5;font-weight:500;
}
[data-mode="dark"] .form-error{background:rgba(226,122,74,.12);color:var(--c-accent-deep)}

/* ───────── Piege a robots (invisible, hors flux) ─ */
.hp-field{
  position:absolute !important;
  width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);
  white-space:nowrap;border:0;padding:0;margin:-1px;
}

/* ───────── Bouton en cours d'envoi ───────────── */
.btn[disabled]{opacity:.6;cursor:progress;transform:none !important}

/* ───────── Etats de chargement / vide ────────── */
.app-loading,
.app-empty{
  padding:44px 0;text-align:center;
  color:var(--c-muted);font-size:15px;
}
.app-empty strong{display:block;color:var(--c-ink);font-size:17px;margin-bottom:6px;font-family:var(--f-display)}

/* ───────── Connexion espace pro ──────────────── */
.login-form .form-error{margin:0 0 16px}
.login-form .field input{width:100%}

/* ───────── Pages rendues par Next dans la coquille du site ─────────
   Les articles de blog (/blog/<slug>) sont générés par Next.js, dont le
   layout racine applique encore les classes Tailwind du thème sombre
   (`bg-arsenal-btp-bg`, `text-white`). Une classe l'emporte sur le
   sélecteur `body` de site.css : on remonte la spécificité ici plutôt
   que de toucher au layout racine, partagé avec l'admin. */
body:has(#site-header){
  background:var(--c-cream);
  color:var(--c-ink);
  font-family:var(--f-body);
}
[data-mode="dark"] body:has(#site-header){
  background:#0C1620;
  color:#EAF1F8;
}