/* =========================================================
   HaggisDevLab Theme — Mocha Glass
   Version: 1.1 Safe
   Strategy:
   - GitLab stays responsible for controls, icons and semantics
   - Theme changes design tokens + a few large surfaces only
   - No global button/svg/div/span overrides
   ========================================================= */

:root {
  /* Brand */
  --hdl-shell: #3b2b24;
  --hdl-shell-2: #443129;
  --hdl-shell-hover: #4e392f;
  --hdl-shell-active: #5a4034;

  /* Canvas */
  --hdl-canvas: #181412;
  --hdl-canvas-2: #1d1816;

  /* Surfaces */
  --hdl-surface-1: #241d1a;
  --hdl-surface-2: #2b221e;
  --hdl-surface-3: #332823;
  --hdl-surface-4: #3b2e28;

  /* Text */
  --hdl-text: #eee5df;
  --hdl-text-soft: #cdbfb6;
  --hdl-text-muted: #9d8d82;

  /* Borders */
  --hdl-border-soft: rgba(244, 228, 216, 0.07);
  --hdl-border: rgba(244, 228, 216, 0.11);
  --hdl-border-strong: rgba(244, 228, 216, 0.17);

  /* Accent */
  --hdl-accent: #be8661;
  --hdl-accent-hover: #d09a72;
  --hdl-accent-soft: rgba(190, 134, 97, 0.16);

  /* Glass */
  --hdl-glass: rgba(51, 40, 35, 0.72);
  --hdl-glass-strong: rgba(58, 45, 39, 0.82);

  --hdl-radius: 14px;
  --hdl-shadow: 0 12px 34px rgba(0, 0, 0, 0.20);
}


/* =========================================================
   1. GITLAB DESIGN TOKENS
   These are the main source of truth for native components.
   ========================================================= */

html.gl-dark {
  color-scheme: dark;

  --gl-background-color-default: var(--hdl-surface-1);
  --gl-background-color-subtle: var(--hdl-surface-2);
  --gl-background-color-strong: var(--hdl-surface-3);
  --gl-background-color-section: var(--hdl-canvas-2);
  --gl-background-color-overlap: var(--hdl-surface-3);

  --gl-border-color-default: var(--hdl-border);
  --gl-border-color-subtle: var(--hdl-border-soft);
  --gl-border-color-strong: var(--hdl-border-strong);

  --gl-text-color-default: var(--hdl-text);
  --gl-text-color-subtle: var(--hdl-text-soft);
  --gl-text-color-disabled: var(--hdl-text-muted);

  --gl-control-background-color-default: var(--hdl-surface-2);
  --gl-control-background-color-hover: var(--hdl-surface-3);
  --gl-control-background-color-selected: var(--hdl-surface-4);
  --gl-control-border-color-default: var(--hdl-border);
  --gl-control-border-color-hover: var(--hdl-border-strong);
  --gl-control-text-color-default: var(--hdl-text);

  --gl-link-color: var(--hdl-accent-hover);

  /* Warm neutral ramp used by GitLab utility classes */
  --gl-color-neutral-950: #151210;
  --gl-color-neutral-900: #1b1614;
  --gl-color-neutral-800: #221b18;
  --gl-color-neutral-700: #2a211d;
  --gl-color-neutral-600: #342923;
  --gl-color-neutral-500: #49382f;
  --gl-color-neutral-400: #6c574b;
  --gl-color-neutral-300: #9c887d;
  --gl-color-neutral-200: #c5b6ad;
  --gl-color-neutral-100: #e3d8d1;
  --gl-color-neutral-50: #f0e8e3;
}


/* =========================================================
   2. APP CANVAS
   ========================================================= */

html.gl-dark,
html.gl-dark body {
  background: var(--hdl-canvas) !important;
  color: var(--hdl-text) !important;
}

html.gl-dark .page-with-super-sidebar,
html.gl-dark .content-wrapper,
html.gl-dark .layout-page,
html.gl-dark .main-content,
html.gl-dark #content-body {
  background:
    radial-gradient(circle at 78% 8%, rgba(190, 134, 97, 0.045), transparent 30%),
    linear-gradient(180deg, #1e1816 0%, #1a1513 62%, #171311 100%) !important;

  color: var(--hdl-text) !important;
}


/* =========================================================
   3. TOP BAR
   ========================================================= */

html.gl-dark .top-bar-fixed,
html.gl-dark .top-bar-container,
html.gl-dark .top-bar,
html.gl-dark header.navbar,
html.gl-dark .navbar-gitlab {
  background:
    linear-gradient(
      180deg,
      rgba(67, 48, 40, 0.98),
      rgba(56, 40, 34, 0.98)
    ) !important;

  border-bottom: 1px solid var(--hdl-border-soft) !important;
  color: var(--hdl-text) !important;

  box-shadow: 0 7px 22px rgba(0, 0, 0, 0.13) !important;

  backdrop-filter: blur(14px) saturate(108%);
  -webkit-backdrop-filter: blur(14px) saturate(108%);
}


/* =========================================================
   4. SIDEBAR
   Only shell + active/hover state.
   Native GitLab icons/buttons remain native.
   ========================================================= */

html.gl-dark .super-sidebar {
  background:
    linear-gradient(
      180deg,
      #453128 0%,
      #3b2a23 58%,
      #35251f 100%
    ) !important;

  border-right: 1px solid var(--hdl-border-soft) !important;

  box-shadow: 7px 0 24px rgba(0, 0, 0, 0.09) !important;
}

html.gl-dark .super-sidebar a {
  color: #eadfd8 !important;
}

html.gl-dark .super-sidebar a:hover {
  background: rgba(255, 255, 255, 0.045) !important;
  color: #fff7f1 !important;
}

html.gl-dark .super-sidebar .active,
html.gl-dark .super-sidebar [aria-current="page"] {
  background:
    linear-gradient(
      90deg,
      rgba(190, 134, 97, 0.18),
      rgba(190, 134, 97, 0.07)
    ) !important;

  color: #fff8f2 !important;

  box-shadow:
    inset 3px 0 0 var(--hdl-accent) !important;
}


