/* ==========================================================================
   theme.css — YOUR FILE. Tune the dashboard's look here.

   This loads AFTER styles.css, so anything set here wins. Keeping your
   changes in this file (rather than editing styles.css) means the rest of
   the stylesheet can be updated without clobbering your palette.

   It is bind-mounted into the nginx container, so: edit, save, reload the
   browser. No rebuild, no restart.

   HOW COLOURS WORK
   ----------------
   Accents are declared as raw "R G B" channel triplets, not hex. Every
   border, glow, gradient and chart line derives its own transparency from
   those channels, so changing one line here recolours ~30 places at once.

     --accent-rgb: 255 138 0;   <- correct   (space separated, no commas)
     --accent-rgb: #ff8a00;     <- WRONG, breaks every derived colour

   Need a hex value? Convert it: #ff8a00 -> 255 138 0.

   Charts and gauges read these same variables at page load (see app.js),
   so the canvas graphics recolour along with the CSS.
   ========================================================================== */

:root {
  /* ----------------------------------------------------------------------
     ACTIVE THEME
     Uncomment a preset below to replace these, or just edit these five.
     ---------------------------------------------------------------------- */

  /* --accent-rgb:     0 255 245; */   /* primary   — CPU, net DOWN, frames */
  /* --accent-alt-rgb: 255 43 214; */  /* secondary — RAM, net UP           */
  /* --warn-rgb:       255 183 0;  */  /* warning   — swap, restarting      */
  /* --ok-rgb:         57 255 136; */  /* healthy   — disk, running, LIVE   */
  /* --alert-rgb:      255 59 92;  */  /* critical  — stopped, offline      */

  /* Surfaces and text --------------------------------------------------- */
  /* --bg-void:       #05070c; */      /* page background                  */
  /* --bg-panel:      rgba(10, 18, 28, 0.55); */ /* glass panel fill       */
  /* --bg-panel-solid:#0a1220; */      /* opaque fill (sticky table heads) */
  /* --text-primary:  #d9fbff; */      /* values, numbers                  */
  /* --text-dim:      #6f97a3; */      /* labels, units                    */

  /* Effects ------------------------------------------------------------- */
  /* --scanline-opacity: 0.18;  */     /* CRT scanlines: 0 disables them   */
  /* --noise-opacity:    0.035; */     /* film grain: 0 disables it        */
}

/* ==========================================================================
   PRESETS — uncomment ONE block to switch the whole dashboard over.
   ========================================================================== */

/* --- URGENT: orange + green. Reads well under warm ambient light. ---------
:root {
  --accent-rgb:     255 138 0;
  --accent-alt-rgb: 57 255 136;
  --warn-rgb:       255 210 0;
  --ok-rgb:         57 255 136;
  --alert-rgb:      255 59 92;
  --text-primary:   #ffeedd;
  --text-dim:       #a3846f;
  --bg-void:        #0c0703;
  --bg-panel:       rgba(28, 18, 10, 0.55);
  --bg-panel-solid: #1a1006;
}
*/

/* --- TOXIC: acid green terminal. -----------------------------------------
:root {
  --accent-rgb:     57 255 136;
  --accent-alt-rgb: 200 255 0;
  --warn-rgb:       255 210 0;
  --ok-rgb:         57 255 136;
  --alert-rgb:      255 59 92;
  --text-primary:   #d9ffe4;
  --text-dim:       #6fa385;
  --bg-void:        #030c06;
  --bg-panel:       rgba(10, 28, 18, 0.55);
  --bg-panel-solid: #061a10;
}
*/

/* --- ICE: cold blue + violet, low glare for a dark room. -----------------
:root {
  --accent-rgb:     80 170 255;
  --accent-alt-rgb: 150 120 255;
  --warn-rgb:       255 200 90;
  --ok-rgb:         90 230 190;
  --alert-rgb:      255 90 120;
  --text-primary:   #e2f0ff;
  --text-dim:       #7d93ab;
  --bg-void:        #04070d;
  --bg-panel:       rgba(12, 20, 34, 0.55);
  --bg-panel-solid: #0a1424;
}
*/

/* --- AMBER CRT: single-colour vintage terminal. --------------------------
:root {
  --accent-rgb:     255 176 0;
  --accent-alt-rgb: 255 120 0;
  --warn-rgb:       255 220 100;
  --ok-rgb:         255 176 0;
  --alert-rgb:      255 70 40;
  --text-primary:   #ffd899;
  --text-dim:       #99764a;
  --bg-void:        #0a0600;
  --bg-panel:       rgba(30, 20, 4, 0.55);
  --bg-panel-solid: #1a1200;
  --scanline-opacity: 0.28;
}
*/

/* --- FLAT: no scanlines, no grain. Best for a matte kiosk panel. ---------
:root {
  --scanline-opacity: 0;
  --noise-opacity: 0;
}
*/

/* ==========================================================================
   Anything else is fair game too — this file is plain CSS loaded last.

   .alias { font-size: 2.2rem; }                 bigger server name
   .panel-vitals { --gauge-size: 210px; }        force a gauge size
   .scanlines, .noise, .vignette { display: none; }   strip all effects
   ========================================================================== */
