MediaWiki:Common.css

From Tower Defense Simulator Wiki
Revision as of 16:16, 1 March 2026 by imported>Mentin123
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* IMPORTS */
@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:BalancedComments.css|u:dev:MediaWiki:BalancedCategories.css|u:dev:MediaWiki:BalancedSlider.css|u:dev:MediaWiki:BalancedBloglists.css|u:dev:MediaWiki:MinifiedLeftTabs/code.css|MediaWiki:Colors.css|MediaWiki:SlantedToggles.css|MediaWiki:UpdateLog.css|MediaWiki:MainPage.css|u:alterego:MediaWiki:EgoIcons.css");

@import url('https://fonts.googleapis.com/css?family=Raleway|Source Sans Pro|Open Sans|Roboto');
@import url('https://bin.t7ru.link/fol/unisans/index.css');

/* BASIC CHANGES */
/* Fonts */
body, .category-gallery-item .snippet .text, a.wikia-button, .wikia-single-button a, .wikia-menu-button, input, .button, button, select {
	font-family: Roboto !important;
}

.unisans {
	font-family: UniSans, sans-serif;
}

.mainheader, .mainpageheader, .tableheader, .upgradeheader, .galleryheader, .sectionheader,
h1, h2, h3, h4,
.fandom-community-header__community-name,
.community-page-header-welcome-message,
.community-page-module-section-title,
.community-page-todo-list-module-header,
.community-page-cards-module-header {
	font-family: UniSans !important;
}

/* list styles */
.page-content :is(ul ul ul, ol ul ul, ul ol ul, ol ol ul), #content :is(ul ul ul, ol ul ul, ul ol ul, ol ol ul), #Wall.Thread .message .msg-body :is(ul ul ul, ol ul ul, ul ol ul, ol ol ul) {
	list-style-type: square;
}

.page-content :is(ul ul, ol ul), #Wall.Thread .message .msg-body :is(ul ul, ol ul) {
	list-style-type: circle;
}

.toc ul {
	list-style: none !important;
}

/* Collapsible colors */
.theme-fandomdesktop-light .navbox-header .mw-collapsible-toggle .mw-collapsible-text {
	--theme-link-color: #8AC5F8;
	--theme-link-color--hover: #97CEFC;
}

.theme-fandomdesktop-light .mw-collapsible:has(.mw-collapsible-toggle + .sectionheader) .mw-collapsible-toggle {
	--theme-link-color: #8AC5F8;
	--theme-link-color--hover: #97CEFC;
	--theme-page-text-color: #FFF;
}

