/* stylelint-disable selector-class-pattern */

/**
 * Any CSS included here will be global. The classic template
 * bundles Infima by default. Infima is a CSS framework designed to
 * work well for content-centric websites.
 */
@import url("https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,100..900;1,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap");
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap");

/* Tailwind base styles */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* You can override the default Infima variables here. */
:root {
	--ifm-color-primary: #327eff;
	--ifm-color-primary-dark: #2a2978;
	--ifm-color-primary-darker: #362771;
	--ifm-color-primary-darkest: #000;
	--ifm-color-primary-light: hwb(216deg 27% 39%);
	--ifm-footer-background-color: #111;
	--ifm-color-primary-lighter: #7062c8;
	--ifm-color-primary-lightest: #6c87c5;
	--ifm-link-color: #333;
	--ifm-code-font-size: 95%;
	--docusaurus-highlighted-code-line-bg: rgb(0 0 0 / 10%);
	--ifm-hover-overlay: #fafafa;
	--ifm-heading-color: #111;
	--ifm-font-family-base: "Archivo";
	--ifm-global-shadow-md: 0px; /* Remove shadow on the left */
}

[data-theme="light"] {
	--ifm-menu-color: #000;
}

.theme-doc-sidebar-container {
	border-width: 0 !important;
}

/* .hiring-link {
   color: #fff;
   background-color: #3c8957;
   line-height: 1.2;
   font-weight: 600;
   border-radius: 100px;
 }
 .hiring-link:hover {
   color: #fff;
   background-color: #2a623e;
 } */

/* For readability concerns, you should choose a lighter palette in dark mode. */
[data-theme="dark"] {
	--ifm-color-primary: #5693fc;
	--ifm-color-primary-dark: #21af90;
	--ifm-color-primary-darker: #1fa588;
	--ifm-color-primary-darkest: #1a8870;
	--ifm-color-primary-light: #29d5b0;
	--ifm-color-primary-lighter: #32d8b4;
	--ifm-color-primary-lightest: #4fddbf;
	--ifm-link-color: #ccc;
	--docusaurus-highlighted-code-line-bg: rgb(0 0 0 / 30%);
	--ifm-heading-color: #fff;
}

code {
	color: #eb5757;
	border-width: 0;
	padding: 3px 8px;
	font-size: 0.8em;
	font-weight: 600;
}

[data-theme="light"] code {
	background-color: #f0f0f0;
}

[data-theme="dark"] code {
	background-color: #111;
}

.theme-code-block {
	font-family: "IBM Plex Mono", monospace;
	font-size: 0.9em;
}

.theme-code-block .token {
	font-family: "IBM Plex Mono", monospace;
}

[data-theme="light"] .theme-code-block pre {
	background-color: #fafafa;
}

/* hide breadcrumbs from top of posts */
.theme-doc-breadcrumbs {
	display: none;
}

.theme-doc-sidebar-menu.menu__list {
	margin-top: 20px;
}

nav.menu {
	margin-right: 1px;
	padding: 0;
}

nav.menu::-webkit-scrollbar {
	display: none;
}

.menu__link {
	transition-property: none;
	line-height: 1.5;
	padding-left: 20px;

	/* word-spacing: 7px; */
	margin: 0 10px;
	border-radius: 3px;
}

p {
	line-height: 1.5;
}

blockquote {
	padding: 20px 30px;
	border-radius: 3px;
	font-style: italic;
	line-height: 1.5;
	margin-left: 20px;
	margin-right: 20px;
}

[data-theme="light"] blockquote {
	background-color: #f0f0f0;
	color: #000;
}

[data-theme="dark"] blockquote {
	background-color: #111;
}

[data-theme="light"] .navbar__brand:hover {
	color: #000;
}

[data-theme="dark"] .navbar__brand:hover {
	color: #fff;
}

.iconExternalLink_node_modules-\@docusaurus-theme-classic-lib-theme-Icon-ExternalLink-styles-module {
	display: none;
}

/* .navbar__items svg {
   display: none;
 } */

.pagination-nav__link {
	border-radius: 0;
	border: 0;
}

[data-theme="light"] .pagination-nav__link {
	border-top: 1px solid #ccc;
}

[data-theme="dark"] .pagination-nav__link {
	border-top: 1px solid #ccc;
}

[data-theme="light"] .pagination-nav__link:hover {
	border-top: 1px solid #000;
}

[data-theme="dark"] .pagination-nav__link:hover {
	border-top: 1px solid #fff;
}

.hero__subtitle {
	font-weight: 600;
	margin-bottom: 40px;
	margin-top: 30px;
}

[data-theme="light"] .hero__subtitle {
	color: #000;
}

[data-theme="dark"] .hero__subtitle {
	color: #fff !important;
}

