:root:has(.switch.content-bg li:nth-child(1).selected) {
.switch.body-bg-2 {
display: none;
}
&:has(.switch.body-bg-1 li:nth-child(2).selected) {
--background-color: 13, 13, 15;
--text-color: 195, 195, 195;
--light-color-2: 26, 26, 28;
--dark-color-2: 44, 44, 45;
--dark-color-3: 66, 66, 67;
--dark-color-4: var(--dark-color-3);
--warning-text-color: 230, 230, 230;
--rating-info-text-color: 230, 230, 230;
--scrollbar-color: var(--dark-color-3);
--scrollbar-background-color: var(--light-color-2);
--general-medium-text-color: var(--text-color);
--general-dark-text-color: var(--text-color);
--background-top: var(--text-color), 0.2;
--header-text-color: var(--text-color);
--header-text-shadow-color: 0, 0, 0, 0;
--topbar-text-color: var(--text-color);
--topbar-hover-text-color: var(--text-color);
--topbar-hover-border-color: var(--background-color), 0.5;
--topbar-drop-text-color: var(--text-color);
--topbar-drop-hover-text-color: var(--text-color);
--popup-fader-color: 0, 0, 0, 0.5;
--popup-tip-color: var(--text-color);
--sidebar-handle-background-color: var(--light-color-2);
--sidebar-title-shadow-color: 0, 0, 0, 0;
--sidebar-media-background-color: var(--light-color-2), 0.5;
--popup-loading-color: var(--dark-color-3);
}
}
:root:has(.switch.content-bg li:nth-child(2).selected) {
.switch.body-bg-1 {
display: none;
}
#main-content {
background: rgba(var(--background-color), 0.7);
box-sizing: border-box;
padding: 1.5rem 2rem;
@media only screen and (max-width: 540px) {
padding: 1.5rem 1rem;
margin: 0;
}
}
&:has(.switch.body-bg-2 li:not(:nth-child(1)).selected) {
--background-top: var(--theme-color), 0.9;
--background-bottom: var(--theme-color);
}
&:has(.switch.body-bg-2 li:nth-child(2).selected) {
--theme-color: var(--dark-color-1);
}
&:has(.switch.body-bg-2 li:nth-child(3).selected) {
--theme-color: var(--dark-color-3);
}
&:has(.switch.body-bg-2 li:nth-child(4).selected) {
--theme-color: 255, 110, 105;
}
&:has(.switch.body-bg-2 li:nth-child(5).selected) {
--theme-color: 255, 169, 111;
}
&:has(.switch.body-bg-2 li:nth-child(6).selected) {
--theme-color: 255, 221, 136;
}
&:has(.switch.body-bg-2 li:nth-child(7).selected) {
--theme-color: 179, 224, 134;
}
&:has(.switch.body-bg-2 li:nth-child(8).selected) {
--theme-color: 165, 244, 232;
}
&:has(.switch.body-bg-2 li:nth-child(9).selected) {
--theme-color: 147, 161, 245;
}
&:has(.switch.body-bg-2 li:nth-child(10).selected) {
--theme-color: 188, 165, 244;
}
}
:root:has(.switch.accent li:nth-child(2).selected) {
--chain-color: 27, 148, 156;
--link-color: 27, 148, 156;
}
:root:has(.switch.forbidden li:nth-child(2).selected) {
--theme-color: 231, 211, 156;
--background-top: var(--theme-color), 0.8;
--background-bottom: var(--theme-color);
--light-color-2: 205, 181, 127;
--dark-color-1: 76, 70, 55;
--dark-color-2: 138, 125, 81;
--dark-color-3: 76, 70, 55;
&:has(.switch.content-bg li:nth-child(1).selected) {
--background-color: var(--theme-color);
--header-text-color: 234, 227, 206;
}
#extra-div-4 {
background: url(http://vivarium.wdfiles.com/local--files/private%3Aasjasjas/aaa.jpg);
background-repeat: no-repeat;
background-size: auto 100%;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: var(--header-height);
z-index: -5;
mask: linear-gradient(black, transparent);
}
:is(
#header h1 a,
#header-extra-div-1,
#header-extra-div-2,
#header-extra-div-3,
#extra-div-1,
#extra-div-2,
#extra-div-3
) span {
background: url(https://images.unsplash.com/photo-1656055449458-b5da9d3bb8b2);
background-size: auto 100%;
filter: blur(0.03rem);
}
}
.switch .yui-navset {
margin: 0;
}
.switch .yui-navset .yui-nav {
box-shadow: none;
}
.switch .yui-navset .yui-nav :is(li, li.selected) {
flex: 1;
}
.switch .yui-navset .yui-content {
display: none;
}