/* hr */
hr {
	border: 0;
	height: 2px;
	background: linear-gradient(to right, #0000, black, #0000);
}

.theme-fandomdesktop-dark hr {
	background: linear-gradient(to right, #FFF0, white, #FFF0);
}

/* INFOBOX */
:root {
	--InfoboxBorder: rgba(var(--theme-accent-color--rgb),0.5);
}

.portable-infobox hr {
	background: var(--InfoboxBorder);
}

/* General Styles */
.portable-infobox {
	width: 300px;
	border: 0;
	border-radius: 0;
	--pi-background: var(--BasicBackground);
	--pi-secondary-background: var(--WikiAccentPrimary);
	border-radius: 25px 0 25px;
}

/* Title */
.portable-infobox .pi-title {
	position: relative;
	border-top-left-radius: 25px;
	font-family: UniSans;
	font-weight: normal
}

/* Audio width */
.portable-infobox audio {
	width: 300px !important;
}

/* Infobox item spacing */
.portable-infobox .pi-item-spacing {
	padding: 8px 10px;
}

/* Centered audio */
.pi-item:has(.thumb.mw-halign-center) {
	justify-content: center;
}

/* Infobox tabs */
.portable-infobox .wds-tabs__wrapper:has(.wds-tabs__tab:only-child) {
	display: none;
}

.portable-infobox .wds-tab__content > .pi-data:first-child {
	border-top-width: 0;
}

:is(.portable-infobox .pi-image-collection.wds-tabber, .portable-infobox .pi-panel.wds-tabber) .wds-tabs__wrapper .wds-tabs {
	justify-content: safe center;
}

.portable-infobox :is(.pi-image-collection.wds-tabber, .pi-panel.wds-tabber) > .wds-tabs__wrapper {
	padding: 6px 8px;
	background: var(--WikiAccentSecondary);
	font-family: Source Sans Pro, Raleway, Roboto, sans-serif;
}

.portable-infobox :is(.pi-image-collection.wds-tabber, .pi-panel.wds-tabber) > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab {
	color: #FFF;
	transition: .75s;
}

.portable-infobox :is(.wds-tabs__arrow-right, .wds-tabs__arrow-left) .wds-icon {
	fill: white
}

.portable-infobox :is(.pi-image-collection.wds-tabber, .pi-panel.wds-tabber) > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab:hover {
	background-color: color-mix(in oklch, var(--WikiAccentTertiary), transparent 75%);
	transition: .5s;
}

.portable-infobox :is(.pi-image-collection.wds-tabber, .pi-panel.wds-tabber) > .wds-tabs__wrapper > .wds-tabs > .wds-tabs__tab.wds-is-current {
	background-color: var(--WikiAccentTertiary);
	box-shadow: none;
	transition: .75s;
}

.portable-infobox .pi-panel.wds-tabber .pi-image-collection.wds-tabber > .wds-tabs__wrapper {
	padding-top: 0;
}

.pi-panel:has(.pi-image-thumbnail) + .pi-item {
	border-top-width: 0;
}

/* RIGHT RAIL MODS */
.right-rail-wrapper .rail-module {
	border: 8px solid transparent;
	border-radius: 6px;
	transition: 0.2s ease;
	transition-property: border, background;
}

.right-rail-wrapper > :last-child > .rail-module:last-child {
	border-bottom: 8px solid transparent;
}

	.WikiaRail .rail-module:hover {
		border-color: rgba(211, 211, 211, 0.2) !important;
		background: rgba(211, 211, 211, 0.5);
	}
	
	.theme-fandomdesktop-dark .WikiaRail .rail-module:hover {
		border-color: color-mix(in hsl, var(--BasicBackgroundDark), transparent 0%) !important;
		background: color-mix(in hsl, var(--BasicBackgroundDark), transparent 10%);
	}
	
.recent-images-module {
	.wds-widget-frame {
		background: transparent;
	}
	
	.wds-widget-frame {
		padding: 0;
	}

	.alice-carousel {
		display: flex;
		flex-wrap: wrap;
		gap: 0.25em;

		> div:first-child {
			width: 100%;
		}
	}

	.alice-carousel__prev-btn,
	.alice-carousel__next-btn {
		position: static;
		flex: 1;

		&:empty {
			display: none;
		}
	}

	.alice-carousel__arrow {
		position: static;
		width: 100%;
		transform: none;
	}

	.alice-carousel__prev-btn-item svg { transform: rotate(90deg); }
	.alice-carousel__next-btn-item svg { transform: rotate(-90deg); }

	.wds-widget-frame .alice-carousel__arrow {
		background: var(--BlueThemePrimary);

		&:hover {
			background: var(--BlueThemePrimaryHover);
		}
	}

	.alice-carousel__prev-btn .alice-carousel__arrow {
		border-radius: 25px 0 0;
	}

	.alice-carousel__next-btn .alice-carousel__arrow {
		border-radius: 0 0 25px;
	}

	:is(.alice-carousel:has(.alice-carousel__next-btn:empty) .alice-carousel__prev-btn, .alice-carousel:has(.alice-carousel__prev-btn:empty) .alice-carousel__next-btn) .alice-carousel__arrow {
		border-radius: 25px 0;
	}
}

/* Medal pop up */
.theme-fandomdesktop-dark .badgetooltiparrow {
	border-color: var(--theme-page-background-color) !important;
	border-left-color: transparent !important;
	border-right-color: transparent !important;
}

.theme-fandomdesktop-dark .badgetooltipwindow {
	color: var(--theme-page-text-color) !important;
	border-color: var(--theme-page-background-color) !important;
	background: var(--BasicBackground) !important;
}

.theme-fandomdesktop-dark .badgetooltipwindow hr {
	background: linear-gradient(to right, #0000, black, #0000);
}
	
/* Fandom widget colors */
.wds-widget-frame__header .wds-widget-frame__title {
	--wds-midlight-color: rgba(var(--theme-link-color--rgb),0.1);
	background-image: linear-gradient(to top,var(--wds-midlight-color,rgba(var(--theme-accent-color--rgb),.15)) 54%,#0000 54%,#0000 100%);
	margin-right: -3px;
	padding-right: 3px;
}

.right-rail-wrapper {
	--widget-link-color--hover: var(--theme-link-color--hover);
	--widget-link-color: var(--theme-link-color);
	--fandom-global-nav-panel-background-color: var(--BlueThemePrimary);
	--widget-border-color--light: var(--BlueThemePrimary);
}

/* NAVIGATIONAL HEADERS */
.mainheader {
	font-size: 40px;
}
.mainpageheader {
	font-size: 22px;
	text-align: center;
}
.tableheader {
	font-size: 22px;
	color: #FFF;
	background: var(--PrimaryColour);
	border-radius: 25px 0;
	line-height: 1.5;
}
.upgradeheader {
	font-size: 18px;
}
.galleryheader {
	font-size: 20px;
}
.sectionheader {
	font-size: 20px;
	text-align: center;
	padding: 5px;
	color: var(--TextColour);
	background: var(--PrimaryColour);
	border-top-left-radius: 25px;
}

.mw-collapsible-toggle + .sectionheader {
	border-bottom-right-radius: 25px;
}

.mw-collapsible-toggle-expanded + .sectionheader {
	border-bottom-right-radius: 0;	
}

/* NAVBOX, ABILITY & UPGRADE */
/* Angled NavBox */
.anglednavbox {
	background: var(--PrimaryColour);
	color: #FFF;
	border-top-left-radius: 25px;
}

/* Navbox */
.tds-navbox {
	width: 100%;
	text-align: center;
}
.navbox-header {
	padding: 4px;
	background-color: var(--PrimaryColour);
	text-align: center;
	color: white;
}
.navbox-header .mw-collapsible-toggle {
	--theme-page-text-color: white;
}
.navbox-header {
	position: relative;
	transition: .4s ease;
}
.navbox-header:has(.mw-collapsible-toggle):hover {
	background: var(--PrimaryColourHover);
}
.navbox-header button.mw-collapsible-toggle {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
@media only screen and (max-width:1024px) {
	table.mw-collapsible:has(.navbox-header):last-child {
		margin-bottom: 1px;
	}
}
.navbox-header .mw-collapsible-toggle .mw-collapsible-text {
	float: right;
	margin-right: 5px;
	font-size: 20px;
	transition: .4s ease;
	text-decoration: none !important;
}
.navbox-header:hover .mw-collapsible-toggle .mw-collapsible-text {
	color: var(--theme-link-color--hover)
}
.navbox-header .mw-collapsible-toggle-default::before,
.navbox-header .mw-collapsible-toggle-default::after {
	content: '';
}
.navbox-label-wide,
.navbox-label-narrow {
	padding: 4px;
	background-color: var(--PrimaryColour);
	color: white;
}
:is(.navbox-label-wide, .navbox-label-narrow, .navbox-header) a {
	color: white;
}
.navbox-label-wide {
	width: 20%;
}
.navbox-label-narrow {
	width: 15%;
}
.navbox-data {
	text-align: left;
	color: black
}
.theme-fandomdesktop-dark .navbox-data {
	color: white;
}

/* Upgrades */
.upgrade-header {
	border-top-left-radius: 25px;
	background: var(--PrimaryColour);
	border-bottom: 2px solid var(--BlueThemeSecondary);
	display: flex;
	align-items: center;
	padding: .75em;
	text-align: center;
	position: relative;
	z-index: 2;
}

.upgrade-header-inner {
	flex: 1 1 auto;
	line-height: 1;
}

.upgrade-title {
	font-size: 1.5em;
	font-weight: 900;
	color: white; /* idk if there's any theme that will have issues with this but for now it seems fine in both dark and light mode */
	margin-left: .25em;
}

.upgrade-subtitle {
	font-size: .625em;
	color: white;
	margin-top: .35em;
	font-family: Roboto;
}

.upgrade-subtitle:empty {
	display: none;
}

.upgrade-body {
	display: flex;
	flex-wrap: wrap;
	padding: .5em;
	background-color: var(--BasicBackground);
	position: relative;
	border-radius: 0 0 25px 0;
  --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/f/fe/VoidCasterSpellCast.png/revision/latest?cb=20250301142738);
	
  &::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	width: min(256px,13.5rem);
	aspect-ratio: 1;
	background-image: var(--narrate);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom right;
	opacity: .35;
	pointer-events: none;
	z-index: 1;
	border-bottom-right-radius: 25px;
  }

	&.narrator-150::after {
		width: min(256px,10.5rem);
	}
	
	&.jaxe::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/7/72/JaxeAggressive.png/revision/latest?cb=20211211165943); width: min(256px,12.5rem) }
	&.ajstriker::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/4/42/AJConcern.png/revision/latest?cb=20210508144217) }
	&.necromancer::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/f/f1/NecromancerLevel2.png) }
	&.executioner::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/5/5b/EclipseExecutionerStoreRender.png) }
	&.assassin::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/e/e0/AssassinUpgrade4.png) }
	&.cowboy::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/3/3f/CowboyAdRender.png) }
	&.fireworktech::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/5/54/FireworkTechnicianLevel1.png) }
	&.narrator::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/d/d0/NarratorRender.png) }
	&.group::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/a/a1/MatchmakingRender.png) }
	&.vigilanteelectroshocker::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/7/72/VigilanteElectroshockerRender.png) }
	&.riftwalker::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/2/2f/RiftWalkerEasyRender.png) }
	&.spotlighttech::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/d/d5/SpotlightTechLevel1.png) }
	&.umbra::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/7/7a/UmbraTaunt.png) }
	&.medic::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/4/41/MedicUpg3.png) }
	&.commando::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/d/d5/CommandoLevel2.png) }
	&.toxicgunner::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/3/38/KimGunner.png) }
	&.hacker::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/d/d8/HackerUpgrade3.png) }
	&.freezer::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/0/06/Freezer_Upgrade_3.png) }
	&.rocketeer::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/5/56/RocketeerLevel3.png) }
	&.swarmer::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/4/4d/SwarmerReworkUpgrade3.png) }
	&.harvester::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/c/c5/HarvesterUpgrade3.png) }
	&.cryomancer::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/c/c6/CryomancerLevel3.png) }
	&.biologist::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/f/f5/BiologistUpgradeIcon2.png) }
	&.minigunner::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/a/ab/MiniLevel4.png) }
	&.eclipsecommander::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/a/aa/Eclipse_Commander.png) }
	&.bloxycommander::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/0/08/BloxyRender.png) }
	&.piratewarden::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/a/a8/PirateWardenRender.png) }
	&.nullcommander::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/1/1d/NullCommanderHardMatchmakingRender.png) }
	&.brute::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/a/aa/MatchmakingBruteRender.png) }
	&.gravedigger::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/1/11/MatchmakingGraveDiggerRender.png) }
	&.patientzero::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/1/1b/PatientZeroIntermediateMatchmakingRender.png) }
	&.moltenwarlord::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/c/cb/MoltenWardlordMatchmakingRender.png) }
	&.fallenking::after { --narrate: url(https://static.wikia.nocookie.net/tower-defense-sim/images/3/3f/MatchmakingFallenKingRender.png) }
	&.hide::after { --narrate:  }
}

.upgrade-body-has-image {
	gap: 0.5em;
}

.upgrade-info-wrapper {
	flex: 1 1 0%;
	display: flex;
	z-index: 2;
}


.upgrade-info-content {
	width: 100%;
	margin-bottom: 0;
	background: var(--BlueThemePrimary);
	padding: 0.5em;
	border: 3px solid var(--BlueThemeSecondary);
	border-radius: 25px 0;
	text-align: center;
	align-content: center;

	.mw-collapsible-toggle {
		line-height: 1.35;
	}

	p, span {
		font-size: .85em;
	}

	p {
		margin-top: 0;
		margin-bottom: 0;

		+ p {
			margin-top: 0;
		}
	}
	.upgrade-list {
		border-width: 0;
		background: transparent;
		display: flex;
		flex-wrap: wrap;
		border-radius: 0;
		gap: 10px;
	}
	.upgrade-list > div {
		flex: 1 1;
		padding: 5px;
		min-width: 190px;
		background: var(--BlueThemePrimary);
		border: 2px solid var(--BlueThemeSecondary);
		align-content: center;
		border-radius: 25px 0;
		font-size: 0.85em;
		line-height: 20px;
	}
}

.upgrade-image-wrapper {
	border: 3px solid var(--BlueThemeSecondary);
	overflow: hidden;
	border-radius: 1em;
	background: var(--BlueThemePrimary);
	height: fit-content;
	z-index: 2;
}


/* Styles for things that use "box" */
.box-content.DYKbox {
	padding: 10px;
	line-height: 1.25;
}
.DYKbox {
	z-index: 3;
}
.DYKbox-table {
	position: relative;
}
.DYKbox-image {
	position: absolute;
	top: 0;
	right: 0;
	opacity: 0.2;
	z-index: 2;
	pointer-events: none;
	mask-image: linear-gradient(to top, transparent 13%, black);
}

/* Boxes */
div.box {
	display: flow-root;
}

.box hr {
	background: var(--PrimaryColour);
}

.angled-header {
	line-height: 30px !important;
	text-align: center;
	font: 22px source sans pro;
	color: #FFF;
	background: var(--PrimaryColour);
	border-top-left-radius: 25px;
	padding: 1px;
}

.box-content {
	color: var(--theme-page-text-color);
	text-align: center;
	padding: 1px;
	border: 4px ridge var(--PrimaryColour);
	border-right-style: groove;
	border-bottom-style: groove;
}

.box-list, .box-ability {
	width: 100%;
	max-width: 700px;
	margin: 0 auto;
	padding: 5px;
	line-height: 20px;
	display: flex;
	flex-wrap: wrap;
}

.box-list > div {
	width: 50%;
	padding: 5px;
}

.box-list > div:nth-child(odd):last-child {
	width: 100%;
}

.box-ability div {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 5px;
}

.box-ability > div:nth-child(odd) {
	width: 125px;
}

.box-ability > div:nth-child(even) {
	width: calc(100% - 125px);
}

/* Pseudo 3d */
.pseudo-3d-viewport {
	position: relative;
	left: 1.5em;
	cursor: ew-resize;
	width: 270px;
	height: 270px;
  overflow: hidden;
	
	img {
		width: 2400%;
		height: 100%;
	}
}

.pi-item:has(> .pi-data-value > .pseudo-3d-viewport) {
	position: relative;
	padding: 0;
	background:
		url('https://static.wikia.nocookie.net/roblox/images/1/13/DefaultSkybox2021.png/revision/latest?cb=20250114020329&format=webp')
		center / cover;

	&::after {
		content: 'Drag Image To Rotate';
		position: absolute;
		bottom: 0;
		right: 0;
		margin: .5em;
		color: white;
		background: oklch(0 0 0 / 40%);
		padding: .2em 1.25em;
		border-radius: 25px 0;
		pointer-events: none;
		transition: opacity .25s;
		font-size: .85em;
	}
}

.pi-item:has(> .pi-data-value > .pseudo-3d-viewport:hover)::after {
	opacity: 0;
}


/* TABLE OF CONTENTS */
.toc {
	border: 2px solid var(--BlueThemeSecondary);
	border-radius: 25px 0 25px;
	margin: 10px auto 10px 0;
}

.sticky-toc.toc {
	border: 2px solid var(--BlueThemeSecondary);
	background: var(--BasicBackground);
}

.sticky-toc.toc .toctitle .wds-icon {
	fill: var(--BlueThemeSecondary);
	opacity: 1;
}

.toc .toctitle {
	background: var(--BlueThemePrimary);
	border-bottom: 2px solid var(--BlueThemeSecondary);
	border-top-left-radius: 23px;
}

.toc .toctogglecheckbox:checked + .toctitle {
	border-bottom-right-radius: 23px;
}

.sticky-toc .toctitle {
	border-top-left-radius: 0;
}

.toctogglecheckbox:checked~.toctitle {
	border-bottom: none;
}

.toc ul, .sticky-toc.toc > ul:before, .sticky-toc.toc > ul:after {
	background-color: var(--BasicBackground);
}

.toc > ul {
	border-bottom-right-radius: 23px;
}

.toc ul li a:hover {
	background-color:var(--BasicBackgroundDark)
}

.toctogglecheckbox:checked + .toctitle .toctogglelabel:after {
	content:'▼'
}

.toctogglecheckbox:not(:checked) + .toctitle .toctogglelabel:after {
	content:'▲'
}

.toctogglelabel {
	background: var(--BlueThemeSecondary);
	padding: 3px 4px;
	border-radius: 5px;
	color: white !important;
	transition: .3s !important;
}

.toctogglelabel:hover {
	background: var(--BlueThemeSecondaryHover);
}

.toctogglespan::before,
.toctogglespan::after {
	content: "";
}

.toctogglecheckbox:focus + .toctitle .toctogglelabel {
	text-decoration: none;
	outline: none;
}

/* right aligned table of contents */
.right-toc #toc {
	float: right;
	margin-left: 12px;
}

