/* ==========================================================================
   Max Personal Trainer CRM — design tokens
   Values sampled directly from the approved mockups (1672 x 941 canvas).
   ========================================================================== */

:root {
  /* --- Surfaces ------------------------------------------------------- */
  --bg:            #03060B;   /* page background                          */
  --bg-glow:       #0A1220;   /* subtle top-left wash on the page         */
  --sidebar:       #000000;   /* textured black rail                      */
  --panel:         #111519;   /* every card / table / panel               */
  --panel-hi:      #161B21;   /* hovered rows, nested blocks              */
  --panel-sunk:    #0B0E12;   /* inputs, selects, textareas               */
  --panel-inset:   #0D1116;   /* package box inside the profile header    */

  /* --- Lines ---------------------------------------------------------- */
  --line:          #23272E;   /* card borders                             */
  --line-soft:     #1A1E24;   /* inner separators                         */
  --line-input:    #2E3238;   /* input borders                            */
  --line-blue:     #17356E;   /* blue-tinted table dividers               */

  /* --- Brand ---------------------------------------------------------- */
  --blue:          #2F6BFF;   /* Performance Blue                         */
  --blue-bright:   #0B59FF;   /* numerals, links, icons                   */
  --blue-deep:     #084DCF;   /* active nav gradient end                  */
  --blue-soft:     rgba(47, 107, 255, .14);

  --yellow:        #F5CC33;   /* Energy Yellow — headings & numerals      */
  --yellow-btn-a:  #F7D34B;   /* primary button gradient start            */
  --yellow-btn-b:  #D8B02C;   /* primary button gradient end              */
  --yellow-line:   #C9A93A;   /* outlined yellow button border            */
  --yellow-dim:    #B99C34;

  --green:         #77B94A;   /* ACTIVE badge text                        */
  --green-line:    #4E862F;   /* ACTIVE badge border                      */
  --red:           #E5533D;

  /* --- Type ----------------------------------------------------------- */
  --txt:           #FFFFFF;
  --txt-2:         #C9CDD3;
  --txt-3:         #9AA0A8;
  --muted:         #7C838C;

  /* Barlow Condensed reproduces the mockups' headline ink box to within 0.1%
     at a matched cap height; Barlow is the body face of the same family.
     See tools/typemetrics.py for the derivation. */
  --font-head: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --font-body: 'Barlow', 'Segoe UI', system-ui, sans-serif;

  /* --- Metrics -------------------------------------------------------- */
  --rail-w:        267px;
  --gutter:        39px;
  --radius:        10px;
  --radius-sm:     6px;
  --card-pad:      26px;
}