/*
   Present Malice Theme
   [2021 Wikidot Theme]
   by JackalRelated
          greatly inspired by Resident Evil (1996)
*/

@import url('https://fonts.googleapis.com/css2?family=Courier+Prime&family=Anton&family=Jost&family=Anonymous+Pro&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@600&display=swap');

:root {
	--theme-base: "black-highlighter";
	--theme-id: "present-malice";
	--theme-name: "Present Malice Theme";

	--logo-image: url("/api/css-proxy?url=https%3A%2F%2Fscp-wiki.wdfiles.com%2Flocal--files%2Ftheme%3Apresent-malice%2Fumbrella-scp.png") !important;
	--header-title: "SCP FOUNDATION";
	--header-subtitle: "SECURE. CONTAIN. PROTECT.";

	--body-font: 'Jost', sans-serif;
	--header-font: 'Anton', sans-serif;
	--title-font: 'Courier Prime', sans-serif;
	--mono-font: 'Anonymous Pro', monospace;
	--UI-font: var(--body-font);

	/* WHITE - GREY - BLACK */
	--tyrant-white: 240, 235, 235;
	--barry-magnum: 230, 230, 230;
	--jill-grey: 198, 205, 215;
	--pecking-crow: 40, 40, 40;
	--weskers-shades: 20, 20, 20;
	--mr-x: 5, 5, 5;

	/* BLUE - GREEN */
	--menu-blue: 132, 134, 163;
	--light-stars-blue: 0, 13, 135;
	--medium-stars-blue: 42, 45, 102;
	--dark-stars-blue: 0, 8, 84;
	--rpd-uniform: 30, 30, 56;
	--jills-shoulderpads: 20, 20, 36;
	--chris-green: 11, 138, 0;
	--woman-drawing-water: 1, 71, 50;

	/* RED - BROWN */
	--chris-blood: 185, 0, 0;
	--umbrella-red: 143, 0, 0;
	--ashford-red: 84, 0, 0;
	--barry-jacket: 165, 51, 51;
	--rotten-flesh: 82, 54, 42;
	--itchy-tasty: 126, 64, 38;
	--rust-rot: 61, 31, 18;

	/* THEME ASSIGNMENTS */
	--white-monochrome: var(--tyrant-white);
	--pale-gray-monochrome: var(--barry-magnum);
	--light-gray-monochrome: var(--barry-magnum);
	--gray-monochrome: var(--weskers-shades);
	--dark-gray-monochrome: var(--jills-shoulderpads);
	--black-monochrome: var(--weskers-shades);
	--pale-accent: var(--barry-jacket);
	--bright-accent: var(--chris-blood);
	--medium-accent: var(--umbrella-red);
	--dark-accent: var(--ashford-red);

	--swatch-topmenu-bg-color: var(--weskers-shades);
	--swatch-topmenu-border-color: var(--weskers-shades);

	--swatch-background: var(--jill-grey);
	--swatch-border-color: var(--weskers-shades);

	--swatch-text-dark: var(--mr-x);
	--swatch-text-light: var(--barry-magnum);
	--swatch-text-general: var(--swatch-text-dark);
	--swatch-important-text: var(--bright-accent);

	--swatch-menubg-color: var(--tyrant-white);
	--swatch-menubg-light-color: var(--menu-blue);
	--swatch-menubg-medium-color: var(--rpd-uniform);
	--swatch-menubg-medium-dark-color: var(--jills-shoulderpads);
	--swatch-menubg-dark-color: var(--jills-shoulderpads);

	--swatch-menutxt-dark-color: var(--mr-x);
	--swatch-menutxt-light-color: var(--barry-magnum);

	--swatch-secondary-color: var(--jills-shoulderpads);

	--swatch-text-secondary-color: var(--tyrant-white);
	--swatch-text-tertiary-color: var(--barry-magnum);

	--header-gradient-color-top: var(--weskers-shades);
	--header-gradient-color-middle: var(--weskers-shades);
	--header-gradient-color-bottom: var(--weskers-shades);
	--background-gradient-distance: 0rem;
	--diagonal-stripes: linear-gradient(transparent 0);

	--sidebar-transition-timing: 0.8s ease-in-out 0.1s;

	--hover-link-color: var(--chris-blood);
	--link-color: var(--umbrella-red);
	--newpage-color: var(--chris-blood);
	--visited-link-color: var(--ashford-red);

	--ui-wght: 200;
	--ui-hvr-wght: 200;

	--toggle-button-bg: rgb(var(--weskers-shades));
	--toggle-border-color: rgb(var(--umbrella-red));
	--toggle-icon-color: rgb(var(--tyrant-white));
	--toggle-roundness: 0%;
}

/* HEADER AND TOPBAR */