/* scrollable table of contents */
.scroll-toc > #toc > ul {
	max-height: var(--toc-max-height);
	overflow: auto;
}

.scroll-toc .toc, .scroll-toc .toc .toctogglecheckbox:checked + .toctitle {
	border-bottom-right-radius: 0;
}

/* sticky table of contents only */
.shadow-toc .toc {
	display: none;
}

/* CHALLENGE MAP BOXES */
.challenge-box {
	display: flex;
	width: 750px;
	margin: 0 auto;
	align-items: center;
}

.challenge-box a {
	color: #FFF;
}

.challenge-info {
	width: 500px;
	background: var(--BasicBackground);
	border-radius: 25px 10px 25px;
	margin: 0 auto;
}

.challenge-description {
	padding: 5px;
	text-align: center;
}

.challenge-header {
	padding: 2px 4px;
	font-size: 22px;
	background: var(--PrimaryColour);
	text-align: center;
	color: #FFF;
	border-top-left-radius: 25px;
}

.reward-row {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.reward-box {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	position: relative;
	width: 100px;
	height: 100px;
	margin: 5px;
	font-size: 18px;
	font-weight: bold;
	background: var(--BasicBackgroundDark);
	border-radius: 15px 5px 15px;;
	z-index: 1;
	text-shadow: 0 0 1.5px black, 0 0 1.5px black, 0 0 1.5px black, 0 0 1.5px black, 0 0 1.5px black;
	color: #FFF;
}

.reward-box a {
	color: #FFF;
}

.reward-box img {
	position: absolute;
	left: 5px;
	top: 5px;
	z-index: -1;
}

.season-box .reward-row.text-row .reward-box, .playtime-box .reward-row.text-row .reward-box, .reward-row.text-row .reward-box {
	height: auto;
	display: grid;
	align-items: center;
	padding: 5px;
}

.reward-row.text-row img {
	position: initial
}

.challenge-map {
	margin: auto;
}

.challenge-map img {
	border-radius: 25px;
}

@media only screen and (max-width:876px) {
	.challenge-box {
		flex-direction: column-reverse;
		width: 500px;
	}
	.challenge-info {
		margin-top: 10px;
	}
}

/* INFORMATION BOXES */
.information-row {
	display: flex;
}

.row-image {
	display: flex;
	align-items: center;
	background: var(--BasicBackgroundDark);
	border-radius: 15px 5px 15px;
	margin: 5px;
}

.information-box .reward-box {
	width: 125px;
	height: 125px;
	background: transparent;
	margin: 0;
}

.row-info {
	width: calc(100% - 135px);
	margin: 5px;
	font-size: 16px;
	background: var(--BasicBackgroundDark);
	border-radius: 15px 5px 15px;
}

.info-box-text {
	height: 125px;
	overflow: auto;
	border-radius: 15px 5px 15px;
}

/* ROBLOX CONTAINERS */
.roblox-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.roblox-box {
	margin: 2px 8px;
	width: 175px;
}

.roblox-image {
	background: var(--BasicBackground);
	width: 175px;
	border-radius: 8px;
}

.roblox-image img {
	border-radius: 8px;
}

.roblox-info {
	text-align: center;
	width: 175px;
	font-weight: bold;
}

/* SCROLLBOX */
.desktop-scroll-box, .scroll-box {
	overflow: auto;
	width: 100%;
	height: 400px;
	border: 1px solid var(--BasicBackgroundDark);
	padding: 0.5em;
	margin: 3px 0;
	scrollbar-width: thin;
	resize: vertical;
}

:is(.scroll-box, .desktop-scroll-box) h3 {
	margin-top: 0;
}

/* TABLES */
/* Styles for the mode debut templates */
.succession-table {
	width: 90%;
	max-width: 950px;
	text-align: center;
	color: var(--theme-page-text-color);
	margin: 0 auto;
	border-width: 8px 1px 1px 1px;
	border-style: solid;
	border-collapse: collapse;
}
.succession-table.no-top-border {
	border-top-width: 1px;
}

.succession-table :is(th, td) {
	padding: 5px;
	text-align: center;
	width: 33%;
	border: 1px solid var(--theme-border-color);
}

.succession-table th {
	padding: 8px;
	background-color: var(--theme-page-background-color--secondary);
}

.debut-big {
	font-size: 20px;
}

.debut-small {
	font-size: 12px;
}

/* Wiki themed table */
.tds-table {
	border: 2px solid color-mix(in hsl, var(--PrimaryColour), white 20%);
	border-collapse: collapse;
}

.tds-table th {
	background: var(--PrimaryColour);
	color: white;
}

.tds-table :is(th, td) {
	border: 2px solid color-mix(in hsl, var(--PrimaryColour), white 20%);
	padding: 5px;
}

/* wikitable styling */
.wikitable, .succession-table {
	--theme-border-color: color-mix(in hsl, var(--BlueThemePrimary), black 35%);
	--theme-page-background-color--secondary: var(--BlueThemePrimary);
	--theme-page-background-color: transparent;
}

.theme-fandomdesktop-dark :is(.wikitable, .succession-table) {
	--theme-border-color: var(--BlueThemeSecondary);	
	--theme-page-background-color--secondary: var(--BlueThemePrimary);
}

/* article-table and other similar table color styling */
.article-table, .gallery-table, .gallery-table-title {
	 background: color-mix(in oklch, var(--PrimaryColour), transparent 95%);
	 --theme-border-color: color-mix(in oklch, var(--PrimaryColour), transparent 65%) !important;
}

:is(.article-table, .gallery-table, .gallery-table-title) th {
	 background: color-mix(in oklch, var(--PrimaryColour), transparent 75%);
}

/* Gallery table */
table:is(.gallery-table, .gallery-table-title)  {
	border-collapse: collapse;
	border: 1px solid var(--theme-border-color);
	text-align: center;
}

table.gallery-table, .table-wide-inner:has(.gallery-table) {
	margin: 0 auto;
	width: 95%;
}

.table-wide:has(.gallery-table):before {
	right: 2.5%;
}

.overflowbugytable.gallery-table:last-of-type {
	margin: 0 auto 1em;
}

table.gallery-table-title {
	margin: 1em auto;
	width: 200px;
}

.gallery-table :is(th, td), .gallery-table-title th {
	border: 1px solid var(--theme-border-color);
	padding: 5px;
}

/* Skin gallery hr */
hr.gallery-hr {
	background: linear-gradient(to right,#0000, color-mix(in oklch, var(--PrimaryColour), transparent 65%) , #0000);
}

/* Table utilities */
.stats-table {
	margin: 1em auto;
	text-align: center;
	width: max-content;
}

.stats-table :is(td, th) {
	padding: 5px 15px !important;
}

.pad-5 :is(td, th),
.pad-td-5 td,
.pad-th-5 th {
	padding: 5px !important;
}

.pad-10 :is(td, th),
.pad-td-10 td,
.pad-th-10 th {
	padding: 10px !important;
}

.overflow-box, .overflowbugy {
	max-width: 100%;
	overflow: auto;
}

/* Table Yes/No/Neutral */
.yes-table {
	background: green;
	color: #FFF;
}

.no-table {
	background: #D60000;
	color: #FFF;
}

.neutral-table {
	background: #F09B00;
	color: #FFF;
}

/* Link colors */
:is(.yes-table, .neutral-table, .no-table) a {
	color: var(--WikiLinkDark);
}

:is(.yes-table, .neutral-table, .no-table) a:hover {
	color: var(--WikiLinkDarkHover);
}

/* Border collapse */
.empty-table, .light-table {
	border-collapse: collapse;
}

/* TOP PAGE TEMPLATES */
/* Tabs styles */
.tds-tab-container {
	display: flex;
	justify-content: safe center;
	overflow-x: auto;
}

.tds-tab-container :is(strong, a) {
	font-size: 18px;
	font-weight: bold;
	color: var(--theme-page-text-color)
}

.tds-tab-container a {
	 text-decoration: none;
	
	&:hover span {
		text-decoration: underline;
	}
}

.tds-tab {
	background: var(--BlueThemePrimary);
	padding: 6px 24px;
	border-top: 2px solid var(--BlueThemeSecondary);
	border-bottom: 2px solid var(--BlueThemeSecondary);
	transition: .5s;
	display: flex;
	white-space: nowrap;
	align-items: flex-start;
}

a:not(.new) .tds-tab:hover {
	color: var(--theme-link-color);
	background: var(--BlueThemePrimaryHover);
	border-color: var(--BlueThemeSecondaryHover);
	transition: .5s;
}

.mw-selflink .tds-tab {
	color: var(--theme-link-color);
	background: var(--BlueThemePrimaryActive);
	border-color: var(--BlueThemeSecondaryActive) !important;
	pointer-events: none;
}

:is(a, span).new .tds-tab {
	background: var(--RedThemePrimary);
	border-color: var(--RedThemeSecondary) !important;
}

:is(a, span).new .tds-tab:hover {
	background: var(--RedThemePrimaryHover);
	border-color: var(--RedThemeSecondaryHover) !important;
}

.tds-tab-container :is(strong, a):first-child .tds-tab {
	border-top-left-radius: 25px;
	border-left: 2px solid var(--BlueThemeSecondary);
}

.tds-tab-container :is(strong, a):last-child .tds-tab {
	border-bottom-right-radius: 25px;
	border-right: 2px solid var(--BlueThemeSecondary);
}

.tds-tab-container :is(strong, a):first-child {
	border-top-left-radius: 25px;
}

.tds-tab-container :is(strong, a):last-child {
	border-bottom-right-radius: 25px;
}

/* Type selector */
.tower-type {
	display: flex;
	justify-content: safe center;
	margin-bottom: 5px;
}

.tower-type :is(a, strong) {
	color: var(--theme-page-text-color);
	font-size: 12px;
	font-weight: bold;
	padding: 3px 10px;
	transition: .5s;
}


.tower-type :is(a, strong):first-child {
	background: var(--BlueThemePrimary);
	border: 1px solid var(--BlueThemeSecondary);
	border-right: 0;
	border-top-left-radius: 18px;
}

.tower-type a:hover:first-child {
	background: var(--BlueThemePrimaryHover);
	border-color: var(--BlueThemeSecondaryHover);
	transition: .5s;
}

.tower-type :is(a, strong):last-child {
	background: var(--YellowThemePrimary);
	border: 1px solid var(--YellowThemeSecondary);
	border-left: 0;
	border-bottom-right-radius: 18px;
}

.tower-type a:hover:last-child {
	background: var(--YellowThemePrimaryHover);
	border-color: var(--YellowThemeSecondaryHover);
	transition: .5s;
}

.tower-type strong:first-child {
	background: var(--BlueThemePrimaryActive);
	border-color: var(--BlueThemeSecondaryActive);
}

.tower-type strong:last-child {
	color: #613F1B;
	background: var(--YellowThemePrimaryActive);
	border-color: var(--YellowThemeSecondaryActive);
}

.theme-fandomdesktop-dark .tower-type strong:last-child {
	color: #F1D1AC;
}

/* Tab icons */
.tab-icon {
	font-size: 26px;
	margin-right: 10px;
}

/* Styles for Template:Quote */
.quote-container {
	width: fit-content;
	min-width: 350px;
	max-width: 474px;
}

.quote-container .wds-tabber {
	overflow: visible;
}

.quote-container .wds-tabs__wrapper {
	overflow: hidden;
}

.quote-container:has(.wds-tabs) {
	max-width: 100%;
}

.quote-container:has(.wds-tabs) .wds-tab__content {
	width:fit-content;
	min-width:350px;
	max-width:450px
}

.quote {
	position: relative;
	display: flow-root;
	background-color: var(--BlueThemePrimary);
	border: 2px solid var(--BlueThemeSecondary);
	padding: 3px 5px 3px 0;
	border-radius: 25px 0 25px;
	z-index: 0;
	margin-bottom: 10px;
	word-break: break-word;
}
.quote dd {
	margin-right: 24px;
}
.quote-image {
	 position: absolute;
	 left: 5px;
	 top: 5px;
	 z-index: -1;
}
.theme-fandomdesktop-dark .quote-image {
	opacity: 0.25;
}

.tabber .quote:last-of-type {
	margin-bottom: 0px;
}

/* Notice template theming */
.notice {
	background: var(--BlueThemePrimary);
	border-left: 9px solid var(--theme-accent-color);
	width: 90%;
	margin: 5px auto;
	padding: 3px 8px;
}

.notice .notice-collapsible .mw-collapsible-toggle {
	display: none;
}

.notice .notice-collapsible .mw-collapsible-content {
	display: block !important;
}

.section-notice {
	width: fit-content;
	border-left-width: 6px;
	margin: 4px auto;
	padding: 2px 4px;
	font-size: 15px;
}

/* Top template bubbles */
.bubble-box {
	background: var(--BlueThemePrimary);
	border: 2px solid var(--BlueThemeSecondary);
	border-radius: 25px 0 25px;
	text-align: center;
	padding: 0.5em;
	margin-bottom: 5px !important;
	line-height: 1.5;
}

/* Bubbles & notices */
.notice hr {
	background: var(--BlueThemeSecondary);
}
hr.themed-hr {
	background: var(--BlueThemePrimary);
}

/* DEV TABBER */
.dev-tabber.wds-tabber {
	overflow: initial;
}

.dev-tabber .wds-tabs__wrapper {
	display: flex;
	flex-wrap: wrap;
	border-bottom: 0;
}

.dev-tabber .wds-tabs__tab {
	background: var(--WikiAccentPrimary);
	margin: 4px;
	border-radius: 5px;
	transition: background 0.75s;
}

.dev-tabber .wds-tabs__tab:hover {
	background: var(--WikiAccentSecondary);
}

.dev-tabber .wds-tabs__tab.wds-is-current {
	background: var(--WikiAccentTertiary);
	color: #FFF;
	box-shadow: none;
	transition: background 0.75s;
	cursor: default;
}

.dev-tabber .wds-tabs__tab-label {
	margin: 0 6px;
	height: 30px;
	color: #F2F2F2;
}

.dev-tabber .wds-tabs__tab.wds-is-current > .wds-tabs__tab-label a {
	cursor: default;
}

/* Double tabber border */
.dev-tabber .wds-tab__content > .wds-tabber > .wds-tabs__wrapper {
	border-top:1px solid var(--WikiAccentSecondary);
}

/* Last paragraph no longer has a margin below it + exceptions */
.dev-tabber .wds-tab__content p:last-child {
	margin-bottom: 0;
}

.dev-tabber .wds-tab__content .box-content p:last-child {
	margin-bottom: 24px;
}

/* fix for a very specific issue on the soundtrack page */
.dev-tabber .wds-tab__content pre:first-child:has(.video) {
	background: transparent;
	border-width: 0;
	padding: 0;
	white-space: collapse;
}

/* Tabber style for regular/golden/platinum tower history and rof bug pages | Colored links for skins */
.tower-tabber .wds-tabs__tab.wds-is-current[data-hash*="Golden"] {
	color: #8C8C04;
}

.tower-tabber .wds-tabs__tab.wds-is-current[data-hash*="Platinum"] {
	color: #4CA194;
}

.theme-fandomdesktop-dark :is(.tower-tabber .wds-tabs__tab.wds-is-current[data-hash*="Golden"]) {
	color: #FFFF00;
}

.theme-fandomdesktop-dark .tower-tabber .wds-tabs__tab.wds-is-current[data-hash*="Platinum"] {
	color: #BDFBF2;
}

/* CONTAINERCOLUMN */
.ContainerColumn {
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	margin: 0 0 10px;
	padding: 0;
	overflow: hidden;
	border-bottom-right-radius: 25px;
}
.theme-fandomdesktop-dark .ContainerColumn {
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

/* BASIC BACKGROUND */
.BasicBackground {
	background: var(--BasicBackground);
	border-left: 8px solid var(--theme-accent-color);
	margin-bottom: 8px;
	padding: 6px;
	border-top-right-radius: 25px;
}

/* tabs */
.BasicBackground .dev-tabber .wds-tabs__tab .wds-tabs__tab-label {
	color: var(--theme-page-text-color);
}

.BasicBackground .dev-tabber .wds-tabs__tab {
	background: color-mix(in hsl, var(--BasicBackgroundDark), black 5%);
}

.BasicBackground .dev-tabber .wds-tabs__tab:hover {
	background: color-mix(in hsl, var(--BasicBackgroundDark), black 10%);
}

.BasicBackground .dev-tabber .wds-tabs__tab.wds-is-current {
	background: color-mix(in hsl, var(--BasicBackgroundDark), black 15%);
}

.theme-fandomdesktop-dark .BasicBackground .dev-tabber .wds-tabs__tab {
	background: color-mix(in hsl, var(--BasicBackgroundDark), white 5%);
}

.theme-fandomdesktop-dark .BasicBackground .dev-tabber .wds-tabs__tab:hover {
	background: color-mix(in hsl, var(--BasicBackgroundDark), white 10%);
}

.theme-fandomdesktop-dark .BasicBackground .dev-tabber .wds-tabs__tab.wds-is-current {
	background: color-mix(in hsl, var(--BasicBackgroundDark), white 15%);
}

/* Colors for policy pages */
.BasicBackground.Green {
	border-left-color: #00FF44;
}
.BasicBackground.Orange {
	border-left-color: #FF9D00;
}
.BasicBackground.Red {
	border-left-color: #870000;
}

/* ACHIEVEMENT BOX */
.achievement-box {
	background: var(--BasicBackground);
	padding: 5px 5px 5px 10px;
	margin: 4px auto;
	border-radius: 3px;
	border-top-right-radius: 25px;
	border-left: 6px solid var(--BasicBackgroundDark);
	display: flow-root;
}

/* PROFILE PAGE */
/* Profile page tabs */
#userProfileApp .user-profile-navigation {
	border-bottom: 0;
}

body.skin-fandomdesktop #userProfileApp .user-profile-navigation__link {
	padding: 0px;
	flex: auto;
	text-align: center;
	background: var(--BlueThemePrimary);
	transition: .35s;
	opacity: 0.75;
}

body.skin-fandomdesktop #userProfileApp .user-profile-navigation__link.is-active {
	border-bottom: 0;
	opacity: 1;
}

