/* STRIPE button */
#stripeButton {
    border-radius: 10px;
    font-size: 4px;
    background-color: #635BFF !important;
    font-weight: bold;
}

#stripeButton:hover {
    background-color: #5047E4;
    transform: scale(1.02);
    transition: all 0.2s ease-in-out;
}

/* PAYPAL button (legacy, non usato ora ma lo lasciamo) */
#paypalButton {
    border-radius: 10px;
    font-size: 28px;
    background-color: #253B80;
    font-weight: bold;
}

/* Input fields radius */
#amount,
#description,
#currency {
    border-radius: 5px;
}

/* Custom amount width */
#amount {
    max-width: 100px;
}

/* Center stripe logo */
#img-logo {
    margin: 0 auto !important;
}

/* --------------------------------------------- */
/* REMOVE NUMBER INPUT ARROWS (mobile + desktop) */
/* --------------------------------------------- */

/* Chrome, Safari, Edge */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/* --------------------------------------------- */
/* PRESET BUTTONS                                */
/* --------------------------------------------- */

/* Horizontal spacing — reliable across Tailwind Starter Kit */
.preset-btn {
    margin: 0 0.5rem;
    min-width: 70px;
    text-align: center;
}

/* Larger devices (optional fine tuning) */
@media (min-width: 768px) {
    .preset-btn {
        margin: 0 0.6rem;
    }
}

/* ACTIVE preset (clicked/selected) */
.preset-btn.active {
    background-color: #193647 !important;
    color: white !important;
}