#header {
	--swatch-headerh1-color: var(--chris-blood);
	--swatch-headerh2-color: var(--tyrant-white);

	--search-icon-color: var(--barry-magnum);
	--search-icon-hover-color: var(--tyrant-white);
	--search-icon-hover-bg-color: var(--umbrella-red);
	--search-textbox-text-color: 0, 0, 0, 0;

	--search-icon-focus-color: var(--tyrant-white);
	--search-icon-focus-bg-color: var(--umbrella-red);
	--search-focus-outline-color: var(--chris-blood);
	--search-focus-textbox-bg-color: var(--medium-stars-blue);
	--search-focus-textbox-text-color: var(--barry-magnum);

	--login-line-divider-color: var(--chris-blood);
	--login-username-color: var(--chris-blood);
	--login-myaccount-color: var(--barry-magnum);
	--login-myaccount-underline-color: var(--umbrella-red);
	--login-myaccount-hover-bg-color: var(--mr-x);
	--login-arrow-color: var(--barry-magnum);

	--login-dropdown-bg-color: var(--jills-shoulderpads);
	--login-dropdown-bg-image: var(--jills-shoulderpads);
	--login-dropdown-border-color: var(--mr-x);
	--login-dropdown-text-color: var(--barry-magnum);
	--login-dropdown-text-hover-color: var(--tyrant-white);
	--login-dropdown-bg-hover-color: var(--chris-blood);

	--login-mobile-icon-color: var(--barry-magnum);
	--login-mobile-icon-hover-color: var(--tyrant-white);
	--login-mobile-icon-hover-bg-color: var(--chris-blood);
}

#header h1 a,
#header h1 a:before {
	--wght: 200;
	font-weight: 200;
}

#header h2 span::before {
	margin-left: -0.2rem;
}

@media only screen and (max-width: 320px) {
	#header h2 span::before {
		margin-left: -0.4rem;
	}
}

@media only screen and (max-width: 375px) {
	#header h2 span::before {
		margin-left: -0.7rem;
	}
}

#top-bar {
	--topmenu-category-color: var(--barry-magnum);
	--topmenu-category-hover-color: var(--tyrant-white);
	--topmenu-category-hover-bg: var(--jills-shoulderpads);
	--topmenu-hover-border-color: var(--umbrella-red);

	--mobile-topmenu-sidebar-button-color: var(--barry-magnum);

	--dropdown-bg-color: var(--rpd-uniform), 0.9;
	--dropdown-border-color: var(--jills-shoulderpads), 0.5;
	--dropdown-links-color: var(--barry-magnum);
	--dropdown-links-hover-color: var(--tyrant-white);
	--dropdown-links-hover-bg-color: var(--umbrella-red);
}

#action-area p {
    color: white;
}

/* BREADCRUMBS */

#breadcrumbs a:hover,
.pseudocrumbs a:hover,
#breadcrumbs a:active,
.pseudocrumbs a:active {
	color: rgb(var(--chris-blood));
	text-decoration: none;
}

#breadcrumbs a:focus-within,
.pseudocrumbs a:focus-within {
	color: rgb(var(--umbrella-red));
	text-decoration: none;
}

/* SCROLLBAR AND SIDEBAR */

html,
body {
	scrollbar-color:
		rgb(var(--weskers-shades)) rgb(var(--umbrella-red));
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
	width: 18px;
	background: #transparent;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
	background: rgb(var(--weskers-shades));
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
	background: rgb(var(--umbrella-red));
	border: rgb(var(--umbrella-red)) 1px solid;
	border-radius: 0px;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
	background: rgb(var(--chris-blood));
}

#side-bar,
#interwiki {
	--sidebar-bg-color: var(--jills-shoulderpads);
	--sidebar-resources-bg-color: var(--ashford-red);
	--sidebar-media-bg-color: var(--ashford-red);

	--sideblock-heading-bg-color: var(--umbrella-red);
	--sideblock-heading-border-color: var(--chris-blood);
	--sideblock-heading-text-color: var(--tyrant-white);

	--sidebar-border-color: var(--rpd-uniform);
	--sidebar-subtest-color: var(--umbrella-red);

	--sidebar-links-text: var(--barry-magnum);
	--sidebar-links-hover-bg-color: var(--chris-blood);
	--sidebar-links-hover-text-color: var(--tyrant-white);
}

hr {
	background-color: rgb(var(--dark-stars-blue));
}

.code {
	background-color: rgb(var(--barry-magnum));
}

.scp-image-block .scp-image-caption {
	border-top: .0625rem outset rgba(var(--umbrella-red), 1);
	background-color: rgb(var(--barry-magnum)) !important;
	color: var(--mr-x);
}

.scp-image-block {
	box-shadow: none;
	border: none;
}

/* MAIN CONTENT */

.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
	-webkit-filter: hue-rotate(0deg);
	        filter: hue-rotate(0deg);
}

