/*
 * Tokyo Midnight — a dark Forgejo theme based on the Tokyo Night palette
 * (https://github.com/enkia/tokyo-night-vscode-theme).
 *
 * Install: copy this file to
 *   <CUSTOM_PATH>/public/assets/css/theme-tokyo-midnight.css
 * (for this repo's docker-compose setup, CUSTOM_PATH is /data/gitea, which
 * maps to ./data/forgejo/gitea on the host — see deploy.sh)
 *
 * Register in app.ini:
 *   [ui]
 *   THEMES = forgejo-auto,forgejo-light,forgejo-dark,tokyo-midnight
 *   DEFAULT_THEME = tokyo-midnight
 *
 * Then select it per-account under Settings → Appearance → Theme.
 */

:root {
  /* Tokyo Night base palette */
  --tn-bg: #1a1b26;
  --tn-bg-dark: #16161e;
  --tn-bg-highlight: #292e42;
  --tn-terminal-black: #414868;
  --tn-fg: #c0caf5;
  --tn-fg-dark: #a9b1d6;
  --tn-fg-gutter: #3b4261;
  --tn-comment: #565f89;
  --tn-blue: #7aa2f7;
  --tn-blue0: #3d59a1;
  --tn-blue1: #2ac3de;
  --tn-cyan: #7dcfff;
  --tn-green: #9ece6a;
  --tn-green1: #73daca;
  --tn-magenta: #bb9af7;
  --tn-orange: #ff9e64;
  --tn-purple: #9d7cd8;
  --tn-red: #f7768e;
  --tn-red1: #db4b4b;
  --tn-yellow: #e0af68;
  --tn-border: #292e42;

  /* Primary → Tokyo Night blue */
  --color-primary: var(--tn-blue);
  --color-primary-contrast: #ffffff;
  --color-primary-dark-1: #6690e8;
  --color-primary-dark-2: #527dd6;
  --color-primary-dark-3: #3d59a1;
  --color-primary-dark-4: #2f4785;
  --color-primary-dark-5: #24366b;
  --color-primary-dark-6: #1a2650;
  --color-primary-dark-7: #101838;
  --color-primary-light-1: #8fb1f8;
  --color-primary-light-2: #a3bffa;
  --color-primary-light-3: #b7cdfb;
  --color-primary-light-4: #cbdcfc;
  --color-primary-light-5: #dfeafd;
  --color-primary-light-6: #eef4fe;
  --color-primary-light-7: #f5f9fe;
  --color-primary-alpha-10: #7aa2f719;
  --color-primary-alpha-20: #7aa2f733;
  --color-primary-alpha-30: #7aa2f74b;
  --color-primary-alpha-40: #7aa2f766;
  --color-primary-alpha-50: #7aa2f780;
  --color-primary-alpha-60: #7aa2f799;
  --color-primary-alpha-70: #7aa2f7b3;
  --color-primary-alpha-80: #7aa2f7cc;
  --color-primary-alpha-90: #7aa2f7e1;
  --color-primary-hover: var(--color-primary-light-1);
  --color-primary-active: var(--color-primary-light-2);

  /* Secondary → Tokyo Night comment/border grays */
  --color-secondary: var(--tn-terminal-black);
  --color-secondary-dark-1: #4b5479;
  --color-secondary-dark-2: #565f89;
  --color-secondary-dark-3: #626b9a;
  --color-secondary-dark-4: #6e77ab;
  --color-secondary-dark-5: #7a83bc;
  --color-secondary-dark-6: #868fcd;
  --color-secondary-dark-7: #929bde;
  --color-secondary-dark-8: #9ea7ef;
  --color-secondary-dark-9: #aab3ff;
  --color-secondary-dark-10: #b6bfff;
  --color-secondary-dark-11: #c2cbff;
  --color-secondary-dark-12: #ceD7ff;
  --color-secondary-dark-13: #dae3ff;
  --color-secondary-light-1: #383e5c;
  --color-secondary-light-2: #292e42;
  --color-secondary-light-3: #20242f;
  --color-secondary-light-4: #16161e;
  --color-secondary-alpha-10: #41486819;
  --color-secondary-alpha-20: #41486833;
  --color-secondary-alpha-30: #4148684b;
  --color-secondary-alpha-40: #41486866;
  --color-secondary-alpha-50: #41486880;
  --color-secondary-alpha-60: #41486899;
  --color-secondary-alpha-70: #414868b3;
  --color-secondary-alpha-80: #414868cc;
  --color-secondary-alpha-90: #414868e1;
  --color-secondary-hover: var(--color-secondary-dark-1);
  --color-secondary-active: var(--color-secondary-dark-2);

  /* Console / terminal blocks */
  --color-console-fg: var(--tn-fg);
  --color-console-fg-subtle: var(--tn-fg-dark);
  --color-console-bg: var(--tn-bg-dark);
  --color-console-border: var(--tn-border);
  --color-console-hover-bg: #ffffff16;
  --color-console-active-bg: var(--tn-bg-highlight);
  --color-console-menu-bg: var(--tn-bg-dark);
  --color-console-menu-border: var(--tn-border);

  /* Named colors used across labels/badges/diffs */
  --color-red: var(--tn-red);
  --color-orange: var(--tn-orange);
  --color-yellow: var(--tn-yellow);
  --color-olive: #9ba86a;
  --color-green: var(--tn-green);
  --color-teal: var(--tn-green1);
  --color-blue: var(--tn-blue);
  --color-violet: var(--tn-purple);
  --color-purple: var(--tn-magenta);
  --color-pink: #ff007c;
  --color-brown: #a47252;
  --color-grey: var(--tn-comment);
  --color-black: var(--tn-fg);

  --color-red-light: #ff8fa3;
  --color-orange-light: #ffb385;
  --color-yellow-light: #eec488;
  --color-olive-light: #b3c087;
  --color-green-light: #b6e08c;
  --color-teal-light: #93e3d5;
  --color-blue-light: #9cb9f9;
  --color-violet-light: #b499e3;
  --color-purple-light: #d2b6fa;
  --color-pink-light: #ff5c9d;
  --color-brown-light: #bb8f6d;
  --color-grey-light: #7c85ab;
  --color-black-light: var(--tn-fg-dark);

  --color-red-dark-1: #d65a70;
  --color-orange-dark-1: #e08a52;
  --color-yellow-dark-1: #c69856;
  --color-olive-dark-1: #7f8c52;
  --color-green-dark-1: #82b358;
  --color-teal-dark-1: #5cb8a9;
  --color-blue-dark-1: #6690e8;
  --color-violet-dark-1: #856ab8;
  --color-purple-dark-1: #a586d9;
  --color-pink-dark-1: #d90068;
  --color-brown-dark-1: #8a5f3f;
  --color-black-dark-1: #a9b1d6;

  --color-red-dark-2: #b84e61;
  --color-orange-dark-2: #c17444;
  --color-yellow-dark-2: #ab8149;
  --color-olive-dark-2: #6c7746;
  --color-green-dark-2: #6f984b;
  --color-teal-dark-2: #4d9c8f;
  --color-blue-dark-2: #527dd6;
  --color-violet-dark-2: #715898;
  --color-purple-dark-2: #8c70bb;
  --color-pink-dark-2: #b30056;
  --color-brown-dark-2: #745232;
  --color-black-dark-2: #929cc7;

  --color-ansi-black: var(--tn-terminal-black);
  --color-ansi-red: var(--tn-red);
  --color-ansi-green: var(--tn-green);
  --color-ansi-yellow: var(--tn-yellow);
  --color-ansi-blue: var(--tn-blue);
  --color-ansi-magenta: var(--tn-magenta);
  --color-ansi-cyan: var(--tn-cyan);
  --color-ansi-white: var(--color-console-fg-subtle);
  --color-ansi-bright-black: var(--tn-comment);
  --color-ansi-bright-red: var(--tn-red1);
  --color-ansi-bright-green: #a9dc76;
  --color-ansi-bright-yellow: #f0c674;
  --color-ansi-bright-blue: #89b4fa;
  --color-ansi-bright-magenta: #c4a7f7;
  --color-ansi-bright-cyan: var(--tn-blue1);
  --color-ansi-bright-white: var(--color-console-fg);

  --color-gold: #d4af37;
  --color-white: #ffffff;

  /* Diffs */
  --color-diff-added-word-bg: #2a3d2e;
  --color-diff-removed-word-bg: #4a2331;
  --color-diff-added-row-bg: #1e2b21;
  --color-diff-removed-row-bg: #35202a;
  --color-diff-moved-row-bg: #3a331f;
  --color-diff-added-row-border: #3e5b44;
  --color-diff-removed-row-border: #6b3446;
  --color-diff-moved-row-border: #6b5a2f;
  --color-diff-inactive: var(--tn-bg-highlight);

  /* Alert/status colors */
  --color-error-border: #6b3446;
  --color-error-bg: #35202a;
  --color-error-bg-active: #4a2331;
  --color-error-bg-hover: #4a2331;
  --color-error-text: #ffb3c0;
  --color-success-border: #3e5b44;
  --color-success-bg: #1e2b21;
  --color-success-text: #baf0a0;
  --color-warning-border: #6b5a2f;
  --color-warning-bg: #3a331f;
  --color-warning-text: #f3d99a;
  --color-info-border: #2f4785;
  --color-info-bg: #1a2650;
  --color-info-text: #b7cdfb;

  /* Badges */
  --color-red-badge: var(--tn-red);
  --color-red-badge-bg: #f7768e22;
  --color-red-badge-hover-bg: #f7768e44;
  --color-green-badge: var(--tn-green);
  --color-green-badge-bg: #9ece6a22;
  --color-green-badge-hover-bg: #9ece6a44;
  --color-yellow-badge: var(--tn-yellow);
  --color-yellow-badge-bg: #e0af6822;
  --color-yellow-badge-hover-bg: #e0af6844;
  --color-orange-badge: var(--tn-orange);
  --color-orange-badge-bg: #ff9e6422;
  --color-orange-badge-hover-bg: #ff9e6444;

  /* Page structure */
  --color-body: var(--tn-bg);
  --color-box-header: var(--tn-bg-highlight);
  --color-box-body: var(--tn-bg);
  --color-box-body-highlight: var(--tn-bg-highlight);
  --color-text-dark: var(--tn-fg);
  --color-text: var(--tn-fg);
  --color-text-light: var(--tn-fg-dark);
  --color-text-light-1: var(--tn-fg-dark);
  --color-text-light-2: var(--tn-comment);
  --color-text-light-3: var(--tn-comment);
  --color-footer: var(--tn-bg-dark);
  --color-timeline: var(--tn-border);
  --color-input-text: var(--tn-fg);
  --color-input-background: var(--tn-bg-highlight);
  --color-input-toggle-background: var(--tn-terminal-black);
  --color-input-border: var(--tn-border);
  --color-input-border-hover: var(--tn-comment);
  --color-header-wrapper: var(--tn-bg-dark);
  --color-header-wrapper-transparent: #16161e00;
  --color-light: #ffffff11;
  --color-light-mimic-enabled: rgba(255, 255, 255, calc(6 / 255 * 222 / 255 / var(--opacity-disabled)));
  --color-light-border: var(--tn-border);
  --color-hover: #7aa2f722;
  --color-active: #7aa2f733;
  --color-menu: var(--tn-bg-dark);
  --color-card: var(--tn-bg-highlight);

  --color-markup-table-row: #292e4280;
  --color-markup-code-block: var(--tn-bg-dark);
  --color-markup-code-inline: #41486840;
  --color-button: var(--tn-bg-highlight);
  --color-code-bg: var(--tn-bg-dark);
  --color-shadow: #00000055;
  --color-secondary-bg: var(--tn-bg-highlight);
  --color-text-focus: var(--tn-fg);
  --color-expand-button: var(--tn-bg-highlight);
  --color-placeholder-text: var(--tn-comment);
  --color-editor-line-highlight: var(--tn-bg-highlight);
  --color-project-board-bg: var(--tn-bg-highlight);
  --color-project-board-dark-label: var(--tn-comment);
  --color-caret: var(--tn-fg);
  --color-reaction-bg: #41486822;
  --color-reaction-active-bg: #7aa2f733;
  --color-reaction-hover-bg: #7aa2f722;
  --color-tooltip-text: var(--tn-bg-dark);
  --color-tooltip-bg: #c0caf5e6;
  --color-nav-bg: var(--tn-bg-dark);
  --color-nav-hover-bg: var(--tn-bg-highlight);
  --color-secondary-nav-bg: var(--tn-bg-dark);
  --color-label-text: var(--tn-fg);
  --color-label-bg: #41486833;
  --color-label-hover-bg: #41486855;
  --color-label-active-bg: #41486877;
  --color-label-bg-alt: #41486866;
  --color-accent: var(--tn-blue);
  --color-small-accent: #1a2650;
  --color-highlight-fg: var(--tn-cyan);
  --color-highlight-bg: #3a331f;
  --color-overlay-backdrop: #16161e99;
  --color-selection-bg: var(--tn-blue);
  --color-selection-fg: var(--tn-bg-dark);

  --color-indicator-offline: var(--tn-comment);
  --color-indicator-offline-20: #565f8933;
  --color-indicator-idle: var(--tn-yellow);
  --color-indicator-idle-20: #e0af6833;
  --color-indicator-active: var(--tn-green);
  --color-indicator-active-20: #9ece6a33;

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