/**
 * Citizen
 *
 * Core MediaWiki skin tokens
 * Used by supported extensions and other UI in the MW ecosystem
 * @see https://phabricator.wikimedia.org/T349359
 */

@import 'mediawiki.skin.defaults.less';

/**
 * Codex design tokens
 * @see https://github.com/wikimedia/mediawiki/blob/master/resources/lib/codex-design-tokens/theme-wikimedia-ui.less
 */
@import 'mediawiki.skin.codex-design-tokens/theme-wikimedia-ui.less';

// LESS variable override
@font-size-x-small: var( --font-size-x-small );
@font-size-small: var( --font-size-small );
@font-size-medium: var( --font-size-medium );
@font-size-large: var( --font-size-large );
@font-size-x-large: var( --font-size-x-large );
@font-size-xx-large: var( --font-size-xx-large );
@font-size-xxx-large: var( --font-size-xxx-large );
// Bold is too bold for Roboto, semi-bold looks nicer
@font-weight-bold: var( --font-weight-semi-bold );

/**
 * Skin variables that are not Codex tokens
 * @see https://github.com/wikimedia/mediawiki/blob/master/resources/src/mediawiki.less/mediawiki.skin.defaults.less
 */
@color-link: var( --color-link );
@color-link--visited: var( --color-link );
@color-link--active: var( --color-link--active );
@color-link-new: var( --color-link-red );
@color-link-new--visited: var( --color-link-red );
@color-link-external: var( --color-link );
@color-link-external--visited: var( --color-link );
@color-link-external--active: var( --color-link--active );
// work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.
// see https://github.com/twbs/bootstrap/blob/8f3d0580a36d3eba2a9f90d90ceaf6e50f452365/scss/mixins/_breakpoints.scss#L43 for why `- 0.02px` is used.
@max-width-breakpoint-mobile: ( @min-width-breakpoint-tablet - 0.02px );
@max-width-breakpoint-tablet: ( @min-width-breakpoint-desktop - 0.02px );
@max-width-breakpoint-desktop: ( @min-width-breakpoint-desktop-wide - 0.02px );