import { css } from 'lit';

export const displayFontStyles = css`
.display-large {
	font-family:    var(--font-family-name);
	font-weight:    var(--display-large-font-weight);
	font-size:      var(--display-large-font-size);
	line-height:    var(--display-large-line-height);
	letter-spacing: var(--display-large-letter-spacing);
}
.display-medium {
	font-family:    var(--font-family-name);
	font-weight:    var(--display-medium-font-weight);
	font-size:      var(--display-medium-font-size);
	line-height:    var(--display-medium-line-height);
	letter-spacing: var(--display-medium-letter-spacing);
}
.display-small {
	font-family:    var(--font-family-name);
	font-weight:    var(--display-small-font-weight);
	font-size:      var(--display-small-font-size);
	line-height:    var(--display-small-line-height);
	letter-spacing: var(--display-small-letter-spacing);
}
`;

export const headlineFontStyles = css`
.headline-large {
	font-family:    var(--font-family-name);
	font-weight:    var(--headline-large-font-weight);
	font-size:      var(--headline-large-font-size);
	line-height:    var(--headline-large-line-height);
	letter-spacing: var(--headline-large-letter-spacing);
}
.headline-medium {
	font-family:    var(--font-family-name);
	font-weight:    var(--headline-medium-font-weight);
	font-size:      var(--headline-medium-font-size);
	line-height:    var(--headline-medium-line-height);
	letter-spacing: var(--headline-medium-letter-spacing);
}
.headline-small {
	font-family:    var(--font-family-name);
	font-weight:    var(--headline-small-font-weight);
	font-size:      var(--headline-small-font-size);
	line-height:    var(--headline-small-line-height);
	letter-spacing: var(--headline-small-letter-spacing);
}
`;

export const bodyFontStyles = css`
.body-large {
	font-family:    var(--font-family-name);
	font-weight:    var(--body-large-font-weight);
	font-size:      var(--body-large-font-size);
	line-height:    var(--body-large-line-height);
	letter-spacing: var(--body-large-letter-spacing);
}
.body-medium {
	font-family:    var(--font-family-name);
	font-weight:    var(--body-medium-font-weight);
	font-size:      var(--body-medium-font-size);
	line-height:    var(--body-medium-line-height);
	letter-spacing: var(--body-medium-letter-spacing);
}
.body-small {
	font-family:    var(--font-family-name);
	font-weight:    var(--body-small-font-weight);
	font-size:      var(--body-small-font-size);
	line-height:    var(--body-small-line-height);
	letter-spacing: var(--body-small-letter-spacing);
}
`;

export const labelFontStyles = css`
.label-large {
	font-family:    var(--font-family-name);
	font-weight:    var(--label-large-font-weight);
	font-size:      var(--label-large-font-size);
	line-height:    var(--label-large-line-height);
	letter-spacing: var(--label-large-letter-spacing);
}
.label-medium {
	font-family:    var(--font-family-name);
	font-weight:    var(--label-medium-font-weight);
	font-size:      var(--label-medium-font-size);
	line-height:    var(--label-medium-line-height);
	letter-spacing: var(--label-medium-letter-spacing);
}
.label-small {
	font-family:    var(--font-family-name);
	font-weight:    var(--label-small-font-weight);
	font-size:      var(--label-small-font-size);
	line-height:    var(--label-small-line-height);
	letter-spacing: var(--label-small-letter-spacing);
}
`;

export const titleFontStyles = css`
.title-large {
	font-family:    var(--font-family-name);
	font-weight:    var(--title-large-font-weight);
	font-size:      var(--title-large-font-size);
	line-height:    var(--title-large-line-height);
	letter-spacing: var(--title-large-letter-spacing);
}
.title-medium {
	font-family:    var(--font-family-name);
	font-weight:    var(--title-medium-font-weight);
	font-size:      var(--title-medium-font-size);
	line-height:    var(--title-medium-line-height);
	letter-spacing: var(--title-medium-letter-spacing);
}
.title-small {
	font-family:    var(--font-family-name);
	font-weight:    var(--title-small-font-weight);
	font-size:      var(--title-small-font-size);
	line-height:    var(--title-small-line-height);
	letter-spacing: var(--title-small-letter-spacing);
}
`;