body.login-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 20% 12%, rgba(65, 244, 223, 0.18), transparent 30%),
        radial-gradient(circle at 82% 18%, rgba(89, 168, 255, 0.16), transparent 28%),
        linear-gradient(180deg, #05070d 0%, #08111c 100%);
    color: #f5fbff;
}

.login-box {
    width: min(760px, calc(100% - 28px));
}

.card {
    background: rgba(10, 18, 31, 0.92);
    border: 1px solid rgba(65, 244, 223, 0.24) !important;
    border-radius: 8px;
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.35);
}

.card-header,
.card-body {
    background: transparent;
}

h2,
label {
    color: #f5fbff;
}

input,
select,
textarea,
.form-control {
    border-radius: 8px !important;
}

/* Estilos generales */
label {
    font-weight: bold;
}

.form-group {
    margin-bottom: 20px;
}

.required::after {
    content: '*';
    color: red;
}

.error-message {
    color: red;
}

.center-text {
    text-align: center;
    margin: 0 auto;
}

.large-input {
    width: 100%;
}

/* Estilos para los checkboxes y botón */
.form-group-pd {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-group-pd label,
.form-group-pd input {
    display: block;
    margin-bottom: 10px;
}

.form-group-pd label {
    margin-right: 10px;
}

button[type="submit"],
.step-button {
    background: linear-gradient(135deg, #41f4df, #59a8ff);
    color: #061018;
    border: none;
    border-radius: 8px;
    font-weight: 800;
    padding: 10px 20px;
    cursor: pointer;
    transition: transform 0.3s, box-shadow 0.3s;
}

/* Efecto de zoom al pasar el ratón */
button[type="submit"]:hover,
.step-button:hover {
    transform: scale(1.1);
}

/* Efecto de zoom al hacer clic */
button[type="submit"]:active,
.step-button:active {
    transform: scale(0.9);
    box-shadow: none;
}