/* =========================================================
   5. PAGE HERO / LARGE GLASS SURFACES
   Glass is deliberately limited to large blocks.
   ========================================================= */

html.gl-dark #content-body .group-home-panel,
html.gl-dark #content-body .project-home-panel,
html.gl-dark #content-body .home-panel {
  background:
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.022),
      rgba(255, 255, 255, 0.004)
    ),
    var(--hdl-glass) !important;

  border: 1px solid var(--hdl-border) !important;
  border-radius: var(--hdl-radius) !important;

  box-shadow: var(--hdl-shadow) !important;

  backdrop-filter: blur(14px) saturate(108%);
  -webkit-backdrop-filter: blur(14px) saturate(108%);
}


/* =========================================================
   6. TABS
   Keep them flat. Only accent the selected tab.
   ========================================================= */

html.gl-dark #content-body .nav-tabs,
html.gl-dark #content-body .gl-tabs-nav {
  background: transparent !important;
  border-color: var(--hdl-border) !important;
}

html.gl-dark #content-body .nav-tabs .nav-link,
html.gl-dark #content-body .gl-tab-nav-item {
  background: transparent !important;
  color: var(--hdl-text-soft) !important;
}

html.gl-dark #content-body .nav-tabs .nav-link:hover,
html.gl-dark #content-body .gl-tab-nav-item:hover {
  color: var(--hdl-text) !important;
}

html.gl-dark #content-body .nav-tabs .nav-link.active,
html.gl-dark #content-body .gl-tab-nav-item[aria-selected="true"] {
  background: transparent !important;
  color: #f5ece6 !important;

  box-shadow:
    inset 0 -2px 0 var(--hdl-accent) !important;
}


/* =========================================================
   7. LISTS
   Rows stay flat and native. Only separators and hover change.
   ========================================================= */

html.gl-dark #content-body .groups-list,
html.gl-dark #content-body .projects-list,
html.gl-dark #content-body .content-list {
  background: transparent !important;
}

html.gl-dark #content-body .groups-list > li,
html.gl-dark #content-body .projects-list > li,
html.gl-dark #content-body .content-list > li {
  background: transparent !important;
  border-color: var(--hdl-border) !important;
}

html.gl-dark #content-body .groups-list > li:hover,
html.gl-dark #content-body .projects-list > li:hover,
html.gl-dark #content-body .content-list > li:hover {
  background:
    linear-gradient(
      90deg,
      rgba(190, 134, 97, 0.045),
      rgba(255, 255, 255, 0.012)
    ) !important;
}


/* =========================================================
   8. README / FILE PANEL
   ========================================================= */

html.gl-dark #content-body .readme-holder,
html.gl-dark #content-body .file-holder {
  overflow: hidden;

  background:
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.018),
      rgba(255, 255, 255, 0.004)
    ),
    rgba(43, 34, 30, 0.82) !important;

  border: 1px solid var(--hdl-border) !important;
  border-radius: var(--hdl-radius) !important;

  box-shadow: var(--hdl-shadow) !important;

  backdrop-filter: blur(12px) saturate(106%);
  -webkit-backdrop-filter: blur(12px) saturate(106%);
}

html.gl-dark #content-body .readme-holder .file-title,
html.gl-dark #content-body .file-holder .file-title {
  background:
    linear-gradient(
      180deg,
      #302622,
      #29211d
    ) !important;

  color: var(--hdl-text) !important;
  border-color: var(--hdl-border) !important;
}

html.gl-dark #content-body .readme-holder .md,
html.gl-dark #content-body .file-holder .md {
  background: transparent !important;
  color: var(--hdl-text) !important;
}


/* =========================================================
   9. TYPOGRAPHY
   Scoped to content only. No global span/div overrides.
   ========================================================= */

html.gl-dark #content-body h1,
html.gl-dark #content-body h2,
html.gl-dark #content-body h3,
html.gl-dark #content-body h4,
html.gl-dark #content-body h5,
html.gl-dark #content-body h6 {
  color: #f3eae4 !important;
}

html.gl-dark #content-body p,
html.gl-dark #content-body li,
html.gl-dark #content-body td,
html.gl-dark #content-body th {
  color: var(--hdl-text) !important;
}

html.gl-dark #content-body .gl-text-subtle,
html.gl-dark #content-body .text-muted,
html.gl-dark #content-body .text-secondary,
html.gl-dark #content-body small {
  color: var(--hdl-text-soft) !important;
}

html.gl-dark #content-body a {
  color: #d2a07d;
}

html.gl-dark #content-body a:hover {
  color: #e5b48e;
}


/* =========================================================
   10. MARKDOWN DETAILS
   ========================================================= */

html.gl-dark #content-body .md pre,
html.gl-dark #content-body .md code {
  background: #1c1715 !important;
  color: #eee1d8 !important;
  border-color: var(--hdl-border) !important;
}

html.gl-dark #content-body .md blockquote {
  color: var(--hdl-text-soft) !important;
  border-left-color: var(--hdl-accent) !important;
}


/* =========================================================
   11. SCROLLBAR
   ========================================================= */

html.gl-dark ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

html.gl-dark ::-webkit-scrollbar-track {
  background: #181412;
}

html.gl-dark ::-webkit-scrollbar-thumb {
  background: #504039;
  border: 2px solid #181412;
  border-radius: 999px;
}

html.gl-dark ::-webkit-scrollbar-thumb:hover {
  background: #675148;
}


/* =========================================================
   12. TEXT SELECTION
   ========================================================= */

html.gl-dark ::selection {
  background: rgba(190, 134, 97, 0.32);
  color: #fff8f2;
}


/* =========================================================
   HaggisDevLab Theme — Header Polish
   Version: 1.2
   Scope: global header, global search, breadcrumb/top-bar only
   ========================================================= */

