﻿:root {
    --azul-corporativo: #003366;
    --azul-fuerte: #002244;
    --plata-claro: #f4f6f7;
    --texto-negro: #1a1a1a; /* Máximo contraste */
    --borde-enfocado: #0056b3;
    /* Fuente más legible */
    --font-family-login: 'Segoe UI', Arial, sans-serif;
    --bg-general: linear-gradient(135deg, #73b7dc 0%, #003366 100%)
}

.contenedor-login {
    width: 100%;
    min-height: 100vh;
    background: var(--bg-general);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px; /* Espacio para móviles */
}

.login-card {
    background: #ffffff;
    padding: 3.5rem; /* Más espacio interno */
    border-radius: 1.5rem;
    box-shadow: 0 15px 35px rgba(0,0,0,0.3);
    width: 100%;
    max-width: 550px; /* Un poco más ancha para campos grandes */
}

/* --- LOGO IMG ---*/
.img_contenedor {
    display: flex;
    justify-content: center;
}
/* --- TEXTOS --- */
.subtitle-login {
    font-size: 1.4rem; /* Aumentado */
    line-height: 1.4;
    font-weight: 500;
    color: var(--texto-negro);
    margin-bottom: 2.5rem;
}

/* --- CAMPOS (INPUTS) --- */

.estilos-inputs-login {
    font-size: 1.4rem !important; /* Texto mucho más grande al escribir */
    padding: 1.2rem !important; /* Campo más alto y fácil de tocar */
    height: auto !important;
    border: 2px solid #7f8c8d !important; /* Borde más grueso y visible */
    border-radius: 0.8rem;
    margin-bottom: 1.5rem;
    background-color: var(--plata-claro);
    color: var(--texto-negro);
}

    .estilos-inputs-login:focus {
        border-color: var(--borde-enfocado) !important;
        box-shadow: 0 0 0 4px rgba(0, 86, 179, 0.25); /* Indicador visual de foco claro */
        outline: none;
    }

    /* Aumentar tamaño del placeholder */
    .estilos-inputs-login::placeholder {
        font-size: 1.2rem;
        color: #555;
    }

/* --- BOTÓN --- */

.btn-login {
    font-size: 1.5rem; /* Botón muy legible */
    font-weight: 800;
    padding: 1.2rem;
    border-radius: 0.8rem;
    background: var(--azul-corporativo);
    color: white;
    width: 100%;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    text-transform: uppercase;
    letter-spacing: 1px;
}

    .btn-login:hover, .btn-login:focus {
        background: var(--azul-fuerte);
        transform: scale(1.02); /* Feedback visual sutil */
        box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    }

/* Mensajes de error más grandes */
.alert-danger {
    font-size: 1.2rem;
    font-weight: bold;
    border: 2px solid #c0392b;
    margin-top: 1.5rem;
}