.page-rate-widget-box .rate-points {
	border: none !important;
	background-color: rgba(0, 0, 0, 0) !important;
}

#main-content {
	--tabs-bg: var(--jills-shoulderpads);
	--tabs-txt: var(--barry-magnum);
	--tabs-hover-bg: var(--light-stars-blue);
	--tabs-hover-txt: var(--tyrant-white);
	--tabs-selected-bg: var(--chris-blood);
	--tabs-selected-txt: var(--tyrant-white);
	--tabs-selected-outline: var(--chris-blood);
	--tabs-bottom-border-color: var(--light-stars-blue);
	--tabs-content-bg-color: var(--tyrant-white);
	--tabs-content-border-color: var(--jills-shoulderpads);

	--tables-header-bg: var(--chris-green);
	--tables-header-txt: var(--weskers-shades);
	--tables-border: var(--woman-drawing-water);
	--tables-body-bg: var(--rpd-uniform), 0.25;

	--toc-header-bg-color: var(--umbrella-red);
	--toc-header-text-color: var(--barry-magnum);
	--toc-header-text-hover-color: var(--tyrant-white);
	--toc-body-bg-color: var(--rpd-uniform);
	--toc-body-link-color: var(--barry-magnum);

	--ui-icon-color: var(--barry-magnum);
	--ui-icon-bg: var(--jills-shoulderpads);
	--ui-icon-hover-color: var(--tyrant-white);
	--ui-icon-hover-bg: var(--chris-blood);

	--editor-icon-hover-color: var(--tyrant-white);

	--blockquote-bg-color: var(--tyrant-white), 0.35;
	--blockquote-border-color: var(--rust-rot);
	--blockquote-colorbar-color: var(--itchy-tasty);

	--footnotes-footer-bg-color: var(--menu-blue);
	--footnotes-footer-colorbar-color: var(--umbrella-red);
	--footnotes-footer-title-bg-color: var(--umbrella-red);
	--footnotes-footer-title-text-color: var(--barry-magnum);

	--pagetags-title-bg: var(--weskers-shades);
	--pagetags-title-text: var(--barry-magnum);
	--pagetags-text-color: var(--mr-x);
	--pagetags-text-hover-color: var(--tyrant-white);
	--pagetags-text-hover-bg-color: var(--chris-blood);
}

.blockquote hr,
div.blockquote hr {
	background-color: rgb(var(--rotten-flesh));
}

table.wiki-content-table th {
	font-family: var(--title-font);
}

:root {
	--hoverblock-header-bg: var(--chris-blood);
	--hoverblock-header-txt: var(--tyrant-white);
	--hoverblock-footer-txt: var(--barry-magnum);

	--ui-button-hover-bg: var(--chris-blood);
	--ui-button-hover-txt: var(--tyrant-white);

	--modal-body-header-text: var(--barry-magnum);
	--modal-body-text: var(--barry-magnum);

	--rating-module-button-plus-color: var(--chris-green);
	--rating-module-button-negative-color: var(--chris-blood);
	--rating-module-button-cancel-color: var(--itchy-tasty);
	--rating-module-button-credit-color: var(--tyrant-white);
	--rating-module-bg-color: var(--pecking-crow);
	--rating-module-text-color: var(--barry-magnum);
	--rating-module-text-hover-color: var(--tyrant-white);
}

/* FOOTERS AND BELOW */

.page-source {
	background: rgb(var(--tyrant-white));
	font-family: var(--mono-font);
}

#lock-info,
div.note,
input.checkbox,
input.text,
textarea {
	font-family: var(--body-font);
}

form#edit-page-form #edit-page-textarea {
	background-color: rgb(var(--barry-magnum));
}

#footer {
	--footer-bg-color: var(--jills-shoulderpads);
	--footer-text-color: var(--barry-magnum);
	--footer-link-color: var(--barry-magnum);
	--footer-link-hover-color: var(--tyrant-white);
	--footer-link-hover-bg-color: var(--chris-blood);
}

#license-area {
	--license-bg-color: var(--weskers-shades);
	--license-text-color: var(--barry-magnum);
	--license-link-color: var(--barry-magnum);
	--license-link-hover-color: var(--tyrant-white);
	--license-link-hover-bg-color: var(--chris-blood);
}

/* TOGGLE SIDEBAR (BHL) CHANGES */

@supports(display: grid) {
	@media only screen and (min-width: 769px) {
		#main-content::before {
			background: rgba(var(--dark-stars-blue), .45) 1px 1px repeat;
		}
	}
}

html,
body {
	scrollbar-color:
		rgb(var(--umbrella-red)) rgb(var(--weskers-shades));
	border-color: rgba(var(--umbrella-red), 1);
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
	background-color: rgb(var(--weskers-shades));
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
	background-color: rgb(var(--umbrella-red));
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
	background-color: rgb(var(--chris-blood));
}
