:root {
  --tblr-primary: #0b1f3a;
  --tblr-primary-rgb: 11, 31, 58;
  --tblr-link-color: #0f2b55;
  --tblr-link-hover-color: #173e78;
  --app-bg: #f4f7fb;
  --topbar-bg: #f8fbff;
  --topbar-border: #d7e3f3;
  --topbar-pill-bg: #eef4fd;
  --topbar-pill-color: #1f3f6f;
  --topbar-pill-border: #c9d9ef;
  --topbar-user-bg: #f1f6fd;
  --topbar-user-border: #cad9ee;
  --topbar-user-name: #0b1f3a;
  --topbar-user-text: #3a5d8f;
  --topbar-avatar-bg: #d8e3f2;
  --topbar-avatar-border: #b4c8e4;
  --menu-bg: linear-gradient(90deg, #0b1f3a 0%, #12315a 55%, #0b1f3a 100%);
  --menu-link: #ffffff;
  --menu-link-hover: #dbe8ff;
  --dropdown-bg: #ffffff;
  --dropdown-color: #1b3358;
  --dropdown-border: #c9d9f1;
  --accent-glow: rgba(58, 237, 53, 0.18);
}

html[data-theme="dark"] {
  --tblr-primary: #79a8ff;
  --tblr-primary-rgb: 121, 168, 255;
  --tblr-link-color: #a6c7ff;
  --tblr-link-hover-color: #c7dcff;
  --app-bg: #0b1220;
  --topbar-bg: #0f1c31;
  --topbar-border: #223451;
  --topbar-pill-bg: #142844;
  --topbar-pill-color: #d3e4ff;
  --topbar-pill-border: #2b4a74;
  --topbar-user-bg: #152945;
  --topbar-user-border: #2c4d77;
  --topbar-user-name: #e4efff;
  --topbar-user-text: #b4cdf4;
  --topbar-avatar-bg: #20395e;
  --topbar-avatar-border: #3b608f;
  --menu-bg: linear-gradient(90deg, #07101f 0%, #10233e 55%, #07101f 100%);
  --menu-link: #dbe8ff;
  --menu-link-hover: #ffffff;
  --dropdown-bg: #12233d;
  --dropdown-color: #dceaff;
  --dropdown-border: #2e4d79;
  --accent-glow: rgba(58, 237, 53, 0.32);
}

html[data-theme="dark"] body {
  color: #dce7fa;
  background-image: radial-gradient(circle at 12% 8%, rgba(58, 237, 53, 0.09) 0%, rgba(58, 237, 53, 0) 26%);
}

body {
  background-color: var(--app-bg);
}

.navbar {
  --tblr-navbar-color: #ffffff;
}

.navbar .navbar-brand {
  color: #0b1f3a;
}

.navbar .nav-link,
.navbar .nav-link-title {
  color: var(--menu-link) !important;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus,
.navbar .nav-link.active {
  color: var(--menu-link-hover) !important;
}

#navbar-menu .navbar,
#navbar-menu .container-xl {
  background: var(--menu-bg) !important;
}

.btn-primary {
  background-color: #0b1f3a !important;
  border-color: #0b1f3a !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: #12315a !important;
  border-color: #12315a !important;
}

.dropdown-item:active,
.dropdown-item.active {
  background-color: #12315a !important;
}

.card-header {
  border-bottom-color: #d6e0ef;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .table,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
  background-color: #12233d;
  color: #e1ecff;
  border-color: #2e4d79;
}

html[data-theme="dark"] .dropdown-menu .dropdown-item {
  color: #dceaff;
}

html[data-theme="dark"] .dropdown-menu .dropdown-item:hover {
  background-color: #1c355a;
}

html[data-theme="dark"] .table th,
html[data-theme="dark"] .table td {
  border-color: #2e4d79 !important;
}

html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .topbar-pill,
html[data-theme="dark"] .theme-toggle {
  box-shadow: 0 0 0 1px rgba(58, 237, 53, 0.14), 0 0 18px var(--accent-glow);
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .topbar-user {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 0 16px rgba(58, 237, 53, 0.1);
}