/* ---------------------------------------------------------
   GLOBAL HEADER
   --------------------------------------------------------- */

html.gl-dark .super-top-bar,
html.gl-dark .navbar-gitlab {
  background:
    linear-gradient(
      180deg,
      rgba(58, 42, 35, 0.985),
      rgba(49, 36, 30, 0.985)
    ) !important;

  border-bottom: 1px solid rgba(244, 228, 216, 0.075) !important;

  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.16) !important;

  backdrop-filter: blur(16px) saturate(110%);
  -webkit-backdrop-filter: blur(16px) saturate(110%);
}

/* Keep header controls native, but harmonize their surfaces */
html.gl-dark .super-top-bar .gl-button,
html.gl-dark .navbar-gitlab .gl-button {
  background-color: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(244, 228, 216, 0.09) !important;
  color: #eee5df !important;
}

html.gl-dark .super-top-bar .gl-button:hover,
html.gl-dark .navbar-gitlab .gl-button:hover {
  background-color: rgba(255, 255, 255, 0.075) !important;
  border-color: rgba(244, 228, 216, 0.14) !important;
}


/* ---------------------------------------------------------
   GLOBAL SEARCH
   --------------------------------------------------------- */

html.gl-dark .super-top-bar .gl-search-box-by-type,
html.gl-dark .super-top-bar .search-box-by-type,
html.gl-dark .navbar-gitlab .gl-search-box-by-type,
html.gl-dark .navbar-gitlab .search-box-by-type {
  background:
    linear-gradient(
      180deg,
      rgba(34, 27, 24, 0.78),
      rgba(29, 23, 21, 0.78)
    ) !important;

  border: 1px solid rgba(244, 228, 216, 0.105) !important;
  border-radius: 11px !important;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.025),
    0 4px 14px rgba(0, 0, 0, 0.10) !important;

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

html.gl-dark .super-top-bar .gl-search-box-by-type input,
html.gl-dark .super-top-bar .search-box-by-type input,
html.gl-dark .navbar-gitlab .gl-search-box-by-type input,
html.gl-dark .navbar-gitlab .search-box-by-type input {
  background: transparent !important;
  border: 0 !important;
  color: #eee5df !important;
  box-shadow: none !important;
}

html.gl-dark .super-top-bar .gl-search-box-by-type input::placeholder,
html.gl-dark .super-top-bar .search-box-by-type input::placeholder,
html.gl-dark .navbar-gitlab .gl-search-box-by-type input::placeholder,
html.gl-dark .navbar-gitlab .search-box-by-type input::placeholder {
  color: #9d8d82 !important;
}

html.gl-dark .super-top-bar .gl-search-box-by-type:focus-within,
html.gl-dark .super-top-bar .search-box-by-type:focus-within,
html.gl-dark .navbar-gitlab .gl-search-box-by-type:focus-within,
html.gl-dark .navbar-gitlab .search-box-by-type:focus-within {
  border-color: rgba(208, 154, 114, 0.34) !important;

  box-shadow:
    0 0 0 3px rgba(190, 134, 97, 0.09),
    inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
}


/* ---------------------------------------------------------
   BREADCRUMB / STRIP BETWEEN HEADER AND CONTENT
   This is intentionally quieter than the global header.
   --------------------------------------------------------- */

html.gl-dark .top-bar,
html.gl-dark .breadcrumbs {
  background: rgba(24, 20, 18, 0.72) !important;
  color: #cdbfb6 !important;
}

html.gl-dark .top-bar-container,
html.gl-dark .breadcrumbs-container {
  background:
    linear-gradient(
      180deg,
      rgba(31, 25, 22, 0.76),
      rgba(27, 22, 20, 0.76)
    ) !important;

  border-bottom: 1px solid rgba(244, 228, 216, 0.055) !important;

  box-shadow:
    inset 0 -1px 0 rgba(0, 0, 0, 0.10) !important;

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Breadcrumb itself: no card/pill treatment */
html.gl-dark .top-bar-container .gl-breadcrumbs,
html.gl-dark .breadcrumbs-container .gl-breadcrumbs {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Breadcrumb links/text */
html.gl-dark .top-bar-container .gl-breadcrumbs a,
html.gl-dark .breadcrumbs-container .gl-breadcrumbs a {
  color: #cdbfb6 !important;
}

html.gl-dark .top-bar-container .gl-breadcrumbs a:hover,
html.gl-dark .breadcrumbs-container .gl-breadcrumbs a:hover {
  color: #f1e7df !important;
}

/* Current breadcrumb level */
html.gl-dark .top-bar-container .gl-breadcrumbs li:last-child,
html.gl-dark .breadcrumbs-container .gl-breadcrumbs li:last-child {
  color: #eee5df !important;
}

/* The content begins cleanly after the breadcrumb strip */
html.gl-dark .top-bar + .content-wrapper,
html.gl-dark .breadcrumbs + .content-wrapper {
  border-top: 0 !important;
}


/* =========================================================
   HaggisDevLab Theme — Warm Surface Fix
   Version: 1.3
   Fixes remaining cold gray GitLab surfaces.
   ========================================================= */

/* --- Breadcrumb / strip under the global header --- */
html.gl-dark .top-bar,
html.gl-dark .top-bar-container,
html.gl-dark .breadcrumbs-container,
html.gl-dark .page-breadcrumbs {
  background:
    linear-gradient(
      180deg,
      rgba(35, 28, 25, 0.96),
      rgba(30, 24, 22, 0.96)
    ) !important;

  border-color: rgba(244, 228, 216, 0.07) !important;
  color: #cdbfb6 !important;
  box-shadow: none !important;
}

/* --- Search / filter toolbar above subgroup list --- */
html.gl-dark #content-body .gl-filtered-search,
html.gl-dark #content-body .filtered-search-box,
html.gl-dark #content-body .filtered-search-wrapper,
html.gl-dark #content-body .search-box-by-type,
html.gl-dark #content-body .gl-search-box-by-type {
  background:
    linear-gradient(
      180deg,
      rgba(48, 38, 34, 0.96),
      rgba(41, 32, 29, 0.96)
    ) !important;

  border-color: rgba(244, 228, 216, 0.10) !important;
  color: #eee5df !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.025) !important;
}

/* Search input itself */
html.gl-dark #content-body .gl-filtered-search input,
html.gl-dark #content-body .filtered-search-box input,
html.gl-dark #content-body .filtered-search-wrapper input,
html.gl-dark #content-body .search-box-by-type input,
html.gl-dark #content-body .gl-search-box-by-type input {
  background: #2a211e !important;
  border-color: rgba(244, 228, 216, 0.09) !important;
  color: #eee5df !important;
  box-shadow: none !important;
}

