cybertensor-developer-docs/src/css/style.css

/**
 * 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.
 */

/* You can override the default Infima variables here. */
:root {
	--ifm-color-primary: rgba(14, 16, 19, 1);
	--ifm-color-primary-dark: #29784c;
	--ifm-color-primary-darker: #277148;
	--ifm-color-primary-darkest: #205d3b;
	--ifm-color-primary-light: black;
	--ifm-color-primary-lighter: #359962;
	--ifm-color-primary-lightest: #3cad6e;
	--ifm-code-font-size: 95%;
	--ifm-h1-font-size: 1.8rem;
	--ifm-h2-font-size: 1.5rem;
	--ifm-h3-font-size: 1.2rem;
	--ifm-h4-font-size: 1rem;
	--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
	--text-primary: #5f6368;
	--text-secondary: #5f6368;
	--grey-100: #f8f9fa; /* --contrast-100 */
	--grey-900: #0e1013; /* --border-dashed-primary-hk */
	--ifm-menu-color-background-hover: var(--grey-100)
}

/* For readability concerns, you should choose a lighter palette in dark mode. */
[data-theme="dark"] {
	--ifm-color-primary: white;
	--ifm-color-primary-dark: white;
	--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;
	--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
	--ifm-background-surface-color: #000000 !important;
	--ifm-background-color: #000000 !important;
	--ifm-navbar-active-color: white;
	--ifm-navbar-item-color: #a5abaf;
	--ifm-footer-div-color: black;
	--ifm-table-of-contents-border: rgba(40, 42, 45, 1);
	--ifm-table-of-contents-border-active: rgba(248, 249, 250, 1);
	--ifm-table-of-contents-text: #a5abaf;
	--ifm-table-of-contents-text-active: white;
	--ifm-breadcrumbs__item--active: rgba(248, 249, 250, 1);
	--ifm-menu__link--active: #5f6368;
	--ifm-dropdown-background-color: #242526 !important;
	--ifm-footer-bg: #0E1013;
	--ifm-footer-company-name-color: white;
	--ifm-algolia-bg: #242526;
	--ifm-algolia-border: #7f8497;
	--ifm-navbar-border: #282A2D;
	--ifm-alert-secondary: rgba(235, 237, 240, 0.15);
	--ifm-alert-success: rgba(0, 164, 0, 0.15);
	--ifm-alert-info: rgba(84, 199, 236, 0.15);
	--ifm-alert-warning: rgba(255, 186, 0, 0.15);
	--ifm-alert-danger: rgba(250, 56, 62, 0.15);
	--ifm-blockquote-border: #606770;
	--ifm-tab-container-active-bg: white;
	--ifm-tab-container-active-color: black;
	--ifm-ul: #f5f6f7;
	--ifm-hr: rgba(95, 99, 104, 1);
	--ifm-search-icon-color: #a5abaf;
	--ifm-doc-search-border-color: #000000;
	--ifm-table-header-bg: #2B2B2D;
	--ifm-table-header-color: white;
	--ifm-table-body-color: #D7E3E3;
	--ifm-table-tr-border: #3c3e42;
	--ifm-doc-search-title-color: white;
	--ifm-dock-search-active-a-bg: #000000;
	--ifm-dock-search-active-a-color: white;
	--ifm-dock-search-svg-color: white;
	--ifm-doc-search-title-bg: #242526;
}

[data-theme="light"] {
	--ifm-color-primary: black;
	--ifm-color-primary-dark: white;
	--ifm-color-primary-darker: #1fa588;
	--ifm-color-primary-darkest: #1a8870;
	--ifm-color-primary-light: black;
	--ifm-color-primary-lighter: #32d8b4;
	--ifm-color-primary-lightest: #4fddbf;
	--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
	--ifm-navbar-active-color: black;
	--ifm-navbar-item-color: rgb(111, 112, 114);
	--ifm-footer-div-color: white;
	--ifm-table-of-contents-border: rgba(219, 221, 225, 1);
	--ifm-table-of-contents-border-active: black;
	--ifm-table-of-contents-text: #5F6368;
	--ifm-table-of-contents-text-active: #0E1013;
	--ifm-breadcrumbs__item--active: rgba(14, 16, 19, 1);
	--ifm-menu__link--active: rgb(111, 112, 114);
	--ifm-footer-bg: #0E1013;
	--ifm-footer-company-name-color: white;
	--ifm-algolia-bg: white;
	--ifm-algolia-border: #0E1013;
	--ifm-navbar-border: #DBDDE1;
	--ifm-alert-secondary: #F8F9FA;
	--ifm-alert-success: #E6F5E6;
	--ifm-alert-info: #EEF9FC;
	--ifm-alert-warning: #FFF8E6;
	--ifm-alert-danger: #FFEBEC;
	--ifm-blockquote-border: #DBDDE1;
	--ifm-tab-container-active-bg: black;
	--ifm-tab-container-active-color: white;
	--ifm-ul: rgba(95, 99, 104, 1);
	--ifm-hr: rgba(14, 16, 19, 1);
	--ifm-search-icon-color: #1c1e21;
	--ifm-doc-search-border-color: rgba(219, 221, 225, 1);
	--ifm-table-header-bg: #F8F9FA;
	--ifm-table-header-color: #5F6368;
	--ifm-table-body-color: rgba(95, 99, 104, 1);
	--ifm-table-tr-border: rgba(14, 16, 19, 1);
	--ifm-doc-search-title-color: rgba(14, 16, 19, 1);
	--ifm-dock-search-active-a-bg: white;
	--ifm-dock-search-active-a-color: #000000;
	--ifm-dock-search-svg-color: rgba(14, 16, 19, 1);
	--ifm-doc-search-title-bg: white;
}


