/* ═══════════════════════════════════════════════════════════════════════════
   ev-director-darkcards-v309.css  —  2026-06-11
   ───────────────────────────────────────────────────────────────────────────
   OBJET : finir le thème sombre unifié (v304) sur TOUT l'espace STAFF
   (Directeur + Manager + Opérateur). v304 neutralise le blanc pur
   (#FFFFFF / #fff / white) mais PAS les fonds pastel clairs
   (#FFF7ED orange, #EFF4FF bleu, #ECFDF5 vert, #FEF2F2 rouge, #F1F5F9 gris…)
   injectés en inline par app.js. Sur les dashboards staff ces cartes
   ressortaient en clair = taches blanches sur fond #0A0E17.

   STRATÉGIE
   ─────────
   • SCOPE = `body.in-app` → ajoutée UNIQUEMENT dans startApp() (app.js l.6354),
     c.-à-d. pour le staff (director/manager/operator). L'espace CLIENT/membre
     passe par mbStartApp() qui n'ajoute JAMAIS `in-app` → volontairement clair,
     jamais touché. (2026-06-11 : élargi de body.role-director à body.in-app
     pour couvrir Manager + Opérateur en plus du Directeur.)
   • On ne modifie QUE le background + la bordure (on darkise la surface et on
     garde une bordure accent qui PRÉSERVE le sens : vert=ok, rouge=alerte,
     orange=à valider, bleu=info). Les chiffres colorés (CA vert, écart rouge)
     restent intacts ; le texte gris foncé est déjà relevé par v290/v302.
   • !important systématique pour battre les inline styles d'app.js.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── Surfaces NEUTRES (gris/blanc cassé) → carte sombre standard ─────────── */
body.in-app [style*="background:#F8FAFC" i],
body.in-app [style*="background: #F8FAFC" i],
body.in-app [style*="background:#F1F5F9" i],
body.in-app [style*="background: #F1F5F9" i],
body.in-app [style*="background:#F9FAFB" i],
body.in-app [style*="background:#F3F4F6" i],
body.in-app [style*="background:#E2E8F0" i]{
  background:#131C2E !important;
  border-color:#2A3A52 !important;
}

/* ─── VERT (succès / OK) → fond sombre + accent vert ─────────────────────── */
body.in-app [style*="background:#ECFDF5" i],
body.in-app [style*="background: #ECFDF5" i],
body.in-app [style*="background:#DCFCE7" i],
body.in-app [style*="background:#F0FDF4" i],
body.in-app [style*="background:#D1FAE5" i]{
  background:#13241D !important;
  border-color:rgba(16,185,129,.38) !important;
}

/* ─── ROUGE (alerte / écart) → fond sombre + accent rouge ────────────────── */
body.in-app [style*="background:#FEF2F2" i],
body.in-app [style*="background: #FEF2F2" i],
body.in-app [style*="background:#FEE2E2" i],
body.in-app [style*="background:#FECACA" i],
body.in-app [style*="background:#FFF1F2" i]{
  background:#241619 !important;
  border-color:rgba(239,68,68,.40) !important;
}

/* ─── ORANGE / AMBRE (à valider / attention) → fond sombre + accent ambre ── */
body.in-app [style*="background:#FFF7ED" i],
body.in-app [style*="background: #FFF7ED" i],
body.in-app [style*="background:#FFFBEB" i],
body.in-app [style*="background:#FEF3C7" i],
body.in-app [style*="background:#FFEDD5" i],
body.in-app [style*="background:#FEFCE8" i]{
  background:#241E12 !important;
  border-color:rgba(245,158,11,.40) !important;
}

/* ─── BLEU (info / à confirmer) → fond sombre + accent bleu ───────────────── */
body.in-app [style*="background:#EFF4FF" i],
body.in-app [style*="background: #EFF4FF" i],
body.in-app [style*="background:#EFF6FF" i],
body.in-app [style*="background:#F0F9FF" i],
body.in-app [style*="background:#E0F2FE" i],
body.in-app [style*="background:#EEF2FF" i]{
  background:#13202F !important;
  border-color:rgba(59,130,246,.40) !important;
}

