/* ============================================================================
   STME brand theme — the one file that colours this deployment.
   ----------------------------------------------------------------------------
   Loaded LAST, after the whole vg-* layer, so everything here wins. It replaces
   assets/css/vg-theme.css in the image; nothing else in the codebase changes.

   Both colours are read from the customer's own logo rather than eyeballed:
     #54B4D8  the blue tiles of the isometric mark
     #E47830  the orange tiles

   WHY BLUE LEADS. Measured on this near-black shell (#0d0d0d):
     blue    8.23:1   passes AA for body text
     orange  6.50:1   also passes, but competes with the warning/alert palette
   Blue carries links and small text comfortably; orange is kept for the places
   that should draw the eye, which is what it does in the logo too.

   WHY --vg-on-primary IS DARK, AND WHY IT HAD TO EXIST. Umniah's #ce0037 carries
   white text at 5.7:1, so white was hardcoded throughout the button styles and
   looked fine. Neither STME colour does: white on this blue is 2.36:1 and on the
   orange 2.99:1 -- both unreadable. Setting --vg-primary alone would have produced
   a correctly-branded, illegible button. Near-black on the blue measures 8.23:1.

   The vg- layer defines ~98 custom properties used ~2,200 times, so these
   overrides re-colour most of the product. What they do NOT reach, unchanged from
   the note in the Umniah theme: assets/css/style.css (the 816 KB Star Admin
   template, 224 hard-coded hex values), ~70 pages carrying their own inline
   <style> blocks, and the chart and SweetAlert palettes, which are JS literals.
   Those stay the template blue until they are tokenised.
   ========================================================================= */

:root,
body.vg-auth-body,
.vg-auth {
    /* Primary */
    --vg-primary:      #54b4d8;
    --vg-primary-rgb:  84, 180, 216;
    --vg-primary-soft: rgba(84, 180, 216, .14);
    --vg-primary-line: rgba(84, 180, 216, .38);
    /* Lighter than the primary, for zone outlines drawn over live video -- they have to
       stay visible against a scene, which is what the pink did for Umniah. */
    --vg-primary-bright: #7fc9e3;

    /* Filled buttons. Dark text, for the reason in the header above. */
    --vg-on-primary:    #0d0d0d;
    --vg-primary-hover: #4799b8;

    /* Tables */
    --vgt-primary:     #54b4d8;
    --vgt-primary-dk:  #4799b8;
    --vgt-info:        #54b4d8;

    /* Forms */
    --vgf-primary:     #54b4d8;

    /* Charts. The second brand colour earns its place here: a chart with one
       accent cannot distinguish two series, and orange against this blue is the
       widest separation the brand offers. */
    --vgv-accent:      #54b4d8;
    --vgv-accent-2:    #e47830;
}