@font-face {
	font-family: "Haffer";
	src: url(../../static/fonts/Haffer-Light.ttf);
	font-weight: 200;
	font-style: normal;
}

@font-face {
	font-family: "Haffer";
	src: url(../../static/fonts/Haffer-Medium.ttf);
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: "Haffer";
	src: url(../../static/fonts/Haffer-Regular.ttf);
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "Haffer";
	src: url(../../static/fonts/Haffer-SemiBold.ttf);
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: "HafferSQ";
	src: url(../../static/fonts/HafferSQ-Light.ttf);
	font-weight: 200;
	font-style: normal;
}

@font-face {
	font-family: "HafferSQ";
	src: url(../../static/fonts/HafferSQ-Medium.ttf);
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: "HafferSQ";
	src: url(../../static/fonts/HafferSQ-Regular.ttf);
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "HafferSQ";
	src: url(../../static/fonts/HafferSQ-SemiBold.ttf);
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: "TTCommonsPro";
	src: url(../../static/fonts/TTCommonsProMonoMedium.ttf);
	font-weight: 200;
	font-style: normal;
}

@font-face {
	font-family: "TTCommonsPro";
	src: url(../../static/fonts/TTCommonsProMonoRegular.ttf);
	font-weight: 100;
	font-style: normal;
}

@font-face {
	font-family: "FiraCode";
	src: url(../../static/fonts/FiraCode_VariableFont_wght.ttf);
}

@font-face {
	font-family: "DM Mono";
	src: url(../../static/fonts/DMMono-Regular.ttf);
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "DM Mono";
	src: url(../../static/fonts/DMMono-Medium.ttf);
	font-weight: 500;
	font-style: normal;
}

body {
	font-family: "Haffer";
	font-size: 16px;
	font-weight: 200;
	letter-spacing: 0%;
	line-height: 160%;
}

.h1 {
	font-family: "Haffer";
	font-size: 32px;
	font-weight: 400;
	letter-spacing: calc(-0.01 * 20px);
	line-height: 120%;
}

.h2 {
	font-family: "Haffer";
	font-size: 24px;
	font-weight: 400;
	letter-spacing: calc(-0.01 * 20px);
	line-height: 120%;
}

.h3 {
	font-family: "Haffer";
	font-size: 20px;
	font-weight: 400;
	letter-spacing: 0%;
	line-height: 120%;
}

.h4 {
	font-family: "Haffer";
	font-size: 16px;
	font-weight: bold;
	letter-spacing: 0%;
	line-height: 140%;
}

a {
	/* color: rgb(0, 49, 0); */
	color: none;
	font-weight: 400;
}


h1 {
	font-weight: 400 !important;
	font-size: 32px !important;
	padding-bottom: 22px !important;
	margin-top: -16px !important;
}

h1.anchor {
	font-weight: 400 !important;
	font-size: 32px !important;
}

h2 {
	font-weight: 400 !important;
	font-size: 24px !important;
}

h2.anchor {
	font-weight: 400 !important;
	font-size: 24px !important;
}

h3 {
	font-weight: 400 !important;
	font-size: 20px !important;
}

h3.anchor {
	font-weight: 400 !important;
	font-size: 20px !important;
}

h4 {
	font-size: 16px !important;
	font-weight: bold !important;
}

h4.anchor {
	font-size: 16px !important;
	font-weight: bold !important;
}

p {
	font-size: 16px !important;
	font-weight: 400 !important;
}

