/**
 * Stylesheet for Babel extension.
 *
 * You can override the CSS code on the MediaWiki:Common.css page
 * on your wiki to adjust colours etc.
 *
 * @file
 * @ingroup Extensions
 */
/**
 * This file is a LESS import match for "mediawiki.skin.variables.less"
 * when legacy Vector (useskin=vector) is the active skin.
 */
/* stylelint-disable @stylistic/indentation */
:root,
.skin-invert,
.notheme {
  --babel-box-0-border: #fbb;
  --babel-box-0-background: #fee;
  --babel-box-1-border: #e0c0e0;
  --babel-box-1-background: #f3e0f3;
  --babel-box-2-border: #bcb9ef;
  --babel-box-2-background: #e9e4f9;
  --babel-box-3-border: #99b3ff;
  --babel-box-3-background: #e0e8ff;
  --babel-box-4-border: #77e0e8;
  --babel-box-4-background: #d0f8ff;
  --babel-box-5-border: #ffcf4d;
  --babel-box-5-background: #ffefa6;
  --babel-box-N-border: #6ef7a7;
  --babel-box-N-background: #c5fcdc;
}
@media screen {
  html.skin-theme-clientpref-night {
    --babel-box-0-border: #692626;
    --babel-box-0-background: var(--background-color-base, #fff);
    --babel-box-1-border: #4b2b4b;
    --babel-box-1-background: var(--background-color-base, #fff);
    --babel-box-2-border: #3f3b71;
    --babel-box-2-background: var(--background-color-base, #fff);
    --babel-box-3-border: #314a95;
    --babel-box-3-background: var(--background-color-base, #fff);
    --babel-box-4-border: #004851;
    --babel-box-4-background: var(--background-color-base, #fff);
    --babel-box-5-border: #5c2d00;
    --babel-box-5-background: var(--background-color-base, #fff);
    --babel-box-N-border: #004c00;
    --babel-box-N-background: var(--background-color-base, #fff);
  }
}
@media screen and (prefers-color-scheme: dark) {
  html.skin-theme-clientpref-os {
    --babel-box-0-border: #692626;
    --babel-box-0-background: var(--background-color-base, #fff);
    --babel-box-1-border: #4b2b4b;
    --babel-box-1-background: var(--background-color-base, #fff);
    --babel-box-2-border: #3f3b71;
    --babel-box-2-background: var(--background-color-base, #fff);
    --babel-box-3-border: #314a95;
    --babel-box-3-background: var(--background-color-base, #fff);
    --babel-box-4-border: #004851;
    --babel-box-4-background: var(--background-color-base, #fff);
    --babel-box-5-border: #5c2d00;
    --babel-box-5-background: var(--background-color-base, #fff);
    --babel-box-N-border: #004c00;
    --babel-box-N-background: var(--background-color-base, #fff);
  }
}
/* Babel wrapper layout. */
/* @noflip */
.mw-babel-wrapper {
  background-color: var(--background-color-base, #fff);
  border: 1px solid var(--border-color-progressive, #6485d1);
  border-spacing: 0;
  box-sizing: border-box;
  padding: 0;
  margin: 1px;
  width: 100%;
}
/* header and footer */
.mw-babel-header {
  font-weight: bold;
  text-align: center;
}
.mw-babel-footer {
  font-size: 0.75rem;
  font-weight: normal;
  text-align: center;
}
/* Babel box layout */
.mw-babel-box {
  margin: 1px;
  border: 1px solid;
}
.mw-babel-box table {
  border-spacing: 0;
  width: 100%;
  margin: 0 !important;
  /* stylelint-disable-line declaration-no-important */
}
.mw-babel-box th {
  font-size: 1.25rem;
  height: 2.75rem;
  min-width: 2.75rem;
  text-align: center;
  width: 2.75rem;
}
.mw-babel-box td {
  line-height: 1.25;
  font-size: 0.75rem;
  padding: 0.5em;
  width: 100%;
}
.mw-babel-notabox {
  clear: both;
}
@media all and (min-width: 480px) {
  /* @noflip */
  .mw-babel-wrapper {
    float: right;
    clear: right;
    width: 238px;
  }
  /* @noflip */
  .mw-content-ltr .mw-babel-wrapper {
    float: right;
    clear: right;
  }
  /* @noflip */
  .mw-content-rtl .mw-babel-wrapper {
    float: left;
    clear: left;
  }
  /* @noflip */
  .mw-babel-box {
    float: right;
    clear: right;
    width: 238px;
  }
  /* @noflip */
  .mw-content-ltr .mw-babel-box {
    float: right;
    clear: right;
  }
  /* @noflip */
  .mw-content-rtl .mw-babel-box {
    float: left;
    clear: left;
  }
}
/* Babel box colours. */
.mw-babel-box-0 {
  border-color: var(--babel-box-0-border);
}
.mw-babel-box-0 table {
  background-color: var(--babel-box-0-background);
}
.mw-babel-box-0 table th {
  background-color: var(--babel-box-0-border);
}
.mw-babel-box-1 {
  border-color: var(--babel-box-1-border);
}
.mw-babel-box-1 table {
  background-color: var(--babel-box-1-background);
}
.mw-babel-box-1 table th {
  background-color: var(--babel-box-1-border);
}
.mw-babel-box-2 {
  border-color: var(--babel-box-2-border);
}
.mw-babel-box-2 table {
  background-color: var(--babel-box-2-background);
}
.mw-babel-box-2 table th {
  background-color: var(--babel-box-2-border);
}
.mw-babel-box-3 {
  border-color: var(--babel-box-3-border);
}
.mw-babel-box-3 table {
  background-color: var(--babel-box-3-background);
}
.mw-babel-box-3 table th {
  background-color: var(--babel-box-3-border);
}
.mw-babel-box-4 {
  border-color: var(--babel-box-4-border);
}
.mw-babel-box-4 table {
  background-color: var(--babel-box-4-background);
}
.mw-babel-box-4 table th {
  background-color: var(--babel-box-4-border);
}
.mw-babel-box-5 {
  border-color: var(--babel-box-5-border);
}
.mw-babel-box-5 table {
  background-color: var(--babel-box-5-background);
}
.mw-babel-box-5 table th {
  background-color: var(--babel-box-5-border);
}
.mw-babel-box-N {
  border-color: var(--babel-box-N-border);
}
.mw-babel-box-N table {
  background-color: var(--babel-box-N-background);
}
.mw-babel-box-N table th {
  background-color: var(--babel-box-N-border);
}
