/* Styling kecil untuk elemen native yang tidak dihasilkan Tailwind build
   (radix Slider di versi React diganti <input type="range"> native di sini).
   Pakai CSS variable yang sama persis dari style.css supaya senada. */

.kt-slider {
  -webkit-appearance: none;
  appearance: none;
  height: 4px;
  border-radius: 999px;
  background: var(--secondary);
  outline: none;
  cursor: pointer;
}

.kt-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: var(--gold);
  border: 2px solid var(--background);
  box-shadow: var(--shadow-soft);
  cursor: pointer;
}

.kt-slider::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: var(--gold);
  border: 2px solid var(--background);
  box-shadow: var(--shadow-soft);
  cursor: pointer;
}

.kt-slider::-moz-range-track {
  height: 4px;
  border-radius: 999px;
  background: var(--secondary);
}