/* Jumbo Tourisme · panneau d'estimation (colonne de droite du widget BeandBus) · v1.0.0
   Couleurs surchargeables sur le conteneur du widget : --jte-bg, --jte-accent, --jte-ink. */
.bbf .jte {
  --jte-bg: #0C3D52;
  --jte-accent: #23B7C5;
  --jte-ink: #fff;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px 18px 16px;
  border-radius: var(--bbf-radius, 18px);
  background: var(--jte-bg);
  color: var(--jte-ink);
  font-family: var(--bbf-font, Manrope, system-ui, sans-serif);
}
.bbf .jte-kicker {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .72);
}
.bbf .jte-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--jte-accent); flex: none; }
.bbf .jte-range { font-size: 26px; font-weight: 800; letter-spacing: -.03em; line-height: 1.12; }
.bbf .jte-range--pending { font-size: 17px; }
.bbf .jte-sub { margin-top: -5px; font-size: 12.5px; font-weight: 600; color: rgba(255, 255, 255, .74); }
.bbf .jte-lines { margin: 2px 0 0; display: flex; flex-direction: column; }
.bbf .jte-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-top: 1px solid rgba(255, 255, 255, .12);
  font-size: 12.5px;
  line-height: 1.4;
}
.bbf .jte-line dt { flex: none; font-weight: 700; color: rgba(255, 255, 255, .62); }
.bbf .jte-line dd { margin: 0; font-weight: 600; text-align: right; }
.bbf .jte-msg { margin: 0; font-size: 12.5px; font-weight: 500; line-height: 1.55; color: rgba(255, 255, 255, .84); text-wrap: pretty; }
.bbf .jte-note { margin: 0; font-size: 11px; font-weight: 500; line-height: 1.5; color: rgba(255, 255, 255, .56); text-wrap: pretty; }

/* Correctifs de cascade du widget sur un site hôte (voir BEANDBUS-INTEGRATION.md §3) */
.bbf button.bbf-next, .bbf button.bbf-next:hover { color: #fff; }
.bbf button.bbf-back, .bbf button.bbf-lnk { color: #5B6874; }
.bbf button.bbf-lnk, .bbf button.bbf-unimport, .bbf button.bbf-add-stop { color: var(--bbf-accent-hi, #0C3D52); }
/* La colonne de droite colle sous l'en-tête collant du site (98 px), en mode deux colonnes seulement.
   Sous 900 px de conteneur, le widget passe en une colonne et place la colonne au-dessus du formulaire :
   elle ne doit plus être collante, sinon elle recouvre les questions. Le conteneur .bbf est déjà
   « container-type: inline-size » (beandbus-form.css). */
.bbf .bbf-aside { top: 114px; }
@container (max-width: 900px) {
  .bbf-aside { position: static; top: auto; }
  .jte { padding: 16px; }
}