body.skin-fandomdesktop #userProfileApp .user-profile-navigation__link:not(.is-active):hover {
	opacity: 0.95;
}

body.skin-fandomdesktop #userProfileApp .user-profile-navigation__link a {
	display: block;
	padding: 12px;
	text-transform: uppercase;
	font-weight: 700;
	text-decoration: none;
}

#userProfileApp .user-profile-navigation__link.is-active a {
	color: inherit;
}

/* Edit profile button */
#userProfileApp .wds-button.wds-is-secondary {
	border: 0;
	background: var(--BlueThemePrimary);
	padding: 10px 18px;
}

/* Tag colors on mastheads */
.theme-fandomdesktop-light .tag-wiki_contributor {
	background-color: #68C8B7 !important;
}

.theme-fandomdesktop-dark .tag-wiki_contributor {
	background-color: #02705C !important;
}

.theme-fandomdesktop-light .tag-contributor_of_the_week {
	background-color: #F1C40F !important;
}

.theme-fandomdesktop-dark .tag-contributor_of_the_week {
	background-color: #8F7304 !important;
}

#userProfileApp .user-identity-header__tag {
	background: var(--BlueThemePrimary);
}

/* TOP NAVIGATION */
.fandom-community-header__local-navigation .wds-dropdown__content .wds-list.wds-is-linked > li > a > svg:not(.navigation-item-icon) {
	fill: var(--BlueThemeSecondary);
}

