/* Dark theme overrides.

   The palette is GitHub's (Primer dark): a near-black canvas with a darker
   inset for the chrome, one hairline border colour, and two text weights.
   Everything below is expressed in terms of the --gh-* tokens so the whole
   theme can be retuned from this one block.

   This file is only ever loaded in dark mode — either unconditionally, or
   behind prefers-color-scheme for the "system" setting — so plain :root is
   enough; [data-bs-theme=dark] is listed alongside only to match the
   specificity of Bootstrap's own dark block. */
:root,
[data-bs-theme="dark"] {
  --gh-canvas-default: #0d1117;
  --gh-canvas-inset: #010409;
  --gh-canvas-subtle: #151b23;
  --gh-canvas-overlay: #151b23;

  --gh-border-default: #3d444d;
  --gh-border-muted: rgba(61, 68, 77, 0.7);

  --gh-fg-default: #f0f6fc;
  --gh-fg-muted: #9198a1;
  --gh-fg-subtle: #656c76;

  --gh-accent-fg: #4493f8;
  --gh-accent-emphasis: #1f6feb;
  --gh-accent-muted: rgba(56, 139, 253, 0.4);
  --gh-accent-subtle: rgba(56, 139, 253, 0.1);

  --gh-success-fg: #3fb950;
  --gh-success-emphasis: #238636;
  --gh-success-subtle: rgba(46, 160, 67, 0.15);

  --gh-danger-fg: #f85149;
  --gh-danger-emphasis: #da3633;
  --gh-danger-subtle: rgba(248, 81, 73, 0.1);

  --gh-attention-fg: #d29922;

  --gh-neutral-muted: rgba(101, 108, 118, 0.2);
  --gh-btn-bg: #212830;
  --gh-btn-hover-bg: #262c36;
  --gh-btn-active-bg: #2f3742;

  /* Bootstrap's dark palette, repointed at the tokens above. Most components
     read these, so overriding them here covers far more than listing every
     component by hand. */
  color-scheme: dark;

  --bs-body-bg: #0d1117;
  --bs-body-bg-rgb: 13, 17, 23;
  --bs-body-color: #f0f6fc;
  --bs-body-color-rgb: 240, 246, 252;

  --bs-emphasis-color: #ffffff;
  --bs-emphasis-color-rgb: 255, 255, 255;
  --bs-secondary-color: #9198a1;
  --bs-secondary-color-rgb: 145, 152, 161;
  --bs-secondary-bg: #151b23;
  --bs-secondary-bg-rgb: 21, 27, 35;
  --bs-tertiary-color: #656c76;
  --bs-tertiary-color-rgb: 101, 108, 118;
  --bs-tertiary-bg: #212830;
  --bs-tertiary-bg-rgb: 33, 40, 48;

  --bs-border-color: #3d444d;
  --bs-border-color-translucent: rgba(61, 68, 77, 0.7);

  --bs-link-color: #4493f8;
  --bs-link-color-rgb: 68, 147, 248;
  --bs-link-hover-color: #6cb6ff;
  --bs-link-hover-color-rgb: 108, 182, 255;

  --bs-code-color: #f0f6fc;
  --bs-highlight-bg: rgba(56, 139, 253, 0.25);

  --bs-heading-color: #f0f6fc;

  --bs-primary: #1f6feb;
  --bs-primary-rgb: 31, 111, 235;
  --bs-primary-text-emphasis: #4493f8;
  --bs-success-text-emphasis: #3fb950;
  --bs-danger-text-emphasis: #f85149;
  --bs-warning-text-emphasis: #d29922;
  --bs-primary-bg-subtle: rgba(56, 139, 253, 0.1);
  --bs-success-bg-subtle: rgba(46, 160, 67, 0.15);
  --bs-danger-bg-subtle: rgba(248, 81, 73, 0.1);
  --bs-warning-bg-subtle: rgba(187, 128, 9, 0.15);
  --bs-primary-border-subtle: rgba(56, 139, 253, 0.4);
  --bs-success-border-subtle: rgba(63, 185, 80, 0.4);
  --bs-danger-border-subtle: rgba(248, 81, 73, 0.4);
  --bs-warning-border-subtle: rgba(187, 128, 9, 0.4);

  --bs-focus-ring-color: rgba(31, 111, 235, 0.3);
}

body {
  background-color: var(--gh-canvas-default);
  color: var(--gh-fg-default);
}

::selection {
  background-color: var(--gh-accent-muted);
}

/* The navbar and footer both carry .bg-light and no theme-dependent class, so
   repainting that one rule covers them. .bg-light is also used for code blocks
   in the docs pages, which take the subtle canvas rather than the inset one. */
.bg-light {
  background-color: var(--gh-canvas-subtle) !important;
}

.navbar.bg-light,
.footer.bg-light {
  background-color: var(--gh-canvas-inset) !important;
}

/* GitHub's header links sit at full contrast and dim on hover, the reverse of
   Bootstrap's default. */