/* ─── Bordures pastel résiduelles (quand le fond a déjà été pris ailleurs) ── */
body.in-app [style*="border:1px solid #FED7AA" i],
body.in-app [style*="border:1px solid #FDE68A" i],
body.in-app [style*="border:1px solid #FEF08A" i]{ border-color:rgba(245,158,11,.40) !important; }
body.in-app [style*="border:1px solid #BFD7FE" i],
body.in-app [style*="border:1px solid #BAE6FD" i],
body.in-app [style*="border:1px solid #93C5FD" i]{ border-color:rgba(59,130,246,.40) !important; }
body.in-app [style*="border:1px solid #FCA5A5" i],
body.in-app [style*="border:1px solid #FECACA" i]{ border-color:rgba(239,68,68,.40) !important; }
body.in-app [style*="border:1px solid #BBF7D0" i],
body.in-app [style*="border:1px solid #A7F3D0" i],
body.in-app [style*="border:1px solid #86EFAC" i]{ border-color:rgba(16,185,129,.38) !important; }
body.in-app [style*="border:1px solid #E2E8F0" i],
body.in-app [style*="border:1px solid #CBD5E1" i],
body.in-app [style*="border:1px solid #E5E7EB" i]{ border-color:#2A3A52 !important; }

/* ─── Séparateurs de section dans la sidebar Directeur (NADM {sep}) ───────── */
.ni-sep{
  font-size:10px !important;
  font-weight:800 !important;
  letter-spacing:.09em !important;
  text-transform:uppercase !important;
  color:#94A3B8 !important;
  padding:15px 12px 5px !important;
  margin-top:4px !important;
  border-top:1px solid #1E293B !important;
  user-select:none;
  pointer-events:none;
}
.ni-sep:first-child{
  border-top:0 !important;
  margin-top:0 !important;
  padding-top:2px !important;
}

/* ─── Indicateur de MODE en tête de sidebar Opérateur (Solo/Salle/Caisse) ─── */
.mode-indic{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.03em;
  color:#CBD5E1 !important;
  background:#0F1626 !important;
  border:1px solid #2A3A52 !important;
  border-left:3px solid #22D3EE !important;
  border-radius:8px !important;
  padding:8px 11px !important;
  margin:0 0 10px !important;
}
.mode-indic b{ color:#FFFFFF !important; font-weight:800 !important; }

/* ─── Inputs/selects clairs des barres de filtre (pages staff) ────────────── */
body.in-app [style*="background:#FFFFFF" i] input,
body.in-app [style*="background:#FFFFFF" i] select,
body.in-app input[style*="background:#FFFFFF" i],
body.in-app select[style*="background:#FFFFFF" i]{
  background:#0F1626 !important;
  border-color:#2A3A52 !important;
  color:#F1F5F9 !important;
  color-scheme:dark;
}

/* ═══════════════════════════════════════════════════════════════════════
   2026-06-12 — NETTOYAGE INTERFACE STAFF (focus caisse, anti-bug d'affichage)
   ───────────────────────────────────────────────────────────────────────
   BUG : le header marketing v300 (.ev-header, position:fixed, translucide avec
   backdrop-blur) se superposait à la barre d'outils NATIVE de l'app (.tb : ☰
   menu, marque, horloge, langue, 🚪 Déconnexion, 🔔, ↻). Résultat : deux
   en-têtes empilés + un flou fantôme au centre.
   FIX : la barre native .tb porte déjà TOUT (dont le logout) → on masque
   entièrement le header marketing + son drawer pour le staff connecté.
   Couvre :has() (navigateurs récents) ET body.in-app (fallback Safari<15.4). */
body:has(#p-app.on) .ev-header,
body.in-app .ev-header,
body:has(#p-app.on) .ev-drawer,
body.in-app .ev-drawer,
body:has(#p-app.on) .ev-burger,
body.in-app .ev-burger{
  display:none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   2026-06-12 (bis) — ORDRE D'ORIGINE RÉTABLI (directive Directeur « te9elb »)
   ───────────────────────────────────────────────────────────────────────
   Le Directeur veut l'ordre visuel d'origine : Logo → Programme de Fidélité
   /Parrainage → Formulaire de connexion (tabs + login) tout en bas.
   On ANNULE le « connexion en premier » : le bloc fidélité (#programme)
   repasse JUSTE sous le titre (order:2), tabs+formulaire descendent en bas.
   Trade-off assumé : le staff doit scroller la pub avant le login.
   `.aw` est déjà flex-column → purement visuel via `order`, aucun DOM/JS touché. */
#p-auth .aw{ display:flex; flex-direction:column; }
#p-auth .aw > #hero{ order:1; }
#p-auth .aw > #programme{ order:2; margin-top:8px; }
#p-auth .aw > .atabs{ order:3; }
#p-auth .aw > #form-login,
#p-auth .aw > #form-signup{ order:4; }
/* dernier enfant = liens footer (Politique / Support / copyright) → tout en bas */
#p-auth .aw > *:last-child{ order:5; }

/* ═══════════════════════════════════════════════════════════════════════
   2026-06-12 — NETTOYAGE PAGE DE CONNEXION (décision Directeur : minimum
   essentiel pour que l'agent se connecte sans bruit).
   ───────────────────────────────────────────────────────────────────────
   On retire les liens MORTS et le marketing redondant :
   · header → on garde le LOGO seul ; on masque la nav (Accueil/Programme/
     Partenaires dont #partenaires n'existe PAS = lien mort), le CTA
     « Se connecter » (redondant, le formulaire est juste en dessous) et le
     burger (plus de menu à ouvrir).
   · footer géant 4 colonnes → masqué en entier (Partenaires = lien mort,
     3 icônes réseaux = href vides/morts, le reste fait doublon). La ligne
     discrète sous le formulaire (Politique · Support WhatsApp · email)
     suffit comme bas de page.
   Purement visuel / réversible — aucun élément supprimé du DOM. */
.ev-header__nav,
.ev-header__cta--login,
.ev-burger{ display:none !important; }
/* footer marketing : inutile sur une page dont le seul but est se connecter */
.ev-footer{ display:none !important; }