.fandom-community-header__local-navigation .wds-dropdown__content {
	border-radius: 25px 0 25px;
}

.fandom-community-header__local-navigation .wds-dropdown__content:has(.wds-dropdown-level-nested) {
	border-bottom-right-radius: 0px;
}

.wds-dropdown__content .wds-list.wds-is-linked .wds-dropdown-level-nested .wds-dropdown-level-nested__content:not(:has(li.wds-dropdown-level-nested)) {
	border-radius: 0 0 25px;
}

.fandom-community-header__local-navigation .wds-dropdown__content > .wds-list.wds-is-linked > li:first-child > a:not(.wds-button) {
	border-top-left-radius: 15px;
}

.fandom-community-header__local-navigation .wds-dropdown__content > .wds-list.wds-is-linked > li:last-child > a:not(.wds-button) {
	border-bottom-right-radius: 15px;
}

.fandom-community-header__local-navigation .wds-dropdown__content:has(.wds-dropdown-level-nested) > .wds-list.wds-is-linked > li:last-child > a:not(.wds-button) {
	border-bottom-right-radius: 0;
}

.wds-dropdown-level-nested__content > .wds-list.wds-is-linked > li:last-child > a:not(.wds-button) {
	border-bottom-right-radius: 15px;
}

.wds-dropdown-level-nested__content:has(.wds-dropdown-level-nested) > .wds-list.wds-is-linked > li:last-child > a:not(.wds-button) {
	border-bottom-right-radius: 0;
}

