/* Estilos mejorados para formularios de login - v2.0 */

/* Campos de entrada mejorados - Mayor especificidad */
form input[type="email"], 
form input[type="password"], 
form input[type="text"],
.card input[type="email"], 
.card input[type="password"], 
.card input[type="text"],
input[type="email"], 
input[type="password"], 
input[type="text"] { 
    padding: 14px 16px !important; 
    font-size: 16px !important; 
    border: 2px solid #e5e5e5 !important;
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
    background: #fff !important;
    background-color: #fff !important;
    color: #333 !important;
    -webkit-text-fill-color: #333 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;
    font-family: inherit !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

form input[type="email"]:focus, 
form input[type="password"]:focus, 
form input[type="text"]:focus,
.card input[type="email"]:focus, 
.card input[type="password"]:focus, 
.card input[type="text"]:focus,
input[type="email"]:focus, 
input[type="password"]:focus, 
input[type="text"]:focus {
    outline: none !important;
    border-color: #6B00FF !important;
    box-shadow: 0 0 0 3px rgba(107, 0, 255, 0.1) !important;
    background: #fff !important;
    background-color: #fff !important;
    color: #333 !important;
    -webkit-text-fill-color: #333 !important;
}

input[type="email"]::placeholder, 
input[type="password"]::placeholder, 
input[type="text"]::placeholder {
    color: #999;
    opacity: 1;
    font-style: normal;
}

input[type="email"]:focus::placeholder, 
input[type="password"]:focus::placeholder, 
input[type="text"]:focus::placeholder {
    color: #ccc;
    opacity: 0.7;
}

/* Estados de validación */
input[type="email"].error, 
input[type="password"].error, 
input[type="text"].error {
    border-color: #e74c3c;
    box-shadow: 0 0 0 3px rgba(231, 76, 60, 0.1);
}

input[type="email"].success, 
input[type="password"].success, 
input[type="text"].success {
    border-color: #27ae60;
    box-shadow: 0 0 0 3px rgba(39, 174, 96, 0.1);
}

/* Información de dominios */
.domain-info {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 12px;
    margin: 16px 0;
    text-align: center;
}

.domain-info p {
    margin: 4px 0;
    font-size: 14px;
}

.domain-info p:first-child {
    color: #6B00FF;
    font-weight: 600;
}

.domain-info p:last-child {
    color: #666;
    font-family: 'Courier New', monospace;
    font-size: 13px;
}

/* Mejoras para accesibilidad */
input[type="email"]:focus-visible, 
input[type="password"]:focus-visible, 
input[type="text"]:focus-visible {
    outline: 2px solid #6B00FF;
    outline-offset: 2px;
}

/* Animaciones suaves */
input[type="email"], 
input[type="password"], 
input[type="text"] {
    transition: border-color 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

/* Estilos para diferentes navegadores */
input[type="email"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="text"]::-webkit-input-placeholder {
    color: #999;
    opacity: 1;
}

input[type="email"]::-moz-placeholder,
input[type="password"]::-moz-placeholder,
input[type="text"]::-moz-placeholder {
    color: #999;
    opacity: 1;
}

input[type="email"]:-ms-input-placeholder,
input[type="password"]:-ms-input-placeholder,
input[type="text"]:-ms-input-placeholder {
    color: #999;
    opacity: 1;
}

/* Responsive design */
@media (max-width: 480px) {
    input[type="email"], 
    input[type="password"], 
    input[type="text"] {
        font-size: 16px; /* Previene zoom en iOS */
        padding: 12px 14px;
    }
}