html.gl-dark #content-body .gl-filtered-search input::placeholder,
html.gl-dark #content-body .filtered-search-box input::placeholder,
html.gl-dark #content-body .filtered-search-wrapper input::placeholder,
html.gl-dark #content-body .search-box-by-type input::placeholder,
html.gl-dark #content-body .gl-search-box-by-type input::placeholder {
  color: #9d8d82 !important;
}

/* Buttons that belong to the filter toolbar only */
html.gl-dark #content-body .gl-filtered-search .gl-button,
html.gl-dark #content-body .filtered-search-box .gl-button,
html.gl-dark #content-body .filtered-search-wrapper .gl-button,
html.gl-dark #content-body .search-box-by-type .gl-button,
html.gl-dark #content-body .gl-search-box-by-type .gl-button {
  background: #352a25 !important;
  border-color: rgba(244, 228, 216, 0.10) !important;
  color: #e8ddd6 !important;
}

html.gl-dark #content-body .gl-filtered-search .gl-button:hover,
html.gl-dark #content-body .filtered-search-box .gl-button:hover,
html.gl-dark #content-body .filtered-search-wrapper .gl-button:hover,
html.gl-dark #content-body .search-box-by-type .gl-button:hover,
html.gl-dark #content-body .gl-search-box-by-type .gl-button:hover {
  background: #3e302a !important;
  border-color: rgba(244, 228, 216, 0.15) !important;
}

/* Sort controls immediately alongside the search toolbar */
html.gl-dark #content-body .filtered-search-wrapper + .gl-button,
html.gl-dark #content-body .gl-filtered-search + .gl-button {
  background: #352a25 !important;
  border-color: rgba(244, 228, 216, 0.10) !important;
  color: #e8ddd6 !important;
}

/* --- README/file header: remove the remaining blue-gray bar --- */
html.gl-dark #content-body .readme-holder .file-title,
html.gl-dark #content-body .readme-holder .file-header,
html.gl-dark #content-body .readme-holder .file-title-flex-parent,
html.gl-dark #content-body .file-holder .file-title,
html.gl-dark #content-body .file-holder .file-header,
html.gl-dark #content-body .file-holder .file-title-flex-parent {
  background:
    linear-gradient(
      180deg,
      #332823,
      #2b221e
    ) !important;

  border-color: rgba(244, 228, 216, 0.09) !important;
  color: #d7a17b !important;
  box-shadow: none !important;
}

/* --- Remaining cold utility surfaces, but only inside the main content --- */
html.gl-dark #content-body .gl-bg-gray-10,
html.gl-dark #content-body .gl-bg-gray-50,
html.gl-dark #content-body .gl-bg-neutral-50,
html.gl-dark #content-body .gl-bg-neutral-100 {
  background-color: #2b221e !important;
}

html.gl-dark #content-body .gl-bg-default {
  background-color: #271f1c !important;
}

html.gl-dark #content-body .gl-bg-subtle {
  background-color: #2b221e !important;
}

html.gl-dark #content-body .gl-bg-strong {
  background-color: #332823 !important;
}


/* =========================================================
   HaggisDevLab Theme — Remove Secondary Top Strip
   Version: 1.4
   The global .super-top-bar remains untouched.
   ========================================================= */

/* Hide the secondary breadcrumb/top strip below the main header */
html.gl-dark .top-bar:not(.super-top-bar),
html.gl-dark .top-bar-container:not(.super-top-bar),
html.gl-dark .breadcrumbs-container,
html.gl-dark .page-breadcrumbs {
  display: none !important;
}

/* Remove any space or divider left behind by the hidden strip */
html.gl-dark .content-wrapper,
html.gl-dark .page-with-super-sidebar,
html.gl-dark #content-body {
  border-top: 0 !important;
}

/* Let the main content begin cleanly below the global header */
html.gl-dark .content-wrapper {
  margin-top: 0 !important;
}


/* =========================================================
   HaggisDevLab Theme — Breadcrumb Strip Fix
   Version: 1.5
   Exact target discovered in GitLab DOM:
   <nav class="gl-breadcrumbs">...</nav>
   ========================================================= */

/* Hide the breadcrumb navigation itself */
html.gl-dark nav.gl-breadcrumbs {
  display: none !important;
}

/*
   Collapse only the direct wrapper that contains the breadcrumb nav.
   Modern Chromium supports :has(), and this avoids touching unrelated
   top bars or application controls.
*/
html.gl-dark *:has(> nav.gl-breadcrumbs) {
  min-height: 0 !important;
  height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}


/* =========================================================
   HaggisDevLab Theme — Repository Polish
   Version: 1.6
   Fixes:
   - remaining empty breadcrumb strip
   - repository commit summary block
   - repository file table
   ========================================================= */

/* ---------------------------------------------------------
   EMPTY STRIP UNDER GLOBAL HEADER
   We no longer try to collapse unknown GitLab wrappers.
   Instead every breadcrumb wrapper is visually merged into
   the application canvas, so no cold/black strip remains.
   --------------------------------------------------------- */

html.gl-dark nav.gl-breadcrumbs {
  display: none !important;
}

html.gl-dark *:has(> nav.gl-breadcrumbs),
html.gl-dark *:has(> * > nav.gl-breadcrumbs) {
  background: #181412 !important;
  border-top-color: transparent !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
}