.menu__list {
	list-style: none;
	margin: 0 !important;
	padding-left: 0 !important;
	font-family: "FiraCode";
	font-size: 12px;
	font-weight: 400;
	letter-spacing: calc(0.05 * 12px);
	line-height: 150%;
	text-transform: uppercase;
}

.theme-doc-sidebar-item-category > ul > li > a {
	padding-left: 48px;
}

.theme-doc-sidebar-container > div > div {
	padding-top: 96px !important;
	margin-top: -96px !important;
}

.table-of-contents,
.table-of-contents ul {
	font-family: "FiraCode";
}
[class*="tableOfContents"] {
	padding-top: 20px;
}

.pagination-nav__link--prev .pagination-nav__label::before {
	content: "";
}

.pagination-nav__link--next .pagination-nav__label::after {
	content: "";
}

.pagination-nav__link {
	border: none;
}

.navbar__link {
	font-size: 12px;
	font-weight: 500;
	font-family: 'DM Mono', monospace;
	color: var(--text-secondary);
	letter-spacing: 0.6px;
}
[data-theme="dark"] .navbar__link:hover {
	color:#e3e3e3 !important;
}

.navbar__link:hover {
	color: #000 !important;
}

.theme-last-updated {
	font-style: normal;
	font-weight: 400;
	font-size: 9px;
	text-transform: uppercase;
	font-family: "FiraCode";
}

.parameter-label {
	display: inline-block;
	position: relative;
	top: 3px;
	color: #fff;
	text-transform: uppercase;
	font-size: 11px;
	font-weight: 700;
	padding: 1px 5px;
}

.success {
	background: #859900;
}

.important {
	background: #dc322f;
}


ul {
	font-family: "Haffer";
	font-weight: 200;
	text-transform: none;
}

.navbar {
	margin-bottom: 10px;
}

.sidebar-title {
	font-size: 1rem;
	font-family: "Haffer";
	font-weight: 500;
	letter-spacing: 0.05em;
	margin: 0.7rem;
	text-transform: uppercase;
}

#bittensor-img {
	width: 80%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* ALGOLIA SEARCH INPUT */

/* NAVBAR LINKS */
.navbar__item.navbar__link {
	font-family: 'DM Mono', monospace;
	color: var(--text-secondary);
	font-size: 12px !important;
	align-items: center;
	letter-spacing: 0.6px;
	margin-left: 32px;
}
@media (min-width: 997) {
	.navbar__item.navbar__link {
		display: flex;
	}
}

.dropdown--right {
	margin-right: auto;
	margin-bottom: 0 !important;
}

/* NAV TITLE */
.navbar__title.text--truncate {
	font-size: 16px !important;
	line-height: 27.2px !important;
	font-weight: 400 !important;
	font-family: "Haffer";
	letter-spacing: 0.32px;
}

/* Bread Crumb */
.breadcrumbs__item .breadcrumbs__link {
	color: var(--text-secondary);
	line-height: 130%;
	letter-spacing: 0.6px;
}

.breadcrumbs__item.breadcrumbs__item--active .breadcrumbs__link {
	background: initial !important;
	color: var(--text-primary);
	font-family: 'DM Mono', monospace;
}

/* Footer */

.footer__copyright.footer__copyright__custom .container {
	max-width: 100%;
}

@media (min-width: 1440px) {
	.footer .container {
		max-width: 100% !important;
		padding: 0;
	}
}

.theme-doc-sidebar-container>div>div {
	width: 100% !important;
}

.theme-doc-sidebar-container nav {
	padding: 16px 16px 16px 16px !important;
	margin-top: 80px;
}

.menu__link {
	padding: 15px;
	font-size: 15px !important;
}
.menu__link--sublist-caret::after{
	background: url('data:image/svg+xml;utf8,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_2202_2258)"><path d="M11.7691 9.99968L8.83325 12.9355L8.83325 7.06381L11.7691 9.99968Z" fill="%230E1013"/></g><defs><clipPath id="clip0_2202_2258"><rect width="16" height="16" fill="white" transform="translate(2 18) rotate(-90)"/></clipPath></defs></svg>');
	transform: rotate(90deg);
}
.menu__caret::before{
	background: url('data:image/svg+xml;utf8,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_2202_2258)"><path d="M11.7691 9.99968L8.83325 12.9355L8.83325 7.06381L11.7691 9.99968Z" fill="%230E1013"/></g><defs><clipPath id="clip0_2202_2258"><rect width="16" height="16" fill="white" transform="translate(2 18) rotate(-90)"/></clipPath></defs></svg>');
}
.menu__caret{
 transform: rotate(270deg);
 margin-right: 2px;
}
.menu__list-item--collapsed .menu__link--sublist::after, .menu__list-item--collapsed.menu__caret::before{
	transform: rotateZ(0deg) !important;
}
.theme-doc-sidebar-menu.menu__list > li {
	position: relative;
}
.theme-doc-sidebar-menu.menu__list > li::after {
	content: '';
	background-position: 0 0;
	background-image: linear-gradient(to right, var(--grey-900), 1.5px, transparent 1.5px);
	background-repeat: repeat-x;
	background-size: 6px;
	display: block;
	width: 100%;
	height: 1.5px;
	position: absolute;
	bottom: 0px;
	left: 0;
}

