/* ── Login page — estilos independientes del tema oscuro de la app ── */

:root {
  --login-dark:       #1E3A5F;
  --login-dark-hover: #152d4a;
  --login-mid:        #2980B9;
  --login-bg-input:   #fafbfd;
  --login-bg-card:    #ffffff;
  --login-border:     #e3e8ef;
  --login-radius:     7px;
  --font-body:        'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
}

* { box-sizing: border-box; }

body {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, #0a1520 0%, #1E3A5F 50%, #1a4a7a 100%);
  font-family: var(--font-body);
  font-size: .855rem;
  color: #1e293b;
  -webkit-font-smoothing: antialiased;
}

.login-wrap {
  width: 100%;
  max-width: 420px;
  padding: 0 16px;
}

.login-header {
  background: linear-gradient(135deg, #1E3A5F 0%, #2980B9 100%);
}

.login-footer {
  background: #f8fafc;
  border-top: 1px solid #eef1f5;
}

/* Grupos de campo con label en mayúsculas */
.field-group { margin-bottom: 14px; }
.field-group label {
  font-size: .69rem;
  font-weight: 600;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 5px;
  display: block;
}

/* Inputs */
.form-control {
  border-color: var(--login-border);
  border-radius: var(--login-radius);
  background-color: var(--login-bg-input);
  font-size: .855rem;
  color: #1e293b;
  transition: border-color .15s, box-shadow .15s;
}
.form-control:focus {
  border-color: var(--login-mid);
  background: var(--login-bg-card);
  box-shadow: 0 0 0 3px rgba(41, 128, 185, .12);
}

/* Botón primario */
.btn {
  font-weight: 500;
  letter-spacing: .01em;
  border-radius: var(--login-radius);
  transition: all .15s ease;
}
.btn-primary {
  background: var(--login-dark);
  border-color: var(--login-dark);
}
.btn-primary:hover,
.btn-primary:focus {
  background: var(--login-dark-hover);
  border-color: var(--login-dark-hover);
  box-shadow: 0 0 0 3px rgba(30, 58, 95, .22);
}