/* === LATINAI GITLAB 2026 - SOFT GREEN DARK v3 === */
/* Fixes: Weiß-Blitzer bei Transitions, Top-Bar, Scrim, CRUD */

/*:root {
  --bg-0: #0f1a14;     
  --bg-1: #132119;     
  --bg-2: #1a2e22;     
  --bg-3: #223529;     
  
  --brand: #4ade80;    
  --brand-soft: #86efac;
  --brand-dark: #22c55e;
  
  --border: #2d3d33;   
  --text-0: #e8f5e9;   
  --text-1: #d1e7d3;   
  --text-2: #a8bdb0;   
  --radius: 10px;
  --gl-text-color-default: #adadad;
  --gl-text-color-subtle: #93a6ad;
  --gl-action-selected-foreground-color-hover: #178046;
  --gl-action-neutral-foreground-color-hover: #178046;
  --gl-heading-1-color: #0b7d3e;
  --gl-dropdown-option-text-color-default: #adadad;
  --gl-text-color-strong: #18874a;
  --gl-background-color-subtle: #1a2e22;
  --gl-background-color-default: #223529;
  --gl-text-color-heading: #208543;
}*/
/*
:root {*/
  /* Deine Basis - bleibt */
  /*--bg-0: #0f1a14;     
  --bg-1: #132119;     
  --bg-2: #1a2e22;     
  --bg-3: #223529;     
  --bg-3-hover: #2a3d31;

  --brand: #4ade80;    
  --brand-soft: #86efac;
  --brand-dark: #22c55e;
*/
  /*--border: #2d3d33;*/   
  /*--text-0: #e8f5e9;*/   /* Headings - warmweiß */
  /*--text-1: #d1e7d3;*/   /* Body - hellgrün */
  /*--text-2: #a8bdb0;*/   /* Sekundär - gedämpft grün */
  /*--radius: 10px;
*/
  /* === GITLAB OVERRIDES - ALLES GRÜN, KEIN GRAU === */
  
  /* Text - weg mit #adadad */
  /*--gl-text-color-default: var(--text-1);
  --gl-text-color-subtle: var(--text-2);
  --gl-text-color-strong: var(--text-0);
  --gl-text-color-heading: var(--text-0);
  --gl-heading-1-color: var(--text-0);
  */
  /* Backgrounds - weg mit #ECECEF */
  /*--gl-background-color-default: var(--bg-1);
  --gl-background-color-subtle: var(--bg-1);
  --gl-background-color-strong: var(--bg-2);
  */
  /* Actions/Hover - Grün statt Grau */
  /*--gl-action-selected-foreground-color-hover: var(--brand-soft);
  --gl-action-neutral-foreground-color-hover: var(--brand);
  --gl-action-disabled-background-color: var(--bg-2);
  */
  /* Dropdowns */
  /*--gl-dropdown-option-text-color-default: var(--text-1);
  --gl-dropdown-option-background-color-selected-default: var(--bg-3);
  */
  /* Buttons */
  /*--gl-button-selected-background-color-default: var(--bg-3);
  --gl-button-selected-background-color-hover: var(--bg-3-hover);
  --gl-button-selected-background-color-focus: var(--bg-3-hover);
  --gl-button-default-primary-background-color-hover: var(--bg-3-hover);
  --gl-button-default-primary-background-color-focus: var(--bg-3-hover);
  */
  /* Badges */
  /*--gl-badge-muted-background-color-default: var(--bg-2);
  --gl-badge-muted-background-color-hover: var(--bg-3);
  --gl-badge-muted-background-color-focus: var(--bg-3);
  */
  /* Toggle/Switch */
  /*--gl-toggle-switch-icon-color-disabled: var(--bg-3);
  */
  /* Filtered Search */
  /*--gl-filtered-search-token-type-background-color-default: var(--bg-2);
  --gl-filtered-search-token-operator-background-color-default: var(--bg-2);
  */
  /* Feedback/Banner/Alert */
  /*--gl-feedback-neutral-background-color: var(--bg-1);
  --gl-broadcast-banner-background-color-light: var(--bg-1);
  --gl-alert-neutral-background-color: var(--bg-1);
  */
  /* Skeleton */
  /*--gl-skeleton-loader-shimmer-color: var(--bg-2);
  */
  /* Border */
  /*--gl-border-color-subtle: var(--border);
  */
  /* Contribution Graph */
  /*--user-contribution-graph-cell-level-0: var(--bg-1);
  */
  /* Sidebar */
  /*--super-sidebar-bg: var(--bg-2);
  */
  /* Bootstrap Legacy */
  /*--secondary: var(--bg-2);
  --gray-50: var(--bg-1);
  --gl-color-neutral-50: var(--bg-1);
}*/