.menu__list-item-collapsible {
	position: relative;
}
.menu__list-item-collapsible::after {
	content: '';
	background-position: 0 0;
	background-image: linear-gradient(to right, var(--grey-900), 1.5px, transparent 1.5px);
	background-repeat: repeat-x;
	background-size: 6px;
	display: block;
	width: 100%;
	height: 1.5px;
	position: absolute;
	bottom: 0px;
	left: 0;
}

.theme-doc-sidebar-item-link-level-2 {
	position: relative;
}
.theme-doc-sidebar-item-link-level-2:not(:last-child)::after {
	content: '';
	background-position: 0 0;
	background-image: linear-gradient(to right, var(--grey-900), 1.5px, transparent 1.5px);
	background-repeat: repeat-x;
	background-size: 6px;
	display: block;
	width: 100%;
	height: 1.5px;
	position: absolute;
	bottom: 0px;
	left: 0;
}

.theme-doc-sidebar-menu.menu__list li {
	margin: 0 !important;
}

.theme-doc-sidebar-menu.menu__list li > a {
	height: 48px;
}

.menu__link.menu__link--sublist.menu__link--sublist-caret {
	height: 48px;
}

.menu__link {
	border-radius: 0 !important;
	color: var(--ifm-navbar-item-color);
	font-size: 12px !important;
	font-family: 'DM Mono', monospace;
	letter-spacing: 0.6px !important;
}

[data-theme="dark"] .menu__link:hover {
	color:var(--ifm-table-of-contents-text-active);
	background-color: transparent;
}

[data-theme="dark"] .menu__list-item-collapsible {
	background-color: transparent !important;
	color:var(--ifm-table-of-contents-text-active) !important;
}

.menu__link--active {
	background-color: transparent !important;
	color: var(--ifm-navbar-active-color) !important;
	font-weight: 600;
}

/* custom style for navbar - Change the Class name if you want stick with it (custom_algolia)  */
.custom__algolia__search__container_xfkw>div>div {
	width: 353px !important;
	min-width: 353px !important;
	max-width: 353px !important;
	height: 50px;
}

.custom__algolia__search__container_xfkw>div {
	width: 353px !important;
	min-width: 353px !important;
	max-width: 353px !important;
	height: 50px;
}

@media screen and (min-width: 996px) {
	.custom_algolia {
		position: absolute;
		left: 178px;
		top: 200px;
	}
	.custom_algolia > div {
		display: block !important;
	}
}


.search_container > div {
	width: 268px !important;
	height: 50px;
}

.navbar__inner {
	align-content: center;
}

.navbar__item {
	padding: 0;
}

.navbar__items--right {
	gap: 0 32px !important;
	height: 48px;
}

/* right bar style */
.table-of-contents__link {
	color: #5F6368;
	font-family: 'DM Mono', monospace;
	font-size: 0.75rem;
	line-height: 130%;
	letter-spacing: 0.6px;
}

.table-of-contents__link--active {
	font-weight: bold;
}

.table-of-contents.table-of-contents__left-border {
	border: none !important;
}

.table-of-contents.table-of-contents__left-border li {
	margin: 0 !important;
}

.table-of-contents.table-of-contents__left-border li a {
	padding: 10px 0;
	padding-left: 15px;
}

.table-of-contents.table-of-contents__left-border ul {
	padding: 0 !important;
}

.table-of-contents>li>ul>li>a {
	padding-left: 30px !important;
	display: table !important;
}

.table-of-contents>li>ul>li>ul>li>a {
	margin-left: 45px !important;
}

.table-of-contents .table-of-contents__link:hover {
	color: var(--ifm-table-of-contents-text-active) !important;
}

.container.padding-top--md {
	position: relative;
}

.container.padding-top--md>div>div:last-child {
	padding-left: 1rem !important;
}