/* ---------------------------------------------------------
   REPOSITORY — LAST COMMIT / COMMIT SUMMARY
   --------------------------------------------------------- */

html.gl-dark #content-body .commit-box,
html.gl-dark #content-body .commit-box-container,
html.gl-dark #content-body .js-commit-box,
html.gl-dark #content-body [data-testid="commit-box"] {
  background:
    linear-gradient(
      180deg,
      rgba(53, 41, 35, 0.96),
      rgba(45, 35, 30, 0.96)
    ) !important;

  border: 1px solid rgba(244, 228, 216, 0.10) !important;
  border-radius: 12px !important;
  color: #eee5df !important;
  box-shadow: none !important;
}

/* Utility surfaces nested inside the commit box */
html.gl-dark #content-body .commit-box .gl-bg-default,
html.gl-dark #content-body .commit-box .gl-bg-subtle,
html.gl-dark #content-body .commit-box .gl-bg-strong,
html.gl-dark #content-body .commit-box-container .gl-bg-default,
html.gl-dark #content-body .commit-box-container .gl-bg-subtle,
html.gl-dark #content-body .commit-box-container .gl-bg-strong,
html.gl-dark #content-body .js-commit-box .gl-bg-default,
html.gl-dark #content-body .js-commit-box .gl-bg-subtle,
html.gl-dark #content-body .js-commit-box .gl-bg-strong {
  background: transparent !important;
}

/* Commit hash / history controls should stay native in behavior,
   but use the warm neutral surface */
html.gl-dark #content-body .commit-box .gl-button,
html.gl-dark #content-body .commit-box-container .gl-button,
html.gl-dark #content-body .js-commit-box .gl-button {
  --gl-control-background-color-default: #3a2d27;
  --gl-control-background-color-hover: #44352e;
  --gl-control-border-color-default: rgba(244, 228, 216, 0.11);
  --gl-control-text-color-default: #e9ddd5;
}


/* ---------------------------------------------------------
   REPOSITORY — FILE TREE / FILE TABLE
   --------------------------------------------------------- */

html.gl-dark #content-body .tree-holder,
html.gl-dark #content-body .repository-tree,
html.gl-dark #content-body .tree-table,
html.gl-dark #content-body .table-holder:has(.tree-table),
html.gl-dark #content-body table.tree-table {
  background: #271f1c !important;
  border-color: rgba(244, 228, 216, 0.10) !important;
  color: #eee5df !important;
}

/* Header: Name / Last commit / Last update */
html.gl-dark #content-body .tree-table thead,
html.gl-dark #content-body .tree-table thead tr,
html.gl-dark #content-body .tree-table thead th,
html.gl-dark #content-body table.tree-table thead,
html.gl-dark #content-body table.tree-table thead tr,
html.gl-dark #content-body table.tree-table thead th {
  background: #342923 !important;
  color: #eee5df !important;
  border-color: rgba(244, 228, 216, 0.11) !important;
}

/* File rows */
html.gl-dark #content-body .tree-table tbody,
html.gl-dark #content-body .tree-table tbody tr,
html.gl-dark #content-body .tree-table tbody td,
html.gl-dark #content-body table.tree-table tbody,
html.gl-dark #content-body table.tree-table tbody tr,
html.gl-dark #content-body table.tree-table tbody td {
  background: #29211d !important;
  color: #cdbfb6 !important;
  border-color: rgba(244, 228, 216, 0.08) !important;
}

html.gl-dark #content-body .tree-table tbody tr:hover,
html.gl-dark #content-body table.tree-table tbody tr:hover {
  background: #302621 !important;
}

/* Newer GitLab repository table variants */
html.gl-dark #content-body .repository-tree .gl-table,
html.gl-dark #content-body .repository-tree .gl-table thead,
html.gl-dark #content-body .repository-tree .gl-table tbody {
  background: transparent !important;
}

html.gl-dark #content-body .repository-tree .gl-table th {
  background: #342923 !important;
  color: #eee5df !important;
  border-color: rgba(244, 228, 216, 0.11) !important;
}

html.gl-dark #content-body .repository-tree .gl-table td {
  background: #29211d !important;
  color: #cdbfb6 !important;
  border-color: rgba(244, 228, 216, 0.08) !important;
}

html.gl-dark #content-body .repository-tree .gl-table tr:hover td {
  background: #302621 !important;
}


/* =========================================================
   HaggisDevLab Theme — Commit Card Final Polish
   Version: 1.7
   Exact anchor:
   <div class="committer ..." data-testid="committer">
   ========================================================= */

/* The commit summary card that contains the exact committer block */
html.gl-dark #content-body .gl-bg-default:has([data-testid="committer"]),
html.gl-dark #content-body .gl-bg-subtle:has([data-testid="committer"]),
html.gl-dark #content-body .gl-bg-strong:has([data-testid="committer"]),
html.gl-dark #content-body .gl-border:has([data-testid="committer"]),
html.gl-dark #content-body .gl-rounded-base:has([data-testid="committer"]),
html.gl-dark #content-body .gl-rounded-lg:has([data-testid="committer"]) {
  background:
    linear-gradient(
      180deg,
      rgba(53, 41, 35, 0.96),
      rgba(45, 35, 30, 0.96)
    ) !important;

  border-color: rgba(244, 228, 216, 0.10) !important;
  color: #eee5df !important;
  box-shadow: none !important;
}

/* Exact committer line */
html.gl-dark #content-body .committer[data-testid="committer"] {
  color: #bca99d !important;
}

/* Author */
html.gl-dark #content-body
.committer[data-testid="committer"]
.commit-author-link {
  color: #d7a17b !important;
  text-decoration: none !important;
}

html.gl-dark #content-body
.committer[data-testid="committer"]
.commit-author-link:hover {
  color: #e8b58e !important;
  text-decoration: underline !important;
}

