/* =====================================================================
   HEXBENCH — THEME COLORS  (the ONLY file you need to edit)
   =====================================================================

   Every button, icon, border, badge, glow effect, and both the light
   and dark theme across the ENTIRE project pull their color from the
   variables below. Change a value here → the whole site updates.

   HOW TO EDIT:
   Each color is written as three numbers "R G B" (red green blue,
   0–255, space separated — no commas, no #). This is on purpose: it
   lets every color also be used at different transparencies (e.g. a
   faint glow) without needing a second value anywhere else.

   Example: to change the main accent color to orange rgb(255,120,40):
      --accent-rgb: 255 120 40;
   That's it — buttons, icons, borders, hero glow, everything updates,
   in BOTH the light and dark theme sections below.

   If you only know a color as a hex code (#RRGGBB), convert it at
   https://www.rapidtables.com/convert/color/hex-to-rgb.html and paste
   the three numbers in.
===================================================================== */

/* =====================================================================
Electric purple (already tried)
--accent-rgb:      128 82 151;
--accent-dim-rgb:  100 62 119;

Mint / teal (original)
--accent-rgb:      0 229 199;
--accent-dim-rgb:  0 168 143;

Hot pink / magenta
--accent-rgb:      236 72 153;
--accent-dim-rgb:  182 44 116;

Electric blue
--accent-rgb:      59 130 246;
--accent-dim-rgb:  37 99 235;

Cyber orange
--accent-rgb:      255 107 53;
--accent-dim-rgb:  204 78 30;

Lime / acid green
--accent-rgb:      163 230 53;
--accent-dim-rgb:  122 179 30;

Deep violet
--accent-rgb:      139 92 246;
--accent-dim-rgb:  109 63 205;

Crimson red
--accent-rgb:      239 68 68;
--accent-dim-rgb:  185 40 40;

Gold / amber-gold
--accent-rgb:      245 158 11;
--accent-dim-rgb:  194 120 5;

Sky cyan
--accent-rgb:      34 211 238;
--accent-dim-rgb:  8 165 194;

Rose gold
--accent-rgb:      251 113 133;
--accent-dim-rgb:  201 78 96;
===================================================================== */

/* ---------------------------------------------------------------------
   DARK THEME  (default theme, shown until the visitor switches)
--------------------------------------------------------------------- */
:root{
  /* backgrounds */
  --bg-rgb:      10 13 18;      /* page background            (was #0A0D12) */
  --panel-rgb:   18 22 31;      /* card / panel background    (was #12161F) */
  --panel2-rgb:  23 28 39;      /* secondary panel background (was #171C27) */
  --border-rgb:  35 40 55;      /* borders / dividers         (was #232837) */

  /* brand accent — used on buttons, links, icons, glows, badges */
--accent-rgb:      139 92 246;
--accent-dim-rgb:  109 63 205;  /* darker shade of the accent, used for
                                      gradients & hover states */

  /* secondary accent — used for "Soon" badges & secondary highlights */
  --accent2-rgb: 255 180 84;    /* (was #FFB454) */

  /* text */
  --ink-rgb:   230 237 243;     /* main text color   (was #E6EDF3) */
  --muted-rgb: 124 135 152;     /* secondary/muted text (was #7C8798) */

  /* fine-tuning, rarely needs changing */
  --grid-opacity:  0.055;       /* faintness of the background grid lines */
  --btn-glow-rgb:  255 255 255; /* button hover sheen color */
}

/* ---------------------------------------------------------------------
   LIGHT THEME  (shown when the visitor clicks the sun/moon toggle)
--------------------------------------------------------------------- */
html[data-theme="light"]{
  --bg-rgb:      246 248 250;   /* (was #F6F8FA) */
  --panel-rgb:   255 255 255;   /* (was #FFFFFF) */
  --panel2-rgb:  237 241 245;   /* (was #EDF1F5) */
  --border-rgb:  216 223 230;   /* (was #D8DFE6) */

--accent-rgb:      139 92 246;
--accent-dim-rgb:  109 63 205;

  --accent2-rgb: 180 84 0;      /* deepened so it stays readable on white */

  --ink-rgb:   15 23 32;
  --muted-rgb: 100 112 125;

  --grid-opacity:  0.07;
  --btn-glow-rgb:  0 0 0;
}