.slider-button-ressource {
  position: relative;
  width: 154px;
  /* height: 32px; */
  border-radius: 999px;
  background-color: white;
  border: 2px solid #fbfbfb;
  padding: 15px;
  border: none;
  cursor: pointer;
  transition: background-color 0.3s ease-in-out;
}

.slider-button {
  position: relative;
  width: 154px;
  /* height: 32px; */
  border-radius: 999px;
  background-color: #e9f7fe;
  padding: 15px;
  border: none;
  cursor: pointer;
  transition: background-color 0.3s ease-in-out;
}

.slider-button:focus {
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #3b82f6;
}

.slider-button-ressource.active {
  background-color: #139cbc;
}

.slider-button.active {
  /* background-color: #3b82f6; */

  background-color: white;
}

.slider-circle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  background-color: #139cbc;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition: transform 0.3s ease-in-out;
}
.slider-text {
  transition: transform 0.3s ease-in-out;
}

.slider-button.active .slider-circle {
  transform: translateX(100px);
}

.slider-button.active .slider-text {
  transform: translateX(100px);
}

.slider-button-ressource.active .slider-text {
  transform: translateX(-30px);
  color: white;
}

.slider-button-ressource.active .slider-circle {
  transform: translateX(100px);
  background-color: #ef532b;
}

.slider-button.active .slider-text {
  transform: translateX(-30px);
}