.container.padding-top--md>div>div:first-child {
	padding: 32px 32px 48px 56px !important;
}
/*  */
@media screen and (max-width: 550px) {
	.container.padding-top--md>div>div:first-child {
		padding: 32px 32px 48px 32px !important;
	}
}

.breadcrumbs:first-child svg {
	top: 0px !important;
	height: 1rem;
	width: 1rem;
}

.breadcrumbs__item--active span {
	padding: 5px;
}

/* dropdown */
.dropdown {
	z-index: 9999 !important;
	padding-bottom: 10px;
	margin-bottom: -10px !important;
}

.dropdown_menu_container {
	position: relative;
}

.dropdown_menu_container li {
	list-style: none;
}

.dropdown_menu_container .dropdownNavbarItemNested {
	position: absolute;
	left: 100%;
}

.dropdown__menu {
	padding: 0;
	min-width: 200px !important;
	border: 1px solid var(--ifm-navbar-border);
	box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.08); 
	border-radius: var(--border-radius-border-radius-base, 4px); 
}
.dropdown--right .dropdown__menu{
	right: unset;
}

.dropdown__menu .dropdown__link {
	padding: 7px 20px !important;
	border-radius: 0 !important;
	margin: 0 !important;
	cursor: pointer;
	color: var(--text-secondary, #5F6368);
	font-family: 'DM Mono', monospace;
	font-size: 12px;
	letter-spacing: 0.6px;
	text-transform: uppercase; 
}

/* Custom bottom border mixin */
.dropdown__menu > li {
	position: relative;
}
.dropdown__menu > li:not(:last-child)::after {
	content: '';
	background-position: 0 0;
	background-image: linear-gradient(to right, var(--grey-900), 1.5px, transparent 1.5px);
	background-repeat: repeat-x;
	background-size: 6px;
	display: block;
	width: 100%;
	height: 1.5px;
	position: absolute;
	bottom: 0;
	left: 0;
}

.dropdown__link:hover {
	background-color: var(--grey-100);
}

.dropdown__menu ul {
	padding-left: 15px !important;
	height: 0;
	overflow: hidden;
	transition: all ease 0.3s !important;
}

@keyframes heightAnimation {
	0% {
		height: 0px;
		border-bottom: 1px dashed rgba(95, 99, 104, 1);
	}

	100% {
		border-bottom: 1px dashed rgba(95, 99, 104, 1);
		height: 100%;
	}
}

.dropdown__menu .active-nested-dropdown {
	animation-name: heightAnimation;
	animation-duration: 1s;
	animation-fill-mode: both;
}

.dropdown__menu_nested_items {
	border-bottom: 1px dashed rgba(95, 99, 104, 1) !important;
}

.dropdown__menu li:last-child a {
	border-bottom: 0 !important;
}

.dropdown__menu li:last-child ul {
	border-bottom: 0 !important;
}

.dropdown__menu li:last-child {
	border-bottom: 0 !important;
}

.dropdown__menu ul li {
	list-style: none !important;
}

.dropdown__menu .has-dropdown {
	display: flex;
	width: 100% !important;
	position: relative;
}

.dropdown__menu .has-dropdown a {
	width: 100% !important;
}

.dropdown__menu .has-dropdown .arrow {
	position: absolute;
	right: 15px;
	top: 12px;
}

.navbar__item.dropdown a {
	/* margin-top: 6px; */
	display: block;
}

.navbar__item.dropdown a::after {
	margin-left: 8px !important;
	margin-bottom: 2px !important;
}

/* Dropdown caret */
.dropdown > .navbar__link::after {
	border-width: 0.3em 0.3em 0;
	top: 1px;
}

/* breadcrumbs styles */
.breadcrumbs {
	display: flex;
	flex-wrap: wrap;
}

.breadcrumbs .breadcrumbs__item::after {
	background: url("../../static//img/slice.svg");
	height: 15px;
	background-size: cover;
	background-repeat: no-repeat;
}

.breadcrumbs .breadcrumbs__item span {
	padding: 0 !important;
	display: table;
}

.breadcrumbs .breadcrumbs__item {
	display: flex;
	align-items: center;
}

.breadcrumbs .breadcrumbs__item:first-child {
	display: flex !important;
}

.breadcrumbs .breadcrumbs__item .breadcrumbs__link {
	padding: 0 !important;
	font-size: 0.75rem;
}

.breadcrumbs__item--active span {
	color: var(--ifm-breadcrumbs__item--active) !important;
}

/* Feedback */
.feedback {
	display: flex !important;
	align-items: center;
	gap: 0 20px;
}

.feedback span {
	font-weight: 400 !important;
	text-transform: uppercase;
	font-size: 0.7rem;
	font-family: 'DM Mono', monospace;
	letter-spacing:0.6;
}

.feedback .feelings {
	display: flex;
	align-items: center;
	gap: 0 16px;
}

.feeling {
	width:32px;
	height:32px;
	border: 1px solid rgba(219,221,225,1);
	border-radius:4px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.feedbackAndName {
	display: flex;
	align-items: center;
	width: 100%;
	justify-content: space-between;
	margin-top: 80px;
}

.feeling-symbol {
	cursor: pointer !important;
}

.footer-line div {
	position: absolute;
	left: 0;
	right: 0;
	width: 100% !important;
	border-top: 2px solid var(--ifm-navbar-border);
	margin-top: -10px;
	height: 110px;
	z-index: 9 !important;
	background-color: var(--ifm-footer-div-color);
}

/* pagination */
.pagination-nav {
	display: flex !important;
	justify-content: space-between;
	z-index: 99 !important;
	position: relative;
}

.pagination-nav .pagination-nav__link {
	max-width: 30% !important;
}

.pagination-nav:has(.pagination-nav__link:first-child.pagination-nav__link--next) {
	justify-content: end;
}


.table-of-contents.table-of-contents__left-border li a {
	border-left: 1px solid var(--ifm-table-of-contents-border);
}

.table-of-contents.table-of-contents__left-border li a {
	font-weight: 400;
	color: var(--ifm-table-of-contents-text);
}

.table-of-contents__link--active {
	border-left: 1px solid var(--ifm-table-of-contents-border-active) !important;
	color: var(--ifm-table-of-contents-text-active) !important;
}

.menu__link--sublist-caret.menu__link--active {
	color: var(--ifm-menu__link--active) !important
}

.footer {
	padding: 25px 30px !important;
	background-color: var(--ifm-footer-bg) !important;
}

.footer .footer__copyright {
	font-family: TTCommonsPro !important;
	font-size: 14px !important;
	text-transform: uppercase !important;
	display: flex;
	align-items: center;
	justify-content: space-between;
}


.footer .footer__copyright a {
	color: var(--ifm-footer-company-name-color) !important;
}


/* Algolia Search */
.DocSearch {
	position: fixed !important;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.DocSearch .DocSearch-Modal {
	background-color: var(--ifm-algolia-bg) !important;
	border-radius: 10px !important;
	min-width: 40% !important;
}

.DocSearch .DocSearch-Footer {
	display: none !important;
}

.DocSearch .DocSearch-Form {
	background-color: var(--ifm-algolia-bg) !important;
	box-shadow: inset 0 0 0 1px var(--ifm-algolia-border) !important;
}

.DocSearch .DocSearch-Form label {
	color: var(--ifm-algolia-border) !important;
}

.DocSearch .DocSearch-Form label svg {
	width: 20px !important;
	height: 20px !important;
}

.DocSearch .DocSearch-Form input::placeholder {
	font-size: 16px !important;
}

.DocSearch .DocSearch-Form input {
	font-size: 16px !important;
}

.DocSearch-Modal .DocSearch-Hit-source {
	font-size: 14px !important;
	text-transform: uppercase !important;
	font-family: TTCommonsPro !important;
}

.DocSearch-Modal #docsearch-list li {
	margin: 0 !important;
}

.navbar {
	border-bottom: none !important;
	box-shadow: none !important;
}

.navbar__logo {
	margin-right: 13rem;
}
  
/* Components design */
.alert {
	position: relative;
	border-left-width: 3px !important;
	border-radius: 0 !important;
	font-family: Haffer !important;
	box-shadow: 0 !important;
}

.alert.alert--secondary {
	background-color: var(--ifm-alert-secondary) !important;
}

.alert.alert--success {
	background-color: var(--ifm-alert-success) !important;
}

.alert.alert--info {
	background-color: var(--ifm-alert-info) !important;
}

.alert.alert--warning {
	background-color: var(--ifm-alert-warning) !important;
}

.alert.alert--warning span svg {
	width: 18px !important;
}

.alert.alert--danger {
	background-color: var(--ifm-alert-danger) !important;
}

.alert.alert--success svg,
.alert.alert--info svg,
.alert.alert--secondary svg {
	width: 1.1rem !important;
	height: 1.1rem !important;
}

blockquote {
	border-left: 3px solid var(--ifm-blockquote-border) !important;
}

.language-bash>div span>span.token.plain {
	font-family: FiraCode !important;
}

.theme-code-block div:first-child {
	display: flex !important;
	align-items: center;
	gap: 0 10px !important;
	font-family: FiraCode !important;
}

.theme-code-block div:first-child svg {
	margin-top: -1px !important;
}

code {
	font-family: FiraCode !important;
}

.tabs-container>ul {
	display: flex !important;
	gap: 0 5px;
}

.tabs-container>ul li {
	border-radius: 5px !important;
	font-weight: 400 !important;
	letter-spacing: 2px;
	font-size: 14px !important;
	padding: 8px 10px !important;
	padding-bottom: 5px !important;
}

.tabs-container>ul li.tabs__item--active {
	border-bottom: 0 !important;
	background-color: var(--ifm-tab-container-active-bg) !important;
	color: var(--ifm-tab-container-active-color) !important;
}

table {
	background-color: transparent !important;
	border-color: transparent !important;
	border-spacing: 0 !important;
	border: 0 !important;
	width: 100% !important;
	min-width: 100% !important;
	display: table !important;
}

table thead {
	background-color: var(--ifm-table-header-bg) !important;
}


table tr {
	border-bottom: 1px dotted var(--ifm-table-tr-border) !important;
	border: 0 !important;
	border-spacing: 10px !important;
	background-color: transparent !important;
	background-image: linear-gradient(to right, var(--ifm-table-tr-border) 50%, transparent 50%);
	background-size: 7px 1px;
	background-repeat: repeat-x;
	background-position: 0 bottom;
}

table tbody tr:last-child {
	border-bottom: 0 !important;
	background-image: none !important;
}

table tbody {
	background-color: transparent !important;
}

table tr td,
th {
	border: 0 !important;
	font-weight: 400 !important;
}

table tr th {
	color: var(--ifm-table-header-color) !important;
	font-size: 15px !important;
	text-align: center !important;
	font-family: TTCommonsPro !important;
	font-weight: 600 !important;
}

table tr th:first-child {
	text-align: start !important;
}

table tr th:last-child {
	text-align: start !important;
}

table tr td {
	color: var(--ifm-table-body-color) !important;
	font-size: 14px !important;
}

table tr td:first-child {
	font-weight: 400 !important;
}

hr {
	background-color: transparent !important;
	background-image: linear-gradient(to right, var(--ifm-hr) 10%, transparent 30%);
	background-size: 5px 7px;
	background-repeat: repeat-x;
	background-position: 0 bottom;
}

ol:not([class]) li {
	font-size: 16px !important;
	font-weight: 400 !important;
	font-family: "Haffer";
}

ul.dashed_ul {
	list-style-type: none !important;
	padding: 0 !important;
	padding-left: 25px !important;
}

ul.dashed_ul>li {
	font-size: 16px !important;
	position: relative;
	font-weight: 400 !important;
}

ul.dashed_ul>li::before {
	content: "" !important;
	display: block;
	width: 8px !important;
	background-color: var(--ifm-ul) !important;
	height: 1px !important;
	margin-top: 12px !important;
	margin-right: 10px !important;
	position: absolute;
	left: -15px;
}


p>a>img[loading="lazy"] {
	width: 100% !important;
}

.open_grepper_editor {
	display: none !important;
}


.theme-doc-sidebar-menu.menu__list li:first-child>div {
	display: none !important;
}

.navbar .navbar__inner .navbar__items .navbar__brand {
	display: flex;
}

.lastEdit {
	width: 100%;
	text-align: right;
	font-size: 12px !important;
	font-family: TTCommonsPro !important;
	color: #5f6368;
	position: absolute !important;
	top: -15px !important;
}

.navbar.navbar--fixed-top {
	margin-bottom: 0 !important;
}

main article {
	position: relative !important;
}

main article a {
	text-decoration: underline !important;
}

footer .container.container-fluid {
	margin: 0 !important;
	max-width: 100% !important;
}

#docsearch-list {
	border: 2px solid var(--ifm-doc-search-border-color) !important;
	border-radius: 5px !important;
}

#docsearch-list li {
	padding: 0 !important;
}

