/* ============================================================
   Tokyo Night — for Obsidian Publish
   Recreates the Tokyo Night palette on the standard Obsidian
   CSS variables that Publish honors. Values lifted directly
   from the local theme (.obsidian/themes/Tokyo Night/theme.css).
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;0,500;0,700;1,400&display=swap');

:root {
  /* --- Tokyo Night palette --- */
  --tn-bg:            #1a1b26; /* background-primary */
  --tn-bg-dark:       #16161e; /* background-secondary */
  --tn-bg-darker:     #121218;
  --tn-bg-highlight:  #292e42; /* borders / hover */
  --tn-code-bg:       #24283b; /* code blocks */
  --tn-fg:            #c0caf5; /* text-normal */
  --tn-fg-dark:       #a9b1d6; /* text-muted */
  --tn-comment:       #565f89; /* text-faint */
  --tn-blue:          #7aa2f7;
  --tn-cyan:          #7dcfff;
  --tn-magenta:       #bb9af7;
  --tn-green:         #9ece6a;
  --tn-yellow:        #e0af68;
  --tn-orange:        #ff9e64;
  --tn-red:           #ff757f;
}

/* Apply on both classes so we win over Publish's light/dark defaults.
   (Also set the site to "Dark" in Publish settings to avoid the fight.) */
body.theme-dark,
body.theme-light {
  color-scheme: dark;

  --background-primary:        var(--tn-bg);
  --background-primary-alt:    var(--tn-bg);
  --background-secondary:      var(--tn-bg-dark);
  --background-secondary-alt:  var(--tn-bg-dark);
  --background-modifier-border:        var(--tn-bg-highlight);
  --background-modifier-border-hover:  var(--tn-bg-highlight);
  --background-modifier-border-focus:  var(--tn-bg-highlight);
  --background-modifier-hover:         var(--tn-bg-highlight);

  --text-normal:        var(--tn-fg);
  --text-muted:         var(--tn-fg-dark);
  --text-faint:         var(--tn-comment);
  --text-accent:        var(--tn-magenta);
  --text-accent-hover:  var(--tn-cyan);
  --text-on-accent:     var(--tn-bg);

  --interactive-accent:        var(--tn-cyan);
  --interactive-accent-hover:  var(--tn-blue);

  --text-selection: rgba(61, 89, 161, 0.6);

  --code-normal:     var(--tn-fg);
  --code-background: var(--tn-code-bg);

  /* Tokyo Night uses JetBrains Mono as its default font.
     For a marketing/sales page you may prefer a sans body —
     swap --font-text to a system stack and keep mono for code. */
  --font-text:       "JetBrains Mono", ui-monospace, "Inter", sans-serif;
  --font-monospace:  "JetBrains Mono", ui-monospace, "Source Code Pro", monospace;
}

/* Page chrome */
body { background-color: var(--tn-bg); }
.published-container,
.site-body { background-color: var(--tn-bg); }

/* Per-level heading colors (signature Tokyo Night touch) */
.markdown-preview-view h1, .markdown-rendered h1 { color: var(--tn-red); }
.markdown-preview-view h2, .markdown-rendered h2 { color: var(--tn-yellow); }
.markdown-preview-view h3, .markdown-rendered h3 { color: var(--tn-green); }
.markdown-preview-view h4, .markdown-rendered h4 { color: var(--tn-cyan); }
.markdown-preview-view h5, .markdown-rendered h5 { color: var(--tn-blue); }
.markdown-preview-view h6, .markdown-rendered h6 { color: var(--tn-magenta); }

/* Links */
a.internal-link            { color: var(--tn-magenta); }
a.external-link            { color: var(--tn-cyan); }
a.internal-link:hover,
a.external-link:hover      { color: var(--tn-blue); }

/* Inline code + code blocks */
.markdown-rendered code    { color: var(--tn-orange); background: var(--tn-code-bg); }
.markdown-rendered pre      { background: var(--tn-code-bg); }

/* Tables / callouts pick up the border + bg variables above automatically */