.navbar {
  --bs-navbar-color: var(--gh-fg-default);
  --bs-navbar-hover-color: var(--gh-fg-muted);
  --bs-navbar-active-color: var(--gh-fg-default);
  --bs-navbar-disabled-color: var(--gh-fg-subtle);
  --bs-navbar-brand-color: var(--gh-fg-default);
  --bs-navbar-brand-hover-color: var(--gh-fg-default);
  --bs-navbar-toggler-border-color: var(--gh-border-default);
}

.theme-switch {
  border-color: var(--gh-border-default);
}

.theme-switch a {
  color: var(--gh-fg-muted);
}

.theme-switch a:hover {
  color: var(--gh-fg-default);
  background-color: var(--gh-neutral-muted);
}

.theme-switch a.active {
  color: var(--gh-fg-default);
  background-color: var(--gh-btn-hover-bg);
}

.card {
  --bs-card-bg: var(--gh-canvas-default);
  --bs-card-border-color: var(--gh-border-default);
  --bs-card-cap-bg: var(--gh-canvas-subtle);
  color: var(--gh-fg-default);
}

.card-header {
  border-bottom-color: var(--gh-border-default);
}

.modal {
  --bs-modal-bg: var(--gh-canvas-overlay);
  --bs-modal-border-color: var(--gh-border-default);
  --bs-modal-header-border-color: var(--gh-border-default);
  --bs-modal-footer-border-color: var(--gh-border-default);
  --bs-modal-color: var(--gh-fg-default);
}

.dropdown-menu {
  --bs-dropdown-bg: var(--gh-canvas-overlay);
  --bs-dropdown-border-color: var(--gh-border-default);
  --bs-dropdown-color: var(--gh-fg-default);
  --bs-dropdown-link-color: var(--gh-fg-default);
  --bs-dropdown-link-hover-bg: var(--gh-btn-hover-bg);
  --bs-dropdown-link-hover-color: var(--gh-fg-default);
  --bs-dropdown-divider-bg: var(--gh-border-default);
}

/* Inputs sit on the canvas itself on GitHub, not on a lighter fill. */
.form-control,
.form-select,
textarea.form-control {
  background-color: var(--gh-canvas-default);
  border-color: var(--gh-border-default);
  color: var(--gh-fg-default);
}

.form-control:focus,
.form-select:focus {
  background-color: var(--gh-canvas-default);
  color: var(--gh-fg-default);
  border-color: var(--gh-accent-emphasis);
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3);
}

.form-control::placeholder {
  color: var(--gh-fg-subtle);
}

.form-check-input {
  background-color: var(--gh-canvas-default);
  border-color: var(--gh-border-default);
}

.form-check-input:checked {
  background-color: var(--gh-accent-emphasis);
  border-color: var(--gh-accent-emphasis);
}

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

.text-muted,
.text-body-secondary {
  color: var(--gh-fg-muted) !important;
}

a {
  color: var(--gh-accent-fg);
}

hr,
.border,
.border-bottom,
.border-top,
.border-start,
.border-end {
  border-color: var(--gh-border-default) !important;
}

/* Buttons. Bootstrap compiles literal colours into each .btn-* variant, so
   these have to be named one by one. The default (secondary) button is
   GitHub's grey; primary is its green; outline variants keep the same grey
   shell and only change the label colour, as GitHub's do. */
.btn {
  --bs-btn-focus-box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3);
}

.btn-secondary,
.btn-outline-secondary,
.btn-light,
.btn-dark {
  --bs-btn-color: var(--gh-fg-default);
  --bs-btn-bg: var(--gh-btn-bg);
  --bs-btn-border-color: var(--gh-border-default);
  --bs-btn-hover-color: var(--gh-fg-default);
  --bs-btn-hover-bg: var(--gh-btn-hover-bg);
  --bs-btn-hover-border-color: var(--gh-fg-subtle);
  --bs-btn-active-color: var(--gh-fg-default);
  --bs-btn-active-bg: var(--gh-btn-active-bg);
  --bs-btn-active-border-color: var(--gh-fg-subtle);
  --bs-btn-disabled-color: var(--gh-fg-subtle);
  --bs-btn-disabled-bg: var(--gh-btn-bg);
  --bs-btn-disabled-border-color: var(--gh-border-default);
}

.btn-outline-primary {
  --bs-btn-color: var(--gh-accent-fg);
  --bs-btn-bg: var(--gh-btn-bg);
  --bs-btn-border-color: var(--gh-border-default);
  --bs-btn-hover-color: var(--gh-accent-fg);
  --bs-btn-hover-bg: var(--gh-btn-hover-bg);
  --bs-btn-hover-border-color: var(--gh-accent-muted);
  --bs-btn-active-color: var(--gh-accent-fg);
  --bs-btn-active-bg: var(--gh-btn-active-bg);
  --bs-btn-active-border-color: var(--gh-accent-muted);
}