:root {
  /* Deine Basis */
  --bg-0: #0f1a14;
  --bg-1: #132119;
  --bg-2: #1a2e22;
  --bg-3: #223529;
  --bg-3-hover: #2a3d31;

  --brand: #4ade80;
  --brand-soft: #86efac;
  --brand-dark: #22c55e;

  --border: #2d3d33;
  --text-0: #e8f5e9;
  --text-1: #d1e7d3;
  --text-2: #a8bdb0;
  --radius: 10px;


  /* === ALLE FREMDEN FARBEN KILLEN === */

  /* Text */
  --gl-text-color-default: var(--text-1);
  --gl-text-color-subtle: var(--text-2);
  --gl-text-color-strong: var(--text-0);
  --gl-text-color-heading: var(--text-0);
  --gl-heading-1-color: var(--text-0);

  /* Backgrounds */
  --gl-background-color-default: var(--bg-1);
  --gl-background-color-subtle: var(--bg-1);
  --gl-background-color-strong: var(--bg-2);

  /* Borders - war #DCDCDE + #ECECEF */
  --gl-border-color-default: var(--border);
  --gl-border-color-subtle: var(--border);
  --gl-border-color-strong: var(--border);
  --gl-border-color-section: var(--border);
  --gl-divider-color-default: var(--border);
  --gl-dropdown-divider-color: var(--border);
  --gl-broadcast-banner-border-color-light: var(--border);
  --gl-table-border-color: var(--border);
  --gl-tabs-border-color: var(--border);
  --gl-card-border-color: var(--border);
  --gl-panel-border-color: var(--border);

  /* Actions */
  --gl-action-selected-foreground-color-hover: var(--brand-soft);
  --gl-action-neutral-foreground-color-hover: var(--brand);
  --gl-action-disabled-background-color: var(--bg-2);
  --gl-action-disabled-foreground-color: var(--text-2);
  --gl-action-disabled-border-color: var(--border);

  /* Dropdowns */
  --gl-dropdown-option-text-color-default: var(--text-1);
  --gl-dropdown-option-background-color-selected-default: var(--bg-3);
  --gl-dropdown-option-background-color-selected-hover: var(--border);
  --gl-dropdown-option-background-color-selected-focus: var(--border);

  /* Buttons */
  --gl-button-selected-background-color-default: var(--bg-3);
  --gl-button-selected-background-color-hover: var(--bg-3-hover);
  --gl-button-selected-background-color-focus: var(--bg-3-hover);
  --gl-button-selected-background-color-active: var(--border);
  --gl-button-default-primary-background-color-hover: var(--bg-3-hover);
  --gl-button-default-primary-background-color-focus: var(--bg-3-hover);
  --gl-button-default-primary-background-color-active: var(--border);
  --gl-button-confirm-secondary-background-color-hover: var(--bg-3);
  --gl-button-confirm-secondary-background-color-focus: var(--bg-3);
  --gl-button-disabled-background-color: var(--bg-2);
  --gl-button-disabled-border-color: var(--border);

  /* Badges - Neutral war #DCDCDE */
  --gl-badge-muted-background-color-default: var(--bg-2);
  --gl-badge-muted-background-color-hover: var(--bg-3);
  --gl-badge-muted-background-color-focus: var(--bg-3);
  --gl-badge-muted-background-color-active: var(--border);
  --gl-badge-neutral-background-color-default: var(--border);
  --gl-badge-neutral-background-color-hover: var(--border);
  --gl-badge-neutral-background-color-focus: var(--border);

  /* Status */
  --gl-status-neutral-background-color: var(--border);

  /* Toggle/Switch */
  --gl-toggle-switch-icon-color-disabled: var(--bg-3);

  /* Filtered Search - Token war #DCDCDE */
  --gl-filtered-search-token-type-background-color-default: var(--bg-2);
  --gl-filtered-search-token-type-background-color-hover: var(--border);
  --gl-filtered-search-token-operator-background-color-default: var(--bg-2);
  --gl-filtered-search-token-operator-background-color-hover: var(--border);
  --gl-filtered-search-token-data-background-color-default: var(--border);
  --gl-token-background-color: var(--border);

  /* Feedback/Alert/Info */
  --gl-feedback-neutral-background-color: var(--bg-1);
  --gl-feedback-info-background-color: var(--bg-2);
  --gl-broadcast-banner-background-color-light: var(--bg-1);
  --gl-alert-neutral-background-color: var(--bg-1);
  --gl-alert-info-background-color: var(--bg-2);

  /* Table/Highlight */
  --gl-table-row-background-color-hover: var(--bg-2);
  --gl-highlight-target-background-color: var(--bg-2);
  --timeline-entry-target-background-color: var(--bg-2);

  /* Skeleton/Avatar */
  --gl-skeleton-loader-shimmer-color: var(--bg-2);
  --gl-skeleton-loader-background-color: var(--border);
  --gl-avatar-background-color: var(--bg-3);
  --gl-avatar-border-color: var(--border);

  /* Icons */
  --gl-icon-color-disabled: var(--text-2);
  --gl-icon-color-subtle: var(--text-2);
  --ci-icon-neutral-background-color: var(--border);

  /* Inputs/Controls */
  --gl-input-border-color-disabled: var(--border);
  --gl-control-color-disabled: var(--bg-3);
  --gl-control-border-color-disabled: var(--border);

  /* Spinner */
  --gl-spinner-track-color-default: var(--border);

  /* Contribution Graph */
  --user-contribution-graph-cell-level-0: var(--bg-1);

  /* Sidebar */
  --super-sidebar-bg: var(--bg-2);

  /* Bootstrap Legacy */
  --secondary: var(--bg-2);
  --light: var(--border);
  --gray-50: var(--bg-1);
  --gray-100: var(--border);
  --gray-200: var(--border);
  --gray-300: var(--text-2);
  --blue-50: var(--bg-2);
  --gl-color-neutral-50: var(--bg-1);
  --gl-color-neutral-100: var(--border);
  --gl-color-neutral-200: var(--border);
  --gl-color-neutral-300: var(--text-2);
  --gl-color-blue-50: var(--bg-2);
}

