/* ============================================================
   brand.css – Direction artistique Legilog : vert #32cd32
   Chargé APRÈS bootstrap et app.css : surcharge le « primary » Bootstrap.
   Règle d'usage : le vert vif sert aux fonds / accents (boutons, barres, pastilles),
   le vert foncé aux textes et liens (le #32cd32 sur blanc manque de contraste).
   ============================================================ */
:root {
  --brand:        #32cd32;
  --brand-rgb:    50, 205, 50;
  --brand-dark:   #1f8a1f;   /* textes, liens */
  --brand-darker: #166016;
  --brand-hover:  #2bb82b;
  --brand-soft:   #e9f9e9;   /* fonds très clairs */
  --brand-ink:    #0b2e0b;   /* texte posé sur le vert vif */
  --brand-night:  #14231a;   /* fonds sombres (barre latérale, en-têtes) */
  --brand-night2: #1d3226;

  --bs-primary: var(--brand);
  --bs-primary-rgb: var(--brand-rgb);
  --bs-primary-text-emphasis: var(--brand-darker);
  --bs-primary-bg-subtle: var(--brand-soft);
  --bs-primary-border-subtle: #b5ebb5;
  --bs-link-color: var(--brand-dark);
  --bs-link-color-rgb: 31, 138, 31;
  --bs-link-hover-color: var(--brand-darker);
  --bs-link-hover-color-rgb: 22, 96, 22;
  --bs-focus-ring-color: rgba(var(--brand-rgb), .3);
}

/* ---- Boutons ---- */
.btn-primary {
  --bs-btn-color: var(--brand-ink); --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand);
  --bs-btn-hover-color: var(--brand-ink); --bs-btn-hover-bg: var(--brand-hover); --bs-btn-hover-border-color: var(--brand-hover);
  --bs-btn-active-color: var(--brand-ink); --bs-btn-active-bg: #27a827; --bs-btn-active-border-color: #27a827;
  --bs-btn-disabled-color: var(--brand-ink); --bs-btn-disabled-bg: var(--brand); --bs-btn-disabled-border-color: var(--brand);
  --bs-btn-focus-shadow-rgb: var(--brand-rgb);
  font-weight: 600;
}
.btn-outline-primary {
  --bs-btn-color: var(--brand-dark); --bs-btn-border-color: var(--brand);
  --bs-btn-hover-color: var(--brand-ink); --bs-btn-hover-bg: var(--brand); --bs-btn-hover-border-color: var(--brand);
  --bs-btn-active-color: var(--brand-ink); --bs-btn-active-bg: var(--brand); --bs-btn-active-border-color: var(--brand);
  --bs-btn-disabled-color: var(--brand-dark); --bs-btn-disabled-border-color: var(--brand);
  --bs-btn-focus-shadow-rgb: var(--brand-rgb);
}
.btn-success {
  --bs-btn-bg: var(--brand-dark); --bs-btn-border-color: var(--brand-dark);
  --bs-btn-hover-bg: var(--brand-darker); --bs-btn-hover-border-color: var(--brand-darker);
  --bs-btn-active-bg: var(--brand-darker); --bs-btn-active-border-color: var(--brand-darker);
}

