/*
 * Archivo: login.css
 * Descripción: Estilos específicos para la página de inicio de sesión SIGA 360.
 */

/* --- Variables CSS para el tema --- */
:root {
  --color-primary-siga: #2e8b57; /* Verde Sea Green */
  --color-text-dark: #2b2b2b;
  --color-text-secondary: #6c757d;
  --color-bg-light: #ffffff;
  --color-input-border: #ced4da; /* Color de borde por defecto de Bootstrap */
}

/* --- Estilos Globales y de Layout --- */
body {
  font-family: 'Poppins', sans-serif;
  background: linear-gradient(135deg, #f6f9fc, #e9f1ff);
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* --- Contenedor Principal de Login --- */
.login-container {
  background-color: var(--color-bg-light);
  border-radius: 1rem;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  max-width: 850px;
  width: 100%;
}

/* --- Panel Izquierdo (Visual) --- */
.login-left {
  background: linear-gradient(160deg, #e9f7ef 0%, #ffffff 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}

.login-left img {
  max-width: 85%;
  height: auto;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,0.1));
}

/* --- Panel Derecho (Formulario) --- */
.login-right {
  padding: 3rem 2.5rem;
}

.login-right h2 {
  font-weight: 600;
  color: var(--color-text-dark);
  text-align: center;
}

.login-right p {
  text-align: center;
  color: var(--color-text-secondary);
  margin-bottom: 2rem;
  font-size: 0.95rem;
}

/* --- Estilos de Formulario --- */
.form-label {
  color: #333;
  font-weight: 500;
}

.form-control {
  border-radius: 0.5rem;
  padding: 0.75rem;
  font-size: 1rem;
}

/* --- Botón Primario (Login) --- */
.btn-primary {
  background-color: var(--color-primary-siga);
  border: none;
  transition: all 0.3s ease-in-out;
}

.btn-primary:hover {
  background-color: #267347; /* Un color ligeramente más oscuro para el hover */
}

/* --- Enlaces de Color Principal --- */
.text-siga {
  color: var(--color-primary-siga) !important;
}

/* --- Footer --- */
.footer {
  text-align: center;
  color: var(--color-text-secondary);
  font-size: 0.85rem;
  margin-top: 1.5rem;
}

/* --- Media Queries (Responsividad) --- */
@media (max-width: 767px) {
  .login-left {
    display: none; /* Oculta la imagen en dispositivos móviles */
  }
  .login-right {
    padding: 2rem 1.5rem;
  }
}