:root {
    --color-text-heading: #1b1b1b;
    --color-text-subheading: rgba(27, 27, 27, 0.7);
    --color-text-body: #313131;
    --color-text-body-transparent: rgba(49, 49, 49, 0.05);
    --color-text-body-transparent-02: rgba(49, 49, 49, 0.2);
    --color-text-meta: rgba(27, 27, 27, 0.7);
    --color-text-link: #2a5ddf;
    --color-text-success: #39bb4a;
    --color-text-error: #b6534c;

    --color-background: #ffffff;
    --color-background-transparent: rgba(255, 255, 255, 0.8);
    --color-border: #eaeaea;
    --color-overlay: #000000;
    --color-overlay-transparent: rgba(0, 0, 0, 0.6);

    --color-background-meta: #f5f5f5;
    --color-foreground-meta: rgba(49, 49, 49, 0.6);

    --color-border-input: #eaeaea;
    --color-text-input: #313131;

    --color-background-button: #000000;
    --color-background-button-hover: #333333;
    --color-text-button: #ffffff;

    --color-border-button-secondary: #eaeaea;
    --color-text-button-secondary: #313131;
    --color-border-button-secondary-hover: #000000;

    --color-background-contrast: #141414;
    --color-background-meta-contrast: #1e1e1e;
    --color-foreground-meta-contrast: rgba(255, 255, 255, 0.6);
    --color-text-meta-contrast: rgba(255, 255, 255, 0.7);
    --color-text-heading-contrast: #ffffff;
    --color-text-subheading-contrast: rgba(255, 255, 255, 0.7);
    --color-text-body-contrast: #ffffff;
    --color-border-contrast: #282828;
    --color-background-button-contrast: #ffffff;
    --color-background-button-hover-contrast: #cccccc;
    --color-text-button-contrast: #191919;
    --color-text-link-contrast: #fafafa;

    --color-background-header: #000000;
    --color-background-header-transparent: rgba(0, 0, 0, 0);
    --color-text-header: #ffffff;
    --color-icon-header: #ffffff;
    --color-border-header: rgba(0,0,0,0);
    --color-shadow-header: rgba(0, 0, 0, 0.15);

    --color-background-dropdown: #101010;
    --color-text-dropdown: #ffffff;
    --color-text-dropdown-transparent: rgba(255, 255, 255, 0.1);
    --color-border-dropdown: #353535;

    --color-background-footer: #fafafa;
    --color-text-footer: #1f1f1f;
    --color-border-footer: #dcdcdc;
    --color-border-footer-darker: #a9a9a9;
    --color-input-button-hover-footer: #e1e1e1;

    --color-text-drawer: #ffffff;
    --color-text-meta-drawer: rgba(255, 255, 255, 0.7);
    --color-background-drawer: #101010;
    --color-border-drawer: #353535;
    --color-background-input-drawer: #ffffff;
    --color-text-input-drawer: #1d1d1d;

    --color-background-pill: rgba(234, 234, 234, 0.7);
    --color-background-pill-hover: #eaeaea;

    /* Typography */
    --font-logo: Inter, sans-serif;
    --font-logo-weight: 400;
    --font-logo-style: normal;
    --logo-font-size: 24px;
    --logo-text-transform: none;
    --logo-letter-spacing: 0.0em;

    --font-heading: Inter, sans-serif;
    --font-heading-weight: 800;
    --font-heading-style: normal;
    --font-heading-text-transform: uppercase;
    --font-heading-base-letter-spacing: 0.0em;

    --font-body: sans-serif;
    --font-body-weight: 400;
    --font-body-style: normal;
    --font-body-bold-weight: 500;
    --font-body-bolder-weight: 600;
    --font-body-base-letter-spacing: 0.0em;

    --font-meta: Inter, sans-serif;
    --font-meta-weight: 600;
    --font-meta-style: normal;
    --font-meta-text-transform: uppercase;
    --font-meta-base-letter-spacing: 0.0em;

    /* --font-size-heading-x-large: 36px; */
    --font-size-heading-x-large: 36px;
    --line-height-heading-x-large: 1.22;

    /* --font-size-heading-large: 32px; */
    --font-size-heading-large: 32px;
    --line-height-heading-large: 1.25;

    /* --font-size-heading-base: 24px; */
    --font-size-heading-base: 24px;
    --line-height-heading-base: 1.33;

    /* --font-size-heading-small: 18px; */
    --font-size-heading-small: 18px;
    --line-height-heading-small: 1.33;

    /* --font-size-body-large: 16px; */
    --font-size-body-large: 16px;
    --line-height-body-large: 1.75;

    /* --font-size-body-base: 14px; */
    --font-size-body-base: 14px;
    --line-height-body-base: 1.714;

    --font-size-body-small: 12px;
    --font-size-body-small: 12px;
    --line-height-body-small: 1.66;

    /* --font-size-meta: 12px; */
    --font-size-meta: 12px;
    --line-height-meta: 2;

    --radius-corner: 16px;

    /* Shopify pay specific */
    --payment-terms-background-color: #f5f5f5;
}