/* change Bulma Dark styles  */

/* disclaimer - I hate CSS */

:root {
	--signage: hsl(193, 46%, 60%);
	--verydark: hsl(237, 20%, 10%);
	--quitedark: hsl(237, 20%, 13%);
	--lessdark: hsl(237, 20%, 16%);
}


html.theme--documenter-dark body {
	background-color: var(--verydark);
	color: #eff;
	font-size: 1.1em;
	font-weight: 400;
	line-height: 1.8rem;
}

html.theme--documenter-dark a {
	color: var(--signage);
}

html.theme--documenter-dark p > a:after {
	padding-left:0.2rem;
	font-family: "JuliaMono";
	content: "⮻";
	color: var(--signage);
	background-color: inherit;
	font-size: 120%;
}

html.theme--documenter-light p > a:after {
	padding-left:0.2rem;
	font-family: "JuliaMono";
	content: "⮻";
	background-color: inherit;
	font-size: 120%;
}

html.theme--documenter-dark .has-text-left,
html.theme--documenter-dark body, 
html.theme--documenter-dark #documenter .docs-sidebar, 
html.theme--documenter-dark .documenter-example-output,
html.theme--documenter-dark #documenter .docs-sidebar ul.docs-menu .tocitem,
html.theme--documenter-dark #documenter .docs-sidebar ul.docs-menu .tocitem:hover,
html.theme--documenter-dark #documenter .docs-sidebar ul.docs-menu li.is-active .tocitem,
html.theme--documenter-dark #documenter .docs-sidebar ul.docs-menu li.is-active .tocitem:hover, 
html.theme--documenter-dark #documenter .docs-main header.docs-navbar {
	background-color: var(--verydark);
	border: 0.5px solid hsla(237, 20%, 10%, 0.3) !important;
}

html.theme--documenter-dark .modal-card-body ,
html.theme--documenter-dark .modal-card-head ,
html.theme--documenter-dark .modal-card-foot ,
html.theme--documenter-dark #documenter .docs-sidebar ul.docs-menu ,
html.theme--documenter-dark #documenter .docs-sidebar ul.docs-menu li.is-active {
	background-color: var(--verydark);
}

html.theme--documenter-dark .docstring ,
html.theme--documenter-dark .docstring>header {
	background-color: var(--lessdark);
}

html.theme--documenter-dark .content pre, 
html.theme--documenter-dark pre {
	background-color: var(--lessdark);
	border: 0.5px solid hsla(237, 20%, 10%, 0.3) !important;
}

html.theme--documenter-dark a {
	color: var(--signage);
}

html.theme--documenter-dark .modal-card-head {
	border: none;
}


.schemename {
    font-family: "JuliaMono";
    font-size: 0.7em;
	margin-top: 1em;
}

/*
is this how to scale the SVGs to page width?
*/
.swatch {
	width: 100%;
	height: 100%;
}
.swatch svg {
	width: 100%;
    height: 100%;
}

.category {
	font-family: "JuliaMono";
    font-size: 0.8em;
}

html.theme--documenter-dark p > code {
	color: #eff !important;
}


html.theme--documenter-dark li > code {
	color: #eff !important;
}


html.theme--documenter-dark a > code {
	color: #eff !important;
}

html.theme--documenter-dark p > a {
	color: #eff !important;
	}

html.theme--documenter-dark .select select:focus,
html.theme--documenter-dark .textarea:focus,
html.theme--documenter-dark .input:focus,
html.theme--documenter-dark #documenter .docs-sidebar form.docs-search>input:focus,
html.theme--documenter-dark .select select.is-focused,
html.theme--documenter-dark .is-focused.textarea,
html.theme--documenter-dark .is-focused.input,
html.theme--documenter-dark #documenter .docs-sidebar form.docs-search>input.is-focused,
html.theme--documenter-dark .select select:active,
html.theme--documenter-dark .textarea:active,
html.theme--documenter-dark .input:active,
html.theme--documenter-dark #documenter .docs-sidebar form.docs-search>input:active,
html.theme--documenter-dark .select select.is-active,
html.theme--documenter-dark .is-active.textarea,
html.theme--documenter-dark .is-active.input,
html.theme--documenter-dark #documenter .docs-sidebar form.docs-search>input.is-active {
	border-color: var(--signage);
}

.hovertext {
	position: relative;
	border-bottom: 1px dotted black;
}

.hovertext:before {
	content: attr(data-hover);
	visibility: hidden;
	opacity: 0;
	width: 500px;
	background-color: black;
	color: #fff;
	text-align: left;
	border-radius: 5px;
	padding: 5px 0;
	transition: opacity 1s ease-in-out;

	position: absolute;
	z-index: 1;
	left: 0;
	top: 110%;
}

.hovertext:hover:before {
	opacity: 1;
	visibility: visible;
}