/* =========================================================================
   Corsair Design System — root stylesheet
   Consumers link THIS file. It pulls in:
   - ds/fig-tokens.css      authoritative Figma Variables (primitive + semantic)
   - colors_and_type.css    fonts, element defaults, helpers (hand-authored)
   ========================================================================= */

@import './ds/fig-tokens.css';
@import './colors_and_type.css';
@import './ds/grid.css';

/* -------------------------------------------------------------------------
   Length aliases for the unitless Figma float tokens.
   fig-tokens.css stores spacing/size as raw numbers (e.g. --16: 16) so they
   can be used in calc(). These *px aliases give ready-to-use length values.
   ------------------------------------------------------------------------- */
:root {
  /* spacing scale (px) */
  --sp-4:   calc(var(--4)   * 1px);
  --sp-8:   calc(var(--8)   * 1px);
  --sp-12:  calc(var(--12)  * 1px);
  --sp-16:  calc(var(--16)  * 1px);
  --sp-24:  calc(var(--24)  * 1px);
  --sp-32:  calc(var(--32)  * 1px);
  --sp-40:  calc(var(--40)  * 1px);
  --sp-48:  calc(var(--48)  * 1px);
  --sp-64:  calc(var(--64)  * 1px);
  --sp-80:  calc(var(--80)  * 1px);
  --sp-112: calc(var(--112) * 1px);

  /* layout (px) */
  --layout-margin:  calc(var(--margin) * 1px);
  --layout-gutter:  calc(var(--column-gap) * 1px);
  --layout-block-y: calc(var(--block-padding-vertical) * 1px);

  /* type sizes (px) — desktop defaults, auto-shift via [data-mode] */
  --fs-h1: calc(var(--font-size-header-1) * 1px);   --lh-h1: calc(var(--font-line-height-header-1) * 1px);
  --fs-h2: calc(var(--font-size-header-2) * 1px);   --lh-h2: calc(var(--font-line-height-header-2) * 1px);
  --fs-h3: calc(var(--font-size-header-3) * 1px);   --lh-h3: calc(var(--font-line-height-header-3) * 1px);
  --fs-h4: calc(var(--font-size-header-4) * 1px);   --lh-h4: calc(var(--font-line-height-header-4) * 1px);
  --fs-h5: calc(var(--font-size-header-5) * 1px);   --lh-h5: calc(var(--font-line-height-header-5) * 1px);
  --fs-h6: calc(var(--font-size-header-6) * 1px);   --lh-h6: calc(var(--font-line-height-header-6) * 1px);
  --fs-sub1: calc(var(--font-size-subhead-1) * 1px); --lh-sub1: calc(var(--font-line-height-subhead-1) * 1px);
  --fs-sub2: calc(var(--font-size-subhead-2) * 1px); --lh-sub2: calc(var(--font-line-height-subhead-2) * 1px);
  --fs-cta: calc(var(--font-size-cta) * 1px);       --lh-cta: calc(var(--font-line-height-cta) * 1px);
  --fs-body1: calc(var(--font-size-body-copy-1) * 1px); --lh-body1: calc(var(--font-line-height-body-copy-1) * 1px);
  --fs-body2: calc(var(--font-size-body-copy-2) * 1px); --lh-body2: calc(var(--font-line-height-body-copy-2) * 1px);
  --fs-disc: calc(var(--font-size-disclaimer) * 1px);  --lh-disc: calc(var(--font-line-height-disclaimer) * 1px);
}