/**
 * CSS Variables
 *
 * Define global CSS custom properties.
 *
 *
 */

:root body {
    /* ============================ */
    /* Colors */
    /* ============================ */
    --color-primary              : var(--e-global-color-primary);
    --color-secondary            : var(--e-global-color-secondary);
    --color-accent               : var(--e-global-color-accent);

    --color-text                 : var(--e-global-color-text);
    --color-text-light           : #FFFFFF;
    --color-text-dark            : #000000;

    --color-bg-light             : #F4F6F8;
    --color-bg-dark              : #2D2D2D;
    --kelveo-gradient            : linear-gradient(90deg, #3CB9BE 0%, #FBBB32 100%);
    /* ============================ */
    /*  Typography */
    /* ============================ */
    /* --- PRIMARY --- */
    --font-family-primary        : var(--e-global-typography-primary-font-family);
    --font-size-primary          : var(--e-global-typography-primary-font-size);
    --font-weight-primary        : var(--e-global-typography-primary-font-weight);
    --font-line-height-primary   : var(--e-global-typography-primary-line-height);
    --font-primary               : var(--font-weight-primary) var(--font-size-primary) / var(--font-line-height-primary) var(--font-family-primary);

    /* --- SECONDARY --- */
    --font-family-secondary      : var(--e-global-typography-secondary-font-family);
    --font-size-secondary        : var(--e-global-typography-secondary-font-size);
    --font-weight-secondary      : var(--e-global-typography-secondary-font-weight);
    --font-line-height-secondary : var(--e-global-typography-secondary-line-height);
    --font-secondary             : var(--font-weight-secondary) var(--font-size-secondary) / var(--font-line-height-secondary) var(--font-family-secondary);

    /* --- TEXT --- */
    --font-family-text           : var(--e-global-typography-text-font-family);
    --font-size-text             : var(--e-global-typography-text-font-size);
    --font-weight-text           : var(--e-global-typography-text-font-weight);
    --font-line-height-text      : var(--e-global-typography-text-line-height);
    --font-text                  : var(--font-weight-text) var(--font-size-text) / var(--font-line-height-text) var(--font-family-text);

    /* --- ACCENT --- */
    --font-family-accent         : var(--e-global-typography-accent-font-family);
    --font-size-accent           : var(--e-global-typography-accent-font-size);
    --font-weight-accent         : var(--e-global-typography-accent-font-weight);
    --font-line-height-accent    : var(--e-global-typography-accent-line-height);
    --font-accent                : var(--font-weight-accent) var(--font-size-accent) / var(--font-line-height-accent) var(--font-family-accent);


    /* ============================ */
    /*  Transitions */
    /* ============================ */
    --transition-fast            : 0.15s;
    --transition-normal          : 0.3s;
    --transition-slow            : 0.8s;
}