/* One slider style for every calculator (tools + homepage). Loaded after global.css. */
/* ── Custom range sliders: one style for every tool ── */
.precision-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  border-radius: 9999px;
  background: #e8edf6;
  outline: none;
  cursor: pointer;
  margin: 12px 0 8px;
}
.precision-slider::-webkit-slider-runnable-track {
  height: 6px;
  border-radius: 9999px;
  background: linear-gradient(to right, #2154ff var(--fill, 0%), #e8edf6 var(--fill, 0%));
}
.precision-slider::-moz-range-track { height: 6px; border-radius: 9999px; background: #e8edf6; }
.precision-slider::-moz-range-progress { height: 6px; border-radius: 9999px; background: #2154ff; }
.precision-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ffffff;
  border: 4px solid #2154ff;
  box-shadow: 0 2px 8px rgba(33, 84, 255, 0.25);
  margin-top: -7px;
  cursor: grab;
  transition: box-shadow 0.2s, transform 0.15s;
}
.precision-slider::-moz-range-thumb {
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ffffff;
  border: 4px solid #2154ff;
  box-shadow: 0 2px 8px rgba(33, 84, 255, 0.25);
  cursor: grab;
  transition: box-shadow 0.2s, transform 0.15s;
}
.precision-slider::-webkit-slider-thumb:hover { box-shadow: 0 2px 14px rgba(33, 84, 255, 0.35); transform: scale(1.1); }
.precision-slider::-moz-range-thumb:hover { box-shadow: 0 2px 14px rgba(33, 84, 255, 0.35); transform: scale(1.1); }
.precision-slider::-webkit-slider-thumb:active { cursor: grabbing; }
.precision-slider::-moz-range-thumb:active { cursor: grabbing; }
.precision-slider:focus-visible { outline: 3px solid rgba(33, 84, 255, 0.35); outline-offset: 4px; }

/* Slider row with - / + buttons (built by global.js) */
.slider-controls { grid-template-columns: 32px minmax(0, 1fr) 32px; gap: 10px; margin: 10px 0 4px; }
.slider-controls .precision-slider { margin: 0; height: 6px; }
.slider-controls .btn-minus,
.slider-controls .btn-plus {
  width: 32px;
  height: 32px;
  border: 1px solid #dce6fa;
  border-radius: 10px;
  background: #f6f8fc;
  color: #2154ff;
  font-size: 18px;
}
.slider-controls .btn-minus:hover,
.slider-controls .btn-plus:hover { background: #e6efff; border-color: #9db4ff; }
/* Min / max scale under each slider */
.slider-controls + .flex.justify-between { font-size: 11px; }
/* Bigger thumb on touch screens */
@media (pointer: coarse) {
  .precision-slider::-webkit-slider-thumb { width: 24px; height: 24px; margin-top: -9px; }
  .precision-slider::-moz-range-thumb { width: 24px; height: 24px; }
  /* Square 44px -/+ buttons: easy to tap, no tall narrow pills */
  .slider-controls { grid-template-columns: 44px minmax(0, 1fr) 44px; }
  .slider-controls .btn-minus, .slider-controls .btn-plus { width: 44px; height: 44px; min-height: 44px; }
}