:root {
    --degradat-blau: linear-gradient(120deg, #48a8f6, #557aed);
    --cancellar: #ff3131;
    --fondo: #2e2e2e;

    --gris-negro: #1d1d1d;
    --gris-oscuro: #181818;
    --gris-bloqueado: #282828;
    --gris-input: #303030;

    --gris-text-bloqueado: #828282;
}

html body {
    background-color: var(--fondo);
    color: white;
    font-family: Arial, Helvetica, sans-serif;
}

.error {
    color: var(--cancellar);
    font-style: italic;
    cursor: help;
}
.error-inesperado {
    color: var(--cancellar);
    font-style: italic;
}
.notificacion {
    color: var(--cancellar);

}
input {
    height: 20px;
    background-color: var(--gris-input);
    color: white;
    border: none;
    border-radius: 0.5em;
}
.btn:disabled {
    background-image: var(--gris-bloqueado);
    color: var(--gris-text-bloqueado);
    width: 30%;
    height: 4.5vh;
    padding: 0 25px;
    margin: 20px 0 20px;
    cursor: not-allowed;
}
.btn {
    background-image: var(--degradat-blau);
    font-weight: bold;
    width: 30%;
    height: 4.5vh;
    padding: 0 25px;
    margin: 20px 0 20px;
    cursor: pointer;
}
@media (max-width: 768px) {
    .btn:disabled {
        padding: 0;
    }
    .btn {
        padding: 0 25px;
    }
}