.calcSlider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  border-radius: 3px;
  outline: none;
  cursor: pointer;
  --slider-track: #e5e7eb;
}

:global(.dark) .calcSlider {
  --slider-track: #1f2937;
}

.calcSlider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #155dfc;
  border: 2px solid #fff;
  cursor: pointer;
  transition: transform 0.15s;
  box-shadow: 0 0 8px rgba(21, 93, 252, 0.5);
}

.calcSlider::-webkit-slider-thumb:hover {
  transform: scale(1.15);
}

.calcSlider::-moz-range-thumb {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #155dfc;
  border: 2px solid #fff;
  cursor: pointer;
  box-shadow: 0 0 8px rgba(21, 93, 252, 0.5);
}

.calcSlider::-moz-range-track {
  height: 6px;
  border-radius: 3px;
  background: var(--slider-track);
}

.calcSlider::-moz-range-progress {
  background: #155dfc;
  border-radius: 3px;
  height: 6px;
}

.calcSlider:focus-visible::-webkit-slider-thumb {
  box-shadow:
    0 0 0 3px rgba(21, 93, 252, 0.3),
    0 0 8px rgba(21, 93, 252, 0.5);
}
