:host {
  @apply inline-block relative focus:outline-none;
}

.quantity-control__button {
  @apply flex items-center justify-between gap-2 px-4 py-2;
}

.quantity-control__input {
  @apply bg-transparent focus:outline-none focus-visible:outline-none text-center px-2 py-2;
}

.quantity-control__dropdown {
  @apply bg-isa-white list-none m-0 flex flex-col w-[6.0625rem] p-1 items-center max-h-[300px] overflow-y-auto rounded-[1.25rem] shadow-[0_0_16px_0_rgba(0,0,0,0.15)];
}

/* Remove number input spinner buttons */
input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type='number'] {
  -moz-appearance: textfield;
}

input[type='number']::placeholder {
  text-align: center;
  font-weight: 400;
}
