/*
 * blocksol.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
 */

/* Local violet and lavender palette. */
:root {
  color-scheme: dark;
  --desk: #140f21;
  --desk-dark: #100c1b;
  --desk-text: #e8def8;
  --panel: #211831;
  --raised: #1a1329;
  --hover: #36274c;
  --ink: #160f23;
  --text: #f5efff;
  --muted: #b9a8ce;
  --faint: #9785ad;
  --line: #443258;
  --line-soft: #302340;
  --line-strong: #674d80;
  --title: #50316d;
  --title-text: #fbf6ff;
  --select: #c4a0fa;
  --select-text: #1a1028;
  --on-accent: #ffffff;
  --bevel-hi: #72558e;
  --bevel-mid: #4a355e;
  --bevel-lo: #100a1b;
  --bevel-dk: #07040d;
  --shadow: rgba(5, 1, 14, .6);
  --veil: rgba(10, 4, 20, .6);
  --buy: #6de0ba;
  --buy-dim: #17392f;
  --buy-strong: #176b53;
  --buy-edge: rgba(109, 224, 186, .4);
  --sell: #ff91b1;
  --sell-dim: #431d33;
  --sell-strong: #a62c55;
  --sell-edge: rgba(255, 145, 177, .4);
  --glacier: #8bdcf0;
  --glacier-dim: #1c3344;
  --glacier-soft: rgba(139, 220, 240, .75);
  --glacier-edge: rgba(139, 220, 240, .4);
  --brass: #e8c490;
  --brass-dim: #3a2c23;
  --warn: #f0ca7f;
  --warn-dim: #3c2e1c;
  --logo-accent: #c4a0fa;
  --chart-grid: rgba(103, 77, 128, .4);
}

/* 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);
}
