/**
 * This file was copied from @salesforce-ux/c360-foundation/dist/index.css
 */

@font-face {
  font-family: 'Salesforce Sans';
  src: url('./fonts/SalesforceSans-Regular.woff2') format('woff2'),
    url('./fonts/SalesforceSans-Regular.woff') format('woff');
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'Salesforce Sans';
  src: url('./fonts/SalesforceSans-Bold.woff2') format('woff2'),
    url('./fonts/SalesforceSans-Bold.woff') format('woff');
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: 'ITC Avant Garde';
  src: url('./fonts/AvantGardeDemi.woff2') format('woff2'), url('./fonts/AvantGardeDemi.woff') format('woff');
  font-weight: 600;
  font-display: swap;
}

[type-style='display-1'] {
  font-family: var(--c360-g-font-family-display);
  font-size: var(--c360-g-font-size-10);
  line-height: 5.5rem;
  letter-spacing: -1.8px;
  color: var(--c360-g-color-palette-blue-20);
}

[type-style='display-2'] {
  font-family: var(--c360-g-font-family-display);
  font-size: var(--c360-g-font-size-9);
  line-height: 4rem;
  letter-spacing: -1.2px;
  color: var(--c360-g-color-palette-blue-20);
}

[type-style='display-3'] {
  font-family: var(--c360-g-font-family-display);
  font-size: var(--c360-g-font-size-8);
  line-height: 3.5rem;
  letter-spacing: -1px;
  color: var(--c360-g-color-palette-blue-20);
}

[type-style='display-4'] {
  font-family: var(--c360-g-font-family-display);
  font-size: var(--c360-g-font-size-7);
  line-height: 3rem;
  letter-spacing: -0.85px;
  color: var(--c360-g-color-palette-blue-20);
}

[type-style='display-5'] {
  font-family: var(--c360-g-font-family-display);
  font-size: var(--c360-g-font-size-6);
  line-height: 2.5rem;
  letter-spacing: -0.6px;
  color: var(--c360-g-color-palette-blue-20);
}

[type-style='display-6'] {
  font-family: var(--c360-g-font-family-display);
  font-size: var(--c360-g-font-size-5);
  line-height: 2rem;
  letter-spacing: -0.5px;
  color: var(--c360-g-color-palette-blue-20);
}

[type-style='display-7'] {
  font-family: var(--c360-g-font-family-display);
  font-size: var(--c360-g-font-size-4);
  line-height: 1.75rem;
  letter-spacing: -0.5px;
  color: var(--c360-g-color-palette-blue-20);
}

[type-style='display-8'] {
  font-family: var(--c360-g-font-family-display);
  font-size: var(--c360-g-font-size-3);
  line-height: 1.5rem;
  letter-spacing: -0.5px;
  color: var(--c360-g-color-palette-blue-20);
}

[type-style='body-1'] {
  font-family: var(--c360-g-font-family-sans);
  font-weight: 400;
  font-size: var(--c360-g-font-size-4);
  line-height: 2rem;
  letter-spacing: 0;
  color: var(--c360-g-color-palette-neutral-10);
}

[type-style='body-2'] {
  font-family: var(--c360-g-font-family-sans);
  font-weight: 400;
  font-size: var(--c360-g-font-size-3);
  line-height: 1.5rem;
  letter-spacing: 0;
  color: var(--c360-g-color-palette-neutral-10);
}

[type-style='body-3'] {
  font-family: var(--c360-g-font-family-sans);
  font-weight: 400;
  font-size: var(--c360-g-font-size-2);
  line-height: 1.25rem;
  letter-spacing: 0;
  color: var(--c360-g-color-palette-neutral-10);
}

[type-style='eyebrow'] {
  font-family: var(--c360-g-font-family-sans);
  font-weight: 700;
  font-size: var(--c360-g-font-size-1);
  line-height: 1.5rem;
  letter-spacing: 0;
  color: var(--c360-g-color-palette-blue-20);
}

[type-style='caption'] {
  font-family: var(--c360-g-font-family-sans);
  font-weight: 400;
  font-size: var(--c360-g-font-size-1);
  line-height: 1.125rem;
  letter-spacing: 0;
  color: var(--c360-g-color-palette-neutral-10);
}

[type-style='body-1'] [type-style='code'],
[type-style='body-1'] code,
[type-style='body-1'] a {
  font-size: var(--c360-g-font-size-4);
  line-height: 2rem;
  letter-spacing: 0;
  color: var(--c360-g-color-palette-neutral-10);
}

[type-style='body-2'] [type-style='code'],
[type-style='body-2'] code,
[type-style='body-2'] a {
  font-size: var(--c360-g-font-size-3);
  line-height: 1.5rem;
  letter-spacing: 0;
  color: var(--c360-g-color-palette-neutral-10);
}

[type-style='body-3'] [type-style='code'],
[type-style='body-3'] code,
[type-style='body-3'] a {
  font-size: var(--c360-g-font-size-2);
  line-height: 1.25rem;
  letter-spacing: 0;
  color: var(--c360-g-color-palette-neutral-10);
}

[type-style='caption'] [type-style='code'],
[type-style='caption'] code,
[type-style='caption'] a {
  font-size: var(--c360-g-font-size-1);
  line-height: 1.125rem;
  letter-spacing: 0;
  color: var(--c360-g-color-palette-neutral-10);
}

[type-style='body-1'] code,
[type-style='body-1'] [type-style='code'],
[type-style='body-2'] code,
[type-style='body-2'] [type-style='code'],
[type-style='body-3'] code,
[type-style='body-3'] [type-style='code'],
[type-style='caption'] code,
[type-style='caption'] [type-style='code'] {
  font-family: var(--c360-g-font-family-monospace);
  font-weight: 400;
  color: var(--c360-g-color-palette-neutral-10);
  letter-spacing: 0;
}

[type-style='body-1'] a,
[type-style='body-2'] a,
[type-style='body-3'] a,
[type-style='caption'] a {
  font-family: var(--c360-g-font-family-sans);
  font-weight: 400;
  color: var(--c360-g-color-palette-blue-50);
  letter-spacing: 0;
}

[type-style='body-1'] a:hover,
[type-style='body-2'] a:hover,
[type-style='body-3'] a:hover,
[type-style='caption'] a:hover {
  color: var(--c360-g-color-palette-blue-20);
}

[util-style='ellipsis'] {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[util-style='multi-line-ellipsis'] {
  display: -webkit-box;
  -webkit-line-clamp: var(--c360-g-text-ellipsis-lines, 3);
  -webkit-box-orient: vertical;
  overflow: hidden;
}