/* "authored" + timestamp */
html.gl-dark #content-body
.committer[data-testid="committer"] time {
  color: #a9988d !important;
}

/* Buttons living inside the same commit card */
html.gl-dark #content-body
.gl-bg-default:has([data-testid="committer"]) .gl-button,
html.gl-dark #content-body
.gl-bg-subtle:has([data-testid="committer"]) .gl-button,
html.gl-dark #content-body
.gl-border:has([data-testid="committer"]) .gl-button,
html.gl-dark #content-body
.gl-rounded-base:has([data-testid="committer"]) .gl-button {
  background: #392c27 !important;
  border-color: rgba(244, 228, 216, 0.11) !important;
  color: #e9ddd5 !important;
}

html.gl-dark #content-body
.gl-bg-default:has([data-testid="committer"]) .gl-button:hover,
html.gl-dark #content-body
.gl-bg-subtle:has([data-testid="committer"]) .gl-button:hover,
html.gl-dark #content-body
.gl-border:has([data-testid="committer"]) .gl-button:hover,
html.gl-dark #content-body
.gl-rounded-base:has([data-testid="committer"]) .gl-button:hover {
  background: #44352e !important;
  border-color: rgba(244, 228, 216, 0.16) !important;
}


/* =========================================================
   HaggisDevLab Theme — Commit + Pipelines Filter Polish
   Version: 1.8
   Exact selectors based on GitLab 19.3.2 DOM supplied by user.
   ========================================================= */


/* =========================================================
   A. REPOSITORY — RECENT COMMIT CARD
   Exact element:
   .well-segment.commit
   ========================================================= */

html.gl-dark #content-body .well-segment.commit {
  background:
    linear-gradient(
      180deg,
      rgba(53, 41, 35, 0.96),
      rgba(45, 35, 30, 0.96)
    ) !important;

  border-color: rgba(244, 228, 216, 0.10) !important;
  color: #eee5df !important;
  box-shadow: none !important;
}

/* Mobile/collapsed commit variant immediately following desktop card */
html.gl-dark #content-body .well-segment.commit + .well-segment {
  background:
    linear-gradient(
      180deg,
      rgba(53, 41, 35, 0.96),
      rgba(45, 35, 30, 0.96)
    ) !important;

  border-color: rgba(244, 228, 216, 0.10) !important;
  color: #eee5df !important;
}

/* Commit title */
html.gl-dark #content-body .well-segment.commit .commit-row-message {
  color: #d7a17b !important;
}

html.gl-dark #content-body .well-segment.commit .commit-row-message:hover {
  color: #e8b58e !important;
}

/* Committer metadata */
html.gl-dark #content-body .well-segment.commit .committer[data-testid="committer"] {
  color: #b7a69b !important;
}

html.gl-dark #content-body .well-segment.commit .commit-author-link {
  color: #d7a17b !important;
}

html.gl-dark #content-body .well-segment.commit .commit-author-link:hover {
  color: #e8b58e !important;
}

html.gl-dark #content-body .well-segment.commit .committer time {
  color: #9f8e82 !important;
}

/* Extended commit description */
html.gl-dark #content-body .well-segment.commit .commit-row-description {
  color: #cdbfb6 !important;
  background: transparent !important;
}

/* SHA label */
html.gl-dark #content-body .well-segment.commit [data-testid="last-commit-id-label"] {
  background: #392c27 !important;
  border-color: rgba(244, 228, 216, 0.11) !important;
  color: #e9ddd5 !important;
}

/* Copy / History / ellipsis controls inside commit card only */
html.gl-dark #content-body .well-segment.commit .gl-button {
  background: #392c27 !important;
  border-color: rgba(244, 228, 216, 0.11) !important;
  color: #e9ddd5 !important;
}

html.gl-dark #content-body .well-segment.commit .gl-button:hover {
  background: #44352e !important;
  border-color: rgba(244, 228, 216, 0.16) !important;
  color: #fff7f1 !important;
}

/* Keep CI status semantic color untouched */
html.gl-dark #content-body .well-segment.commit .ci-icon {
  background: transparent !important;
}


/* =========================================================
   B. PIPELINES — FILTER BAR
   Exact root:
   [data-testid="filtered-search-input"]
   ========================================================= */

/* The row holding filter + dropdown */
html.gl-dark #content-body .row-content-block:has([data-testid="filtered-search-input"]) {
  background: transparent !important;
  border-color: rgba(244, 228, 216, 0.08) !important;
}

/* Search control outer group */
html.gl-dark #content-body [data-testid="filtered-search-input"] {
  background:
    linear-gradient(
      180deg,
      rgba(48, 38, 34, 0.96),
      rgba(41, 32, 29, 0.96)
    ) !important;

  border: 1px solid rgba(244, 228, 216, 0.10) !important;
  border-radius: 12px !important;
  color: #eee5df !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.025) !important;
  overflow: hidden !important;
}

/* GitLab's nested filtered-search layers */
html.gl-dark #content-body [data-testid="filtered-search-input"]
.gl-filtered-search-scrollable-container,

html.gl-dark #content-body [data-testid="filtered-search-input"]
.gl-filtered-search-scrollable,

html.gl-dark #content-body [data-testid="filtered-search-input"]
.gl-filtered-search-term,

html.gl-dark #content-body [data-testid="filtered-search-input"]
.gl-filtered-search-token-segment {
  background: transparent !important;
  border-color: transparent !important;
}

/* Pipeline filter text input */
html.gl-dark #content-body
[data-testid="filtered-search-term-input"] {
  background: transparent !important;
  border: 0 !important;
  color: #eee5df !important;
  box-shadow: none !important;
}

html.gl-dark #content-body
[data-testid="filtered-search-term-input"]::placeholder {
  color: #9f8e82 !important;
}

/* Search button attached to filter */
html.gl-dark #content-body
[data-testid="filtered-search-input"]
[data-testid="search-button"] {
  background: #352a25 !important;
  border-color: rgba(244, 228, 216, 0.10) !important;
  color: #e8ddd6 !important;
}

