$bp-lato-font-family: var(--bp-font-font-family), -apple-system, BlinkMacSystemFont, 'San Francisco', 'Segoe UI', Roboto,
    'Helvetica Neue', sans-serif;

@mixin bp-lato-title-mondo {
    font-weight: var(--bp-font-weight-black);
    font-size: var(--bp-font-size-11);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-07);
    letter-spacing: normal;
}

@mixin bp-lato-title-xlarge {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-10);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-06);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-title-large {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-09);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-05);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-title-medium {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-08);
    font-family: $bp-lato-font-family;
    line-height: var(--bp-font-line-height-05);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-title-small {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-07);
    font-family: $bp-lato-font-family;
    line-height: var(--bp-font-line-height-04);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-subtitle {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-06);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-04);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-body-large-bold {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-07);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-05);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-body-large {
    font-weight: var(--bp-font-weight-regular);
    font-size: var(--bp-font-size-07);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-05);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-body-default-bold {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-05);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-04);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-body-default-semibold {
    font-weight: var(--bp-font-weight-semibold);
    font-size: var(--bp-font-size-05);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-04);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-body-default {
    font-weight: var(--bp-font-weight-regular);
    font-size: var(--bp-font-size-05);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-04);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-body-small-semibold {
    font-weight: var(--bp-font-weight-semibold);
    font-size: var(--bp-font-size-04);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-04);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-body-small {
    font-weight: var(--bp-font-weight-regular);
    font-size: var(--bp-font-size-04);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-04);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-caption-bold {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-03);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-02);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-caption-default {
    font-weight: var(--bp-font-weight-regular);
    font-size: var(--bp-font-size-03);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-02);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-label-bold {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-02);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-03);
    letter-spacing: var(--bp-font-letter-spacing-02);
}

@mixin bp-lato-label-default {
    font-weight: var(--bp-font-weight-regular);
    font-size: var(--bp-font-size-02);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-03);
    letter-spacing: var(--bp-font-letter-spacing-02);
}

@mixin bp-lato-link-default {
    font-weight: var(--bp-font-weight-regular);
    font-size: var(--bp-font-size-05);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-04);
    letter-spacing: var(--bp-font-letter-spacing-01);
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
}

@mixin bp-lato-notification-default {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-01);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-02);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-metric-large {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-12);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-08);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-metric-medium {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-11);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-065);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

@mixin bp-lato-metric-small {
    font-weight: var(--bp-font-weight-bold);
    font-size: var(--bp-font-size-105);
    font-family: $bp-lato-font-family;
    font-style: normal;
    line-height: var(--bp-font-line-height-05);
    letter-spacing: var(--bp-font-letter-spacing-01);
}

// TODO LXP-839 Use CSS variables once tokens are exported from Figma.

$bp-inter-font-family: InterVariable, -apple-system, BlinkMacSystemFont, 'San Francisco', 'Segoe UI', Roboto,
    'Helvetica Neue', sans-serif;

@mixin bp-inter-title-mondo {
    font-weight: 550;
    font-size: 2rem; // 32px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 2.75rem; // 44px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-title-xlarge {
    font-weight: 550;
    font-size: 1.3125rem; // 21px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.875rem; // 30px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-title-large {
    font-weight: 550;
    font-size: 1.1875rem; // 19px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.5rem; // 24px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-title-medium {
    font-weight: 550;
    font-size: 1.125rem; // 18px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.375rem; // 22px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-title-small {
    font-weight: 600;
    font-size: 1.0625rem; // 17px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.3125rem; // 21px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-subtitle {
    font-weight: 600;
    font-size: 1rem; // 16px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.25rem; // 20px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-body-large-bold {
    font-weight: 600;
    font-size: 1rem; // 16px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.375rem; // 22px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-body-large {
    font-weight: 450;
    font-size: 1rem; // 16px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.375rem; // 22px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-body-default-bold {
    font-weight: 600;
    font-size: 0.875rem; // 14px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.25rem; // 20px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-body-default-semibold {
    font-weight: 500;
    font-size: 0.875rem; // 14px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.25rem; // 20px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-body-default {
    font-weight: 450;
    font-size: 0.875rem; // 14px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.25rem; // 20px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-body-small-semibold {
    font-weight: 500;
    font-size: 0.8125rem; // 13px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.125rem; // 18px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-body-small {
    font-weight: 450;
    font-size: 0.8125rem; // 13px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.125rem; // 18px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-caption-bold {
    font-weight: 550;
    font-size: 0.75rem; // 12px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 0.9375rem; // 15px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-caption-default {
    font-weight: 450;
    font-size: 0.75rem; // 12px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 0.9375rem; // 15px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-label-bold {
    font-weight: 550;
    font-size: 0.625rem; // 10px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 0.875rem; // 14px
    letter-spacing: 0.01875rem; // 0.3px
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-label-default {
    font-weight: 450;
    font-size: 0.625rem; // 10px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 0.875rem; // 14px
    letter-spacing: 0.01875rem; // 0.3px
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-link-default {
    font-weight: 500;
    font-size: 0.875rem; // 14px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.25rem; // 20px
    letter-spacing: 0;
    text-transform: none;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
}

@mixin bp-inter-notification-default {
    font-weight: 550;
    font-size: 0.5rem; // 8px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 0.75rem; // 12px
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-metric-large {
    font-weight: bold;
    font-size: 3rem; // px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 3rem;
    letter-spacing: 0.01875rem;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-metric-medium {
    font-weight: bold;
    font-size: 2.25rem; // px
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 2.25rem;
    letter-spacing: 0.01875rem;
    text-transform: none;
    text-decoration: none;
}

@mixin bp-inter-metric-small {
    font-weight: bold;
    font-size: 1.5rem;
    font-family: $bp-inter-font-family;
    font-style: normal;
    line-height: 1.5rem;
    letter-spacing: 0.01875rem;
    text-transform: none;
    text-decoration: none;
}