#docsearch-list li a {
	box-shadow: none !important;
	border-bottom: 1px dashed var(--ifm-doc-search-border-color) !important;
	background-color: transparent !important;
}

#docsearch-list li:last-child a {
	border-bottom: 0 !important;
}

#docsearch-list li a .DocSearch-Hit-icon svg {
	color: var(--ifm-dock-search-svg-color) !important;
}

.DocSearch-Hits .DocSearch-Hit-source {
	font-weight: 600 !important;
	color: var(--ifm-doc-search-title-color) !important;
	font-size: 13px !important;
	letter-spacing: 1px !important;
	background: var(--ifm-doc-search-title-bg) !important;
}

.DocSearch-Hit[aria-selected=true] a {
	background-color: var(--ifm-dock-search-active-a-bg) !important;
	border-radius: 0 !important;
}

.DocSearch-Hit[aria-selected=true] a .DocSearch-Hit-title {
	font-weight: bold !important;
	color: var(--ifm-dock-search-active-a-color) !important;
}

.DocSearch-Hit[aria-selected=true] a .DocSearch-Hit-title mark {
	font-weight: bold !important;
	color: var(--ifm-dock-search-active-a-color) !important;
	background-color: rgba(233, 244, 164, 1) !important;
	color: #000000 !important;
}