.btn--black {
	background-color: #000;
	color: #fff;
}

.btn--black:hover {
	background-color: #000;
	color: #fff;
}

.iconExternalLink_nPIU {
	display: none;
}

.btn--landing {
	border-radius: 0;
	margin-right: 8px;
	margin-left: 8px;
	border-color: #000;
}

[data-theme="light"] .hero--bg {
	background-color: #fafafa;
}

[data-theme="dark"] .hero--bg {
	background-color: #111 !important;
}

article a {
	/* background-color: #f6f3d2; */
	text-decoration: underline;
}

article p a {
	text-decoration: underline;
	font-weight: 600;
	text-underline-position: under;
	margin-bottom: 5px;

	/* display: block; */
}

.hero--banner {
	padding: 10px !important;
}

.hero--banner,
.hero--banner a {
	margin: 0;
	color: #fff;
	background-color: #000;
	width: 100%;
}

.homepage-svg svg {
	height: auto !important;
	width: 100% !important;
	padding: 20px;
	max-width: 200px;
}

[data-theme="light"] .homepage-svg svg {
	background-color: #fafafa;
	color: #000;
}

[data-theme="dark"] .homepage-svg svg {
	background-color: #111 !important;
	color: #fff !important;
}

[data-theme="dark"] .homepage-svg path {
	filter: invert(1);
}

.index-buttons {
	padding: 0 !important;
}

.hero--container-small img {
	max-width: 100%;
}

.hiring-link {
	background-color: #ffde2d;
	color: #000;
	font-weight: 600;
	padding: 5px 10px;
	border-radius: 1px;
}

.footer__item .hiring-link {
	margin-top: 20px;
}

@media screen and (width >= 997px) {
	.hero--container {
		padding: 80px 200px;
	}

	.hero--container-small {
		padding: 40px 200px;
	}
}

