@import (reference) '../../styles/variables.less';
@import (reference) '../../styles/mixins.less';

.@{prefix}-Typography {
	// general text
	&-p {
		font-family: @fontFamily;
	}
	// text for tables
	&-tabular {
		font-family: @font-family-tabular;
	}

	// headings
	&-h1,
	&-h2,
	&-h3 {
		margin: 0;
		font-weight: @font-weight-medium;
		text-rendering: optimizelegibility;
	}
	&-h1 {
		font-size: 24px;
		line-height: 28px;
	}
	&-h2 {
		font-size: 16px;
		line-height: 20px;
	}
	&-h3 {
		font-size: 12px;
		line-height: 16px;
		text-transform: uppercase;
		color: @color-neutral-7;
		letter-spacing: 0.8px;
	}

	// links
	&-a {
		font-weight: @font-weight-medium;
		color: @color-linkColor;
		text-decoration: none;
	}
	&-a:hover {
		color: @color-linkColorHover;
		text-decoration: underline;
	}

	// code and code-like
	&-code,
	&-pre,
	&-kbd,
	&-samp {
		// TODO: replace this with the variable from lucid when this issue is closed:
		// https://github.com/appnexus/lucid/issues/618
		font-family: Menlo, Monaco, 'Ubuntu Mono', Courier, monospace;
	}
}