.DocSearch-Hit[aria-selected=true] a .DocSearch-Hit-path {
	font-weight: 400 !important;
	color: var(--ifm-dock-search-active-a-color) !important;
}

.DocSearch-Hit[aria-selected=true] a .DocSearch-Hit-path mark {
	font-weight: 600 !important;
	color: var(--ifm-dock-search-active-a-color) !important;
	background-color: rgba(233, 244, 164, 1) !important;
	color: #000000 !important;
}

.DocSearch-Hit[aria-selected=true] a .DocSearch-Hit-Tree {
	color: var(--docsearch-muted-color) !important;
}


[data-theme="dark"] {
	.theme-doc-sidebar-menu li:first-child>div>div {
		border: 1px solid #282a2d !important;
	}
}

[data-theme="light"] {
	.menu__link--sublist-caret.menu__link--active {
		font-weight: 400;
	}

	.footer__copyright.footer__copyright__custom {
		color: var(--grey-100) !important;
	}
}

@media screen and (max-width: 1310px) {
	.navbar__inner .navbar__items--right a:nth-child(3) {
		margin-right: 20px !important;
	}
}

@media screen and (max-width: 996px) {
	.navbar__inner .navbar__items:first-child div {
		right: 0 !important;
	}

	.navbar.navbar--fixed-top {
		padding: 10px 15px !important;
	}

	.navbar__inner .search_container div:last-child {
		margin-right: 0px !important;
	}

	.theme-doc-sidebar-menu.menu__list li:first-child>div {
		display: block !important;
	}

	.navbar__inner .search_container {
		width: 100%;
	}

	.navbar__toggle.clean-btn {
		margin-bottom: 5px;
	}

	.navbar__items.navbar__items--right {
		display: none;
	}
}


