/* Matcha Blue (butterfly pea) - Matcha theme family for Forgejo */

:root {
  --mn-900: #0b0e18;
  --mn-850: #0e1220;
  --mn-800: #121729;
  --mn-750: #161c32;
  --mn-700: #1b233e;
  --mn-650: #212b4d;
  --mn-600: #28355f;
  --mn-550: #2f3e72;
  --mn-500: #364986;
  --mn-450: #3e549d;
  --mn-400: #4660b4;
  --mn-350: #5b73c0;
  --mn-300: #7287ca;
  --mn-250: #8a9bd4;
  --mn-200: #a2afdd;
  --mn-150: #bbc6e7;
  --mn-100: #d2d9ef;

  --is-dark-theme: true;
  color-scheme: dark;

  --color-primary: #7e96f6;
  --color-primary-contrast: #0b0e18;
  --color-primary-dark-1: #a6b6f7;
  --color-primary-dark-2: #a6b6f7;
  --color-primary-dark-3: #ccd5fa;
  --color-primary-dark-4: #ccd5fa;
  --color-primary-dark-5: #f1f4fd;
  --color-primary-dark-6: #f1f4fd;
  --color-primary-dark-7: #f2f4fd;
  --color-primary-light-1: #5575f7;
  --color-primary-light-2: #2e55f5;
  --color-primary-light-3: #0b3af4;
  --color-primary-light-4: #0a33d6;
  --color-primary-light-5: #0a33d6;
  --color-primary-light-6: #092cb9;
  --color-primary-light-7: #092cb9;
  --color-primary-alpha-10: #5575f719;
  --color-primary-alpha-20: #5575f733;
  --color-primary-alpha-30: #5575f74b;
  --color-primary-alpha-40: #5575f766;
  --color-primary-alpha-50: #5575f780;
  --color-primary-alpha-60: #5575f799;
  --color-primary-alpha-70: #5575f7b3;
  --color-primary-alpha-80: #5575f7cc;
  --color-primary-alpha-90: #5575f7e1;
  --color-primary-hover: var(--color-primary-light-1);
  --color-primary-active: var(--color-primary-light-2);

  --color-secondary: var(--mn-700);
  --color-secondary-dark-1: var(--mn-550);
  --color-secondary-dark-2: var(--mn-500);
  --color-secondary-dark-3: var(--mn-450);
  --color-secondary-dark-4: var(--mn-400);
  --color-secondary-dark-5: var(--mn-350);
  --color-secondary-dark-6: var(--mn-300);
  --color-secondary-dark-7: var(--mn-250);
  --color-secondary-dark-8: var(--mn-200);
  --color-secondary-dark-9: var(--mn-150);
  --color-secondary-dark-10: var(--mn-100);
  --color-secondary-dark-11: var(--mn-100);
  --color-secondary-dark-12: var(--mn-100);
  --color-secondary-dark-13: var(--mn-100);
  --color-secondary-light-1: var(--mn-650);
  --color-secondary-light-2: var(--mn-700);
  --color-secondary-light-3: var(--mn-750);
  --color-secondary-light-4: var(--mn-800);
  --color-secondary-alpha-10: #212b4d19;
  --color-secondary-alpha-20: #212b4d33;
  --color-secondary-alpha-30: #212b4d4b;
  --color-secondary-alpha-40: #212b4d66;
  --color-secondary-alpha-50: #212b4d80;
  --color-secondary-alpha-60: #212b4d99;
  --color-secondary-alpha-70: #212b4db3;
  --color-secondary-alpha-80: #212b4dcc;
  --color-secondary-alpha-90: #212b4de1;
  --color-secondary-hover: var(--color-secondary-light-1);
  --color-secondary-active: var(--color-secondary-light-2);

  --color-console-fg: var(--mn-150);
  --color-console-fg-subtle: var(--mn-350);
  --color-console-bg: #0e1220;
  --color-console-border: var(--mn-600);
  --color-console-hover-bg: #ffffff16;
  --color-console-active-bg: var(--mn-550);
  --color-console-menu-bg: var(--mn-600);
  --color-console-menu-border: var(--mn-500);

  --color-red: #b03c50;
  --color-orange: #c26a3c;
  --color-yellow: #b18a2f;
  --color-olive: #7d9350;
  --color-green: #2f8a6a;
  --color-teal: #197f8e;
  --color-blue: #4459db;
  --color-violet: #6f5fd8;
  --color-purple: #8a5ac3;
  --color-pink: #b0507a;
  --color-brown: #8a6a5a;
  --color-grey: var(--mn-500);
  --color-black: #0b0e18;
  --color-red-light: #cc5068;
  --color-orange-light: #d9835a;
  --color-yellow-light: #cba24e;
  --color-olive-light: #94ab60;
  --color-green-light: #3aa584;
  --color-teal-light: #26a4b8;
  --color-blue-light: #5c78ee;
  --color-violet-light: #8b7af0;
  --color-purple-light: #a473dd;
  --color-pink-light: #c96b95;
  --color-brown-light: #a38070;
  --color-grey-light: var(--mn-300);
  --color-black-light: var(--mn-750);
  --color-red-dark-1: #9c3545;
  --color-orange-dark-1: #ad5c33;
  --color-yellow-dark-1: #9c7828;
  --color-olive-dark-1: #6d8144;
  --color-green-dark-1: #26765b;
  --color-teal-dark-1: #166f7c;
  --color-blue-dark-1: #3746b4;
  --color-violet-dark-1: #5f51bd;
  --color-purple-dark-1: #784da8;
  --color-pink-dark-1: #9a4569;
  --color-brown-dark-1: #785b4e;
  --color-black-dark-1: #0b0e18;
  --color-red-dark-2: #872e3c;
  --color-orange-dark-2: #964f2b;
  --color-yellow-dark-2: #856622;
  --color-olive-dark-2: #5c6d39;
  --color-green-dark-2: #1e614b;
  --color-teal-dark-2: #125b66;
  --color-blue-dark-2: #2e3a92;
  --color-violet-dark-2: #50449c;
  --color-purple-dark-2: #66418e;
  --color-pink-dark-2: #833a59;
  --color-brown-dark-2: #644c41;
  --color-black-dark-2: #0b0e18;

  --color-ansi-black: var(--mn-750);
  --color-ansi-red: #c25a70;
  --color-ansi-green: #4fb094;
  --color-ansi-yellow: #c9a25e;
  --color-ansi-blue: #7b93f7;
  --color-ansi-magenta: #a06fd6;
  --color-ansi-cyan: #4aa6c9;
  --color-ansi-white: var(--color-console-fg-subtle);
  --color-ansi-bright-black: var(--mn-500);
  --color-ansi-bright-red: #d67086;
  --color-ansi-bright-green: #64c8aa;
  --color-ansi-bright-yellow: #dcb773;
  --color-ansi-bright-blue: #9aabf9;
  --color-ansi-bright-magenta: #b98be6;
  --color-ansi-bright-cyan: #5fbfdd;
  --color-ansi-bright-white: var(--color-console-fg);

  --color-gold: #b1983b;
  --color-white: #ffffff;
  --color-pure-black: #000000;

  --color-diff-removed-word-bg: #6e2f43;
  --color-diff-added-word-bg: #235c53;
  --color-diff-removed-row-bg: #3a2130;
  --color-diff-moved-row-bg: #5f5a1c;
  --color-diff-added-row-bg: #172e2c;
  --color-diff-removed-row-border: #6e2f43;
  --color-diff-moved-row-border: #96801f;
  --color-diff-added-row-border: #235c53;
  --color-diff-inactive: var(--mn-650);

  --color-error-border: #6e2f43;
  --color-error-bg: #532433;
  --color-error-bg-active: #6e2f43;
  --color-error-bg-hover: #6e2f43;
  --color-error-text: #fbeef1;
  --color-success-border: #2c7a68;
  --color-success-bg: #1a4340;
  --color-success-text: #b4eee0;
  --color-warning-border: #96801f;
  --color-warning-bg: #524a1e;
  --color-warning-text: #f5e79b;
  --color-info-border: #3a4fb4;
  --color-info-bg: #26315c;
  --color-info-text: var(--mn-100);

  --color-red-badge: #b03c50;
  --color-red-badge-bg: #b03c5022;
  --color-red-badge-hover-bg: #b03c5044;
  --color-green-badge: #3aa584;
  --color-green-badge-bg: #3aa58422;
  --color-green-badge-hover-bg: #3aa58444;
  --color-yellow-badge: #b18a2f;
  --color-yellow-badge-bg: #b18a2f22;
  --color-yellow-badge-hover-bg: #b18a2f44;
  --color-orange-badge: #c26a3c;
  --color-orange-badge-bg: #c26a3c22;
  --color-orange-badge-hover-bg: #c26a3c44;

  --thin-lightness: .68;
  --regular-chroma: .19;
  --color-thin-green: oklch(var(--thin-lightness) var(--regular-chroma) 170deg);
  --color-thin-red: oklch(var(--thin-lightness) var(--regular-chroma) 15deg);
  --color-thin-purple: oklch(var(--thin-lightness) var(--regular-chroma) 300deg);
  --color-thin-orange: oklch(var(--thin-lightness) var(--regular-chroma) 60deg);
  --thin-lightness-highlight: .75;
  --color-thin-red-highlight: oklch(var(--thin-lightness-highlight) var(--regular-chroma) 15deg);
  --bg-lightness: .26;
  --bg-chroma: .05;
  --color-danger-bg: oklch(var(--bg-lightness) var(--bg-chroma) 15deg);

  --color-body: var(--mn-800);
  --color-box-header: var(--mn-700);
  --color-box-body: var(--mn-750);
  --color-box-body-highlight: var(--mn-650);
  --color-text-dark: #ffffff;
  --color-text: var(--mn-100);
  --color-text-light: var(--mn-150);
  --color-text-light-1: var(--mn-150);
  --color-text-light-2: var(--mn-200);
  --color-text-light-3: var(--mn-250);
  --color-footer: var(--mn-900);
  --color-timeline: var(--mn-650);
  --color-input-text: var(--mn-100);
  --color-input-background: var(--mn-650);
  --color-input-toggle-background: var(--mn-650);
  --color-input-border: var(--mn-550);
  --color-input-border-hover: var(--mn-450);
  --color-header-wrapper: var(--mn-850);
  --color-header-wrapper-transparent: #1b233e00;
  --color-light: #00000028;
  --color-light-mimic-enabled: rgba(0, 0, 0, calc(40 / 255 * 222 / 255 / var(--opacity-disabled)));
  --color-light-border: #ffffff28;
  --color-hover: var(--mn-600);
  --color-active: var(--mn-650);
  --color-menu: var(--mn-700);
  --color-card: var(--mn-700);
  --fancy-card-bg: var(--mn-650);
  --fancy-card-border: var(--mn-600);
  --color-markup-table-row: #ffffff06;
  --color-markup-code-block: var(--mn-850);
  --color-markup-code-inline: var(--mn-900);
  --color-button: var(--mn-600);
  --color-code-bg: var(--mn-750);
  --color-shadow: #00000060;
  --color-secondary-bg: var(--mn-700);
  --color-text-focus: #ffffff;
  --color-expand-button: var(--mn-600);
  --color-placeholder-text: var(--color-text-light-3);
  --color-editor-line-highlight: var(--mn-700);
  --color-project-board-bg: var(--color-secondary-light-3);
  --color-project-board-dark-label: var(--color-text-light-3);
  --color-caret: var(--color-text);
  --color-reaction-bg: #ffffff12;
  --color-reaction-active-bg: var(--color-primary-alpha-30);
  --color-reaction-hover-bg: var(--color-primary-alpha-40);
  --color-tooltip-text: #ffffff;
  --color-tooltip-bg: #0b0e18f0;
  --color-nav-bg: var(--mn-900);
  --color-nav-hover-bg: var(--mn-600);
  --color-secondary-nav-bg: var(--color-body);
  --color-label-text: #ffffff;
  --color-label-bg: var(--mn-600);
  --color-label-hover-bg: var(--mn-550);
  --color-label-active-bg: var(--mn-500);
  --color-label-bg-alt: var(--mn-550);
  --color-accent: var(--color-primary);
  --color-small-accent: var(--color-primary-light-5);
  --color-highlight-fg: var(--color-primary-dark-1);
  --color-highlight-bg: var(--color-primary-alpha-20);
  --color-overlay-backdrop: #0b0e18c0;
  --color-selection-bg: var(--color-primary-dark-3);
  --color-selection-fg: var(--color-pure-black);
  --checkerboard-color-1: var(--mn-500);
  --checkerboard-color-2: var(--mn-600);
  --color-indicator-offline: var(--mn-300);
  --color-indicator-offline-20: #7287ca1a;
  --color-indicator-idle: #3aa584;
  --color-indicator-idle-20: #3aa5841a;
  --color-indicator-active: #5575f7;
  --color-indicator-active-20: #5575f733;

  accent-color: var(--color-accent);
}

