---
# made a liquid file so theme is correctly compiled into import below
permalink: /assets/css/tocompile.scss
---

@charset "utf-8";

.author__urls.social-icons .svg-inline--fa,
.page__footer-follow .social-icons .svg-inline--fa {
    color: rgba(102, 235, 97, 0.829) !important;
  }

/* Colors */
$background-color: #141010 !default;
$text-color: #fff6fbb9 !default;
$primary-color: #ff00ff !default;
$link-color: $primary-color !default;
$link-color-hover: mix(#fff, $link-color, 25%) !default;
$link-color-visited: mix(#000, $link-color, 25%) !default;
$code-background-color: mix(rgb(43, 39, 39), $background-color, 15%) !default;
$code-background-color-dark: mix(rgb(59, 54, 54), $background-color, 20%) !default;

/* Notices */

$success-color: #3fa63f !default;
$warning-color: #d67f05 !default;
$danger-color: #ff0000 !default;
$info-color: #3b9cba !default;

// section not needed under 11ty
/* neon syntax highlighting (base16) */
$base00: #1a191a;
$base01: #e0e0e0;
$base02: #b4a6a6;
$base03: #928e8e;
$base04: #ccc2c2;
$base05: #bd6262;
$base06: #a74040;
$base07: #701b1b;
$base08: #ff0086;
$base09: #fd8900;
$base0a: #aba800;
$base0b: #00c918;
$base0c: #1faaaa;
$base0d: #3777e6;
$base0e: #ad00a1;
$base0f: #926e5c;
 //  base16-atelier-heath
 // base16-synth-midnight-dark
 // base16-summerfruit-dark
 // base16-seti
 // base16-outrun-dark (a bit bright)
 // base16-material-darker
 // base16-harmonic-dark
 // base16-google-dark (little dark for my tastes)
 // base16-default-dark (little dull)
 // base16-classic-dark
 // base16-brewer

 // section not needed under 11ty
 // Hacking the syntax highlighting
 .nb {
  /* Name.Builtin */
  color: $base0f !important;
}

.o {
  /* Operator */
  color: $base04 !important;
}
.n {
  /* Name */
  color: $base05 !important;
}
.p {
  /* Punctuation */
  color: #3ab469 !important;
}
.sr {
  /* Literal.String.Regex */
  color: $base0c !important;
}

// Progress Bar
#progress-bar {
  background: linear-gradient(to right, red, orange , yellow, green,
  blue, indigo, violet var(--scroll), transparent 0);
  position: fixed;
  overflow: hidden;
  width: 100%;
  height: 3px;
  z-index: 1;
}

// Scroll to top
#scroll-to-top {
  background: rgb(215, 210, 210);
 display:block;
 position:fixed;
 font-size:25px;
 bottom:25px;
 right:10%;
 opacity:0;
 z-index:99;
 text-align:center;
 transform:translateY(30%);
 transition:transform 0.5s ease-in-out, opacity 0.5s ease-in-out
}
@media (max-width: 600px) {
 #scroll-to-top {
  font-size:20px
 }
}
@media (max-width: 600px) {
 #scroll-to-top {
  right:5%;
  bottom:15px
 }
}
#scroll-to-top :last-child {
 transition:transform 0.7s ease-in-out
}
#scroll-to-top :last-child:active,
#scroll-to-top :last-child:hover {
 transform:translateY(-10%)
}
#scroll-to-top span {
 cursor:pointer;
 color:#dee3ee
}
#scroll-to-top span:hover .up-arrow,
#scroll-to-top span:active .up-arrow {
 color:#00adb5
}

tt,
code,
kbd,
samp,
pre {
  color: #1bb6be !important
}

$github-color: #fff !default;

div.highlight {
	position: relative;
}

div pre {
  border: 4px #7e1c1c solid;
  border-radius: 20px;
}

code {
  outline: 1px #7e1c1c solid;
}

code > span {
  padding-left: 10px;
}

// messes up table code blocks
//code > span:first-child {
//  padding-top: 5px;
//}

//code > span:last-child {
//  padding-bottom: 5px;
//}

// hack to remove outline that above sets
td > div > pre {
  border: unset;
}

pre > code > div {
  display: flex;
}

td {
  display: inline-flex;
  // below is hack so Firefox looks the same as Safari / Chrome.
  // Both will ignore the assignment because they don't know about "ruby-base"
  // https://caniuse.com/mdn-css_properties_display_ruby_values
  display: ruby-base;
}

// === for copy-code-to-clipboard

// h/t https://simplernerd.com/hugo-add-copy-to-clipboard-button/

.clipboard-button {
	position: absolute;
	top: 2px;
	right: 2px;
	padding: 6px 8px 4px 8px;
	margin: 5px;
//	color: gray-500;
//	border-color: gray-500;
//	background-color: gray-100;
	border: 1px solid;
	border-radius: 6px;
	font-size: 0.8em;
	z-index: 1;
	opacity: 0;
	transition: 0.1s;
}
.clipboard-button > svg {
//	fill: gray-500;
}
.clipboard-button:hover {
	cursor: pointer;
	border-color: #01b139;
	background-color: #87d09e;
	opacity: 1;
}
.clipboard-button:hover > svg {
	fill: #1900ff;
}
.clipboard-button:focus {
	outline: 0;
}

.highlight:hover > .clipboard-button {
	opacity: 1;
	transition: 0.2s;
}

.highlight {
	line-height: 1.5;
}

//@import "progress.css"; // for progress bar
//@import "minimal-mistakes/skins/{{ site.minimal_mistakes_skin | default: 'default' }}"; // skin
@import "minimal-mistakes/skins/_{{ site.minimal_mistakes_skin | default: 'default' }}.scss"; // skin
@import "minimal-mistakes"; // main partials
//@import "assets/css/override-notices.scss"
@import "override-notices.scss";

.footnotes ol, .footnotes li {
  font-size: 1em;
}