/* One Dark for Forgejo.
 *
 * Imports Forgejo's own dark theme and repaints it, rather than forking a copy
 * of the 15KB file: everything not named below keeps upstream's values and
 * picks up upstream's fixes on the next Forgejo upgrade. The import must stay
 * the first rule in the file — CSS ignores @import after any other rule.
 *
 * The base theme derives 58 of its variables from a --steel-* neutral ramp
 * (900 darkest -> 100 lightest), so replacing the ramp moves nearly the whole
 * UI at once. Only the accent and the syntax colours need naming separately.
 */
@import url("theme-forgejo-dark.css");

:root {
  /* One Dark's neutrals. 800 is the page ground and 750 the panels sitting on
   * it, which is the same relationship the editor has with its sidebar:
   * #21252b behind, the canonical #282c34 in front. */
  --steel-900: #16181d;
  --steel-850: #1b1e24;
  --steel-800: #21252b;
  --steel-750: #282c34;
  --steel-700: #2c313a;
  --steel-650: #313640;
  --steel-600: #3a3f4b;
  --steel-550: #4b5263;
  --steel-500: #5c6370;
  --steel-450: #6b7280;
  --steel-400: #767d8a;
  --steel-350: #828997;
  --steel-300: #9da5b4;
  --steel-250: #a6adba;
  --steel-200: #abb2bf;
  --steel-150: #b6bdca;
  --steel-100: #c8ccd4;

  /* Accent: One Dark's blue in place of upstream's orange. In a dark theme the
   * -dark-N steps run lighter and -light-N darker, which looks backwards until
   * you see that they are named for the light theme they mirror. */
  --color-primary: #61afef;
  --color-primary-contrast: #16181d;
  --color-primary-dark-1: #7cbef2;
  --color-primary-dark-2: #7cbef2;
  --color-primary-dark-3: #98cef5;
  --color-primary-dark-4: #98cef5;
  --color-primary-dark-5: #b3ddf8;
  --color-primary-dark-6: #b3ddf8;
  --color-primary-dark-7: #cfebfb;
  --color-primary-light-1: #4d9fe0;
  --color-primary-light-2: #3f8fd0;
  --color-primary-light-3: #3579b3;
  --color-primary-light-4: #2b6396;
  --color-primary-light-5: #214d79;
  --color-primary-light-6: #17375c;
  --color-primary-light-7: #0d213f;
  --color-primary-alpha-10: #61afef19;
  --color-primary-alpha-20: #61afef33;
  --color-primary-alpha-30: #61afef4b;
  --color-primary-alpha-40: #61afef66;
  --color-primary-alpha-50: #61afef80;
  --color-primary-alpha-60: #61afef99;
  --color-primary-alpha-70: #61afefb3;
  --color-primary-alpha-80: #61afefcc;
  --color-primary-alpha-90: #61afefe6;

  /* Semantic colours, One Dark's palette. These are used for labels, badges
   * and status text all over the UI, not only for code. */
  --color-red: #e06c75;
  --color-orange: #d19a66;
  --color-yellow: #e5c07b;
  --color-olive: #98c379;
  --color-green: #98c379;
  --color-teal: #56b6c2;
  --color-blue: #61afef;
  --color-violet: #c678dd;
  --color-purple: #c678dd;
  --color-pink: #e06c75;
  --color-brown: #be5046;
  --color-grey: #5c6370;

  /* Diff rows. One Dark has no diff colours of its own, so these are its green
   * and red at low alpha — readable over #282c34 without hiding the syntax
   * highlighting underneath, which a solid fill would. */
  --color-diff-added-row-bg: #98c37916;
  --color-diff-added-word-bg: #98c37940;
  --color-diff-added-row-border: #98c37926;
  --color-diff-removed-row-bg: #e06c7516;
  --color-diff-removed-word-bg: #e06c7540;
  --color-diff-removed-row-border: #e06c7526;

  --color-selection-bg: #3e4451;
  --color-selection-fg: #dcdfe4;
  --color-caret: #61afef;
}

/* Syntax highlighting. The base theme ships a gruvbox-leaning chroma palette,
 * which is the part that would still look wrong after the chrome is repainted:
 * code is most of what anyone looks at here. */
.chroma .c, .chroma .c1, .chroma .ch, .chroma .cm, .chroma .cs {
  color: #5c6370;
  font-style: italic;
}
.chroma .cp, .chroma .cpf { color: #5c6370; }
.chroma .k, .chroma .kc, .chroma .kd, .chroma .kn, .chroma .kp, .chroma .kr { color: #c678dd; }
.chroma .kt, .chroma .nc, .chroma .nn, .chroma .no, .chroma .ne { color: #e5c07b; }
.chroma .s, .chroma .s1, .chroma .s2, .chroma .sa, .chroma .sb, .chroma .sc,
.chroma .sd, .chroma .se, .chroma .sh, .chroma .si, .chroma .sr, .chroma .ss,
.chroma .sx, .chroma .dl { color: #98c379; }
.chroma .m, .chroma .mb, .chroma .mf, .chroma .mh, .chroma .mi, .chroma .mo,
.chroma .il { color: #d19a66; }
.chroma .nf, .chroma .fm { color: #61afef; }
.chroma .nb, .chroma .bp { color: #e5c07b; }
.chroma .na, .chroma .nl { color: #d19a66; }
.chroma .nd { color: #61afef; }
.chroma .nt { color: #e06c75; }
.chroma .nv, .chroma .vc, .chroma .vg, .chroma .vi, .chroma .n, .chroma .nx,
.chroma .ni, .chroma .p { color: #abb2bf; }
.chroma .o, .chroma .ow { color: #56b6c2; }
.chroma .gr, .chroma .gt { color: #e06c75; }
.chroma .gh, .chroma .gu { color: #61afef; }
.chroma .gs { font-weight: 600; }
.chroma .ge { font-style: italic; }
.chroma .go, .chroma .gp, .chroma .w { color: #5c6370; }
/* Diff lines inside a highlighted block: tint only, so the syntax colours
 * above stay visible rather than being flattened to white on green. */
.chroma .gd { color: inherit; background-color: #e06c7526; }
.chroma .gi { color: inherit; background-color: #98c37926; }
