/* 


*/

/* Thermometer container */

/* Container for the thermometer */
.classy-thermometer-container {
  text-align: center;
  margin: 20px 0;
}

/* Thermometer container */
.classy-thermometer {
  position: relative;
  width: 100%;

  height: 30px;
  border: 1px solid #ccc;
  background-color: #f9f9f9;
  border-radius: 15px;
  overflow: hidden;

  display: flex;
}

/* Thermometer progress */
.classy-thermometer-progress {
  /* position: absolute; */
  top: 0;
  left: 0;

  height: 100%;
  background-color: #d04c33;
  width: 0; /* Default width, will be set by JavaScript */
  transition: width 2s linear; /* Smooth transition for the width */
  /* display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: bold; */
}

/* Labels on the progress bar */
.classy-thermometer-labels {
  font-size: large;
  font-family: "Montserrat";
  position: relative;
  width: 100%;
  text-align: center;
  color: black; /* Use a color that contrasts with the progress bar */
  font-weight: bold;
  z-index: 10; /* Ensure it is above the progress bar */
  pointer-events: none; /* Ensure the text is not interactive */
}

.car-icon {
  /* position: absolute;
  top: 50%;
  right: -20px;
  transform: translate(-50%, -50%); */
  height: 30px; /* Adjust the size of the car icon as needed */
  width: auto;
}
.stroked-text {
  color: black; /* Fill color */
  text-shadow: -1.5px -1.5px 0 white, 1px -1px 0 white, -1px 1px 0 white,
    1px 1px 0 rgb(255, 255, 255); /* Stroke color and size */
}

.tooltip-container {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

/* Style for the tooltip text */
.tooltip-text {
  visibility: hidden;
  font-weight: bold;
  line-height: 100%;
  /* width: 60px; */
  /* background-color: black; */
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px;

  z-index: 10;
  margin: auto;
  opacity: 0;
  transition: opacity 0.3s;
}

/* Show the tooltip text when hovering over the tooltip container */
.tooltip-container:hover .tooltip-text {
  visibility: visible;
  opacity: 1;
}
