/* style.css */
body, html { height: 100%; font-family: 'Poppins', sans-serif; }
body { display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); }
.login-container { width: 100%; max-width: 480px; padding: 15px; }
.login-card { background-color: #ffffff; border-radius: 15px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); border: none; overflow: hidden; }
.login-icon { font-size: 3.5rem; color: #764ba2; }
.card-title { font-weight: 600; color: #333; }
.form-control-lg { height: 55px; border-radius: 8px; border: 1px solid #ddd; }
.form-control-lg:focus { box-shadow: 0 0 0 0.25rem rgba(102, 126, 234, 0.25); border-color: #667eea; }
.input-group-text { background-color: #f8f9fa; border: 1px solid #ddd; border-right: none; border-radius: 8px 0 0 8px; font-size: 1.2rem; }
.btn { font-weight: 600; padding-top: 0.8rem; padding-bottom: 0.8rem; transition: background-color 0.3s ease, border-color 0.3s ease; }
.btn-primary { background-color: #667eea; border-color: #667eea; }
.btn-primary:hover { background-color: #5a6fd8; border-color: #5a6fd8; }


.btn-metodo {
    background-color: #f1f3f5;
    color: #495057;
    border: 1px solid #dee2e6;
    flex-grow: 1;
}

.btn-metodo.active {
    background-color: #667eea;
    color: #ffffff;
    border-color: #667eea;
}

.btn-metodo:hover:not(.active) {
    background-color: #e9ecef;
}