/* BD Icons — système d'icônes inline Lucide-style
   Variables réutilisées du style global (--vert, --vert-clair, --vert-fonce) */

.bd-icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  vertical-align: middle;
  color: var(--vert, #4FBE9A);
  /* stroke=currentColor donc la couleur se contrôle via color: */
}
.bd-icon--sm { width: 18px; height: 18px; }
.bd-icon--md { width: 24px; height: 24px; }
.bd-icon--lg { width: 32px; height: 32px; }
.bd-icon--xl { width: 40px; height: 40px; }

/* Pastille pour les cards / pillars / situations — fond vert clair, icône vert */
.bd-icon-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 18px;
  background: var(--vert-clair, #E5F6EE);
  color: var(--vert-hover, #3DA785);
  flex-shrink: 0;
  transition: background .2s ease, transform .2s ease;
}
.bd-icon-badge:hover,
*:hover > .bd-icon-badge {
  /* hover hérité quand utilisé dans une card cliquable */
}
.bd-icon-badge .bd-icon { color: inherit; }

/* Variante pleine — fond vert plein, icône blanche, pour CTA primaires */
.bd-icon-badge--solid {
  background: var(--vert, #4FBE9A);
  color: var(--vert-fonce, #0A0E14);
}

/* Variante sombre — fond bleu nuit, icône vert (pour sections sombres) */
.bd-icon-badge--dark {
  background: rgba(79, 190, 154, 0.12);
  color: var(--vert, #4FBE9A);
  border: 1px solid rgba(79, 190, 154, 0.25);
}

/* Icône dans une card landing (au-dessus du titre) */
.bd-icon-card {
  display: block;
  margin-bottom: 16px;
  color: var(--vert, #4FBE9A);
}

/* Icône utilisée dans les stats (preuves chiffrées) */
.bd-icon-stat {
  width: 22px;
  height: 22px;
  color: var(--vert, #4FBE9A);
  vertical-align: middle;
  margin-right: 0.4em;
}

/* Petite icône inline dans un bouton ou un lien */
.btn .bd-icon,
.pillar-link .bd-icon,
a .bd-icon--inline {
  width: 16px;
  height: 16px;
  margin-left: .35em;
}