:root,
[data-bs-theme="dark"] {
  color-scheme: dark;
  --bs-body-color: #f4f5f7;
  --bs-body-color-rgb: 244, 245, 247;
  --bs-body-bg: #090b11;
  --bs-body-bg-rgb: 9, 11, 17;
  --bs-emphasis-color: #f4f5f7;
  --bs-secondary-color: #8d94a4;
  --bs-secondary-bg: #151925;
  --bs-tertiary-bg: #0d1018;
  --bs-border-color: rgba(255, 255, 255, 0.09);
  --bs-primary: #5865f2;
  --bs-primary-rgb: 88, 101, 242;
  --bs-link-color: #8791ff;
  --bs-link-hover-color: #a4abff;
  --bs-success: #43d17a;
  --bs-success-rgb: 67, 209, 122;
  --bs-code-color: #d2d6df;
  --bs-highlight-bg: rgba(88, 101, 242, 0.2);
}

html {
  background: #090b11;
  scroll-behavior: smooth;
}

body {
  color: #f4f5f7;
  background:
    radial-gradient(circle at 50% -12%, rgba(88, 101, 242, 0.2), transparent 42%),
    radial-gradient(circle at 0% 100%, rgba(67, 209, 122, 0.055), transparent 34%),
    linear-gradient(180deg, #0a0c12 0%, #090b11 100%);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

body::before {
  opacity: 0.28;
}

.navbar.bg-dark {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(13, 16, 24, 0.96) !important;
  background-image: none !important;
  backdrop-filter: blur(16px);
}

.navbar-dark .navbar-brand,
.navbar-dark .nav-link {
  color: #d2d6df;
}

.navbar-dark .nav-link:hover,
.navbar-dark .nav-link:focus,
.navbar-dark .navbar-brand:hover {
  color: #ffffff;
}

.navbar-dark .nav-link.active {
  color: #8791ff;
}

.container {
  max-width: 1140px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #f4f5f7;
  font-weight: 750;
  letter-spacing: -0.025em;
}

h1 {
  font-size: clamp(2rem, 4vw, 2.7rem);
}

.bs-sidebar.card,
.modal-content,
.dropdown-menu {
  color: #d2d6df;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px;
  background: #151925;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.24);
}

.bs-sidebar .nav > li > a {
  color: #aeb4c2;
  border-radius: 8px;
}

.bs-sidebar .nav > li > a:hover,
.bs-sidebar .nav > li > a:focus,
.bs-sidebar .nav > li > a.active {
  color: #a4abff;
  background: rgba(88, 101, 242, 0.12);
  border-right-color: transparent;
}

a {
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.btn-primary {
  color: #fff;
  border-color: #5865f2;
  background: linear-gradient(135deg, #7280ff, #5865f2);
  box-shadow: 0 8px 22px rgba(88, 101, 242, 0.2);
}

.btn-primary:hover,
.btn-primary:focus {
  color: #fff;
  border-color: #8791ff;
  background: linear-gradient(135deg, #8791ff, #5865f2);
}

.btn-secondary,
.btn-outline-secondary {
  color: #d2d6df;
  border-color: rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.04);
}

pre,
code,
kbd {
  border-color: rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  background-color: #0d1018;
}

pre {
  padding: 1rem;
  border-radius: 12px;
}

pre code {
  background: transparent;
}

table {
  --bs-table-color: #d2d6df;
  --bs-table-bg: rgba(19, 22, 32, 0.7);
  --bs-table-border-color: rgba(255, 255, 255, 0.09);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.025);
  --bs-table-striped-color: #d2d6df;
}

.col-md-9 img {
  border-color: rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  background: #151925;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.24);
}

:focus-visible {
  outline: 3px solid rgba(135, 145, 255, 0.7);
  outline-offset: 3px;
}

footer {
  color: #8d94a4;
}

@media (max-width: 767.98px) {
  body > .container {
    margin-top: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}