@media (min-width: 768px) { .w-md-50 { width: 50%; } }

.simulator .label { opacity: .5; }

.simulator .separador {
  background-color: #EFEFEF;
  width: .5rem;
  margin: 0 1rem;
}

.simulator .text-red  { color: var(--red); }
.simulator .text-blue { color: blue; }

.simulator .box {
  background-color: #EFEFEF;
  height: 150px;
  border-radius: 8px;
}
.simulator .box h2 { font-size: 1.5rem; }

.simulator h3 {
  font-weight: bold;
  font-size: 1.3rem;
  margin-bottom: 35px;
}

/* jQuery UI slider */
.simulator .ui-widget-content, .simulator .ui-widget-header {
  height: 15px;
  border: 0;
  border-radius: 8px;
  background-color: #686868;
  cursor: pointer;
  display: block;
  position: relative;
  width: 80%;
  margin: 0 auto;
}

.simulator #custom-handle {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: var(--red);
  border: 0;
  border-radius: 8px;
  padding: 12px;
  cursor: pointer;
  display: block;
  height: auto;
  width: 215px;
  margin-top: -28px;
  margin-left: -6rem;
  outline: none;
  position: absolute;
  top: 50%;
  font-size: 1.6rem;
  color: white;
  text-align: center;
  left: 98%;
  z-index: 9;
}

/* MOBILE */
@media (max-width: 767.98px){
  .simulator .d-md-flex > div { width:100% !important; }
  .simulator .separador { display:none !important; }
  #amount_mobile { margin-top:1rem; }
  .simulator .box h2 { font-size:20px; }
  .simulator h3 { font-size:18px; }
  .simulator .label { display:block; margin-top:.5rem; color:#6c757d; }
  .simulator .form-check-inline { margin-right:.75rem; }
}

/* ===== Simulador – Tablet: tornar o slider 100% tocável ===== */
@media (min-width:768px) and (max-width:1024px){
  .simulador .ui-slider,
  .simulador .ui-slider *{
    -ms-touch-action: none;
    touch-action: none;        /* não deixe o browser “pegar” o gesto */
  }
  .simulador .ui-slider,
  .simulador .ui-slider-handle{
    pointer-events: auto;      /* garante que o handle receba o toque */
    z-index: 10;
    cursor: pointer;
  }

  /* se houver alguma bolha/tooltip que não seja o próprio handle,
     não deixe ela capturar o toque por cima do trilho */
  .simulador .range-value,
  .simulador .range-value *{
    pointer-events: none !important;
  }
}