@media (prefers-color-scheme: light) {
    .code.white .n, 
    .code.white .hljs-built_in, 
    .code.code-syntax-highlight-theme .n, 
    .code.code-syntax-highlight-theme .hljs-built_in {
        color: #0ac900;
    }
}

.gl-flex.gl-justify-between.gl-flex-wrap.gl-flex-col.gl-gap-5.\@sm\/panel\:gl-flex-row {
  padding: 8px !important;
}

.line {
  color: #dbd94b;
}

#tree-holder {
  padding: 6px !important;
}

.nav-link {
  padding:0 px;
}

/* 0. KRITISCH: WEIß-BLITZER BEI TRANSITIONS VERHINDERN */
*, *::before, *::after {
  animation-duration: 0.3s !important;
  animation-iteration-count: 1 !important;
  /* Wichtig: background-color NICHT transitionen oder Start-Wert setzen */
  transition-property: color, border-color, box-shadow, opacity !important;
  transition-duration: 0.2s !important;
  transition-timing-function: ease-out !important;
}

/* Explizit background-color Transitions nur wo nötig + mit Startwert */
.btn, .gl-button, .nav-item a, .tree-item, .dropdown-item,
.gl-tab-nav-item, .gl-new-dropdown-item {
  transition-property: background-color, color, border-color, box-shadow !important;
  transition-duration: 0.15s !important;
}

