/**
 * Curseurs type="range" unifiés (piste dégradée bleu → vert, partie inactive grise,
 * pouce « pilule » bleu avec ombre et chevrons blancs).
 */
.wb-range-track,
.how-to-loan-page .range-track,
.calc-section .range-track {
  position: relative;
  width: 100%;
  padding: 9px 0;
  box-sizing: border-box;
  background: transparent;
}

.wb-page .wb-range-track {
  margin-bottom: 0.5rem;
}

.how-to-loan-page .range-track {
  margin-bottom: 0.5rem;
}

.calc-section .range-track {
  margin-bottom: 18px;
}

/* Sélecteur commun — ne cible que les curseurs des simulateurs connus */
.wb-page input.wb-range-input[type="range"],
.how-to-loan-page .range-track input[type="range"],
.calc-section input.range-input[type="range"],
#sliderMontant,
#sliderDuree {
  --pct: 50%;
  --bondora-range-blue: #448dbf;
  --bondora-range-lime: #99df2b;
  --bondora-range-gray: #e5e7eb;
  --bondora-range-thumb-h: 24px;
  --bondora-range-thumb-w: 54px;
  --bondora-range-track-h: 6px;
  --bondora-range-thumb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 24'%3E%3Cpath stroke='%23ffffff' stroke-width='2.75' stroke-linecap='round' stroke-linejoin='round' fill='none' d='M18 7l-5 5 5 5m12-10l5 5-5 5'/%3E%3C/svg%3E");

  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: var(--bondora-range-track-h);
  margin: 0;
  background: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  display: block;
  position: relative;
  -moz-appearance: none;
}

.wb-page input.wb-range-input[type="range"]::-webkit-slider-runnable-track,
.how-to-loan-page .range-track input[type="range"]::-webkit-slider-runnable-track,
.calc-section input.range-input[type="range"]::-webkit-slider-runnable-track,
#sliderMontant::-webkit-slider-runnable-track,
#sliderDuree::-webkit-slider-runnable-track {
  width: 100%;
  height: var(--bondora-range-track-h);
  border-radius: 9999px;
  background: linear-gradient(
    90deg,
    var(--bondora-range-blue) 0%,
    var(--bondora-range-lime) var(--pct),
    var(--bondora-range-gray) var(--pct),
    var(--bondora-range-gray) 100%
  );
}

.wb-page input.wb-range-input[type="range"]::-webkit-slider-thumb,
.how-to-loan-page .range-track input[type="range"]::-webkit-slider-thumb,
.calc-section input.range-input[type="range"]::-webkit-slider-thumb,
#sliderMontant::-webkit-slider-thumb,
#sliderDuree::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: var(--bondora-range-thumb-w);
  height: var(--bondora-range-thumb-h);
  margin-top: calc((var(--bondora-range-track-h) - var(--bondora-range-thumb-h)) / 2);
  border: none;
  border-radius: 9999px;
  background: var(--bondora-range-blue) var(--bondora-range-thumb-icon) no-repeat center;
  background-size: 36px 16px;
  box-shadow: 0 2px 10px rgba(68, 141, 191, 0.45);
  cursor: ew-resize;
}

.wb-page input.wb-range-input[type="range"]::-moz-range-track,
.how-to-loan-page .range-track input[type="range"]::-moz-range-track,
.calc-section input.range-input[type="range"]::-moz-range-track,
#sliderMontant::-moz-range-track,
#sliderDuree::-moz-range-track {
  height: var(--bondora-range-track-h);
  border-radius: 9999px;
  background: var(--bondora-range-gray);
  border: none;
}

.wb-page input.wb-range-input[type="range"]::-moz-range-progress,
.how-to-loan-page .range-track input[type="range"]::-moz-range-progress,
.calc-section input.range-input[type="range"]::-moz-range-progress,
#sliderMontant::-moz-range-progress,
#sliderDuree::-moz-range-progress {
  height: var(--bondora-range-track-h);
  border-radius: 9999px;
  background: linear-gradient(90deg, var(--bondora-range-blue), var(--bondora-range-lime));
}

.wb-page input.wb-range-input[type="range"]::-moz-range-thumb,
.how-to-loan-page .range-track input[type="range"]::-moz-range-thumb,
.calc-section input.range-input[type="range"]::-moz-range-thumb,
#sliderMontant::-moz-range-thumb,
#sliderDuree::-moz-range-thumb {
  width: var(--bondora-range-thumb-w);
  height: var(--bondora-range-thumb-h);
  border: none;
  border-radius: 9999px;
  background: var(--bondora-range-blue) var(--bondora-range-thumb-icon) no-repeat center;
  background-size: 36px 16px;
  box-shadow: 0 2px 10px rgba(68, 141, 191, 0.45);
  cursor: ew-resize;
}
