html { font-size: 16px; }

body,
h1, h2, h3, h4, h5, h6,
.btn, input, select, textarea, button {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
}

body {
  font-size: 14px;   /* = 12 pt */
  font-weight: 400;  /* régulier */
}

.btn-primary,
.btn-primary:focus {
  background-color: #1e5637;
  background-image: none;
  border-color: #1e5637;
  color: #fff;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active {
  background-color: #163f28;
  background-image: none;
  border-color: #163f28;
}
.progress-bar, .list-group-item.active {
  background-color: #1e5637;
  background-image: none;
  border-color: #1e5637;
}
.btn-vq,
.btn-vq:focus {
  background-color: #11d78b;
  background-image: none;      /* annule le dégradé de bootstrap-theme */
  border: 2px solid #11d78b;
  border-radius: 999px;        /* forme pilule, comme les boutons du site */
  color: #0f2a1c;              /* texte foncé : le blanc est peu lisible sur ce vert */
  font-size: 16px;
  padding: 12px 28px;
  text-shadow: none;
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
  transition: background-color .15s, transform .1s;
}
.btn-vq:hover,
.btn-vq:active {
  background-color: #0fbf7b;
  border-color: #0fbf7b;
  color: #0f2a1c;
}
.btn-vq:active { transform: translateY(1px); }
.btn-vq .glyphicon { margin-right: 6px; }

/* Base commune : forme pilule, comme le bouton « Ajouter un participant » */
.btn-vq-suivant,
.btn-vq-precedent {
  min-width: 180px;          /* même largeur, peu importe le texte */
  background-image: none;
  border: 2px solid #1e5637;
  border-radius: 999px;
  font-size: 16px;
  font-weight: 600;
  padding: 10px 32px;
  text-shadow: none;
  box-shadow: none;
  transition: background-color .15s, color .15s;
}

/* Suivant : vert foncé plein */
.btn-vq-suivant,
.btn-vq-suivant:focus {
  background-color: #1e5637;
  color: #fff;
}
.btn-vq-suivant:hover,
.btn-vq-suivant:active {
  background-color: #163f28;
  border-color: #163f28;
  color: #fff;
}

/* Précédent : contour vert, fond blanc (action secondaire) */
.btn-vq-precedent,
.btn-vq-precedent:focus {
  background-color: #fff;
  color: #1e5637;
}
.btn-vq-precedent:hover,
.btn-vq-precedent:active {
  background-color: #1e5637;
  color: #fff;
}


/* ===== Fond vert arrondi derrière membership et don ===== */
.zone-verte,
.zone-verte.bg-success {
  background-color: #427157;
  background-image: none;
  border-radius: 16px;
  padding: 15px;
  margin: 12px 0;
}

/* Boîtes blanches à l'intérieur */
.zone-verte .panel {
  border: none;
  border-radius: 12px;
  box-shadow: none;
}
.zone-verte .panel:last-child { margin-bottom: 0; }

/* Boîtes blanches à l'intérieur : coins arrondis assortis */
.membership .well,
.membership .panel,
.zone-verte .well,
.zone-verte .panel {
  border-radius: 12px;
  border: none;
  box-shadow: none;
}


/* ===== Wizard des étapes ===== */
.stepwizard { display: block; width: 100%; margin: 10px 0 30px; }
.stepwizard .stepwizard-row {
  display: flex;
  position: relative;
}
.stepwizard .stepwizard-row:before { display: none; }   /* annule l'ancienne ligne unique */

/* Chaque étape : cercle au-dessus, libellé en dessous */
.stepwizard .stepwizard-step {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative;
}

/* Conteneur du cercle : sert de repère à la ligne */
.stepwizard .etape-point {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Segment de ligne entre ce point et le précédent, centré verticalement sur le cercle */
.stepwizard .stepwizard-step + .stepwizard-step .etape-point:before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 50%;
  width: 100%;
  height: 4px;
  background: #e3e8e5;
  z-index: 0;
}
.stepwizard .stepwizard-step.est-fait .etape-point:before,
.stepwizard .stepwizard-step.est-courant .etape-point:before {
  background: #1e5637;
}

/* Cercles */
.stepwizard .stepwizard-step .btn-circle {
  position: relative;
  z-index: 1;                /* au-dessus de la ligne */
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1;
  background-image: none;
  text-shadow: none;
  box-shadow: none;
  opacity: 1;
  cursor: default;
}

/* Étapes passées : vert foncé, cliquables */
.stepwizard .est-fait .btn-circle {
  background: #1e5637; border: 3px solid #1e5637; color: #fff;
}
.stepwizard .est-fait a.btn-circle { cursor: pointer; }
.stepwizard .est-fait a.btn-circle:hover,
.stepwizard .est-fait a.btn-circle:focus {
  background: #11d78b; border-color: #11d78b; color: #0f2a1c;
}

/* Étape en cours : vert foncé + anneau */
.stepwizard .est-courant .btn-circle,
.stepwizard .est-courant .btn-circle:hover,
.stepwizard .est-courant .btn-circle:focus {
  background: #1e5637; border: 3px solid #1e5637; color: #fff;
  box-shadow: 0 0 0 4px #fff, 0 0 0 7px #11d78b;
}

/* Étapes à venir */
.stepwizard .est-avenir .btn-circle {
  background: #fff; border: 3px solid #cfd8d3; color: #8a9a91;
}

/* Libellés sous les cercles */
.stepwizard .sousetape {
  display: block;
  margin-top: 12px;
  font-size: 13px;
  line-height: 1.3;
  color: #8a9a91;
}
.stepwizard .est-fait .sousetape    { color: #1e5637; }
.stepwizard .est-courant .sousetape { color: #0f2a1c; font-weight: 700; }

@media (max-width: 600px) {
  .stepwizard .stepwizard-step .btn-circle { width: 36px; height: 36px; font-size: 14px; }
  .stepwizard .sousetape { font-size: 11px; }
}

/* ===== Encadré « Contact » ===== */
.encadre-contact {
  position: relative;
  margin: 20px 0 15px;
  padding: 26px 18px 6px;
  border: 2px solid #11d78b;
  border-radius: 16px;
  background: #f5fcf8;
}
.encadre-contact legend {
  /* annule le style Bootstrap 3 de legend (pleine largeur + bordure) */
  width: auto;
  margin: 0;
  padding: 3px 14px;
  border: none;
  border-radius: 999px;
  background: #1e5637;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  position: absolute;
  top: -13px;
  left: 18px;
}