/* Hover-States: Startfarbe definieren damit nicht über Weiß interpoliert wird */
.btn-default, .gl-button.btn-default {
  background-color: var(--bg-3) !important;
}
.btn-default:hover {
  background-color: #2a3d31 !important;
}

.nav-item a {
  background-color: transparent !important;
}
.nav-item:hover a {
  background-color: var(--bg-3) !important;
}

.tree-item {
  background-color: transparent !important;
}
.tree-item:hover {
  background-color: var(--bg-3) !important;
}

.dropdown-item, .gl-new-dropdown-item {
  background-color: transparent !important;
}
.dropdown-item:hover {
  background-color: var(--bg-3) !important;
}

/* 1. GLOBAL */
html, body, .layout-page, .content-wrapper {
  background: var(--bg-0) !important;
  color: var(--text-1) !important;
}

/* 2. HEADER + TOP-BAR-FIXED - KOMPLETT ABDECKEN */
.super-topbar, .navbar-gitlab, .top-bar-fixed,
.top-bar-fixed.container-fluid {
  background: linear-gradient(135deg, var(--bg-2) 0%, #1e3326 100%) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: none !important; /* Kein heller Schatten */
}

.top-bar-container {
  background: transparent !important;
}

/* 3. SUCHLEISTE + FILTERED SEARCH */
.gl-search-box-by-click, 
.gl-search-box-by-click input,
.gl-filtered-search-term-input,
.input-group input,
.gl-filtered-search-scrollable-container {
  background-color: var(--bg-1) !important;
  border-color: var(--border) !important;
  color: var(--text-1) !important;
}
.gl-search-box-by-click input::placeholder {
  color: var(--text-2) !important;
  opacity: 1 !important;
}

/* Filtered Search Token */
.gl-filtered-search-token-segment {
  background-color: var(--bg-2) !important;
  border-color: var(--border) !important;
}

/* 4. SIDEBAR */
.super-sidebar, .nav-sidebar {
  background: linear-gradient(180deg, var(--bg-2) 0%, #182920 100%) !important;
  border-right: 1px solid var(--border) !important;
}
.super-sidebar *, .nav-sidebar * {
  color: var(--text-1) !important;
}
.super-sidebar .nav-item a {
  background-color: transparent !important;
  color: var(--text-1) !important;
}
.super-sidebar .nav-item:hover a {
  background-color: var(--bg-3) !important;
  color: var(--brand-soft) !important;
}

/* 5. CONTENT PANELS */
.panel-content-inner {
  background: linear-gradient(180deg, var(--bg-0) 0%, #111e16 100%) !important;
}

/* 6. ALLE GITLAB UTILITY-KLASSEN */
.gl-bg-default, .bg-default,
.gl-bg-subtle, .gl-bg-strong,
.gl-bg-white, .bg-white,
.gl-bg-section, .gl-bg-dropdown {
  background-color: var(--bg-1) !important;
}

/* 7. CRUD + COMMAND PALETTE */
.crud, .crud-body, .crud-header, .crud-footer,
[data-v-9f3f7c2a], .input-box-wrapper {
  background-color: var(--bg-1) !important;
  border-color: var(--border) !important;
  color: var(--text-1) !important;
}
.crud-body {
  background-color: var(--bg-0) !important;
}

/* Scrim/Overlays - das weiße Zeug */
.top-scrim, .bottom-scrim,
.top-scrim-wrapper, .bottom-scrim-wrapper,
.gl-scroll-scrim {
  background: var(--bg-1) !important;
  background-image: linear-gradient(to bottom, var(--bg-1), transparent) !important;
}
.top-scrim-light, .bottom-scrim-light {
  background: var(--bg-1) !important;
}

/* 8. GENERIC TEXT */
.gl-text-subtle, .gl-text-secondary, .text-muted,
.gl-avatar-labeled-label, .crud-count,
.gl-text-sm, .js-timeago, time {
  color: var(--text-1) !important;
}
.gl-text-heading, h1, h2, h3, h4, h5, h6 {
  color: var(--text-0) !important;
}

/* 9. CARDS */
.card, .gl-card, .project-home-panel, .file-holder, .readme-holder,
.tree-holder, .issue-box, .well, .info-well {
  background-color: var(--bg-1) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  color: var(--text-1) !important;
}

/* 10. REPO-BAUM */
.tree-table, .gl-table, table {
  background-color: var(--bg-1) !important;
}
.tree-table th {
  background-color: var(--bg-2) !important;
  color: var(--text-0) !important;
}
.tree-item {
  background-color: transparent !important;
}
.tree-item:hover {
  background-color: var(--bg-3) !important;
}

/* 11. MARKDOWN */
.readme-holder, .markdown {
  background-color: var(--bg-1) !important;
  color: var(--text-1) !important;
}
.markdown h1, .markdown h2, .markdown h3 {
  color: var(--text-0) !important;
  border-bottom: 1px solid var(--border) !important;
}
.markdown code {
  background-color: var(--bg-0) !important;
  color: var(--brand-soft) !important;
}
.markdown pre {
  background-color: var(--bg-0) !important;
}

/* 12. BUTTONS - KEIN WEIß-BLITZ */
.btn-default, .gl-button {
  background-color: var(--bg-3) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-0) !important;
}
.btn-default:hover {
  background-color: #2a3d31 !important;
}
.btn-primary, .btn-confirm {
  background: linear-gradient(135deg, var(--brand-dark), var(--brand)) !important;
  color: #0a1a0f !important;
}

/* 13. FORMS */
.form-control, input, textarea, select, .gl-form-input {
  background-color: var(--bg-0) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-1) !important;
}
.form-control::placeholder {
  color: var(--text-2) !important;
  opacity: 1 !important;
}

/* 14. CODE */
.code, .file-content, .blob-viewer {
  background-color: #0c1510 !important;
}
.line-numbers {
  background-color: var(--bg-1) !important;
  color: var(--text-2) !important;
}

/* 15. DROPDOWNS */
.dropdown-menu, .gl-new-dropdown-panel, .popover,
.gl-search-box-by-click-history {
  background-color: var(--bg-2) !important;
  border: 1px solid var(--border) !important;
}
.dropdown-item, .gl-new-dropdown-item {
  background-color: transparent !important;
  color: var(--text-1) !important;
}
.dropdown-item:hover {
  background-color: var(--bg-3) !important;
}

/* 16. TABS */
.gl-tabs-nav {
  border-bottom: 1px solid var(--border) !important;
}
.gl-tab-nav-item-active {
  border-bottom: 2px solid var(--brand) !important;
  color: var(--text-0) !important;
  background-color: transparent !important;
}

/* 17. SCROLLBARS */
::-webkit-scrollbar-track {
  background: var(--bg-0) !important;
}
::-webkit-scrollbar-thumb {
  background: var(--bg-3) !important;
}
::-webkit-scrollbar-thumb:hover {
  background: #2d4535 !important;
}

/* 18. BADGES */
.gl-badge, .badge {
  background-color: var(--bg-3) !important;
  color: var(--text-1) !important;
  border: 1px solid var(--border) !important;
}

/* 19. ALERTS */
.gl-alert {
  background-color: var(--bg-1) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-1) !important;
}
.gl-alert-warning {
  background-color: rgba(251, 191, 36, 0.1) !important;
  border-color: rgba(251, 191, 36, 0.3) !important;
}

/* 20. BORDERS */
.gl-border-b, .gl-border-t, .gl-border, .border-b {
  border-color: var(--border) !important;
}

/* 21. FILTERED SEARCH SPEZIFISCH */
.gl-filtered-search-scrollable-container {
  background-color: var(--bg-1) !important;
}

/* 22. CONTENT LIST */
.content-list li {
  border-color: var(--border) !important;
}
.content-list li strong {
  color: var(--text-1) !important;
}
