/* ============================================================
   ColDon Monitor — мост к Bootstrap
   Страницы Identity (вход/регистрация/управление аккаунтом) остаются
   на разметке Bootstrap. Здесь их базовые элементы привязываются к
   токенам темы, чтобы вся система выглядела единообразно во всех темах.
   Загружается ПОСЛЕ bootstrap.min.css и дизайн-CSS.
   ============================================================ */

/* Поля ввода Bootstrap → токены темы */
.form-control,
.form-select {
  background-color: var(--surface);
  color: var(--ink);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  font-family: inherit;
}
.form-control::placeholder { color: var(--muted); }
.form-control:focus,
.form-select:focus {
  background-color: var(--surface);
  color: var(--ink);
  border-color: var(--brand);
  box-shadow: 0 0 0 3px color-mix(in oklch, var(--brand) 18%, transparent);
}
.form-floating > label { color: var(--muted); }
.form-label { font-weight: 600; color: var(--ink-2); }

/* Кнопки Bootstrap наследуют форму от дизайн-.btn; здесь — только цвета вариантов */
.btn-primary {
  background-color: var(--brand);
  border-color: var(--brand);
  color: var(--brand-ink);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--brand-strong);
  border-color: var(--brand-strong);
  color: var(--brand-ink);
}
.btn-outline-primary {
  color: var(--brand);
  border-color: color-mix(in oklch, var(--brand) 45%, var(--border));
  background: var(--surface);
}
.btn-outline-primary:hover {
  background: var(--brand);
  border-color: var(--brand);
  color: var(--brand-ink);
}
.btn-outline-secondary {
  color: var(--ink);
  border-color: var(--border-strong);
  background: var(--surface);
}
.btn-outline-secondary:hover {
  background: var(--surface-2);
  border-color: var(--muted);
  color: var(--ink);
}
.btn-success {
  background-color: var(--ok);
  border-color: var(--ok);
  color: var(--brand-ink);
}
.btn-outline-danger {
  color: var(--danger);
  border-color: color-mix(in oklch, var(--danger) 40%, var(--border));
  background: var(--surface);
}
.btn-outline-danger:hover {
  background: color-mix(in oklch, var(--danger) 12%, var(--surface));
  color: var(--danger);
}
.btn-outline-warning {
  color: var(--amber);
  border-color: color-mix(in oklch, var(--amber) 45%, var(--border));
  background: var(--surface);
}

/* Алерты → мягкие токенные подложки */
.alert { border-radius: var(--radius-sm); border: 1px solid transparent; }
.alert-danger {
  background: color-mix(in oklch, var(--danger) 10%, var(--surface));
  border-color: color-mix(in oklch, var(--danger) 35%, var(--border));
  color: var(--danger);
}
.alert-success {
  background: color-mix(in oklch, var(--ok) 12%, var(--surface));
  border-color: color-mix(in oklch, var(--ok) 35%, var(--border));
  color: var(--brand-soft-ink);
}
.alert-warning {
  background: color-mix(in oklch, var(--amber) 14%, var(--surface));
  border-color: color-mix(in oklch, var(--amber) 40%, var(--border));
  color: var(--ink);
}
.alert-info {
  background: color-mix(in oklch, var(--sky) 12%, var(--surface));
  border-color: color-mix(in oklch, var(--sky) 35%, var(--border));
  color: var(--ink);
}

/* Текстовые утилиты, встречающиеся в шаблонных страницах */
.text-muted { color: var(--muted) !important; }
.text-danger { color: var(--danger) !important; }
hr { border-color: var(--border); opacity: 1; }
code { color: var(--brand-soft-ink); }

/* Карточки/таблицы Bootstrap уже перекрыты дизайн-CSS; ссылки — бренд */
a { color: var(--brand); }
a:hover { color: var(--brand-strong); }