/* SMALL CHANGES/FIXES */
/* pre in comments */
.entity-content pre code {
	background-color: var(--BasicBackgroundDark) !important;
}

/* Read more button */
.entity-content .read-more {
	background: var(--BasicBackground) !important;
	transition: .3s !important;
}

.entity-content .read-more:hover {
	background: var(--BasicBackgroundDark) !important;
}

/* CSS background */
.mw-content-ltr.mw-highlight-lines pre {
	box-shadow: inset 2.75em 0 0 var(--BasicBackgroundDark);
}

/* Fix for shadows */
.page-content {
	overflow-x: visible;
}

/* Link preview */
.npage-preview div {
	text-align: left
}

.npage-preview {
	animation: preview .2s linear;
}

@keyframes preview {
	0% { opacity: 0; transform: translateY(15px) }
	100% { opacity: 1; transform: translateY(0) }
}

.npage-preview {
	border-width: 2px;
	border-color: var(--BlueThemeSecondary);
	background: var(--BasicBackground);
	border-radius: 25px 0 25px;
}

.theme-fandomdesktop-dark .npage-preview {
	background: var(--BlueThemePrimary);
}

/* Search adjustments */
.page-content .unified-search__community__content {
	background: var(--BasicBackground)
}

.paginator-page {
	transition: .3s;
}

