/* ============================================================================
   CRM DESIGN TOKENS — the single place to re-skin the CRM.
   ----------------------------------------------------------------------------
   Change a value here and EVERY CRM screen updates. This is the one file that
   owns the CRM's colours, fonts, spacing, glass and glow. No screen hard-codes
   a colour — everything references a --crm-* variable from this file, so a
   future re-skin is a one-file edit, not a hunt through templates.

   HOW TO RE-SKIN (for a non-developer):
     • Brand colour: change --crm-brand (and --crm-blue, its readable-on-dark lift).
     • Background depth: --crm-bg + the three --crm-bg-glow-* layers.
     • Headings font: --crm-font-head. Body font: --crm-font-body.
     • Glass cards: --crm-surface (fill) + --crm-blur + --crm-shadow-card.
   ============================================================================ */

:root {
  /* ====================================================================== *
   *  THEME: "MIDNIGHT GLASS" — sleek dark command centre.                  *
   *  Deep navy-black base, Carpet Court blue (#0E4FB5) as THE accent,      *
   *  glassmorphism cards with depth, restrained glow on live data.         *
   *  Variable NAMES are stable; only VALUES change on a re-skin.           *
   * ====================================================================== */

  /* ---- SURFACES & TEXT -------------------------------------------------- */
  --crm-bg:        #060A14;                    /* deep navy-black base                              */
  --crm-surface:   rgba(15, 23, 42, 0.62);     /* glass card fill (blurred via --crm-blur)          */
  --crm-surface-2: rgba(22, 32, 56, 0.55);     /* raised glass: inputs, inner wells, hovers         */
  --crm-ink:       #EAF1FB;                    /* primary text — soft cool white                    */
  --crm-muted:     #93A5C6;                    /* secondary / label / sub text                      */
  --crm-line:      rgba(110, 156, 235, 0.16);  /* hairline glass border / divider                   */
  --crm-line-strong: rgba(110, 156, 235, 0.34);/* focused / hovered border                          */

  /* ---- BRAND (Carpet Court blue) ---------------------------------------- */
  --crm-brand:     #0E4FB5;  /* TRUE Carpet Court blue — fills, buttons, bars, active states   */
  --crm-blue:      #5E94EB;  /* the same blue lifted for dark-bg text: links, accents, labels  */
  --crm-blue-dark: #0A3D8F;  /* pressed / hover-deepen on brand fills                          */
  --crm-on-blue:   #FFFFFF;  /* text/icons sitting ON a brand fill                             */

  /* ---- SECONDARY ACCENT (restrained terracotta — ties to the core app) -- */
  --crm-accent:    #E08B5E;  /* "You" tags, add-my-own — used sparingly                        */

  /* ---- STATUS / FUNNEL COLOURS (calm, not neon) -------------------------- */
  --crm-ok:        #46D68C;  /* success / WON / positive                                       */
  --crm-warn:      #F0B543;  /* attention / flagged-for-review                                 */
  --crm-danger:    #F2607A;  /* error / COMPLAINT / lost                                       */
  --crm-on-status: #0B1220;  /* dark text ON an ok/warn/danger fill                            */

  /* ---- QUOTE-AGE HEAT BANDS (green <3d, amber 3–7d, glowing red >7d) ----- */
  --crm-age-fresh:      #46D68C;                       /* quote under 3 days old      */
  --crm-age-mid:        #F0B543;                       /* 3–7 days — losing heat      */
  --crm-age-old:        #F2607A;                       /* over 7 days — act now       */
  --crm-age-old-glow:   0 0 14px rgba(242, 96, 122, .55);  /* the red band GLOWS      */

  /* ---- CATEGORY / CHART COLOURS (sales-mix segments etc.) --------------- */
  --crm-cat-carpet: #6E9FF2;  /* Carpet — blue            */
  --crm-cat-hard:   #46C8D6;  /* Hard floors — teal       */
  --crm-cat-window: #B58CF2;  /* Window furnishings — violet */

  /* ---- GLASS & DEPTH ----------------------------------------------------- */
  --crm-blur:      14px;                                        /* backdrop-filter strength      */
  --crm-shadow-card: 0 14px 34px rgba(2, 8, 22, 0.50),
                     inset 0 1px 0 rgba(255, 255, 255, 0.05);   /* card depth + glass top edge   */
  --crm-shadow-pop:  0 24px 60px rgba(2, 8, 22, 0.65);          /* menus / modals                */
  --crm-glow:        0 0 18px rgba(14, 79, 181, 0.45);          /* subtle glow on LIVE data      */
  --crm-glow-soft:   0 0 12px rgba(94, 148, 235, 0.25);         /* gentler glow (chips, ticks)   */

  /* ---- AMBIENT BACKDROP LAYERS (CSS only — drifted slowly by the shell) -- */
  --crm-bg-glow-1: radial-gradient(52% 38% at 78% -6%,  rgba(14, 79, 181, 0.28), transparent 70%);
  --crm-bg-glow-2: radial-gradient(46% 40% at -8% 86%,  rgba(14, 79, 181, 0.15), transparent 65%);
  --crm-bg-glow-3: radial-gradient(120% 120% at 50% 24%, #0A1326 0%, #070D1C 48%, #060A14 100%);
  /* star field dots (two layers, parallax) */
  --crm-star:      rgba(186, 209, 255, 0.55);
  --crm-star-dim:  rgba(140, 172, 230, 0.30);

  /* ---- SPACING SCALE (use these instead of ad-hoc px) ------------------- */
  --crm-space-1:   6px;      /* tight: chip padding, icon gaps                */
  --crm-space-2:   10px;     /* small: between related controls               */
  --crm-space-3:   14px;     /* default gap between cards / form rows         */
  --crm-space-4:   18px;     /* card inner padding (compact)                  */
  --crm-space-5:   24px;     /* card inner padding (roomy) / section spacing  */
  --crm-space-6:   36px;     /* large: between major page sections            */

  /* ---- SHAPE ----------------------------------------------------------- */
  --crm-radius:    14px;     /* card / panel corner radius                    */
  --crm-radius-sm: 9px;      /* buttons / inputs / chips                      */

  /* ---- TYPOGRAPHY ------------------------------------------------------- */
  --crm-font-head: "Fraunces", Georgia, "Times New Roman", serif;
  --crm-font-body: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}