:root {
    --udl-green: #007547;
    --udl-lime: #a2cf6d;
    --udl-dark: #0f392b;
}

body {
    font-family: 'Space Grotesk', 'Segoe UI', sans-serif !important;
}

input, button {
    border-radius: 0 !important;
}

.login-input::placeholder {
    color: rgb(113 113 122);
}

.input-icon {
    color: var(--udl-green) !important;
    transition: color 0.3s ease;
    z-index: 10;
}

.login-input {
    border: 1px solid #a2cf6d !important;
    transition: all 0.3s ease;
    background-color: white;
}

.login-input:hover {
    border-color: var(--udl-green) !important;
}

.login-input:focus {
    border-color: var(--udl-lime) !important;
    box-shadow: 0 0 0 1px rgba(101, 163, 13, 0.3) !important;
}
.login-input:focus ~ .input-icon {
    color: var(--udl-lime) !important;
}

.login-input:not(:placeholder-shown) {
    border-color: var(--udl-lime) !important;
}
.login-input:not(:placeholder-shown) ~ .input-icon {
    color: var(--udl-lime) !important;
}

.btn-udl-register {
    background-color: var(--udl-green);
    color: white;
    border-radius: 0px;
    border: 2px solid var(--udl-green);
    font-weight: 700;
    transition: all 0.3s ease;
}

.btn-udl-register:hover {
    background-color: white;
    color: var(--udl-green);
    transform: translateY(-5px);        
    box-shadow: 0 10px 20px -5px rgba(22, 101, 52, 0.3);
}

.btn-custom-udl {
    color: #007547 !important;
    border: 2px solid #007547 !important;
    background-color: transparent !important;
    transition: all 0.3s ease;
}

.btn-custom-udl:hover {
    color: white !important;
    background-color: #007547 !important;
    box-shadow: 0 0 15px rgba(0, 88, 65, 0.4); 
}

.btn-toggle-password {
    color: var(--udl-green);
    transition: color 0.3s ease;
}

.btn-toggle-password:hover {
    color: #004230 !important;
}

.btn-toggle-password:active {
    color: #a2cf6d !important;
    transform: scale(0.95); 
}

button:disabled, .btn-bloqueado {
    background-color: #d1d5db !important;
    border-color: #9ca3af !important;
    color: #6b7280 !important;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
    opacity: 0.8;
}

@keyframes unlockPulse {
    0% { box-shadow: 0 0 0 0 rgba(0, 117, 71, 0.7); transform: scale(1); }
    50% { box-shadow: 0 0 0 10px rgba(0, 117, 71, 0); transform: scale(1.02); }
    100% { box-shadow: 0 0 0 0 rgba(0, 117, 71, 0); transform: scale(1); }
}

#btnEnviar:not(:disabled) {
    animation: unlockPulse 0.8s ease-out;
    border-color: var(--udl-lime) !important;
    box-shadow: 0 0 15px rgba(162, 207, 109, 0.6);
}

@media (max-width: 640px) {
    .login-input {
        font-size: 0.95rem;
    }
}