.paginator-page:hover {
	background-color: rgba(var(--theme-accent-color--rgb), 0.3);
}

/* Category adjustments */
.theme-fandomdesktop-light #content .category-page__trending-page-title {
	background: color-mix(in hsl, var(--PrimaryColour), transparent 40%);
}

.theme-fandomdesktop-light #content .category-page__trending-page-title:hover {
	background: color-mix(in hsl, var(--PrimaryColour), transparent 75%);
}

.theme-fandomdesktop-dark #content .category-page__trending-page-title {
	background: color-mix(in hsl,var(--PrimaryColour), transparent 50%);
}

.theme-fandomdesktop-dark #content .category-page__trending-page-title:hover {
	background: color-mix(in hsl,var(--PrimaryColour), transparent 75%);
}

#content .category-page__alphabet-shortcut:after {
	color: var(--theme-page-text-color);
}

#content .category-page__alphabet-shortcut.is-active a {
	padding: 0px 5px;
	border-radius: 3px;
}

/* Slightly improved look for interactive maps */
.interactive-maps-container {
	background: var(--BasicBackgroundDark);
	border-color: var(--BasicBackground);
	--transcluded-map-width: auto; /* Fix for interactive maps not shrinking when infobox would move it down */
}

.interactive-maps .leaflet-container,
.interactive-map-editor .leaflet-container {
	background-color: var(--BasicBackground);
}

