html[data-bs-theme='dark']:root {
  --bs-body-bg: #0a0e0e;
  --bs-body-color: #9ea19e;
  --bs-text-heading: #fff;
}

body {
  font-family: 'Inter', sans-serif;
  line-height: 1.8;
}

code {
  background: #eeeeee17;
  border-radius: 6px;
  padding: 2px;
}

/* highlight text selection */
::selection {
  background-color: rgba(230, 229, 231, 0.337);
  color: #ffffff;
}

article.container-content-area a {
  border-bottom:0;
  box-shadow: inset 0 -2px 0 0 rgba(250, 202, 13, 0.89);
  transition: box-shadow 0.1s ease;
}

article.container-content-area a:hover {
  box-shadow: inset 0 -12px 0 0  rgba(250, 202, 13, 0.49);
}

article.container-content-area img {
  border-radius: 15px;
  border: 2px solid #222;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5);
  margin-bottom: 35px;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--bs-text-heading);
  font-weight: normal;
  line-height: 1.2;
  margin-top: 2.1rem;
  margin-bottom: 0.7rem;
  display: flex;
  align-content: center;
}

h1 {
  font-size: 2rem;
}

h2 {
  font-size: 1.7rem;
}

h3 {
  font-size: 1.45rem;
}

h1 a[href^="#"],
h2 a[href^="#"],
h3 a[href^="#"],
h4 a[href^="#"],
h5 a[href^="#"],
h6 a[href^="#"] {
  font-size: 12px;
  text-decoration: none;
  display: inline-block;
  margin-right: 10px;
  background-color: transparent;
  /* padding: 5px 3px; */
  line-height: 1;
  align-self: center
}

ul li input {
  margin-right: 5px;
}

a {
  color: #fff;
  border-bottom: 1px solid #dedede;
  text-decoration: none;
  padding: 0 2px
}

a.external {
  position: relative;
}

a.external::after {
  content: "";
  display: inline-block;
  margin-left: 0.2em;
  vertical-align: middle;
  width: 0;
  height: 0;
  border-top: 0.4em solid transparent;
  border-left: 0.4em solid #dedede; /* arrow color */
  border-bottom: 0.4em solid transparent;
  transform: rotate(-45deg) translateY(-1px);
  position: relative;
  top: -5px;
}

a.external:hover::after {
  border-left-color: #fff; /* arrow color on hover */
}

a.anchor-link {
  box-shadow: none !important;
  border: 0;
  padding: 6px;
}

img {
  max-width: 100%;
}

/* Style for pre code blocks */
pre {
  font-family: 'CommitMono';
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "ss01", "ss03", "ss04", "ss05";
  background-color:rgba(0,0,0,.5);
  color: #dedede;
  font-size: 0.95rem;
  line-height: 1.4;
  margin-bottom: 1.5rem;
  border-radius: 15px;
  /* max-height: 650px; */
  border: 2px solid #222;
}

pre.full {
  max-height: none;
}

mark {
  background-color: rgba(46, 255, 147, 0.4);
  padding: 0 2px;
  border-radius: 4px;
}
.btn, .sidebar-navigation a, a.anchor-link {
  transition: background-color 0.2s ease, scale 0.1s ease;
}

.btn:active, .sidebar-navigation a:active, a.anchor-link:active {
  scale: .96;
}

/* Menu navigation */
.navbar-container-area {
  box-shadow: 0 -40px 20px 20px rgb(0, 0, 0); /* shadow up */
  background-color: rgba(10,14,14,0.30);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  font-size: 0.9rem;
  width:100%;
  border-bottom: 1px solid rgba(200, 200, 200, 0.1);
  box-shadow: 0px 20px 50px 10px rgba(0, 0, 0, 0.58);
}

.sidebar-navigation {
  z-index: 100;
}

.sidebar-navigation .sidebar-navigation-scroll {
  max-height: calc(100vh - 220px);
  overflow-y: auto;
  padding-right: 10px;
}

