/* ===== DIS+ Escadrille IA — style partagé (fond clair / boîtes rouges) ===== */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=DM+Sans:wght@400;500;600&display=swap');

:root{
  --bordeaux:#6B0F1A; --bordeaux-dark:#4A0A12;
  --gold:#D4AF37; --gold-soft:#C8A951;
  --cream:#FBF7EF; --cream-dim:#EAD9C2;
  --bg-light:#F4F1EB; --ink:#2E2326; --ink-soft:#6E5F61;
}

*{ box-sizing:border-box; }
html,body{ margin:0; min-height:100%; }
body{ font-family:'DM Sans',system-ui,sans-serif; color:var(--ink); }

/* Fond général CLAIR */
.bg-deep{ background:var(--bg-light); min-height:100vh; }
.center-screen{ display:flex; align-items:center; justify-content:center; padding:24px; }

.display{ font-family:'Fraunces',Georgia,serif; font-weight:700; line-height:1.05;
  margin:2px 0 6px; color:var(--bordeaux); }   /* titres en ROUGE */
.display.big{ font-size:40px; }
.brand-tag{ color:var(--bordeaux); letter-spacing:3px; font-size:12px; font-weight:600; }
.muted{ color:var(--ink-soft); }
.lead{ font-size:15px; max-width:580px; line-height:1.5; }

/* Barre d'en-tête ROUGE */
.topbar{ display:flex; justify-content:space-between; align-items:center;
  padding:16px 24px; background:var(--bordeaux); border-bottom:3px solid var(--gold-soft); }
.topbar .brand-tag{ color:var(--gold); }
.logout-link{ color:var(--cream-dim); text-decoration:none; font-size:13px; font-weight:600; }
.logout-link:hover{ color:var(--gold); }

.container{ max-width:1040px; margin:0 auto; padding:30px 24px 60px; }

/* Champs (dans les boîtes rouges) -> blancs lisibles */
.field-label{ display:block; font-size:12px; letter-spacing:1px; text-transform:uppercase;
  color:var(--cream-dim); margin-bottom:6px; font-weight:600; }
.input{ width:100%; background:#fff; border:1px solid var(--gold-soft); border-radius:10px;
  color:var(--ink); padding:11px 12px; font-size:14px; font-family:'DM Sans',sans-serif; }
.input::placeholder{ color:#9b8e80; }
select.input{ appearance:none; cursor:pointer; }
textarea.input{ resize:vertical; }

.btn-gold{ background:linear-gradient(90deg,var(--gold) 0%,var(--gold-soft) 100%);
  color:var(--bordeaux-dark); font-weight:700; font-size:15px; border:none; border-radius:10px;
  padding:13px 16px; cursor:pointer; letter-spacing:.3px; font-family:'DM Sans',sans-serif; }
.btn-gold:hover{ filter:brightness(1.05); }
.btn-gold:disabled{ opacity:.6; cursor:default; }

/* Login = boîte ROUGE sur fond clair */
.login-card{ background:var(--bordeaux); border:1px solid var(--gold-soft); border-radius:18px;
  padding:34px 30px; width:100%; max-width:380px; text-align:center;
  box-shadow:0 14px 40px rgba(107,15,26,.25); }
.login-card .display{ color:var(--cream); }
.login-card .brand-tag{ color:var(--gold); }
.login-card .muted{ color:var(--cream-dim); }
.login-form{ display:flex; flex-direction:column; gap:14px; margin-top:18px; text-align:left; }
.login-form .field-label{ margin-bottom:0; }
.error-banner{ background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.4);
  color:#FBD9CC; border-radius:10px; padding:10px 12px; font-size:14px; margin-top:14px; }

/* Catalogue = boîtes ROUGES sur fond clair */
.grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:18px; margin-top:26px; }
.card-agent{ display:block; text-decoration:none; color:var(--cream);
  background:var(--bordeaux); border:1px solid var(--bordeaux-dark); border-radius:16px; padding:20px;
  box-shadow:0 8px 24px rgba(107,15,26,.18); transition:transform .12s ease, border-color .12s ease; }
.card-agent:hover{ transform:translateY(-3px); border-color:var(--gold); }
.card-soon{ opacity:.6; cursor:default; }
.card-soon:hover{ transform:none; border-color:var(--bordeaux-dark); }
.card-top{ display:flex; gap:8px; margin-bottom:12px; }
.pill{ font-size:11px; letter-spacing:.5px; text-transform:uppercase; font-weight:600;
  color:var(--bordeaux-dark); background:var(--gold-soft); border-radius:999px; padding:3px 10px; }
.pill-soon{ background:transparent; color:var(--cream-dim); border:1px solid rgba(234,217,194,.45); }
.card-title{ font-family:'Fraunces',Georgia,serif; font-size:22px; font-weight:600; margin:0 0 8px; color:var(--cream); }
.card-desc{ font-size:14px; line-height:1.5; color:var(--cream-dim); margin:0 0 14px; }
.card-cta{ color:var(--gold); font-weight:600; font-size:14px; }

.footer-note{ margin-top:34px; font-size:12px; color:var(--ink-soft); text-align:center; }