/* chroma syntax highlighting */
.chroma .c, .chroma .c1, .chroma .ch, .chroma .cm { color: #6b779c }
.chroma .cs { color: #c9a0f0 }
.chroma .cp { color: #8fa6f7 }
.chroma .cpf { color: #7fd1c0 }
.chroma .dl { color: #7fd1c0 }
.chroma .k, .chroma .kd, .chroma .kr, .chroma .kn, .chroma .nt, .chroma .ne, .chroma .nl, .chroma .o { color: #8fa6f7 }
.chroma .kp, .chroma .ow { color: #5575f7 }
.chroma .kt, .chroma .nc, .chroma .nd { color: #62d0e8 }
.chroma .kc, .chroma .m, .chroma .mb, .chroma .mf, .chroma .mh, .chroma .mi, .chroma .mo, .chroma .il, .chroma .no { color: #c9a0f0 }
.chroma .n, .chroma .nn, .chroma .nv, .chroma .nx { color: #d2d9ef }
.chroma .nf, .chroma .ni { color: #a6b6f7 }
.chroma .na { color: #8fa6f7 }
.chroma .nb, .chroma .bp { color: #62d0e8 }
.chroma .vc, .chroma .vg, .chroma .vi { color: #7fd1c0 }
.chroma .s, .chroma .s1, .chroma .s2, .chroma .sb, .chroma .sd, .chroma .sh { color: #7fd1c0 }
.chroma .sa, .chroma .sc, .chroma .si, .chroma .sx { color: #62d0e8 }
.chroma .se, .chroma .ss { color: #c9a0f0 }
.chroma .sr { color: #e0a9d9 }
.chroma .p { color: #a2afdd }
.chroma .w { color: #364986 }
.chroma .gd { color: #fff; background-color: #4a2634 }
.chroma .gi { color: #fff; background-color: #1f4039 }
.chroma .ge { color: #7fd1c0 }
.chroma .gh { color: #8fa6f7 }
.chroma .gu { color: #62d0e8 }
.chroma .gp { color: #a2afdd }
.chroma .go { color: #6b779c }
.chroma .gr { color: #d65f77 }
.chroma .gt { color: #d9825b }
.chroma .gs { color: #d2d9ef }

/* CodeMirror overrides */
.CodeMirror.cm-s-default .cm-comment, .CodeMirror.cm-s-paper .cm-comment { color: #6b779c }
.CodeMirror.cm-s-default .cm-keyword, .CodeMirror.cm-s-paper .cm-keyword { color: #8fa6f7 }
.CodeMirror.cm-s-default .cm-atom, .CodeMirror.cm-s-paper .cm-atom { color: #c9a0f0 }
.CodeMirror.cm-s-default .cm-number, .CodeMirror.cm-s-paper .cm-number { color: #c9a0f0 }
.CodeMirror.cm-s-default .cm-def, .CodeMirror.cm-s-paper .cm-def { color: #d2d9ef }
.CodeMirror.cm-s-default .cm-property, .CodeMirror.cm-s-paper .cm-property { color: #a6b6f7 }
.CodeMirror.cm-s-default .cm-variable-2, .CodeMirror.cm-s-paper .cm-variable-2 { color: #62d0e8 }
.CodeMirror.cm-s-default .cm-variable-3, .CodeMirror.cm-s-paper .cm-variable-3 { color: #7fd1c0 }
.CodeMirror.cm-s-default .cm-string, .CodeMirror.cm-s-paper .cm-string { color: #7fd1c0 }
.CodeMirror.cm-s-default .cm-string-2, .CodeMirror.cm-s-paper .cm-string-2 { color: #62d0e8 }
.CodeMirror.cm-s-default .cm-meta, .CodeMirror.cm-s-paper .cm-meta,
.CodeMirror.cm-s-default .cm-qualifier, .CodeMirror.cm-s-paper .cm-qualifier { color: #8fa6f7 }
.CodeMirror.cm-s-default .cm-builtin, .CodeMirror.cm-s-paper .cm-builtin { color: #62d0e8 }
.CodeMirror.cm-s-default .cm-bracket, .CodeMirror.cm-s-paper .cm-bracket { color: #a2afdd }
.CodeMirror.cm-s-default .cm-tag, .CodeMirror.cm-s-paper .cm-tag { color: #8fa6f7 }
.CodeMirror.cm-s-default .cm-attribute, .CodeMirror.cm-s-paper .cm-attribute { color: #8fa6f7 }
.CodeMirror.cm-s-default .cm-header, .CodeMirror.cm-s-paper .cm-header { color: #a6b6f7 }
.CodeMirror.cm-s-default .cm-quote, .CodeMirror.cm-s-paper .cm-quote { color: #5575f7 }
.CodeMirror.cm-s-default .cm-hr, .CodeMirror.cm-s-paper .cm-hr { color: #5b73c0 }
.CodeMirror.cm-s-default .cm-link, .CodeMirror.cm-s-paper .cm-link { color: #7fd1c0 }
.CodeMirror.cm-s-default .cm-url, .CodeMirror.cm-s-paper .cm-url { color: #bbc6e7 }
.CodeMirror.cm-s-default .cm-error, .CodeMirror.cm-s-paper .cm-error { color: #d65f77 }

/* dark-mode-only markup assets */
.markup [src$="#gh-light-mode-only"], .markup [src$="#light-mode-only"],
.markup [href$="#gh-light-mode-only"], .markup [href$="#light-mode-only"] { display: none }
.markup [src$="#gh-dark-mode-only"], .markup [src$="#dark-mode-only"],
.markup [href$="#gh-dark-mode-only"], .markup [href$="#dark-mode-only"] { display: unset }

/* dark-theme fixups carried over from forgejo-dark */
.emoji[aria-label="check mark"], .emoji[aria-label="currency exchange"],
.emoji[aria-label="TOP arrow"], .emoji[aria-label="END arrow"],
.emoji[aria-label="ON! arrow"], .emoji[aria-label="SOON arrow"],
.emoji[aria-label="heavy dollar sign"], .emoji[aria-label=copyright],
.emoji[aria-label=registered], .emoji[aria-label="trade mark"],
.emoji[aria-label=multiply], .emoji[aria-label=plus], .emoji[aria-label=minus],
.emoji[aria-label=divide], .emoji[aria-label="curly loop"],
.emoji[aria-label="double curly loop"], .emoji[aria-label="wavy dash"],
.emoji[aria-label="paw prints"], .emoji[aria-label="musical note"],
.emoji[aria-label="musical notes"] { filter: invert(100%) hue-rotate(180deg) }

i.grey.icon.icon.icon.icon { color: var(--mn-350) !important }
.ui.secondary.vertical.menu { border-radius: .28571429rem !important; overflow: hidden }
.ui.basic.primary.button.item { background-color: var(--color-active) !important; color: var(--color-text) !important; box-shadow: none !important }
.ui.red.label.notification_count, .ui.primary.label, .ui.primary.labels .label { background-color: var(--color-primary-light-3) !important }
.ui.labeled.icon.buttons > .button > .icon, .ui.labeled.icon.button > .icon { background-color: var(--color-light) !important }
#review-box .review-comments-counter { background-color: var(--color-shadow) !important; color: var(--color-white) !important; margin-inline-start: .5em }
.ui.basic.labels .primary.label, .ui.ui.ui.basic.primary.label { color: var(--color-text-dark) !important }
.ui.yellow.label.pending-label { color: var(--color-warning-text) !important }
strong.attention-important, svg.attention-important { color: var(--color-violet-light) }
strong.attention-note, svg.attention-note { color: var(--color-blue-light) }
strong.attention-caution, svg.attention-caution { color: var(--color-red-light) }
.ui.basic.red.button { background-color: var(--color-red); color: var(--color-white) }
.ui.basic.red.button:hover, .ui.basic.red.button:focus { background-color: var(--color-red-dark-1); color: var(--color-white) }
.ui.basic.red.button:active { background-color: var(--color-red-dark-2); color: var(--color-white) }