@media screen and (max-width: 600px) {

	.pagination-nav .pagination-nav__link {
		max-width: 45% !important;
		width: 100% !important;
		padding: 0 !important;
	}

	.footer-line div {
		height: 2px !important;
	}

	.footer {
		padding: 20px 10px !important;
	}

	.footer .footer__copyright {
		gap: 0 20px !important;
	}

	.navbar {
		padding: 5px 20px !important;
	}
}

@media screen and (max-width: 550px) {
	.pagination-nav.docusaurus-mt-lg {
		margin-top: 80px !important;
	}
}

@media screen and (max-width: 500px) {
	.navbar-sidebar {
		width: 100% !important;
	}

	.navbar-sidebar__item:last-child {
		width: 100% !important;
	}

	.pagination-nav .pagination-nav__link {
		max-width: 489 !important;
	}

	.navbar-sidebar__item menu{
		width: 100% !important;
	}
	
}


@media screen and (max-width: 420px) {

	.navbar {
		padding: 5px 10px !important;
	}

	.footer {
		padding: 20px 0 !important;
	}
}

.pagination-nav__link--next > .pagination-nav__label{
	text-align: right;
}

.pagination-nav__link--next > .pagination-nav__sublabel {
    font-family: 'DM Mono', monospace;
    position: relative;
	padding-right: 12px;
	text-align: right;
}

.pagination-nav__link--next > .pagination-nav__sublabel::before {
    content: "";
    position: absolute; 
    right: 0px;
    top: 4.5px; 
    width: 0;
    height: 0;
    border-top: 4px solid transparent; /* Adjust the size of the arrow */
    border-bottom: 4px solid transparent; /* Adjust the size of the arrow */
    border-left: 6px solid rgb(82, 88, 96); /* Adjust the size and color of the arrow */
}

.pagination-nav__link--prev > .pagination-nav__sublabel {
    font-family: 'DM Mono', monospace;
    position: relative;
	padding-left: 12px;
}

.pagination-nav__link--prev > .pagination-nav__sublabel::before {
    content: "";
    position: absolute; 
    left: 0px;
    top: 4.5px; 
    width: 0;
    height: 0;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-right: 6px solid rgb(82, 88, 96);
}