/* ==== Import de la police du site (Jost) ==== */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@400;500;600;700&display=swap');

/* ==== Typo générale : aligner sur cyclobike.fr ==== */
body,
#booking_layout,
.step_info_item,
.tab-pd,
.btn {
  font-family: 'Jost', sans-serif !important;
}
body, body * {
  font-family: 'Jost', sans-serif !important;
}
body {
  color: #676767;
}

/* ==== Titres (cartes établissement, services...) ==== */
.cap.short,
h1, h2, h3 {
  font-family: 'Jost', sans-serif !important;
  color: #232323 !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

/* ==== Barre d'étapes (Lieu / Catégorie / Service / Heure / Client) ==== */
.step_info_item {
  background: #f8f8f8;
  color: #676767;
  border-radius: 2px;
}

.step_info_item.active {
  background: #21991D !important; /* vert cyclobike */
  color: #ffffff !important;
}

/* ==== Cartes établissement / service ==== */
.tab.tab-col {
  background: #ffffff;
  border: 1px solid #dadada;
  border-radius: 2px;
  box-shadow: none;
}

/* ==== Boutons (Sélectionner, Réserver, etc.) ==== */
.btn,
.btn.select,
button,
a.button {
  background: #21991D !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 2px !important;
  font-weight: 500 !important;
  text-transform: none;
  padding: 12px 25px !important;
  transition: opacity 0.2s ease;
}

.btn:hover,
.btn.select:hover,
button:hover {
  opacity: 0.85;
}

/* ==== Bouton secondaire / retour (noir, comme le CTA sombre du site) ==== */
.btn.secondary,
.btn.back {
  background: #232323 !important;
  color: #ffffff !important;
}
/* ==== Titres de section (A propos de nous, Horaires d'ouverture, etc.) ==== */
.title-main {
  font-family: 'Jost', sans-serif !important;
  color: #232323 !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

/* ==== Jours dans le tableau des horaires ==== */
.day,
.overview td {
  font-family: 'Jost', sans-serif !important;
  color: #232323 !important;
  font-weight: 500 !important;
}
/* ==== Barre d'étapes : forcer Jost sur le texte des étapes ==== */
.title-small {
  font-family: 'Jost', sans-serif !important;
}

/* ==== Filet de sécurité : tout ce qui est dans la timeline des étapes ==== */
#sb-timeline, #sb-timeline * {
  font-family: 'Jost', sans-serif !important;
}