/* =============================================================================
   BrokerOne — habillage charte (aligne l'app audit sur la landing)
   Chargé APRÈS le <style> de chaque page : remappe la palette en thème clair
   et neutralise les fonds sombres résiduels.
   Palette landing : --blue-night #1E3A5F, --coral #C0392B, --gray-pearl #F1F3F6.
   ============================================================================= */
:root {
  --bg: #f5f7fb;
  --card: #ffffff;
  --card2: #f1f3f6;
  --ink: #1e3a5f;
  --muted: #4a5568;
  --accent: #c0392b;       /* CTA corail */
  --ok: #1d6a45;
  --warn: #c65d07;
  --line: #e2e8f0;
  --blue-night: #1e3a5f;
  --coral: #c0392b;
  --gray-pearl: #f1f3f6;
}

body {
  background: var(--bg) !important;
  color: var(--ink) !important;
  font-family: system-ui, "Segoe UI", Roboto, sans-serif;
}

/* Titres en bleu-nuit */
h1, h2, h3 { color: var(--ink); }

/* Champs de formulaire en clair */
input, select, textarea {
  background: #ffffff !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
}

/* Blocs/cartes : fonds sombres résiduels -> clair */
.card, .act, .kpi, .opp, .phase, .verb, .teaser, .analyse, .role-link,
.domaine, .editbanner, .heat span, .ed-phase, .ed-opp {
  background: var(--card) !important;
  border-color: var(--line);
}
.card, .kpi { box-shadow: 0 4px 20px rgba(0,0,0,0.06); }
.opp { border-left: 3px solid var(--accent) !important; }
.verb { border-left-color: var(--accent) !important; }

/* Boutons : corail */
button, .btn, a.btn {
  background: var(--accent);
  color: #fff;
}
button.ghost, button[class*="ghost"] {
  background: transparent;
  color: var(--ink);
  border: 1px solid var(--line);
}
/* Segments / pilules */
.seg span, .chip { background: #fff; color: var(--muted); border-color: var(--line); }
.seg span.on, .chip.on { background: var(--accent); border-color: var(--accent); color: #fff; }

/* Liens */
a { color: #2980b9; }
.note, .hint, .sub, .muted, .desc { color: var(--muted) !important; }

/* Scores / accents numériques en corail (cohérent CTA) */
.kpi .n, .score-num, .n { color: var(--accent) !important; }
.doctrine { color: var(--ok) !important; }

/* =================== Barre d'en-tête (logo + retour) ==================== */
.bo-topbar {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  background: #ffffff; border-bottom: 1px solid var(--line);
  padding: 12px 22px; box-shadow: 0 1px 10px rgba(0,0,0,0.05);
}
.bo-topbar .bo-logo {
  font-weight: 800; font-size: 20px; color: var(--blue-night);
  text-decoration: none; letter-spacing: -0.5px;
}
.bo-topbar .bo-logo em { font-style: normal; color: var(--coral); }
.bo-topbar .bo-back {
  color: var(--muted); text-decoration: none; font-weight: 600; font-size: 14px;
}
.bo-topbar .bo-back:hover { color: var(--coral); }
.bo-topbar .bo-lang { display: inline-flex; gap: 2px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.bo-topbar .bo-lang a { padding: 4px 10px; font-size: 13px; font-weight: 700; color: var(--muted); text-decoration: none; }
.bo-topbar .bo-lang a.on { background: var(--accent); color: #fff; }