/*
 * sabter.dev visual layer for GitLab.
 *
 * Intentional scope: instance accents, navigation chrome, focus states and
 * primary actions. Do not force a global colour mode or restyle dense GitLab
 * content, which keeps user theme preferences and upgrade compatibility.
 */

:root {
  --sabter-ink: #05070b;
  --sabter-surface: #0a0e16;
  --sabter-surface-raised: #0c1220;
  --sabter-line: rgba(120, 160, 220, 0.18);
  --sabter-text: #dfe3ec;
  --sabter-muted: #7b8497;
  --sabter-blue: #3d9bff;
  --sabter-blue-deep: #256fbd;
  --sabter-gold: #e8b44a;
  --gl-focus-ring-outer-color: rgba(61, 155, 255, 0.55);
  --gl-focus-ring-inner-color: var(--sabter-ink);
}

::selection {
  background: var(--sabter-gold);
  color: var(--sabter-ink);
}

:focus-visible {
  outline: 2px solid var(--sabter-blue) !important;
  outline-offset: 2px;
}

/* GitLab uses these shared Pajamas classes for links and primary buttons. */
.gl-link,
a.gl-link,
.gl-button.btn-confirm,
.btn-confirm {
  color: var(--sabter-blue);
}

.gl-button.btn-confirm,
.btn-confirm {
  background-color: var(--sabter-blue-deep);
  border-color: var(--sabter-blue);
  color: var(--sabter-ink);
  font-weight: 600;
}

.gl-button.btn-confirm:hover,
.gl-button.btn-confirm:focus-visible,
.btn-confirm:hover,
.btn-confirm:focus-visible {
  background-color: var(--sabter-blue);
  border-color: var(--sabter-blue);
  color: var(--sabter-ink);
}

/* These selectors span GitLab's current and earlier sidebar implementations. */
.super-sidebar,
.sidebar-wrapper,
.navbar-gitlab {
  background-color: var(--sabter-surface);
  border-color: var(--sabter-line);
}

.super-sidebar .active,
.sidebar-wrapper .active {
  box-shadow: inset 2px 0 0 var(--sabter-gold);
}

.super-sidebar a:hover,
.sidebar-wrapper a:hover,
.navbar-gitlab a:hover {
  color: var(--sabter-blue);
}

/* A restrained brand cue for current navigation, without recolouring content. */
.super-sidebar .active a,
.sidebar-wrapper .active a {
  color: var(--sabter-text);
}