/* Start Menu by default */
:root {
	--header-bg: #112028;
	--header-border: #f7cd12;
	--header-link: #91AAD6;
	--page-bg: linear-gradient(#111e34, #243a5b);
	--modal-center-bg: #1f2f45;
	--text: #fff;
	--pokemon: #1f2f45;
	--asterisk: #FFA2A2;
}

/* Start Menu-specific */
body.theme-start {
	--modal-bg: #152731;
}

/* Classic Dark */
body.theme-dark {
	--header-bg: #333;
	--header-border: #222;
	--header-link: #96ADD7;
	--page-bg: #121212;
	--modal-center-bg: #121212;
	--text: #fff;
	--pokemon: #555;
}

/* Naranja/Uva Academy */
body.theme-naranja,
body.theme-uva {
	--header-border: #f7cd12;
	--header-link: #fff;
	--page-bg: linear-gradient(225deg, #001e4f, #0058ba);
	--text: #fff;
	--pokemon: #002c67;
	--pokemon-header: #081d3c;

	--modal-bg: #081d3c;
	--modal-center-bg: #002c67;
	--label-text: #fcd821;
}

/* Naranja Academy */
body.theme-naranja {
	--header-bg: #b65726;
}

/* Uva Academy */
body.theme-uva {
	--header-bg: #852eb0;
}

/* Intrepid Sword and Dauntless Shield */
body.theme-sword,
body.theme-shield {
	--header-bg: #000;
	--header-border: #000;
	--header-link: #91AAD6;
	--page-bg: linear-gradient(120deg, #43a7ff 0%, #43a7ff 20%, #0d93f4 20%, #0d93f4 30%, #fff 30%, #fff 100%);
	--text: #000;
	--header-text: #fff;
	--pokemon: #eee;

	--modal-bg: #4d4d4d;
	--modal-center-bg: #fff;
	--modal-text: #fff;
	--modal-link: #38578e;
	--pokemon-header: #dbdbd9;
	--asterisk: #a00;
}
.theme-sword .pokemon-list-origin,
.theme-sword .pokemon-list-entry-footer-right,
.theme-sword #menu button:not(#menu-boxes) img,
.theme-sword #pokeform-shiny-toggle img,
.theme-sword .pokemon-list-entry .shiny,
.theme-sword #pokeform-gender-unknown img,
.theme-shield .pokemon-list-origin,
.theme-shield .pokemon-list-entry-footer-right,
.theme-shield #menu button:not(#menu-boxes) img,
.theme-shield #pokeform-shiny-toggle img,
.theme-shield .pokemon-list-entry .shiny,
.theme-shield #pokeform-gender-unknown img,
.theme-sword .pokeform-scale-icon,
.theme-shield .pokeform-scale-icon {
	filter: invert(1);
}
.theme-sword #pokeform-tabs .pokeform-tabs-active,
.theme-shield #pokeform-tabs .pokeform-tabs-active {
	filter: brightness(0);
}
.theme-sword #boxsort-boxes > div,
.theme-shield #boxsort-boxes > div {
	background-color: #dbdbd9;
	background-image: url("../img/ui/drag.svg"), linear-gradient(120deg, #dbdbd9 20%, #dbdbd9 80%, #4d4d4d 80%, #4d4d4d 100%);
	background-size: 20px, auto;
	background-blend-mode: difference, normal;
	color: #000;
}
.theme-sword .modal th,
.theme-shield .modal th {
	background: #dbdbd9;
}
.theme-sword #pokemon-list-nomatch,
.theme-sword #pokemon-list-empty,
.theme-shield #pokemon-list-nomatch,
.theme-shield #pokemon-list-empty {
	text-shadow: 0 0 5px #fff;
}

/* Dauntless Shield-specific */
body.theme-shield {
	--page-bg: linear-gradient(120deg, #e3313d 0%, #e3313d 20%, #c42835 20%, #c42835 30%, #fff 30%, #fff 100%);
}

/* Classic Light */
body.theme-light {
	--header-bg: #ddd;
	--header-border: #888;
	--header-link: #38578e;
	--page-bg: #fff;
	--text: #121212;
	--pokemon: #eee;

	--modal-bg: #333;
	--modal-center-bg: #fff;
	--modal-text: #fff;
	--modal-link: #38578e;
	--pokemon-header: #bbb;
	--asterisk: #a00;
}
.theme-light #header-settings,
.theme-light #header-discord img,
.theme-light .pokemon-list-origin,
.theme-light .pokemon-list-entry-footer-right,
.theme-light #add-pokemon-button img,
.theme-light #menu button:not(#menu-boxes) img,
.theme-light #pokeform-shiny-toggle img,
.theme-light .pokemon-list-entry .shiny,
.theme-light #pokeform-gender-unknown img,
.theme-light .pokeform-scale-icon {
	filter: invert(1);
}
.theme-light #pokeform-tabs .pokeform-tabs-active {
	filter: brightness(0);
}
.theme-light #boxsort-boxes > div {
	background-color: #333;
	color: #fff;
}

/* Main Event */
body {
	background: var(--page-bg);
	background-attachment: fixed;
	color: var(--text);
}
header,
footer,
#add-pokemon-button,
#menu-filter-count {
	background: var(--header-bg);
	border-color: var(--header-border);
	color: var(--header-text, var(--text));
}
header a:not(.button),
footer a:not(.button) {
	color: var(--header-link);
}
.modal a:not(.button) {
	color: var(--modal-link, #add8e6);
}
.modal {
	background: var(--modal-center-bg, var(--page-bg));
	border-color: var(--modal-bg, var(--header-bg));
}
.modal h4,
.modal h5 {
	background: var(--modal-bg, var(--header-bg));
	color: var(--modal-text, var(--text));
}
.modal th label,
.ribbons-gen,
.changelog-date,
.ribbonguide-label,
#ribbonguide-transfer > div > div > div:first-child {
	color: var(--label-text, var(--text));
}
.modal th label .asterisk {
	color: var(--asterisk);
}
.pokemon-list-entry:hover,
#menu button:hover,
#menu button:focus {
	box-shadow: 0 0 10px -5px var(--text);
}
.pokemon-list-entry-header,
.pokemon-list-entry-footer,
#menu button,
#boxsort-boxes > div {
	background-color: var(--pokemon-header, var(--modal-bg, var(--header-bg)));
}
.pokemon-list-entry-center {
	background: var(--pokemon);
}