.EmptyPreview-module_emptyPreview__KGs4b {
	background: color-mix(in oklch, var(--PrimaryColour), black 55%) !important;
}

.mw-content-ltr.mw-parser-output .interactive-maps-container + p {
	display: none;
}

/* Page history */
.theme-fandomdesktop-dark #pagehistory li.selected {
	outline: 1px dashed color-mix(in hsl, var(--BasicBackground), white 30%);
}

/* Image thumb info icon */
.thumb.show-info-icon .info-icon {
	background-color: color-mix(in hsl, var(--BlueThemePrimary), transparent 40%);
}

/* Lightbox */
.blackout {
	background: color-mix(in oklch, var(--PrimaryColour), black 55%);
}

/* Community page card design change */
.community-page-cards-module .community-page-card-module {
	border-radius: 25px 0 25px;
}

.community-page-cards-module .community-page-card-module .community-page-card-module-header {
	background: var(--PrimaryColour);
	border-top-left-radius: 25px;
}

/* Fix for not all tabs appearing in preview while source editing */
.ve-ui-overlay-global .wds-tabs {
	display: flex;
	flex-wrap: wrap;
}

/* msupload file upload text color fix */
#msupload-list .file .file-warning {
	color: var(--theme-page-text-color);
}

#msupload-div a {
	color: var(--theme-link-color);
}

/* Font weight for wiki name */
.fandom-community-header__community-name {
	font-weight: 700 !important;
}

/* Nicer broken icons for dark mode */
.theme-fandomdesktop-dark img[src*="NoProductIcon.png"] {
  filter: invert(0.65)
}

/* UTILITY CLASSES */
/*Aligns text and files for both desktop and mobile*/
.align-center {
	text-align: center;
}
img.align-center {
	margin: 0 auto;
}
.align-center th, .article-table th.align-center {
	text-align: center !important;
}

.align-right {
	text-align: right;
}
.align-right th, .article-table th.align-right {
	text-align: right !important;
}

/* Image visibility */
.theme-fandomdesktop-light .invertimage-light,
.theme-fandomdesktop-dark .invertimage {
	filter:invert(1);
}

/* Image shadows */
.theme-fandomdesktop-light :is(.image-shadow, .image-shadow-light) img, .theme-fandomdesktop-light img:is(.image-shadow, .image-shadow-light) {
	filter: drop-shadow(0 0 0.075rem #000);
}

.theme-fandomdesktop-dark :is(.image-shadow, .image-shadow-dark) img, .theme-fandomdesktop-dark img:is(.image-shadow, .image-shadow-dark) {
	filter: drop-shadow(0 0 0.075rem #FFF);
}

/* Prevents parts of the page from appearing on desktop */
.mobile-only, .link-preview {
	display: none;
}

/* link preview text */
p:has(.link-preview:only-child) {
	margin: 0;	
}

/* Hoverimage */
.hoverimage img {
	opacity: .8;
	transition: opacity .2s ease-in-out;
}
 
.hoverimage img:hover {
	opacity: 1;
}

/* Stretched tabbers */
.tabber-stretch .dev-tabber .wds-tabs__tab-label a {
	color: #FFF;
	font-weight: 700;
	font-size: 16px;
}

.tabber-stretch .dev-tabber .wds-tabs__tab-label a:hover {
	color: #FFF;
}

.tabber-stretch .dev-tabber .wds-tabs {
	width: 90%;
	margin: 0 auto;
}

.tabber-stretch .dev-tabber .wds-tabs__tab {
	flex: auto;
	text-align: center;
}

/* Max tabber width */
.tabber-w-175 .wds-tabber, .tabber-w-175 .wds-tabs__wrapper {
	max-width: 175px;
}

/* clear */
.clear-both {
	clear: both;
}