/* Color tokens copied from the repo root's theme.css (single source of
   truth for standalone.html/annotator.html/client.html/admin.html) so this
   tool's palette matches the rest of NqshLab.

   Not linked directly: this backend (main.py) only serves slide-viewer/
   frontend/ as static files, on its own port -- it has no route to the
   repo root, so a relative "../../theme.css" 404s silently (a `<link>` to
   a missing stylesheet fails without blocking the page). Same reason the
   Thmanyah font files are duplicated into ../fonts/ instead of referenced
   across servers -- see that folder. If theme.css's palette changes,
   re-copy the affected values here by hand. */
:root {
  color-scheme: light;
  --bg:            #F7F4EC;
  --bg-deep:       #EFEBE0;
  --surface:       #FDFCF7;
  --surface-hi:    #FFFFFF;
  --nav-bg:        rgba(247,244,236,0.92);

  --fg:            #10173A;
  --fg-hi:         rgba(16,23,58,0.87);
  --fg-md:         rgba(16,23,58,0.66);
  --fg-lo:         rgba(16,23,58,0.52);
  --fg-vl:         rgba(16,23,58,0.4);
  --fg-ul:         rgba(16,23,58,0.28);

  --border:        rgba(16,23,58,0.16);
  --border-hi:     rgba(16,23,58,0.3);
  --border-sm:     rgba(16,23,58,0.09);

  --teal:          #42A9E6;
  --teal-link:     #1D6FA8;
  --teal-md:       rgba(29,111,168,0.75);
  --teal-lo:       rgba(29,111,168,0.55);
  --teal-vl:       rgba(66,169,230,0.22);
  --teal-ul:       rgba(66,169,230,0.1);
  --teal-surface:  rgba(66,169,230,0.1);
  --teal-brd:      rgba(66,169,230,0.4);

  --amber:         #F5C518;

  --ok:            #147A5C;
  --ok-surface:    rgba(20,122,92,0.08);
  --ok-border:     rgba(20,122,92,0.24);
  --warn:          #9A6410;
  --warn-surface:  rgba(154,100,16,0.08);
  --warn-border:   rgba(154,100,16,0.24);
  --info:          #5B41A8;
  --info-surface:  rgba(91,65,168,0.08);
  --info-border:   rgba(91,65,168,0.24);
  --red:           #C2402E;
  --red-surface:   rgba(194,64,46,0.07);
  --red-border:    rgba(194,64,46,0.28);
}

[data-theme="dark"] {
  color-scheme: dark;
  --bg:            #0F1430;
  --bg-deep:       #0B0F26;
  --surface:       #151A3C;
  --surface-hi:    #1A2047;
  --nav-bg:        rgba(15,20,48,0.92);

  --fg:            #F1EFE7;
  --fg-hi:         rgba(241,239,231,0.88);
  --fg-md:         rgba(241,239,231,0.64);
  --fg-lo:         rgba(241,239,231,0.5);
  --fg-vl:         rgba(241,239,231,0.38);
  --fg-ul:         rgba(241,239,231,0.26);

  --border:        rgba(241,239,231,0.16);
  --border-hi:     rgba(241,239,231,0.32);
  --border-sm:     rgba(241,239,231,0.09);

  --teal:          #42A9E6;
  --teal-link:     #6FBFEB;
  --teal-md:       rgba(111,191,235,0.75);
  --teal-lo:       rgba(111,191,235,0.55);
  --teal-vl:       rgba(66,169,230,0.25);
  --teal-ul:       rgba(66,169,230,0.12);
  --teal-surface:  rgba(66,169,230,0.12);
  --teal-brd:      rgba(66,169,230,0.38);

  --amber:         #F5C518;

  --ok:            #3FD1A5;
  --ok-surface:    rgba(63,209,165,0.1);
  --ok-border:     rgba(63,209,165,0.28);
  --warn:          #FBBF24;
  --warn-surface:  rgba(251,191,36,0.1);
  --warn-border:   rgba(251,191,36,0.28);
  --info:          #A78BFA;
  --info-surface:  rgba(167,139,250,0.1);
  --info-border:   rgba(167,139,250,0.28);
  --red:           #E06A57;
  --red-surface:   rgba(224,106,87,0.1);
  --red-border:    rgba(224,106,87,0.32);
}