MediaWiki:Common.css: Difference between revisions

/* CSS placed here will be applied to all skins */
.infobox {
    border: 1px solid #a2a9b1;
    color: black;
    padding: 0.2em;
    font-size: 88%;
    line-height: 1.5em;
    border-spacing: 3px
}

@media screen {
    .infobox {
        background-color: #f8f9fa
    }
}

@media (max-width: 640px) {
    .infobox {
        width:100%
    }

    .infobox .nowrap {
        white-space: normal
    }
}

@media (min-width: 640px) {
    .infobox {
        margin:0.5em 0 0.5em 1em;
        float: right;
        clear: right;
        width: 22em
    }
}

.infobox-header,.infobox-label,.infobox-above,.infobox-full-data,.infobox-data,.infobox-below,.infobox-subheader,.infobox-image,.infobox-navbar,.infobox th,.infobox td {
    vertical-align: top
}

.infobox-label,.infobox-data,.infobox th,.infobox td {
    text-align: left
}

.infobox .infobox-above,.infobox .infobox-title,.infobox caption {
    font-size: 125%;
    font-weight: bold;
    text-align: center
}

.infobox-title,.infobox caption {
    padding: 0.2em
}

.infobox .infobox-header,.infobox .infobox-subheader,.infobox .infobox-image,.infobox .infobox-full-data,.infobox .infobox-below {
    text-align: center
}

.infobox .infobox-navbar {
    text-align: right
}

.infobox .plainlist ul, .infobox .plainlist li {
	list-style: none;
	margin: 0;
}

