/* ==========================================================
   TAB 1 ("All Facade Schemes") THEME
   ----------------------------------------------------------
   Every color used on Tab 1 lives here as a named variable.
   Change a value below and every place that uses it updates.
   This file only covers colors set via CSS (backgrounds,
   borders, text). Colors drawn on <canvas>/SVG by JavaScript
   (charts, the 3D model, connector lines) live in
   frontend/tab1-config.js instead - see the COLORS export
   there.

   Loaded before style.css, so style.css's rules can reference
   these variables with var(--name).
   ========================================================== */

:root {
    /* ---- Brand / chrome ---- */
    --color-bg-tab:           #edf0f5;  /* nav-tabs pill track background */
    --color-accent-blue:      #7AAEC8;  /* active nav tab background */
    --color-accent-blue-dark: #305674;  /* active selector-option background/border, active-mode accent */
    --color-navy-text:        #223043;  /* headings, primary dark text */

    /* ---- Panel chrome (shared by viewer / performance panel / result cards) ---- */
    --panel-bg:            #fbfcfd;
    --panel-border:        #dfe6ee;
    --panel-shadow:        rgba(34, 48, 67, 0.28);
    --viewer-bg:           #f7f8fa;
    --selector-section-bg: #ffffff;
    --selector-section-border: #e4ebf3;
    --glass-popup-bg: #fafbfc;

    /* ---- Peak Solar Gain (PSG) compliance triad ----
       Used on: 3D model window color, PSG legend dots, altitude/azimuth
       rose segments, live PSG value badge. */
    --psg-safe:    #9bc18d; /* compliant */
    --psg-warning: #dca77d; /* marginally exceeds */
    --psg-danger:  #9e000c; /* significantly exceeds */
    --psg-safe-border:    #7a9e6e; /* darker border for the .info-value--safe pill */
    --psg-warning-border: #b8844e;
    --psg-danger-border:  #6e0008;

    /* ---- Season colors ----
       Used on: scatter/altitude chart points, season legends. */
    --season-cooling: #C00000;
    --season-heating: #0007AC;
    --season-default: #94a3b8;

    /* ---- Selection / compliance-mode accent ---- */
    --mode-optimized-accent: #6699cc;

    /* ---- PASS / FAIL compliance badge (scatter & altitude charts) ---- */
    --badge-pass: #3f7d4a;
    --badge-fail: #8a0d16;

    /* ---- Selector network connector lines (top selector row) ---- */
    --selector-line:           #305674;
    --selector-line-optimized: #6699cc;

    /* ---- Text / neutrals ---- */
    --text-muted:      #4a5a6e;
    --text-faint:      #7d8ea3;
    --text-meta:       #6b7280;
    --text-label:      #8a98a8;
    --text-body-dark:  #444444;
    --border-light:    #e6edf5;
    --border-input:    #d0dae6;
    --seg-track-bg:    #e8ecf1;
    --seg-thumb-bg:    #223043;
    --highlight-border: #000000; /* "Cooling season (3% allowance)" outline */
    --result-image-border: #dbe4ee; /* Daylight/Thermal result image frame */
    --text-subtle:     #7a8a9a; /* result metric titles */
    --overlay-panel-bg: rgba(255,255,255,0.88); /* 3D viewer PSG overlay + legend panel backgrounds */
    --overlay-value-secondary-bg: #e4e4e4; /* PSG overlay secondary value pill */
}