.sidebar-navigation a {
  border-bottom: none;
  background-color: transparent;
  display: block;
  padding: 0px 8px;
  border-radius: 10px;
  margin-bottom: 3px;
  text-decoration: none;
  color: inherit;
}

.sidebar-navigation a:hover {
  background-color:rgba(29, 41, 41, 0.8);
}

.navbar-brand {
  border: none;
  background-color: transparent;
  position: relative;
}

.navbar-brand img {
  /* width: 150px; */
  width: 60px;
  height: 60px;
  position:relative;
  z-index: 1;
}

.navbar-brand em {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 52px;
  width: 52px;
  overflow:hidden;
  border-radius: 20px;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.navbar-brand em:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 52px;
  width: 52px;
  margin: auto;
  background-color: #0f22d1;
  z-index: -1
}

.navbar-brand em:after {
  content:"";
  background-image: radial-gradient(18% 28% at 24% 50%,#cefaff 7%,#073AFF00 100%),radial-gradient(18% 28% at 18% 71%,#ffffff59 6%,#073AFF00 100%),radial-gradient(70% 53% at 36% 76%,#73f2ff 0,#073AFF00 100%),radial-gradient(42% 53% at 15% 94%,#fff 7%,#073AFF00 100%),radial-gradient(42% 53% at 34% 72%,#752c4e 7%,#073AFF00 100%),radial-gradient(18% 28% at 35% 87%,#fff 7%,#073AFF00 100%),radial-gradient(31% 43% at 7% 98%,#fff 24%,#073AFF00 100%),radial-gradient(21% 37% at 72% 23%,#86a73c9c 24%,#073AFF00 100%),radial-gradient(35% 56% at 91% 74%,#8a4ffff5 20%,#073AFF00 100%),radial-gradient(74% 86% at 67% 38%,#6dffaef5 24%,#073AFF00 100%),linear-gradient(125deg,#4eb5ff 1%,#4c00fc 100%);
  background-size: cover;
  background-repeat: no-repeat;
  width: 150px;
  height: 150px;
  position: absolute;
  pointer-events: none;
  z-index: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  left: -20px;
  right: 0;
  animation: rotateAnimation 5s linear infinite;
}

.spotlight-autocomplete-item:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

.spotlight-autocomplete-item.active {
  background-color: rgba(255, 255, 255, 0.05);
}

/* Table of Contents */
.sidebar-right .table-of-contents {
  padding-left: 0;
  list-style: none;
  max-height: calc(100vh - 220px);
  overflow-y: auto;
}

.sidebar-right .table-of-contents li a {
  border-bottom: 0;
  color: var(--bs-body-color);
  background-color: transparent;
}

.sidebar-right .table-of-contents li a:hover {
  color: #fff;
}

.container-content-area strong {
  color: #ccc;
}

.container-content-area ul {
  padding-left: 2.2rem;
  margin-bottom: 1.5rem;
}

.container-content-area ul li {
  margin-bottom: 0.4rem;
}

.footnotes {
  padding: 15px
}

.footnotes .footnote {
  font-size: 0.8rem;
  margin-bottom: 8px;
  line-height: 1.3rem;
}

/* Dialog components */
.alert {
  margin-top: 35px;
  margin-bottom: 25px;
  border-width: 2px;
  position: relative;
  overflow: hidden;
  padding: 2px;
}

.alert .alert-content {
  background-color: var(--bs-alert-bg);
  border-radius: 12px;
  padding: 20px 20px 20px 55px;
  position:relative;
  z-index: 2;
}

.alert-animation {
  content:"";
  transition: transform 0.95s cubic-bezier(.4,2,.3,1);
  background-image: radial-gradient(18% 28% at 24% 50%,#530fff 7%,#073AFF00 100%),radial-gradient(18% 28% at 18% 71%,#ffffff59 6%,#073AFF00 100%),radial-gradient(70% 53% at 36% 76%,#e1218e 0,#073AFF00 100%),radial-gradient(42% 53% at 15% 94%,#00b3ff 7%,#073AFF00 100%),radial-gradient(42% 53% at 34% 72%,#752c4e 7%,#073AFF00 100%),radial-gradient(18% 28% at 35% 87%,#fff 7%,#073AFF00 100%),radial-gradient(31% 43% at 7% 98%,#42c819 24%,#073AFF00 100%),radial-gradient(21% 37% at 72% 23%,#86a73c9c 24%,#073AFF00 100%),radial-gradient(35% 56% at 91% 74%,#8a4ffff5 9%,#073AFF00 100%),radial-gradient(74% 86% at 67% 38%,#6dffaef5 24%,#073AFF00 100%),linear-gradient(125deg,#4eb5ff 1%,#4c00fc 100%);
  background-size: cover;
  background-repeat: no-repeat;
  width:100%;
  height:500px;
  position: absolute;
  filter: blur(30px);
  pointer-events: none;
  z-index: 0;
}

@keyframes rotateAnimation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}


.alert p {
  font-size: 0.90rem;
}

.alert p:last-child {
  margin-bottom: 0;
}

.alert.alert-info {
  --bs-alert-color: #dedede;
  box-shadow: 0 10px 35px rgb(8, 121, 144, 0.2);
}

.alert.alert-warning {
  --bs-alert-color: #cabd94;
  box-shadow: 0 10px 35px rgb(153, 116, 4, 0.1);
}

.alert.alert-danger {
  --bs-alert-color: #e8bbbf;
  --bs-alert-bg: #261b1c;
  box-shadow: 0 10px 35px rgba(197, 16, 58, 0.5);
}

.alert.alert-danger .alert-content:after {
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-alert-circle"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 2c5.523 0 10 4.477 10 10a10 10 0 0 1 -19.995 .324l-.005 -.324l.004 -.28c.148 -5.393 4.566 -9.72 9.996 -9.72zm.01 13l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007zm-.01 -8a1 1 0 0 0 -.993 .883l-.007 .117v4l.007 .117a1 1 0 0 0 1.986 0l.007 -.117v-4l-.007 -.117a1 1 0 0 0 -.993 -.883z" /></svg>');
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-alert-circle"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 2c5.523 0 10 4.477 10 10a10 10 0 0 1 -19.995 .324l-.005 -.324l.004 -.28c.148 -5.393 4.566 -9.72 9.996 -9.72zm.01 13l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007zm-.01 -8a1 1 0 0 0 -.993 .883l-.007 .117v4l.007 .117a1 1 0 0 0 1.986 0l.007 -.117v-4l-.007 -.117a1 1 0 0 0 -.993 -.883z" /></svg>');
}

.alert.alert-warning .alert-content:after {
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-alert-triangle"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 1.67c.955 0 1.845 .467 2.39 1.247l.105 .16l8.114 13.548a2.914 2.914 0 0 1 -2.307 4.363l-.195 .008h-16.225a2.914 2.914 0 0 1 -2.582 -4.2l.099 -.185l8.11 -13.538a2.914 2.914 0 0 1 2.491 -1.403zm.01 13.33l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007zm-.01 -7a1 1 0 0 0 -.993 .883l-.007 .117v4l.007 .117a1 1 0 0 0 1.986 0l.007 -.117v-4l-.007 -.117a1 1 0 0 0 -.993 -.883z" /></svg>');
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-alert-triangle"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 1.67c.955 0 1.845 .467 2.39 1.247l.105 .16l8.114 13.548a2.914 2.914 0 0 1 -2.307 4.363l-.195 .008h-16.225a2.914 2.914 0 0 1 -2.582 -4.2l.099 -.185l8.11 -13.538a2.914 2.914 0 0 1 2.491 -1.403zm.01 13.33l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007zm-.01 -7a1 1 0 0 0 -.993 .883l-.007 .117v4l.007 .117a1 1 0 0 0 1.986 0l.007 -.117v-4l-.007 -.117a1 1 0 0 0 -.993 -.883z" /></svg>');
}

.alert.alert-info .alert-content:after {
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-info-square-rounded"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 2l.642 .005l.616 .017l.299 .013l.579 .034l.553 .046c4.687 .455 6.65 2.333 7.166 6.906l.03 .29l.046 .553l.041 .727l.006 .15l.017 .617l.005 .642l-.005 .642l-.017 .616l-.013 .299l-.034 .579l-.046 .553c-.455 4.687 -2.333 6.65 -6.906 7.166l-.29 .03l-.553 .046l-.727 .041l-.15 .006l-.617 .017l-.642 .005l-.642 -.005l-.616 -.017l-.299 -.013l-.579 -.034l-.553 -.046c-4.687 -.455 -6.65 -2.333 -7.166 -6.906l-.03 -.29l-.046 -.553l-.041 -.727l-.006 -.15l-.017 -.617l-.004 -.318v-.648l.004 -.318l.017 -.616l.013 -.299l.034 -.579l.046 -.553c.455 -4.687 2.333 -6.65 6.906 -7.166l.29 -.03l.553 -.046l.727 -.041l.15 -.006l.617 -.017c.21 -.003 .424 -.005 .642 -.005zm0 9h-1l-.117 .007a1 1 0 0 0 0 1.986l.117 .007v3l.007 .117a1 1 0 0 0 .876 .876l.117 .007h1l.117 -.007a1 1 0 0 0 .876 -.876l.007 -.117l-.007 -.117a1 1 0 0 0 -.764 -.857l-.112 -.02l-.117 -.006v-3l-.007 -.117a1 1 0 0 0 -.876 -.876l-.117 -.007zm.01 -3l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007z" /></svg>');
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-info-square-rounded"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 2l.642 .005l.616 .017l.299 .013l.579 .034l.553 .046c4.687 .455 6.65 2.333 7.166 6.906l.03 .29l.046 .553l.041 .727l.006 .15l.017 .617l.005 .642l-.005 .642l-.017 .616l-.013 .299l-.034 .579l-.046 .553c-.455 4.687 -2.333 6.65 -6.906 7.166l-.29 .03l-.553 .046l-.727 .041l-.15 .006l-.617 .017l-.642 .005l-.642 -.005l-.616 -.017l-.299 -.013l-.579 -.034l-.553 -.046c-4.687 -.455 -6.65 -2.333 -7.166 -6.906l-.03 -.29l-.046 -.553l-.041 -.727l-.006 -.15l-.017 -.617l-.004 -.318v-.648l.004 -.318l.017 -.616l.013 -.299l.034 -.579l.046 -.553c.455 -4.687 2.333 -6.65 6.906 -7.166l.29 -.03l.553 -.046l.727 -.041l.15 -.006l.617 -.017c.21 -.003 .424 -.005 .642 -.005zm0 9h-1l-.117 .007a1 1 0 0 0 0 1.986l.117 .007v3l.007 .117a1 1 0 0 0 .876 .876l.117 .007h1l.117 -.007a1 1 0 0 0 .876 -.876l.007 -.117l-.007 -.117a1 1 0 0 0 -.764 -.857l-.112 -.02l-.117 -.006v-3l-.007 -.117a1 1 0 0 0 -.876 -.876l-.117 -.007zm.01 -3l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007z" /></svg>');'
}

.alert .alert-content:after {
  content: "";
  width: 24px;
  height: 24px;
  position: absolute;
  top: 20px;
  left: 18px;
  background-color: #ffffffa8; 
  -webkit-mask-size: contain;
  mask-size: contain;
}

/* Dropdown Misc */
.dropdown-menu-sm {
  font-size: 0.85em;
  padding-top: 4px;
  padding-bottom: 4px;
}

.dropdown-menu-sm li {
  padding: 0 4px;
}

.dropdown-menu-sm .dropdown-item {
  padding: 2px 10px;
  line-height: 1.3;
  margin-bottom: 4px;
  border-radius: 10px;
}

.dropdown-menu a.external::after {
  position: absolute;
  top: 5px;
  right: 5px;
}