:root {
  color-scheme: light;
  --page-bg: #f4f6f9;
  --surface-bg: #ffffff;
  --surface-alt: #f1f3f6;
  --text-color: #1b1d22;
  --muted-text: #5e6672;
  --border-color: #d9dee5;
  --shadow-color: rgba(17, 23, 33, 0.08);
  --nav-bg: #ffffff;
  --nav-text: #1f2328;
  --nav-border: #e6e9ee;
  --link-color: #2f6fed;
  --input-bg: #ffffff;
  --input-text: #1b1d22;
  --input-border: #cdd3dc;
  --btn-primary-bg: #2f6fed;
  --btn-primary-border: #2f6fed;
  --btn-primary-text: #ffffff;
  --btn-success-bg: #1f9d63;
  --btn-success-border: #1f9d63;
  --btn-success-text: #ffffff;
  --alert-bg: #f1f5ff;
  --alert-border: #d3e1ff;
}

[data-theme="dark"] {
  color-scheme: dark;
  --page-bg: #101218;
  --surface-bg: #171a23;
  --surface-alt: #1e2330;
  --text-color: #e6e8ee;
  --muted-text: #a3adba;
  --border-color: #2a3140;
  --shadow-color: rgba(8, 10, 16, 0.6);
  --nav-bg: #131722;
  --nav-text: #f2f4f8;
  --nav-border: #202637;
  --link-color: #8fb3ff;
  --input-bg: #131722;
  --input-text: #e6e8ee;
  --input-border: #333c50;
  --btn-primary-bg: #4c82ff;
  --btn-primary-border: #4c82ff;
  --btn-primary-text: #0c111b;
  --btn-success-bg: #2ac07d;
  --btn-success-border: #2ac07d;
  --btn-success-text: #0c111b;
  --alert-bg: #1a2234;
  --alert-border: #2a3550;
}

body {
  background: var(--page-bg);
  color: var(--text-color);
}

a {
  color: var(--link-color);
}

a:hover {
  color: var(--link-color);
}

main {
  min-height: calc(100vh - 80px);
}

.navbar-site {
  background: var(--nav-bg);
  border-bottom: 1px solid var(--nav-border);
}

.navbar-site .navbar-brand,
.navbar-site .form-check-label,
.navbar-site .user-info span,
.navbar-site .logout-btn {
  color: var(--nav-text);
}

.navbar-site .logout-btn {
  margin-left: 12px;
  text-decoration: none;
  font-weight: 600;
}

.navbar-site .logout-btn:hover {
  color: var(--link-color);
}

.theme-toggle .form-check-input {
  cursor: pointer;
}

.card {
  background: var(--surface-bg);
  border: 1px solid var(--border-color);
  box-shadow: 0 12px 30px var(--shadow-color);
}

.card-header,
.card-footer {
  background: var(--surface-alt);
  border-color: var(--border-color);
}

.text-muted {
  color: var(--muted-text) !important;
}

.form-label {
  color: var(--muted-text);
}

.form-control {
  background: var(--input-bg);
  border-color: var(--input-border);
  color: var(--input-text);
}

.form-control::placeholder {
  color: var(--muted-text);
}

.form-control:focus {
  border-color: var(--link-color);
  box-shadow: 0 0 0 0.2rem rgba(47, 111, 237, 0.2);
}

.btn-primary {
  background: var(--btn-primary-bg);
  border-color: var(--btn-primary-border);
  color: var(--btn-primary-text);
}

.btn-primary:hover,
.btn-primary:focus {
  filter: brightness(0.95);
  color: var(--btn-primary-text);
}

.btn-success {
  background: var(--btn-success-bg);
  border-color: var(--btn-success-border);
  color: var(--btn-success-text);
}

.btn-success:hover,
.btn-success:focus {
  filter: brightness(0.95);
  color: var(--btn-success-text);
}

.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger {
  border-color: var(--border-color);
  color: var(--muted-text);
}

.btn-outline-success:hover,
.btn-outline-warning:hover,
.btn-outline-danger:hover {
  border-color: var(--link-color);
  color: var(--link-color);
}

.alert {
  background: var(--alert-bg);
  border-color: var(--alert-border);
  color: var(--text-color);
}

[data-theme="dark"] .btn-close {
  filter: invert(1);
}

.book-cover {
  background: var(--surface-alt);
  border: 1px solid var(--border-color);
}

.book-card {
  background: var(--surface-bg);
}
