/* =====================================================
   style.css — Estilos del sistema de autenticación
   ===================================================== */

*, *::before, *::after { box-sizing: border-box; }

body {
    font-family: 'Segoe UI', sans-serif;
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    margin: 0;
}

.container {
    background: #ffffff;
    padding: 2.5rem;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    width: 360px;
}

h2, h1 {
    margin-top: 0;
    color: #1a1a2e;
    font-size: 1.5rem;
    text-align: center;
}

.success-icon {
    font-size: 3rem;
    text-align: center;
    margin-bottom: 0.5rem;
}

input {
    width: 100%;
    padding: 11px 14px;
    margin: 8px 0;
    border: 1.5px solid #dde1e7;
    border-radius: 6px;
    font-size: 0.95rem;
    transition: border-color 0.2s;
    outline: none;
}

input:focus {
    border-color: #0f3460;
    box-shadow: 0 0 0 3px rgba(15, 52, 96, 0.12);
}

button {
    width: 100%;
    padding: 11px;
    margin-top: 12px;
    background: #0f3460;
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 600;
    transition: background 0.2s, transform 0.1s;
}

button:hover:not(:disabled) { background: #16213e; }
button:active:not(:disabled) { transform: scale(0.98); }
button:disabled { opacity: 0.6; cursor: not-allowed; }

.btn-danger { background: #dc3545; margin-top: 16px; }
.btn-danger:hover:not(:disabled) { background: #b02a37; }

p { font-size: 0.88rem; text-align: center; color: #555; margin-top: 1.2rem; }
a { color: #0f3460; font-weight: 600; text-decoration: none; }
a:hover { text-decoration: underline; }

.error {
    background: #fff0f0;
    color: #c0392b;
    border: 1px solid #f5c6cb;
    border-radius: 6px;
    padding: 9px 12px;
    font-size: 0.85rem;
    margin-bottom: 10px;
}

.msg-warn {
    background: #fff8e1;
    color: #856404;
    border: 1px solid #ffc107;
    border-radius: 6px;
    padding: 9px 12px;
    font-size: 0.85rem;
    margin-bottom: 10px;
}

.session-info {
    font-size: 0.78rem;
    color: #888;
    margin: 4px 0 16px;
}

.requisitos {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 10px 14px;
    margin-bottom: 10px;
    font-size: 0.82rem;
    color: #444;
}
.requisitos p { margin: 0 0 5px; text-align: left; font-weight: 600; }
.requisitos ul { margin: 0; padding-left: 16px; }
.requisitos li { margin: 2px 0; }

.container-bienvenida {
    width: 420px;
    text-align: center;
}