@media screen and (width < 997px) {
	.hero--container {
		padding: 20px 0 0;
	}

	.hero--container h2,
	.hero--container-small h2 {
		font-size: 1.2em;
	}

	.hero--container-small {
		padding: 20px 40px;
	}

	.index-buttons {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.index-buttons a {
		margin-bottom: 10px;
	}

	.hero--banner a {
		font-size: 0.8em;
	}

	.hero__subtitle {
		font-size: 1.3rem;
		margin-bottom: 25px;
	}

	.homepage-svg svg {
		max-width: 120px;
		margin-left: 15px;
	}
}

.notbold a {
	font-weight: 400 !important;
}

[data-theme="light"] article p a {
	color: #333;
	text-decoration-color: #bfbfbf;
}

[data-theme="dark"] article p a {
	color: #ccc;
	text-decoration-color: #454545;
}

[data-theme="light"] article p a:hover {
	color: #111;
}

[data-theme="dark"] article p a:hover {
	color: #fff;
}

.menu__link--active {
	font-weight: 600;
}

.footer__title {
	color: #fff;
}

[data-theme="light"] a.footer__link-item {
	color: #fff;
}

[data-theme="dark"] a.footer__link-item {
	color: #fff;
}

[data-theme="light"] .menu__link--active {
	color: #000;
	background-color: #f0f0f0;
}

[data-theme="dark"] .menu__link--active {
	color: #fff;
	background-color: #111;
}

@media screen and (width >= 997px) {
	.menu_node_modules-\@docusaurus-theme-classic-lib-theme-DocSidebar-Desktop-Content-styles-module {
		padding: 0 !important;
	}

	.menu__list-item:not(:first-child) {
		margin-top: 0;
	}
}

.docSidebarContainer_node_modules-\@docusaurus-theme-classic-lib-theme-DocPage-Layout-Sidebar-styles-module {
	border-right-width: 0 !important;
}

/* from here - https://theochu.com/docusaurus/styling/ */
@media screen and (width <= 996px) {
	h1 {
		font-size: 1.5rem !important;
		font-weight: 600;
	}

	.hero .hero__title {
		font-size: 2.5rem;
	}
}

@media screen and (width >= 997px) {
	h1 {
		font-size: 2rem !important;
	}

	h2 {
		font-size: 1.5rem !important;
	}

	h3 {
		font-size: 1rem !important;
	}

	article {
		max-width: 700px;
		margin-left: auto;
		margin-right: auto;
		padding-top: 20px;
	}
}

/* Header Dropdown Menu */
.dropdown__link {
	font-size: inherit;
}

@media screen and (width >= 997px) {
	/* Show inline table of contents on mobile only */
	div[class^="tableOfContentsInline"] {
		display: none;
	}
}

/* 
.tabs {
}
*/

.tabs__item {
	padding: 3px 15px 2px;
	font-weight: 600;
	font-size: 0.9em;
	border-radius: 30px;
	color: #999;
	margin-right: 8px;
	background-color: #f0f0f0;
}

.tabs__item:hover {
	background-color: #e5e5e5;
}

.tabs__item--active {
	border-bottom: 0;
	background-color: rgb(50 125 255);
	border-radius: 30px;
	color: #fff;
}

.tabs__item--active:hover {
	background-color: rgb(50 125 255);
}

.tabs + .margin-top--md {
	margin-top: 5px !important;
}

.tabs + .margin-top--md pre {
	border-top-right-radius: 0;
	border-top-left-radius: 0;
}

.margin-bottom--xl {
	margin-bottom: 20px !important;
}

.margin-bottom--sm {
	margin-top: 10px !important;
	margin-bottom: 10px !important;
}

.hideTabSwitcher {
	display: none;
}

.markdown hr {
	background-color: rgb(120 120 120 / 20%);
}

div.special_table + table {
	border: none;

	/* border-collapse: separate; */

	/* border-spacing: 0px; */
}

div.special_table + table thead {
	background: rgb(120 120 120 / 10%);
	border-top-right-radius: 10px;
	overflow: hidden;
}

div.special_table + table thead tr {
	background: rgb(255 255 255 / 0%);
	border-top: 0;
	border-bottom: 0;
}

div.special_table + table tr th {
	background: rgb(255 255 255 / 0%);
	color: #000;
	font-weight: 600;
	padding: 5px 20px;
}

div.special_table + table tr td {
	padding: 5px 20px;
	text-align: left;
}

div.special_table + table tr:nth-child(even) {
	background: rgb(255 255 255 / 0%);
}

div.special_table + table,
th,
td {
	border-width: 0 !important;
}

.custom-tag {
	display: inline;
	background-color: #f0f0f0;
	padding: 3px 10px;
	margin-right: 5px;
	border-radius: 8px;
	font-size: 0.7em;

	/* text-transform: uppercase; */
	font-weight: 900;
	color: #000;
}

.custom-tag:hover {
	background-color: #e5e5e5;
}

.select-language {
	font-size: 1em;
	font-weight: bolder;
	margin-bottom: 8px;
}

.navbar__link:has(div.custom-tag) {
	padding: 0;
	margin: 0;
	margin-left: 5px;
}

.small-text {
	font-size: 0.8em;
}

.em {
	font-style: italic;
}

.category-header .menu__list-item-collapsible {
	pointer-events: none;
}

.category-header .menu__link--sublist {
	text-transform: uppercase;
	font-size: small;
	font-weight: bold;
	margin-top: 40px;
}

.category-header .menu__link--sublist-caret::after {
	display: none;
}

.category-link a::after {
	content: "\2192";
	font-size: 20px;
	transform: scaleX(-1) rotate(180deg);
	margin-left: 9px;
	position: absolute;
	right: 30px;
	opacity: 0.3;
}

.main-wrapper {
	min-height: 100vh;
}

.header-github-link::before {
	content: "";
	width: 24px;
	height: 24px;
	display: flex;
	background-color: var(--ifm-navbar-link-color);
	mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E");
	transition: background-color var(--ifm-transition-fast)
		var(--ifm-transition-timing-default);
}

.header-github-link:hover::before {
	background-color: var(--ifm-navbar-link-hover-color);
}

.header-discord-link::before {
	content: "";
	width: 24px;
	height: 24px;
	display: flex;
	background-color: var(--ifm-navbar-link-color);

	/* URL encode an svg https://yoksel.github.io/url-encoder/ */
	mask-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19.73 4.87a18.2 18.2 0 0 0-4.6-1.44c-.21.4-.4.8-.58 1.21-1.69-.25-3.4-.25-5.1 0-.18-.41-.37-.82-.59-1.2-1.6.27-3.14.75-4.6 1.43A19.04 19.04 0 0 0 .96 17.7a18.43 18.43 0 0 0 5.63 2.87c.46-.62.86-1.28 1.2-1.98-.65-.25-1.29-.55-1.9-.92.17-.12.32-.24.47-.37 3.58 1.7 7.7 1.7 11.28 0l.46.37c-.6.36-1.25.67-1.9.92.35.7.75 1.35 1.2 1.98 2.03-.63 3.94-1.6 5.64-2.87.47-4.87-.78-9.09-3.3-12.83ZM8.3 15.12c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.89 2.27-2 2.27Zm7.4 0c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.88 2.27-2 2.27Z' %3E%3C/path%3E%3C/svg%3E");
	transition: background-color var(--ifm-transition-fast)
		var(--ifm-transition-timing-default);
}

.header-discord-link:hover::before {
	background-color: var(--ifm-navbar-link-hover-color);
}
