/* === Reset flechitas nativas del input number === */
.quantity input.qty::-webkit-outer-spin-button,
.quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.quantity input.qty[type=number] { -moz-appearance: textfield; }

/* === Bloque – [1] + (tres celdas cuadradas) === */
.qs-qty{
  /* Vars */
  --qs-size: 40px;                 /* tamaño de cada celda (JS lo ajusta al alto real) */
  --qs-border: #2a2a2a;
  --qs-font: #111;

  position: relative;
  display: inline-flex;
  align-items: stretch;
  line-height: 0;
  box-sizing: border-box;
  height: var(--qs-size);
  border: 1px solid var(--qs-border);
  border-radius: 0;
  background: transparent;
  overflow: hidden;
}

/* Celdas (botones e input) */
.qs-qty .qs-btn,
.qs-qty .qs-input{
  flex: 0 0 var(--qs-size);
  width: var(--qs-size);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border: 0;
  background: transparent;
  border-radius: 0;
  line-height: 1;
  font-size: 16px;
  transition: all 0.2s ease;       /* animación suave en hover */
}

/* Input central */
.qs-qty .qs-input{
  width: var(--qs-size) !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border-left: 1px solid var(--qs-border);
  border-right: 1px solid var(--qs-border);
  border-top: 0;
  border-bottom: 0;
  text-align: center;
  font-weight: 600;
  color: var(--qs-font);
}

/* Botones: normal */
.qs-qty .qs-btn{
  cursor: pointer;
  user-select: none;
  color: var(--qs-font);
}

/* Botones: hover → fondo negro, texto blanco */
.qs-qty .qs-btn:hover{
  background: #000 !important;
  color: #fff !important;
}

/* Focus accesible */
.qs-qty .qs-btn:focus,
.qs-qty .qs-input:focus{
  outline: 1px dashed var(--qs-border);
  outline-offset: -2px;
}

/* WooCommerce fix */
.woocommerce .quantity{ display:inline-block; }

/* Opcional: más cómodo en móvil
@media (max-width:480px){
  .qs-qty{ --qs-size: 44px; }
  .qs-qty .qs-input, .qs-qty .qs-btn{ font-size:18px; }
}
*/