/*
 * Gitea theme: Green
 * Dark, Qui-inspired neutral surfaces with a green accent.
 * Install: copy to $GITEA_CUSTOM/public/assets/css/theme-green.css
 *          and add "green" to [ui] THEMES in app.ini.
 * Tested against Gitea 1.22+ variable names.
 */

/* Load Gitea's built-in dark theme first so every variable has a value,
   then override it below. Must stay the first rule in the file. */
@import "./theme-gitea-dark.css";

gitea-theme-meta-info {
  --theme-display-name: "Ooze";
  --theme-color-scheme: "dark";
}

:root {
  --is-dark-theme: true;
  --border-radius: 8px;
  --border-radius-medium: 10px;
  --border-radius-full: 99999px;

  /* ---- Primary: green ---- */
  --color-primary: #22c55e;
  --color-primary-contrast: #04140a;
  /* in dark themes "dark-N" means more contrast against the bg, i.e. lighter */
  --color-primary-dark-1: #38cb6e;
  --color-primary-dark-2: #4ed17e;
  --color-primary-dark-3: #64d68e;
  --color-primary-dark-4: #7adc9e;
  --color-primary-dark-5: #90e2ae;
  --color-primary-dark-6: #a7e8bf;
  --color-primary-dark-7: #bdeecf;
  --color-primary-light-1: #1eb054;
  --color-primary-light-2: #1b9c4a;
  --color-primary-light-3: #178740;
  --color-primary-light-4: #147237;
  --color-primary-light-5: #105e2d;
  --color-primary-light-6: #0d4923;
  --color-primary-light-7: #093419;
  --color-primary-alpha-10: #22c55e19;
  --color-primary-alpha-20: #22c55e33;
  --color-primary-alpha-30: #22c55e4b;
  --color-primary-alpha-40: #22c55e66;
  --color-primary-alpha-50: #22c55e80;
  --color-primary-alpha-60: #22c55e99;
  --color-primary-alpha-70: #22c55eb3;
  --color-primary-alpha-80: #22c55ecc;
  --color-primary-alpha-90: #22c55ee1;
  --color-primary-hover: var(--color-primary-dark-1);
  --color-primary-active: var(--color-primary-dark-2);

  /* ---- Secondary: neutral surfaces / borders ---- */
  --color-secondary: #2a2a2e;
  --color-secondary-dark-1: #313136;
  --color-secondary-dark-2: #3a3a40;
  --color-secondary-dark-3: #45454c;
  --color-secondary-dark-4: #52525b;
  --color-secondary-dark-5: #5f5f68;
  --color-secondary-dark-6: #71717a;
  --color-secondary-dark-7: #82828b;
  --color-secondary-dark-8: #94949c;
  --color-secondary-dark-9: #a1a1aa;
  --color-secondary-dark-10: #b4b4bb;
  --color-secondary-dark-11: #c8c8ce;
  --color-secondary-dark-12: #d4d4d8;
  --color-secondary-dark-13: #e4e4e7;
  --color-secondary-light-1: #232327;
  --color-secondary-light-2: #1d1d20;
  --color-secondary-light-3: #18181b;
  --color-secondary-light-4: #121214;
  --color-secondary-alpha-10: #71717a19;
  --color-secondary-alpha-20: #71717a33;
  --color-secondary-alpha-30: #71717a4b;
  --color-secondary-alpha-40: #71717a66;
  --color-secondary-alpha-50: #71717a80;
  --color-secondary-alpha-60: #71717a99;
  --color-secondary-alpha-70: #71717ab3;
  --color-secondary-alpha-80: #71717acc;
  --color-secondary-alpha-90: #71717ae1;
  --color-secondary-button: #1f1f23;
  --color-secondary-hover: #27272b;
  --color-secondary-active: #2f2f34;

  /* ---- Named colors ---- */
  --color-red: #ef4444;
  --color-orange: #f97316;
  --color-yellow: #eab308;
  --color-olive: #a3b23a;
  --color-green: #22c55e;
  --color-teal: #14b8a6;
  --color-blue: #3b82f6;
  --color-violet: #8b5cf6;
  --color-purple: #a855f7;
  --color-pink: #ec4899;
  --color-brown: #a16207;
  --color-black: #18181b;
  --color-grey: #71717a;
  --color-gold: #d4a017;
  --color-white: #ffffff;
  --color-red-light: #f87171;
  --color-orange-light: #fb923c;
  --color-yellow-light: #facc15;
  --color-olive-light: #bccb4f;
  --color-green-light: #4ade80;
  --color-teal-light: #2dd4bf;
  --color-blue-light: #60a5fa;
  --color-violet-light: #a78bfa;
  --color-purple-light: #c084fc;
  --color-pink-light: #f472b6;
  --color-brown-light: #ca8a04;
  --color-black-light: #2a2a2e;
  --color-grey-light: #a1a1aa;
  --color-gold-light: #e8b923;
  --color-red-dark-1: #dc2626;
  --color-orange-dark-1: #ea580c;
  --color-yellow-dark-1: #ca8a04;
  --color-olive-dark-1: #8a9830;
  --color-green-dark-1: #16a34a;
  --color-teal-dark-1: #0d9488;
  --color-blue-dark-1: #2563eb;
  --color-violet-dark-1: #7c3aed;
  --color-purple-dark-1: #9333ea;
  --color-pink-dark-1: #db2777;
  --color-brown-dark-1: #854d0e;
  --color-black-dark-1: #09090b;

  /* ---- ANSI / console ---- */
  --color-ansi-black: #27272a;
  --color-ansi-red: #f43f5e;
  --color-ansi-green: #4ade80;
  --color-ansi-yellow: #facc15;
  --color-ansi-blue: #60a5fa;
  --color-ansi-magenta: #e879f9;
  --color-ansi-cyan: #22d3ee;
  --color-ansi-white: #d4d4d8;
  --color-ansi-bright-black: #52525b;
  --color-ansi-bright-red: #fb7185;
  --color-ansi-bright-green: #86efac;
  --color-ansi-bright-yellow: #fde047;
  --color-ansi-bright-blue: #93c5fd;
  --color-ansi-bright-magenta: #f0abfc;
  --color-ansi-bright-cyan: #67e8f9;
  --color-ansi-bright-white: #fafafa;
  --color-console-fg: #e4e4e7;
  --color-console-fg-subtle: #a1a1aa;
  --color-console-bg: #09090b;
  --color-console-border: #27272a;
  --color-console-hover-bg: #ffffff0d;
  --color-console-active-bg: #313136;
  --color-console-menu-bg: #16161a;
  --color-console-menu-border: #27272a;

  /* ---- Status ---- */
  --color-error-border: #7f1d1d;
  --color-error-bg: #450a0a;
  --color-error-bg-active: #5c0f0f;
  --color-error-bg-hover: #521010;
  --color-error-text: #fca5a5;
  --color-success-border: #14532d;
  --color-success-bg: #052e16;
  --color-success-text: #86efac;
  --color-warning-border: #713f12;
  --color-warning-bg: #3a2008;
  --color-warning-text: #fde68a;
  --color-info-border: #1e3a8a;
  --color-info-bg: #0c1a3a;
  --color-info-text: #93c5fd;

  /* ---- Diff ---- */
  --color-diff-added-linenum-bg: #12361f;
  --color-diff-added-row-bg: #0f2a18;
  --color-diff-added-row-border: #1d5a32;
  --color-diff-added-word-bg: #1d5a32;
  --color-diff-removed-linenum-bg: #44111c;
  --color-diff-removed-row-bg: #2e0b13;
  --color-diff-removed-row-border: #7a1c2e;
  --color-diff-removed-word-bg: #7a1c2e;
  --color-diff-moved-row-bg: #3a3210;
  --color-diff-moved-row-border: #6b5c1c;
  --color-diff-inactive: #313136;

  /* ---- Base surfaces & text ---- */
  --color-body: #0c0c0e;
  --color-box-header: #16161a;
  --color-box-body: #121215;
  --color-box-body-highlight: #18181c;
  --color-text-dark: #fafafa;
  --color-text: #e4e4e7;
  --color-text-light: #b4b4bb;
  --color-text-light-1: #a1a1aa;
  --color-text-light-2: #8b8b94;
  --color-text-light-3: #71717a;
  --color-footer: #0c0c0e;
  --color-timeline: #27272a;
  --color-input-text: #e4e4e7;
  --color-input-background: #0f0f12;
  --color-input-toggle-background: #313136;
  --color-input-border: #27272a;
  --color-input-border-hover: #52525b;
  --color-light: #00000028;
  --color-light-mimic-enabled: rgba(0, 0, 0, calc(40 / 255 * 222 / 255 / var(--opacity-disabled)));
  --color-light-border: #ffffff12;
  --color-hover: #ffffff0a;
  --color-hover-opaque: #1a1a1e;
  --color-active: #ffffff14;
  --color-menu: #16161a;
  --color-card: #121215;
  --color-markup-table-row: #ffffff06;
  --color-markup-code-block: #101013;
  --color-markup-code-inline: #ffffff12;
  --color-button: #1f1f23;
  --color-code-bg: #101013;
  --color-shadow: #00000099;
  --color-shadow-opaque: #000000;
  --color-secondary-bg: #16161a;
  --color-expand-button: #313136;
  --color-placeholder-text: #71717a;
  --color-editor-line-highlight: #22c55e14;
  --color-project-column-bg: #16161a;
  --color-caret: #fafafa;
  --color-reaction-bg: #ffffff08;
  --color-reaction-hover-bg: var(--color-primary-alpha-30);
  --color-reaction-active-bg: var(--color-primary-alpha-40);
  --color-tooltip-text: #fafafa;
  --color-tooltip-bg: #27272a;
  --color-nav-bg: #0f0f12;
  --color-nav-hover-bg: #313136;
  --color-nav-text: #e4e4e7;
  --color-secondary-nav-bg: #0f0f12;
  --color-label-text: #e4e4e7;
  --color-label-bg: #71717a33;
  --color-label-hover-bg: #71717a55;
  --color-label-active-bg: #71717a77;
  --color-accent: var(--color-primary-light-1);
  --color-small-accent: var(--color-primary-light-5);
  --color-highlight-fg: #bdeecf;
  --color-highlight-bg: #22c55e2e;
  --color-overlay-backdrop: #000000c0;
  --color-danger: var(--color-red);
  --color-transparency-grid-light: #3f3f46;
  --color-transparency-grid-dark: #27272a;
  --color-workflow-edge-hover: #a1a1aa;

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

/* ---- Qui-style touches ---- */

::selection {
  background: #22c55e66;
  color: #ffffff;
}

/* thin accent hairline under the top navbar */
#navbar {
  border-bottom: 1px solid var(--color-primary-light-5);
}

/* active tab / menu items get an accent indicator */
.ui.secondary.pointing.menu .active.item,
.ui.secondary.pointing.menu .active.item:hover {
  border-color: var(--color-primary);
  color: var(--color-text-dark);
}
.ui.vertical.menu .active.item {
  box-shadow: inset 2px 0 0 var(--color-primary);
}

/* soft accent focus ring on inputs */
input:focus,
textarea:focus,
.ui.input input:focus,
.ui.form input:not([type]):focus,
.ui.form input[type="text"]:focus,
.ui.form textarea:focus,
.ui.selection.dropdown.active,
.ui.selection.dropdown:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 3px var(--color-primary-alpha-20) !important;
}

:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* links: accent-tinted rather than full accent for readability */
.markup a,
.repository .ui.list a.item,
a.muted:hover {
  color: var(--color-primary-dark-3);
}

/* scrollbars */
* {
  scrollbar-color: #3f3f46 transparent;
  scrollbar-width: thin;
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: #3f3f46;
  border-radius: 99px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-primary-light-3);
  background-clip: padding-box;
}