/**
 * ###IMPORTANT:##
 * If editing this file, please also edit the respective file in the Vector skin.
 * ####
 *
 * This file is a LESS @import match for 'mediawiki.skin.variables.less'
 * when MinervaNeue is the active skin.
 *
 * Please also note, that both current Wikimedia Design Style Guide based skins,
 * MinervaNeue and Vector 2022 are using the same variable values respectively in their
 * repositories.
 */
@import 'mediawiki.skin.defaults.less';

// Import the Codex design tokens from the “WikimediaUI” theme.
@import 'mediawiki.skin.codex-design-tokens/theme-wikimedia-ui.less';

// Overrides for Codex tokens:

@font-size-base: 1em; // Codex: 16px

// == Typography ==
// Body content uses the user setting in browser / the system default sans-serif font:
// Arial on Windows, Roboto on Android.
// FIXME: Use WikimediaUI Base's OS specific default sans-serif fonts.
@font-family-sans: @font-family-sans--fallback;

/**
 * Link styles are defined in MediaWiki core.
 * These variables are first defined in core/resources/src/mediawiki.less/mediawiki.skin.defaults.less
 * Then they're overridden here for night mode compatibility
 * Then they're fed back into MediaWiki core & extensions
 * through the usage of @import "mediawiki.skin.variables.less".
 * 🙃
 **/
@color-subtle: var(--color-subtle);
@color-error: var(--color-error);
@color-progressive: var(--color-progressive);
@color-destructive: var(--color-destructive);
@color-inverted:  var(--color-inverted);
@color-base: var(--color-base);
@background-color-progressive-subtle: var(--background-color-progressive-subtle);
@color-link: var(--color-link);
@color-link--visited: var( --color-visited);
@color-link--active: var(--color-progressive--active);
@color-link-new: var(--color-link-red);
@color-link-new--visited: var(--color-link-red--visited);
@color-link-external: var(--color-link-external);
@color-link-external--visited: var(--color-link-external--visited);
@color-link-external--active: var(--color-link-external--active);
@background-color-base: var(--background-color-base);
@background-color-destructive: var(--background-color-destructive);
@background-color-interactive: var(--background-color-interactive);
@background-color-interactive-subtle: var(--background-color-interactive-subtle);
@background-color-notice-subtle: var(--background-color-notice-subtle);
@border-color-base: var(--border-color-base);
@border-color-inverted: var(--border-color-inverted);
@border-color-muted: var(--border-color-muted);
@border-color-progressive--focus: var(--border-color-progressive--focus);
@border-color-subtle: var(--border-color-subtle);
@border-color-transparent: var(--border-color-transparent);
@box-shadow-color-progressive--focus: var(--box-shadow-color-progressive--focus);
@color-visited: var(--color-visited);
@color-progressive--active: var(--color-progressive--active);
@color-link-red: var(--color-link-red);
@color-link-red--visited: var(--color-link-red--visited);
@color-link--active: var(--color-link--active);
@color-emphasized: var(--color-emphasized);