:root { --accent: #5b8def; --accent-dark: #3f6fd1; --brand: #16181d; --border-c: #e3e3e6; }
* { box-sizing: border-box; }
body {
  margin: 0; background: #f7f7f8; min-height: 100vh; display: flex;
  align-items: center; justify-content: center;
  font-family: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.login-card { width: 100%; max-width: 380px; padding: 1.5rem; }
.brand { text-align: center; margin-bottom: 2rem; }
.brand h1 { font-size: 1.5rem; font-weight: 500; color: var(--brand); margin: 0 0 .25rem; letter-spacing: .01em; }
.brand p  { color: #8a8d98; font-size: .875rem; margin: 0; }
.card { background: #fff; border: 1px solid var(--border-c); border-radius: 10px; padding: 1.5rem; }
.card h5 { margin: 0 0 1rem; font-size: 1.05rem; font-weight: 500; color: var(--brand); }
.alert { padding: .6rem .9rem; border-radius: 6px; font-size: .85rem; margin-bottom: 1rem; }
.alert-danger { background: #fcebeb; color: #791f1f; border: 1px solid #f7c1c1; }
.alert-success { background: #eaf3de; color: #27500a; border: 1px solid #c0dd97; }
.form-group { margin-bottom: 1rem; }
.form-label { display: block; font-size: .8rem; font-weight: 500; color: #44464d; margin-bottom: .35rem; }
.form-control {
  width: 100%; padding: .55rem .75rem; font-size: .95rem; border: 1px solid var(--border-c);
  border-radius: 6px; outline: none; transition: border-color .15s, box-shadow .15s;
}
.form-control:focus { border-color: var(--accent); box-shadow: 0 0 0 .2rem rgba(91,141,239,.15); }
.btn {
  display: block; width: 100%; padding: .6rem; font-size: .95rem; font-weight: 500;
  border: none; border-radius: 6px; cursor: pointer; text-align: center; text-decoration: none;
  transition: background .15s, opacity .15s;
}
.btn:hover { opacity: .92; }
.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-dark); opacity: 1; }
.btn-link-secondary {
  background: transparent; color: var(--brand); border: 1px solid var(--border-c); margin-top: .6rem;
}
.alert-warning { background: #faeeda; color: #633806; border: 1px solid #fac775; }

.theme-toggle {
  position: absolute; top: 1rem; right: 1rem; width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--border-c); background: #fff; color: var(--brand); display: flex;
  align-items: center; justify-content: center; cursor: pointer; font-size: 1rem;
}

/* Modo oscuro */
[data-bs-theme="dark"] body { background: #0f1115; }
[data-bs-theme="dark"] .brand h1 { color: #f1f1f3; }
[data-bs-theme="dark"] .brand p { color: #8a8d98; }
[data-bs-theme="dark"] .card { background: #1a1c22; border-color: #2c2e35; }
[data-bs-theme="dark"] .card h5 { color: #f1f1f3; }
[data-bs-theme="dark"] .form-label { color: #c8cad1; }
[data-bs-theme="dark"] .form-control {
  background: #24262e; border-color: #3a3d46; color: #f1f1f3;
}
[data-bs-theme="dark"] .form-control:focus { border-color: var(--accent); box-shadow: 0 0 0 .2rem rgba(91,141,239,.2); }
[data-bs-theme="dark"] .btn-link-secondary { color: #c8cad1; border-color: #3a3d46; }
[data-bs-theme="dark"] .alert-danger { background: #501313; color: #f7c1c1; border-color: #791f1f; }
[data-bs-theme="dark"] .alert-success { background: #173404; color: #c0dd97; border-color: #27500a; }
[data-bs-theme="dark"] .alert-warning { background: #412402; color: #fac775; border-color: #633806; }
[data-bs-theme="dark"] .theme-toggle { background: #1a1c22; border-color: #3a3d46; color: #e4e4e7; }
[data-bs-theme="dark"] .text-muted { color: #8a8d98 !important; }