.template-documentation {
    clear: both;
    margin: 1em 0 0 0;
    border: 1px solid #aaa;
    background-color: #ecfcf4;
    padding: 1em;
}

  .wikitable {
        background-color: var(--background-color-neutral-subtle,#f8f9fa);
        color: var(--color-base,#202122);
        margin: 1em 0;
        border: 1px solid var(--border-color-base,#a2a9b1);
        border-collapse: collapse
    }

    .wikitable > tr > th,.wikitable > tr > td,.wikitable > * > tr > th,.wikitable > * > tr > td {
        border: 1px solid var(--border-color-base,#a2a9b1);
        padding: 0.2em 0.4em
    }

    .wikitable > tr > th,.wikitable > * > tr > th {
        background-color: var(--background-color-neutral,#eaecf0);
        color: var(--color-base,#202122);
        text-align: center
    }

    .wikitable > caption {
        font-weight: bold
    }

.fmbox {
    clear: both;
    margin: 0.2em 0;
    width: 100%;
    border: 1px solid #aaa;
    background: #f9f9f9;
}

th.mbox-text, td.mbox-text {
    border: none;
    padding: 0.25em 0.9em;
    width: 100%;
}

.mergedtoprow {
    border-top: 1px solid #aaa;
    padding: 0.4em 0.6em 0.2em 0.6em;
}

.mediawiki .mbox-small {
    clear: right;
    float: right;
    margin: 4px 0 4px 1em;
    width: 238px;
    font-size: 88%;
    line-height: 1.25em;
}

.ombox-notice {
    border: 1px solid #aaa;
}

.plainlist {
    line-height: inherit;
    list-style: none none;
    margin: 0;
}

.ombox {
    margin: 4px 10%;
    border-collapse: collapse;
    border: 1px solid #aaa;
    background: #f9f9f9;
}

.ombox-content {
    border: 1px solid #f28500;
}

.mw-content-ltr a, .mw-content-ltr a:visited {
	font-weight:bold;
}

.toc a, .toc a:visited {
    font-weight: normal!important;
}

table.navbox {
    margin-top: 1em;
}
.navbox, .navbox-subgroup {
    background: #fdfdfd;
}
.navbox {
    border: 1px solid #aaa;
    width: 100%;
    margin: auto;
    clear: both;
    font-size: 88%;
    text-align: center;
    padding: 1px;
}
.navbox th, .navbox-title {
    background: #ccccff;
}
.navbox-abovebelow, th.navbox-group, .navbox-subgroup .navbox-title {
    background: #ddddff;
}
.navbox-group, .navbox-title, .navbox-abovebelow {
    padding: 0.25em 1em;
    line-height: 1.5em;
    text-align: center;
}
.navbox .collapseButton {
    width: 6em;
}
.collapseButton {
    float: right;
    font-weight: normal;
    margin-left: 0.5em;
    text-align: right;
    width: auto;
}
.navbox-title .navbar {
    float: left;
    text-align: left;
    margin-right: 0.5em;
    width: 6em;
}
th.navbox-group {
    white-space: nowrap;
    text-align: right;
}
.navbox-odd {
    background: transparent;
}
.navbox-list {
    line-height: 1.5em;
    border-color: #fdfdfd;
}
.navbox .hlist td dl, .navbox .hlist td ol, .navbox .hlist td ul, .navbox td.hlist dl, .navbox td.hlist ol, .navbox td.hlist ul {
    padding: 0.125em 0;
}
.hlist dd, .hlist dt, .hlist li {
    margin: 0;
    display: inline;
}
.hlist dd:after, .hlist li:after {
    content: " · ";
    font-weight: bold;
}
.navbox .hlist td dl, .navbox .hlist td ol, .navbox .hlist td ul, .navbox td.hlist dl, .navbox td.hlist ol, .navbox td.hlist ul {
    padding: 0.125em 0;
}
.hlist.inline, .hlist.inline dl, .hlist.inline ol, .hlist.inline ul, .hlist dl dl, .hlist dl ol, .hlist dl ul, .hlist ol dl, .hlist ol ol, .hlist ol ul, .hlist ul dl, .hlist ul ol, .hlist ul ul {
    display: inline;
}
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before, .hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before, .hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
    content: " (";
    font-weight: normal;
}

@media screen {
    html.skin-theme-clientpref-night {
    }

    html.skin-theme-clientpref-night .hatnote:not(.notheme),html.skin-theme-clientpref-night .dablink:not(.notheme),html.skin-theme-clientpref-night .rellink:not(.notheme),html.skin-theme-clientpref-night .infobox:not(.notheme) {
        color: var(--color-base,#202122) !important;
        background-color: var(--background-color-interactive-subtle,#f8f9fa) !important
    }

    html.skin-theme-clientpref-night .infobox td:not(.notheme),html.skin-theme-clientpref-night .infobox th:not(.notheme),html.skin-theme-clientpref-night .infobox-above:not(.notheme),html.skin-theme-clientpref-night .infobox p:not(.notheme),html.skin-theme-clientpref-night .infobox > div:not(.notheme),html.skin-theme-clientpref-night .infobox caption:not(.notheme),html.skin-theme-clientpref-night .infobox--frwiki td:not(.notheme),html.skin-theme-clientpref-night .infobox--frwiki th:not(.notheme),html.skin-theme-clientpref-night .infobox--frwiki p:not(.notheme),html.skin-theme-clientpref-night .infobox--frwiki > div:not(.notheme),html.skin-theme-clientpref-night .infobox--frwiki caption:not(.notheme),html.skin-theme-clientpref-night .sinottico th:not(.notheme),html.skin-theme-clientpref-night .infobox-header:not(.notheme),html.skin-theme-clientpref-night .skin-nightmode-reset-color:not(.notheme),html.skin-theme-clientpref-night .navigation-box:not(.notheme),html.skin-theme-clientpref-night .metadata:not(.notheme),html.skin-theme-clientpref-night .quotebox:not(.notheme),html.skin-theme-clientpref-night .side-box:not(.notheme),html.skin-theme-clientpref-night .side-box div:not(.notheme),html.skin-theme-clientpref-night .navbox:not(.notheme),html.skin-theme-clientpref-night .navbox-subgroup:not(.notheme),html.skin-theme-clientpref-night .navbox-group:not(.notheme),html.skin-theme-clientpref-night .navbox-even:not(.notheme),html.skin-theme-clientpref-night .navbox-abovebelow:not(.notheme),html.skin-theme-clientpref-night .navbox-title:not(.notheme) {
        background: inherit !important;
        color: inherit !important;
        border-color: var(--border-color-subtle,#c8ccd1) !important
    }

    html.skin-theme-clientpref-night .mw-parser-output [style*='background'] {
        color: #202122
    }

    html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) [bgcolor] a:not(.mw-selflink),html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox)[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a:not(.mw-selflink),html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) th[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a:not(.mw-selflink),html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) td[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a:not(.mw-selflink),html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) tr[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) td a:not(.mw-selflink) {
        color: var(--color-base-fixed,#202122);
        text-decoration: underline
    }

    html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) [bgcolor] a.new,html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox)[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a.new,html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) th[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a.new,html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) td[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a.new,html.skin-theme-clientpref-night body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) tr[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) td a.new {
        text-decoration-style: wavy
    }
}

@media screen and (prefers-color-scheme: dark) {
    html.skin-theme-clientpref-os {
    }

    html.skin-theme-clientpref-os .infobox td:not(.notheme),html.skin-theme-clientpref-os .infobox th:not(.notheme),html.skin-theme-clientpref-os .infobox-above:not(.notheme),html.skin-theme-clientpref-os .infobox p:not(.notheme),html.skin-theme-clientpref-os .infobox > div:not(.notheme),html.skin-theme-clientpref-os .infobox caption:not(.notheme),html.skin-theme-clientpref-os .infobox--frwiki td:not(.notheme),html.skin-theme-clientpref-os .infobox--frwiki th:not(.notheme),html.skin-theme-clientpref-os .infobox--frwiki p:not(.notheme),html.skin-theme-clientpref-os .infobox--frwiki > div:not(.notheme),html.skin-theme-clientpref-os .infobox--frwiki caption:not(.notheme),html.skin-theme-clientpref-os .sinottico th:not(.notheme),html.skin-theme-clientpref-os .infobox-header:not(.notheme),html.skin-theme-clientpref-os .skin-nightmode-reset-color:not(.notheme),html.skin-theme-clientpref-os .navigation-box:not(.notheme),html.skin-theme-clientpref-os .metadata:not(.notheme),html.skin-theme-clientpref-os .quotebox:not(.notheme),html.skin-theme-clientpref-os .side-box:not(.notheme),html.skin-theme-clientpref-os .side-box div:not(.notheme),html.skin-theme-clientpref-os .navbox:not(.notheme),html.skin-theme-clientpref-os .navbox-subgroup:not(.notheme),html.skin-theme-clientpref-os .navbox-group:not(.notheme),html.skin-theme-clientpref-os .navbox-even:not(.notheme),html.skin-theme-clientpref-os .navbox-abovebelow:not(.notheme),html.skin-theme-clientpref-os .navbox-title:not(.notheme) {
        background: inherit !important;
        color: inherit !important;
        border-color: var(--border-color-subtle,#c8ccd1) !important
    }

    html.skin-theme-clientpref-os .hatnote:not(.notheme),html.skin-theme-clientpref-os .dablink:not(.notheme),html.skin-theme-clientpref-os .rellink:not(.notheme),html.skin-theme-clientpref-os .infobox:not(.notheme) {
        color: var(--color-base,#202122) !important;
        background-color: var(--background-color-interactive-subtle,#f8f9fa) !important
    }

    html.skin-theme-clientpref-os .mw-parser-output [style*='background'] {
        color: #202122
    }

    html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) [bgcolor] a:not(.mw-selflink),html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox)[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a:not(.mw-selflink),html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) th[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a:not(.mw-selflink),html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) td[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a:not(.mw-selflink),html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) tr[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) td a:not(.mw-selflink) {
        color: var(--color-base-fixed,#202122);
        text-decoration: underline
    }

    html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) [bgcolor] a.new,html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox)[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a.new,html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) th[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a.new,html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) td[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) a.new,html.skin-theme-clientpref-os body.ns-0:not(.page-Main_Page) .mw-parser-output table:not(.infobox):not(.navbox-inner):not(.navbox) tr[style*="background"]:not([style*="transparent"]):not([style*="inherit"]) td a.new {
        text-decoration-style: wavy
    }
}

@media screen {
    :root,.skin-invert,.notheme {
        --color-base: #202122;
        --color-base-fixed: #202122;
        --color-base--hover: #404244;
        --color-emphasized: #101418;
        --color-subtle: #54595d;
        --color-placeholder: #72777d;
        --color-disabled: #a2a9b1;
        --color-disabled-emphasized: #a2a9b1;
        --color-inverted: #fff;
        --color-inverted-fixed: #fff;
        --color-progressive: #36c;
        --color-progressive--hover: #3056a9;
        --color-progressive--active: #233566;
        --color-progressive--focus: #36c;
        --color-destructive: #bf3c2c;
        --color-destructive--hover: #9f3526;
        --color-destructive--active: #612419;
        --color-destructive--focus: #36c;
        --color-visited: #6a60b0;
        --color-visited--hover: #534fa3;
        --color-visited--active: #353262;
        --color-destructive--visited: #9f5555;
        --color-destructive--visited--hover: #854848;
        --color-destructive--visited--active: #512e2e;
        --color-error: #bf3c2c;
        --color-error--hover: #9f3526;
        --color-error--active: #612419;
        --color-warning: #886425;
        --color-success: #177860;
        --color-notice: #404244;
        --color-icon-error: #f54739;
        --color-icon-warning: #ab7f2a;
        --color-icon-success: #099979;
        --color-icon-notice: #72777d;
        --color-content-added: #006400;
        --color-content-removed: #8b0000;
        --filter-invert-icon: 0;
        --filter-invert-primary-button-icon: 1;
        --box-shadow-color-base: #a2a9b1;
        --box-shadow-color-progressive--active: #233566;
        --box-shadow-color-progressive--focus: #36c;
        --box-shadow-color-progressive-selected: #36c;
        --box-shadow-color-progressive-selected--hover: #3056a9;
        --box-shadow-color-progressive-selected--active: #233566;
        --box-shadow-color-destructive--focus: #36c;
        --box-shadow-color-inverted: #fff;
        --box-shadow-color-alpha-base: rgba(0,0,0,0.06);
        --box-shadow-color-transparent: transparent;
        --mix-blend-mode-base: normal;
        --mix-blend-mode-blend: multiply;
        --background-color-base: #fff;
        --background-color-base-fixed: #fff;
        --background-color-neutral: #eaecf0;
        --background-color-neutral-subtle: #f8f9fa;
        --background-color-interactive: #eaecf0;
        --background-color-interactive--hover: #dadde3;
        --background-color-interactive--active: #c8ccd1;
        --background-color-interactive-subtle: #f8f9fa;
        --background-color-interactive-subtle--hover: #eaecf0;
        --background-color-interactive-subtle--active: #dadde3;
        --background-color-disabled: #dadde3;
        --background-color-disabled-subtle: #eaecf0;
        --background-color-inverted: #101418;
        --background-color-progressive: #36c;
        --background-color-progressive--hover: #3056a9;
        --background-color-progressive--active: #233566;
        --background-color-progressive--focus: #36c;
        --background-color-progressive-subtle: #f1f4fd;
        --background-color-progressive-subtle--hover: #dce3f9;
        --background-color-progressive-subtle--active: #cbd6f6;
        --background-color-destructive: #bf3c2c;
        --background-color-destructive--hover: #9f3526;
        --background-color-destructive--active: #612419;
        --background-color-destructive--focus: #36c;
        --background-color-destructive-subtle: #ffe9e5;
        --background-color-destructive-subtle--hover: #ffdad3;
        --background-color-destructive-subtle--active: #ffc8bd;
        --background-color-error: #f54739;
        --background-color-error--hover: #d74032;
        --background-color-error--active: #bf3c2c;
        --background-color-error-subtle: #ffe9e5;
        --background-color-error-subtle--hover: #ffdad3;
        --background-color-error-subtle--active: #ffc8bd;
        --background-color-warning-subtle: #fdf2d5;
        --background-color-success-subtle: #dff2eb;
        --background-color-notice-subtle: #eaecf0;
        --background-color-content-added: #a3d3ff;
        --background-color-content-removed: #ffe49c;
        --background-color-transparent: transparent;
        --background-color-backdrop-light: rgba(255,255,255,0.65);
        --background-color-backdrop-dark: rgba(0,0,0,0.65);
        --background-color-button-quiet--hover: rgba(0,24,73,0.027);
        --background-color-button-quiet--active: rgba(0,24,73,0.082);
        --background-color-input-binary--checked: #36c;
        --background-color-tab-list-item-framed--hover: rgba(255,255,255,0.3);
        --background-color-tab-list-item-framed--active: rgba(255,255,255,0.65);
        --opacity-icon-base: 0.87;
        --opacity-icon-base--hover: 0.74;
        --opacity-icon-base--selected: 1;
        --opacity-icon-base--disabled: 0.51;
        --opacity-icon-placeholder: 0.51;
        --opacity-icon-subtle: 0.67;
        --border-color-base: #a2a9b1;
        --border-color-emphasized: #202122;
        --border-color-subtle: #c8ccd1;
        --border-color-muted: #dadde3;
        --border-color-interactive: #72777d;
        --border-color-interactive--hover: #27292d;
        --border-color-interactive--active: #202122;
        --border-color-disabled: #c8ccd1;
        --border-color-inverted: #fff;
        --border-color-inverted-fixed: #fff;
        --border-color-progressive: #6485d1;
        --border-color-progressive--hover: #3056a9;
        --border-color-progressive--active: #233566;
        --border-color-progressive--focus: #36c;
        --border-color-destructive: #f54739;
        --border-color-destructive--hover: #9f3526;
        --border-color-destructive--active: #612419;
        --border-color-destructive--focus: #36c;
        --border-color-error: #f54739;
        --border-color-error--hover: #9f3526;
        --border-color-error--active: #612419;
        --border-color-warning: #ab7f2a;
        --border-color-success: #099979;
        --border-color-notice: #72777d;
        --border-color-content-added: #a3d3ff;
        --border-color-content-removed: #ffe49c;
        --border-color-transparent: transparent;
        --border-color-divider: #a2a9b1;
        --outline-color-progressive--focus: #36c;
        --color-link-red: var(--color-destructive);
        --color-link-red--hover: var(--color-destructive--hover);
        --color-link-red--active: var(--color-destructive--active);
        --color-link-red--focus: var(--color-destructive--focus);
        --color-link-red--visited: var(--color-destructive--visited);
        --color-link-red--visited--hover: var(--color-destructive--visited--hover);
        --color-link-red--visited--active: var(--color-destructive--visited--active);
        --accent-color-base: #36c;
        --border-color-input--hover: var(--border-color-interactive);
        --border-color-input-binary: var(--border-color-interactive);
        --border-color-input-binary--hover: var(--border-color-progressive--hover);
        --border-color-input-binary--active: var(--border-color-progressive--active);
        --border-color-input-binary--focus: var(--border-color-progressive--focus);
        --border-color-input-binary--checked: var(--border-color-progressive);
        --color-base--subtle: #54595d
    }

    html.skin-theme-clientpref-night {
        color-scheme: dark;
        --color-base: #eaecf0;
        --color-base--hover: #f8f9fa;
        --color-emphasized: #f8f9fa;
        --color-subtle: #a2a9b1;
        --color-disabled: #54595d;
        --color-disabled-emphasized: #72777d;
        --color-inverted: #101418;
        --color-progressive: #88a3e8;
        --color-progressive--hover: #b0c1f0;
        --color-progressive--active: #cbd6f6;
        --color-destructive: #fd7865;
        --color-destructive--hover: #fea898;
        --color-destructive--active: #ffc8bd;
        --color-visited: #a799cd;
        --color-visited--hover: #c5b9dd;
        --color-visited--active: #d9d0e9;
        --color-destructive--visited: #c99391;
        --color-destructive--visited--hover: #dcb5b3;
        --color-destructive--visited--active: #e8cecd;
        --color-error: #fd7865;
        --color-error--hover: #fea898;
        --color-error--active: #ffc8bd;
        --color-warning: #ca982e;
        --color-success: #2cb491;
        --color-notice: #a2a9b1;
        --color-content-added: #80cdb3;
        --color-content-removed: #fd7865;
        --color-base--subtle: #a2a9b1;
        --box-shadow-color-base: #72777d;
        --box-shadow-color-progressive--focus: #6485d1;
        --box-shadow-color-progressive-selected: #88a3e8;
        --box-shadow-color-progressive-selected--hover: #b0c1f0;
        --box-shadow-color-progressive-selected--active: #cbd6f6;
        --box-shadow-color-destructive--focus: #6485d1;
        --box-shadow-color-inverted: #000;
        --box-shadow-color-alpha-base: rgba(0,0,0,0.87);
        --mix-blend-mode-blend: screen;
        --background-color-base: #101418;
        --background-color-neutral: #27292d;
        --background-color-neutral-subtle: #202122;
        --background-color-interactive: #27292d;
        --background-color-interactive--hover: #404244;
        --background-color-interactive--active: #54595d;
        --background-color-interactive-subtle: #202122;
        --background-color-interactive-subtle--hover: #27292d;
        --background-color-interactive-subtle--active: #404244;
        --background-color-disabled: #404244;
        --background-color-disabled-subtle: #27292d;
        --background-color-inverted: #f8f9fa;
        --background-color-progressive--focus: #6485d1;
        --background-color-progressive-subtle: #1b223d;
        --background-color-progressive-subtle--hover: #233566;
        --background-color-progressive-subtle--active: #3056a9;
        --background-color-destructive--focus: #6485d1;
        --background-color-destructive-subtle: #3c1a13;
        --background-color-destructive-subtle--hover: #612419;
        --background-color-destructive-subtle--active: #9f3526;
        --background-color-error-subtle: #3c1a13;
        --background-color-error-subtle--hover: #612419;
        --background-color-error-subtle--active: #9f3526;
        --background-color-warning-subtle: #2d2212;
        --background-color-success-subtle: #132821;
        --background-color-notice-subtle: #27292d;
        --background-color-content-added: #233566;
        --background-color-content-removed: #453217;
        --background-color-backdrop-light: rgba(0,0,0,0.65);
        --background-color-backdrop-dark: rgba(255,255,255,0.65);
        --border-color-base: #72777d;
        --border-color-emphasized: #eaecf0;
        --border-color-subtle: #54595d;
        --border-color-muted: #404244;
        --border-color-interactive--hover: #a2a9b1;
        --border-color-interactive--active: #c8ccd1;
        --border-color-disabled: #54595d;
        --border-color-inverted: #101418;
        --border-color-progressive--hover: #88a3e8;
        --border-color-progressive--active: #b0c1f0;
        --border-color-progressive--focus: #6485d1;
        --border-color-destructive--hover: #fd7865;
        --border-color-destructive--active: #fea898;
        --border-color-destructive--focus: #6485d1;
        --border-color-error--hover: #fd7865;
        --border-color-error--active: #fea898;
        --border-color-content-added: #233566;
        --border-color-content-removed: #987027
    }