html.gl-dark #content-body
[data-testid="filtered-search-input"]
[data-testid="search-button"]:hover {
  background: #40322b !important;
  border-color: rgba(244, 228, 216, 0.16) !important;
}


/* =========================================================
   C. PIPELINES — "SHOW PIPELINE ID" DROPDOWN
   ========================================================= */

html.gl-dark #content-body
.gl-new-dropdown:has([data-testid="base-dropdown-toggle"])
[data-testid="base-dropdown-toggle"],

html.gl-dark #content-body
[data-testid="base-dropdown-toggle"] {
  background:
    linear-gradient(
      180deg,
      #392c27,
      #332722
    ) !important;

  border-color: rgba(244, 228, 216, 0.11) !important;
  color: #e9ddd5 !important;
}

html.gl-dark #content-body
[data-testid="base-dropdown-toggle"]:hover {
  background: #44352e !important;
  border-color: rgba(244, 228, 216, 0.16) !important;
  color: #fff7f1 !important;
}

/* Dropdown panel */
html.gl-dark #content-body
.gl-new-dropdown-panel[data-testid="base-dropdown-menu"] {
  background:
    linear-gradient(
      180deg,
      rgba(48, 38, 34, 0.985),
      rgba(39, 31, 28, 0.985)
    ) !important;

  border: 1px solid rgba(244, 228, 216, 0.11) !important;
  border-radius: 12px !important;

  box-shadow:
    0 16px 42px rgba(0, 0, 0, 0.30) !important;

  backdrop-filter: blur(16px) saturate(108%);
  -webkit-backdrop-filter: blur(16px) saturate(108%);
}

html.gl-dark #content-body
.gl-new-dropdown-panel[data-testid="base-dropdown-menu"]
.gl-new-dropdown-inner,

html.gl-dark #content-body
.gl-new-dropdown-panel[data-testid="base-dropdown-menu"]
.gl-new-dropdown-contents {
  background: transparent !important;
}

/* Dropdown entries */
html.gl-dark #content-body
.gl-new-dropdown-panel[data-testid="base-dropdown-menu"]
.gl-new-dropdown-item {
  color: #d8cbc2 !important;
}

html.gl-dark #content-body
.gl-new-dropdown-panel[data-testid="base-dropdown-menu"]
.gl-new-dropdown-item:hover,

html.gl-dark #content-body
.gl-new-dropdown-panel[data-testid="base-dropdown-menu"]
.gl-new-dropdown-item:focus {
  background: rgba(190, 134, 97, 0.10) !important;
  color: #fff7f1 !important;
}

/* Selected dropdown entry */
html.gl-dark #content-body
.gl-new-dropdown-panel[data-testid="base-dropdown-menu"]
.gl-new-dropdown-item[aria-selected="true"] {
  background: rgba(190, 134, 97, 0.15) !important;
  color: #fff7f1 !important;
}

/* Scrims at top/bottom of dropdown should use same warm surface */
html.gl-dark #content-body
.gl-new-dropdown-panel[data-testid="base-dropdown-menu"]
.top-scrim,

html.gl-dark #content-body
.gl-new-dropdown-panel[data-testid="base-dropdown-menu"]
.bottom-scrim {
  background:
    linear-gradient(
      rgba(48, 38, 34, 0.96),
      rgba(48, 38, 34, 0)
    ) !important;
}

/* Chevron follows button text color */
html.gl-dark #content-body
[data-testid="base-dropdown-toggle"]
.gl-new-dropdown-chevron {
  color: #cdbfb6 !important;
}


/* =========================================================
   HaggisDevLab Theme — Login Page
   Version: 1.9
   Exact selectors based on supplied GitLab sign-in DOM.
   Scope is limited to pages containing #sign-in-form.
   ========================================================= */

html.gl-dark body:has(#sign-in-form) {
  background:
    radial-gradient(circle at 72% 28%, rgba(190, 134, 97, 0.07), transparent 28rem),
    radial-gradient(circle at 24% 18%, rgba(255, 255, 255, 0.025), transparent 24rem),
    #181412 !important;
  color: #eee5df !important;
}

html.gl-dark body:has(#sign-in-form) main.content {
  width: min(100%, 1060px) !important;
  margin-inline: auto !important;
  padding: 4.5rem 2rem 3rem !important;
}

html.gl-dark body:has(#sign-in-form) main.content > .row {
  align-items: center !important;
  column-gap: 5rem !important;
}

html.gl-dark body:has(#sign-in-form) main.content #js-custom-sign-in-description {
  color: #cdbfb6 !important;
  max-width: 34rem;
  line-height: 1.65;
}

html.gl-dark body:has(#sign-in-form) main.content h1 {
  color: #f3e9e2 !important;
  letter-spacing: -0.02em;
}

html.gl-dark body:has(#sign-in-form) main.content .col-sm-12.bar {
  padding: 2rem !important;
  background:
    linear-gradient(
      180deg,
      rgba(49, 38, 33, 0.94),
      rgba(38, 30, 27, 0.94)
    ) !important;
  border: 1px solid rgba(244, 228, 216, 0.11) !important;
  border-radius: 18px !important;
  box-shadow:
    0 22px 55px rgba(0, 0, 0, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
  backdrop-filter: blur(18px) saturate(108%);
  -webkit-backdrop-filter: blur(18px) saturate(108%);
}

html.gl-dark body:has(#sign-in-form) main.content .bar .gl-text-center img {
  height: auto !important;
  max-height: 52px !important;
  max-width: 220px !important;
  object-fit: contain !important;
}

html.gl-dark body:has(#sign-in-form) #sign-in-form .col-form-label {
  color: #e9ddd5 !important;
  font-weight: 600 !important;
}

html.gl-dark body:has(#sign-in-form) #sign-in-form .gl-form-input {
  min-height: 42px !important;
  background: #211a17 !important;
  color: #f2e8e1 !important;
  border: 1px solid rgba(244, 228, 216, 0.14) !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02) !important;
  transition:
    border-color 140ms ease,
    box-shadow 140ms ease,
    background 140ms ease !important;
}

