/* ==========================================================
   Hi BodyMate — Design Tokens
   SSOT: apoio/hi-bodymate-antigravity-prompt...md
   ========================================================== */

:root {

  /* ----------------------------------------------------------
     Institutional Colors
     ---------------------------------------------------------- */
  --color-brand-teal:    #00AD91;
  --color-brand-green:   #A5D9A1;
  --color-brand-orange:  #FFA970;
  --color-brand-pink:    #FE9FB7;

  /* ----------------------------------------------------------
     Palette — Light (active)
     ---------------------------------------------------------- */
  --color-h1:            #00AD91;
  --color-h2:            #1e293b;
  --color-h3:            #334155;
  --color-h4:            #475569;
  --color-paragraph:     #647439;

  --color-bg1:           #FFFAF7;
  --color-bg2:           #ffffff;
  --color-bg-box:        #FFE6DB;
  --color-text-box:      #47636C;

  /* ----------------------------------------------------------
     Calculator UI Colors
     ---------------------------------------------------------- */
  --color-input-bg:      #CCFBF1;
  --color-btn-calc:      #00AA99;
  --color-btn-calc-text: #ffffff;

  /* ----------------------------------------------------------
     Tab Colors (per calculator)
     ---------------------------------------------------------- */
  --tab-bmi:             #DCFCE7;
  --tab-usnavy:          #1E3A8A;
  --tab-usnavy-text:     #ffffff;
  --tab-bai:             #581C87;
  --tab-bai-text:        #ffffff;
  --tab-whtr:            #FFEDD5;
  --tab-whr:             #FFE4E6;

  /* ----------------------------------------------------------
     Typography
     ---------------------------------------------------------- */
  --font-heading: 'Bricolage Grotesque', sans-serif;
  --font-body:    'Work Sans', sans-serif;

  --fw-heading-h1: 900;
  --fw-heading-h2: 600;
  --fw-heading-h3: 600;
  --fw-heading-h4: 500;
  --fw-paragraph:  400;

  /* ----------------------------------------------------------
     Font Sizes — fluid scale
     ---------------------------------------------------------- */
  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-lg:   1.125rem;  /* 18px */
  --text-xl:   1.25rem;   /* 20px */
  --text-2xl:  1.5rem;    /* 24px */
  --text-3xl:  1.875rem;  /* 30px */
  --text-4xl:  2.25rem;   /* 36px */
  --text-5xl:  3rem;      /* 48px */

  /* ----------------------------------------------------------
     Border Radius
     ---------------------------------------------------------- */
  --radius-sm:   0.375rem;   /* 6px */
  --radius-md:   0.75rem;    /* 12px */
  --radius-lg:   1rem;       /* 16px */
  --radius-xl:   1.5rem;     /* 24px */
  --radius-2xl:  2rem;       /* 32px */
  --radius-full: 9999px;

  /* ----------------------------------------------------------
     Spacing Scale
     ---------------------------------------------------------- */
  --space-1:  0.25rem;   /* 4px */
  --space-2:  0.5rem;    /* 8px */
  --space-3:  0.75rem;   /* 12px */
  --space-4:  1rem;      /* 16px */
  --space-5:  1.25rem;   /* 20px */
  --space-6:  1.5rem;    /* 24px */
  --space-8:  2rem;      /* 32px */
  --space-10: 2.5rem;    /* 40px */
  --space-12: 3rem;      /* 48px */
  --space-16: 4rem;      /* 64px */
  --space-20: 5rem;      /* 80px */
  --space-24: 6rem;      /* 96px */

  /* ----------------------------------------------------------
     Shadows
     ---------------------------------------------------------- */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md:  0 4px 12px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.05);
  --shadow-lg:  0 10px 30px rgba(0,0,0,0.10), 0 4px 10px rgba(0,0,0,0.06);
  --shadow-calc: 0 8px 32px rgba(0, 173, 145, 0.12), 0 2px 8px rgba(0,0,0,0.06);

  /* ----------------------------------------------------------
     Transitions
     ---------------------------------------------------------- */
  --transition-fast:   150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow:   400ms ease;

  /* ----------------------------------------------------------
     Layout
     ---------------------------------------------------------- */
  --container-max: 1600px;
  --header-height: 68px;
}