/* ---- Couleurs utilitaires ---- */
.bg-primary { background-color: var(--brand) !important; color: var(--brand-ink) !important; }
.text-bg-primary { background-color: var(--brand) !important; color: var(--brand-ink) !important; }
.text-primary { color: var(--brand-dark) !important; }
.border-primary { border-color: var(--brand) !important; }
.bg-primary-subtle { background-color: var(--brand-soft) !important; }
.text-blue { color: var(--brand-dark); }
.badge.bg-primary-subtle { color: var(--brand-darker) !important; }
.progress-bar { background-color: var(--brand); color: var(--brand-ink); }
.progress-bar.bg-success { background-color: var(--brand-dark) !important; }
.form-check-input:checked { background-color: var(--brand); border-color: var(--brand); }
.form-control:focus, .form-select:focus { border-color: var(--brand); box-shadow: 0 0 0 .2rem rgba(var(--brand-rgb), .2); }
.page-link { color: var(--brand-dark); }
.page-item.active .page-link { background-color: var(--brand); border-color: var(--brand); color: var(--brand-ink); }
.nav-tabs .nav-link.active { color: var(--brand-darker); border-bottom-color: var(--brand); }
.nav-pills .nav-link.active { background-color: var(--brand); color: var(--brand-ink) !important; }
.alert-info { --bs-alert-bg: var(--brand-soft); --bs-alert-border-color: #b5ebb5; --bs-alert-color: var(--brand-darker); }
.table-hover tbody tr:hover { background: rgba(var(--brand-rgb), .05); }

/* ---- Administration : barre latérale ---- */
.sidebar { background: var(--brand-night); }
.sidebar-brand, .sidebar .sidebar-brand { background: #0e1a12; border-bottom: 1px solid #08110b; }
.sidebar .brand-icon { background: var(--brand); color: var(--brand-ink); }
.sidebar .nav-link { border-radius: .5rem; font-size: .92rem; color: #d3e2d8 !important; }
.sidebar .nav-link:hover { background: var(--brand-night2); color: #fff !important; }
.sidebar .nav-link.active { background: rgba(var(--brand-rgb), .16) !important; color: #fff !important; box-shadow: inset 3px 0 0 var(--brand); font-weight: 600; }
.sidebar .nav-link.active i { color: var(--brand); }
.sidebar-sep hr { border-color: #3d5a47 !important; }
.sidebar-footer { border-top-color: var(--brand-night2); }
.main-content { background: #f3f7f4; }
.topbar { border-bottom: 2px solid var(--brand); }

/* ---- Espace stagiaire / client ---- */
.participant-layout { background: #f3f7f4 !important; }
.participant-header {
  background: linear-gradient(135deg, var(--brand-night) 0%, var(--brand-night2) 100%);
  border-bottom: 4px solid var(--brand);
  padding: 14px 0 !important;
}
.participant-header .brand-mark {
  width: 38px; height: 38px; border-radius: 10px; background: var(--brand); color: var(--brand-ink);
  display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem;
}
.participant-hero {
  background: linear-gradient(135deg, #ffffff 0%, var(--brand-soft) 100%);
  border-left: 6px solid var(--brand) !important;
}
.avatar-circle-lg.bg-primary { background: var(--brand) !important; color: var(--brand-ink) !important; }

/* Cartes d'étapes (émargement, positionnement, satisfaction) */
.step-card { border-left: 5px solid #cfd8d2 !important; transition: box-shadow .15s, transform .15s; }
.step-card:hover { box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .1) !important; transform: translateY(-1px); }
.step-card.todo { border-left-color: var(--brand) !important; }
.step-card.done { border-left-color: var(--brand-dark) !important; background: #fbfefb; }
.step-card.locked { opacity: .75; }
.step-num {
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; background: var(--brand-soft); color: var(--brand-darker);
}
.step-card.done .step-num { background: var(--brand-dark); color: #fff; }

/* Colonne des documents */
.docs-panel { border-top: 4px solid var(--brand) !important; }
@media (min-width: 992px) { .docs-sticky { position: sticky; top: 1rem; } }
.doc-row { display: flex; align-items: center; gap: .75rem; padding: .65rem 0; text-decoration: none; color: inherit; }
.doc-row + .doc-row { border-top: 1px solid #e6ece8; }
.doc-row:hover .doc-title { color: var(--brand-dark); }
.doc-ext {
  width: 42px; height: 42px; border-radius: 10px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.3rem; background: var(--brand-soft); color: var(--brand-dark);
}
.doc-ext.pdf { background: #fdecec; color: #c62828; }
.doc-ext.word { background: #e8f0fe; color: #1a56db; }
.doc-ext.excel { background: #e6f4ea; color: #1e7e34; }
.doc-ext.img { background: #fff4e0; color: #b26a00; }
.doc-title { font-weight: 600; line-height: 1.25; }