html.gl-dark body:has(#sign-in-form) #sign-in-form .gl-form-input:hover {
  background: #261e1b !important;
  border-color: rgba(244, 228, 216, 0.20) !important;
}

html.gl-dark body:has(#sign-in-form) #sign-in-form .gl-form-input:focus {
  background: #261e1b !important;
  border-color: #be8661 !important;
  box-shadow: 0 0 0 3px rgba(190, 134, 97, 0.16) !important;
}

html.gl-dark body:has(#sign-in-form) #sign-in-form .gl-form-input::placeholder {
  color: #887970 !important;
}

html.gl-dark body:has(#sign-in-form) #sign-in-form [aria-label="Show password"] {
  background: transparent !important;
  border-color: transparent !important;
  color: #bca99d !important;
}

html.gl-dark body:has(#sign-in-form) #sign-in-form [aria-label="Show password"]:hover {
  color: #eee5df !important;
}

html.gl-dark body:has(#sign-in-form) main.content a {
  color: #d7a17b !important;
}

html.gl-dark body:has(#sign-in-form) main.content a:hover {
  color: #e8b58e !important;
}

html.gl-dark body:has(#sign-in-form) #sign-in-form .custom-control-label {
  color: #d9cdc5 !important;
}

html.gl-dark body:has(#sign-in-form) [data-testid="sign-in-button"] {
  min-height: 42px !important;
  background: linear-gradient(180deg, #c18a65, #a96f4e) !important;
  border: 1px solid rgba(255, 236, 222, 0.17) !important;
  border-radius: 10px !important;
  color: #1d1512 !important;
  font-weight: 700 !important;
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.20) !important;
}

html.gl-dark body:has(#sign-in-form) [data-testid="sign-in-button"]:hover {
  background: linear-gradient(180deg, #d09a72, #b97d58) !important;
}

html.gl-dark body:has(#sign-in-form) [data-testid="sign-in-button"]:active {
  transform: translateY(1px);
}

html.gl-dark body:has(#sign-in-form) [data-testid="passkey-login-button"] {
  min-height: 42px !important;
  background: #352a25 !important;
  border: 1px solid rgba(244, 228, 216, 0.11) !important;
  border-radius: 10px !important;
  color: #e9ddd5 !important;
}

html.gl-dark body:has(#sign-in-form) [data-testid="passkey-login-button"]:hover {
  background: #40322b !important;
  border-color: rgba(244, 228, 216, 0.17) !important;
  color: #fff7f1 !important;
}

html.gl-dark body:has(#sign-in-form) main.content .gl-mt-3.gl-text-center {
  color: #bca99d !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container {
  background: rgba(24, 20, 18, 0.82) !important;
  border-top: 1px solid rgba(244, 228, 216, 0.07) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

html.gl-dark body:has(#sign-in-form) .footer-container > hr {
  border-color: transparent !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container .container {
  color: #a9988d !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container a {
  color: #bfa18d !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container a:hover {
  color: #e0b08e !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-toggle"] {
  background: transparent !important;
  border-color: transparent !important;
  color: #bca99d !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-toggle"]:hover {
  background: rgba(190, 134, 97, 0.08) !important;
  color: #eee5df !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-menu"] {
  background:
    linear-gradient(
      180deg,
      rgba(48, 38, 34, 0.985),
      rgba(39, 31, 28, 0.985)
    ) !important;
  border: 1px solid rgba(244, 228, 216, 0.11) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.30) !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-menu"] .gl-new-dropdown-inner,
html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-menu"] .gl-new-dropdown-contents {
  background: transparent !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-menu"] .gl-new-dropdown-item {
  color: #d8cbc2 !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-menu"] .gl-new-dropdown-item:hover,
html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-menu"] .gl-new-dropdown-item:focus,
html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-menu"] .gl-new-dropdown-item[aria-selected="true"] {
  background: rgba(190, 134, 97, 0.12) !important;
  color: #fff7f1 !important;
}

html.gl-dark body:has(#sign-in-form) .footer-container [data-testid="base-dropdown-menu"] [data-testid="footer"] {
  border-color: rgba(244, 228, 216, 0.09) !important;
}

@media (max-width: 767px) {
  html.gl-dark body:has(#sign-in-form) main.content {
    padding: 2rem 1rem 2rem !important;
  }

  html.gl-dark body:has(#sign-in-form) main.content .col-sm-12.bar {
    padding: 1.4rem !important;
    border-radius: 14px !important;
  }

  html.gl-dark body:has(#sign-in-form) main.content > .row {
    column-gap: 0 !important;
  }
}


/* =========================================================
   HaggisDevLab Theme — Login Language Dropdown Layer Fix
   Version: 1.10
   Keeps the language menu above the login card.
   ========================================================= */

/* The login card uses backdrop-filter and therefore creates
   its own stacking context. Keep it below the footer dropdown. */
html.gl-dark body:has(#sign-in-form)
main.content .col-sm-12.bar {
  position: relative !important;
  z-index: 1 !important;
}

/* Footer and its dropdown must be allowed to paint above main content. */
html.gl-dark body:has(#sign-in-form)
.footer-container {
  position: relative !important;
  z-index: 50 !important;
  overflow: visible !important;
}

html.gl-dark body:has(#sign-in-form)
.footer-container .container {
  overflow: visible !important;
}

html.gl-dark body:has(#sign-in-form)
.footer-container .gl-new-dropdown {
  position: relative !important;
  z-index: 100 !important;
  overflow: visible !important;
}

html.gl-dark body:has(#sign-in-form)
.footer-container .gl-new-dropdown-container {
  position: relative !important;
  z-index: 1000 !important;
  overflow: visible !important;
}

html.gl-dark body:has(#sign-in-form)
.footer-container [data-testid="base-dropdown-menu"] {
  z-index: 1001 !important;
}