/*
 * Soldeck.fun color scheme. Every color the site uses is a token here; styles.css
 * and app.js only ever read these names.
 *
 * Terminal green is the site's look (bare :root). The earlier slate-blue night
 * (data-theme="night-blue") and the original day palette (data-theme="day")
 * are kept complete, so either can be switched back on <html>.
 *
 * Token roles
 *   desk, desk-dark ........ desktop background and its 4px checker dots
 *   desk-text .............. desktop icon labels and the footer
 *   panel .................. window face, buttons, taskbar
 *   raised ................. inactive tabs, selected wizard step, avatar wells
 *   hover .................. hovered rows, pressed buttons, active toggles
 *   ink .................... sunken fields, tables, paper (Help, Fees)
 *   text, muted, faint ..... primary, secondary and tertiary text
 *   line, line-soft, line-strong .. dividers, table row rules, strong dividers
 *   title, title-text ...... window title bars and the Start menu band
 *   select, select-text .... selection, menu hover, active menu item
 *   on-accent .............. text on filled red/green chips
 *   bevel-hi/-mid/-lo/-dk .. the four 3D edge shades of raised and sunken parts
 *   shadow, veil ........... window drop shadow, modal dither
 *   buy / sell (+ -dim, -strong, -edge) .. green/red text, chip fill, solid fill, chip border
 *   glacier (+ -dim, -soft, -edge) ....... blue links, PumpSwap badge, SOL figures
 *   brass, warn (+ -dim) ... token amounts, warnings
 *   logo-accent ............ the ".exe" in the logo
 *   chart-grid ............. chart grid lines
 */

/* Soldeck: white, soft blue and cyan accents. */
:root {
  color-scheme: light;
  --desk: #edf4fc;
  --desk-dark: #e6eef9;
  --desk-text: #334d70;
  --panel: #ffffff;
  --raised: #f0f5fc;
  --hover: #e3eefb;
  --ink: #f8fbff;
  --text: #203653;
  --muted: #526987;
  --faint: #657b97;
  --line: #c5d5e9;
  --line-soft: #e0e9f4;
  --line-strong: #97b0d0;
  --title: #d9e9fb;
  --title-text: #193f6b;
  --select: #2864a9;
  --select-text: #ffffff;
  --on-accent: #ffffff;
  --bevel-hi: #ffffff;
  --bevel-mid: #eff6ff;
  --bevel-lo: #a5bad5;
  --bevel-dk: #718dad;
  --shadow: rgba(42, 73, 115, .16);
  --veil: rgba(35, 57, 86, .30);
  --buy: #137357;
  --buy-dim: #e0f4ec;
  --buy-strong: #167558;
  --buy-edge: rgba(19, 115, 87, .30);
  --sell: #b43955;
  --sell-dim: #fce9ef;
  --sell-strong: #b43955;
  --sell-edge: rgba(180, 57, 85, .30);
  --glacier: #17658b;
  --glacier-dim: #def3fb;
  --glacier-soft: rgba(23, 101, 139, .78);
  --glacier-edge: rgba(23, 101, 139, .30);
  --brass: #70539c;
  --brass-dim: #f0eafa;
  --warn: #855b12;
  --warn-dim: #fff3d8;
  --logo-accent: #167494;
  --chart-grid: rgba(151, 176, 208, .35);
}

/* The previous night look (slate blue), kept: set data-theme="night-blue" on <html>. */
:root[data-theme="night-blue"] {
  color-scheme: dark;

  --desk: #172130;
  --desk-dark: #121a26;
  --desk-text: #e4ebf3;

  --panel: #2b2f37;
  --raised: #23272e;
  --hover: #353a44;
  --ink: #161920;

  --text: #e7e2d7;
  --muted: #a9a294;
  --faint: #7d786d;

  --line: #414650;
  --line-soft: #343841;
  --line-strong: #585e6a;

  --title: #23477b;
  --title-text: #ffffff;
  --select: #2f5c9a;
  --select-text: #ffffff;
  --on-accent: #ffffff;

  --bevel-hi: #4e5461;
  --bevel-mid: #3b4049;
  --bevel-lo: #15171c;
  --bevel-dk: #07080a;

  --shadow: rgba(0, 0, 0, .55);
  --veil: rgba(0, 0, 0, .38);

  --buy: #52cc80;
  --buy-dim: #173a27;
  --buy-strong: #1f8a47;
  --buy-edge: rgba(82, 204, 128, .45);
  --sell: #ff7466;
  --sell-dim: #47211d;
  --sell-strong: #c23a2c;
  --sell-edge: rgba(255, 116, 102, .45);

  --glacier: #8bb8ff;
  --glacier-dim: #1c2d4b;
  --glacier-soft: rgba(139, 184, 255, .7);
  --glacier-edge: rgba(139, 184, 255, .45);

  --brass: #e8bb66;
  --brass-dim: #3e321a;
  --warn: #e7b653;
  --warn-dim: #3c3016;

  --logo-accent: #5fd383;
  --chart-grid: rgba(125, 133, 146, .22);
}

:root[data-theme="day"] {
  color-scheme: light;

  --desk: #6b7f8c;
  --desk-dark: #5f7380;
  --desk-text: #ffffff;

  --panel: #dedad0;
  --raised: #cfcabe;
  --hover: #e9e5da;
  --ink: #fbfaf5;

  --text: #1a1915;
  --muted: #55514a;
  --faint: #7d786d;

  --line: #b9b3a6;
  --line-soft: rgba(185, 179, 166, .6);
  --line-strong: #8e897d;

  --title: #1e3a5f;
  --title-text: #ffffff;
  --select: #1e3a5f;
  --select-text: #ffffff;
  --on-accent: #ffffff;

  --bevel-hi: #ffffff;
  --bevel-mid: #f2efe7;
  --bevel-lo: #8e897d;
  --bevel-dk: #2f2d29;

  --shadow: rgba(0, 0, 0, .3);
  --veil: rgba(26, 25, 21, .18);

  --buy: #1d6b37;
  --buy-dim: #d6ead3;
  --buy-strong: #1d6b37;
  --buy-edge: rgba(29, 107, 55, .5);
  --sell: #a3261b;
  --sell-dim: #f2d4cf;
  --sell-strong: #a3261b;
  --sell-edge: rgba(163, 38, 27, .5);

  --glacier: #1c4e8c;
  --glacier-dim: #d3dff0;
  --glacier-soft: rgba(28, 78, 140, .7);
  --glacier-edge: rgba(28, 78, 140, .5);

  --brass: #7a4f00;
  --brass-dim: #efe0bd;
  --warn: #7a5200;
  --warn-dim: #f3e3b5;

  --logo-accent: #2f7d3a;
  --chart-grid: rgba(185, 179, 166, .35);
}