.btn-outline-warning {
  --bs-btn-color: var(--gh-attention-fg);
  --bs-btn-bg: var(--gh-btn-bg);
  --bs-btn-border-color: var(--gh-border-default);
  --bs-btn-hover-color: var(--gh-attention-fg);
  --bs-btn-hover-bg: var(--gh-btn-hover-bg);
  --bs-btn-hover-border-color: rgba(187, 128, 9, 0.4);
  --bs-btn-active-color: var(--gh-attention-fg);
  --bs-btn-active-bg: var(--gh-btn-active-bg);
  --bs-btn-active-border-color: rgba(187, 128, 9, 0.4);
}

.btn-outline-danger {
  --bs-btn-color: var(--gh-danger-fg);
  --bs-btn-bg: var(--gh-btn-bg);
  --bs-btn-border-color: var(--gh-border-default);
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: var(--gh-danger-emphasis);
  --bs-btn-hover-border-color: var(--gh-danger-emphasis);
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: var(--gh-danger-emphasis);
  --bs-btn-active-border-color: var(--gh-danger-emphasis);
}

.btn-primary,
.btn-success {
  --bs-btn-color: #ffffff;
  --bs-btn-bg: var(--gh-success-emphasis);
  --bs-btn-border-color: rgba(240, 246, 252, 0.1);
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: #29903b;
  --bs-btn-hover-border-color: rgba(240, 246, 252, 0.1);
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: #1f7a32;
  --bs-btn-active-border-color: rgba(240, 246, 252, 0.1);
  --bs-btn-disabled-color: rgba(255, 255, 255, 0.5);
  --bs-btn-disabled-bg: #196c2e;
  --bs-btn-disabled-border-color: rgba(240, 246, 252, 0.1);
}

.btn-danger {
  --bs-btn-color: #ffffff;
  --bs-btn-bg: var(--gh-danger-emphasis);
  --bs-btn-border-color: rgba(240, 246, 252, 0.1);
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: #e5534b;
  --bs-btn-hover-border-color: rgba(240, 246, 252, 0.1);
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: #b62324;
  --bs-btn-active-border-color: rgba(240, 246, 252, 0.1);
}

.table {
  --bs-table-color: var(--gh-fg-default);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--gh-border-default);
  --bs-table-striped-bg: var(--gh-canvas-subtle);
  --bs-table-striped-color: var(--gh-fg-default);
  --bs-table-hover-bg: var(--gh-neutral-muted);
  --bs-table-hover-color: var(--gh-fg-default);
  border-color: var(--gh-border-default);
}

.table > thead {
  background-color: var(--gh-canvas-subtle);
}

/* Code. GitHub gives inline code a translucent grey chip and block code the
   subtle canvas with the usual hairline. */
code {
  color: var(--gh-fg-default);
  background-color: var(--gh-neutral-muted);
  border-radius: 6px;
  padding: 0.15em 0.4em;
}

pre {
  background-color: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default);
  color: var(--gh-fg-default);
}

/* Inside a <pre> the chip treatment would double up on the block's own fill. */
pre code {
  background-color: transparent;
  padding: 0;
  border-radius: 0;
}

.alert-success {
  --bs-alert-bg: var(--gh-success-subtle);
  --bs-alert-border-color: rgba(63, 185, 80, 0.4);
  --bs-alert-color: var(--gh-success-fg);
}

.alert-danger {
  --bs-alert-bg: var(--gh-danger-subtle);
  --bs-alert-border-color: rgba(248, 81, 73, 0.4);
  --bs-alert-color: var(--gh-danger-fg);
}

.alert-info,
.alert-primary {
  --bs-alert-bg: var(--gh-accent-subtle);
  --bs-alert-border-color: var(--gh-accent-muted);
  --bs-alert-color: var(--gh-accent-fg);
}

.alert-warning {
  --bs-alert-bg: rgba(187, 128, 9, 0.15);
  --bs-alert-border-color: rgba(187, 128, 9, 0.4);
  --bs-alert-color: var(--gh-attention-fg);
}

.badge.bg-secondary {
  background-color: var(--gh-neutral-muted) !important;
  color: var(--gh-fg-default);
}

/* style.css sets these with a two-class selector, so matching it here is what
   makes the override take. */
.pagination .page-link {
  background-color: var(--gh-canvas-default);
  border-color: var(--gh-border-default);
  color: var(--gh-accent-fg);
}

.pagination .page-link:hover {
  background-color: var(--gh-btn-hover-bg);
  border-color: var(--gh-border-default);
  color: var(--gh-accent-fg);
}

.pagination .page-item.active .page-link {
  background-color: var(--gh-accent-emphasis);
  border-color: var(--gh-accent-emphasis);
  color: #ffffff;
}

.pagination .page-item.disabled .page-link {
  background-color: var(--gh-canvas-default);
  border-color: var(--gh-border-default);
  color: var(--gh-fg-subtle);
}

/* The fill stays as style.css sets it — it overlays an image, not a surface —
   but the hairline lines up with every other border in the theme. */
.nft-badge {
  border-color: var(--gh-border-default);
}