/*
	2= Code boxes
*/

/*================================================*/
/* Variables
/*================================================*/

:root {
	--background-color: #ffffff;
	--color-background-accent: #f2f2f2;
	--border-color: #cccccc;
	--fore-color: #333333;
	--disabled-fore-color: #333333;
	--disabled-background-color: #f2f2f2;
	--dark-border-color: #495057;
	--dark-table-background-color: #212529;
	/* Bootstrap overrides */
	--bs-link-color: #337ab7;
	--bs-link-color-rgb: 51, 122, 183;
	--bs-highlight-bg: rgb(255, 255, 49);
	--card-gutter: 10px;
}

/*================================================*/
/* General
/*================================================*/




body {
	color: var(--fore-color);
	position:relative; /*needed for scrollspy*/
}

.h1, h1 {
	font-size: 36px
}

.h2, h2 {
	font-size: 30px
}

.h3, h3 {
	font-size: 24px
}

.h4, h4 {
	font-size: 18px
}

.h5, h5 {
	font-size: 14px
}

.h6, h6 {
	font-size: 12px
}

article p,
article li {
	margin-top: 16px;
}

a, a:hover, a:active, a:visited, a:focus {
	text-decoration: none;
}

a:focus {
	outline-width:2px;
}

a.external[href]:after {
	display: none;
}

.list-unstyled-all ul,
ul.list-unstyled-all {
	list-style: none;
}

.list-compact li {
	line-height: 1.1;
}


.mr-0 {
	margin-right: 0 !important;
}

.mr-1 {
	margin-right: calc(var(--card-gutter) * 1) !important;
}

.mr-2 {
	margin-right: calc(var(--card-gutter) * 2) !important;
}

.mr-3 {
	margin-right: calc(var(--card-gutter) * 3) !important;
}

.mr-4 {
	margin-right: calc(var(--card-gutter) * 4) !important;
}


label{
	display: inline-block;
	max-width:100%;
	margin-bottom:5px;
	font-weight:700;
}

input[type=checkbox], input[type=radio] {
	margin: 4px 0 0;
	line-height:normal;
}
/*================================================*/
/* Header 
/*================================================*/
body > header {
	flex-direction: column !important;
	height: unset;
	margin-bottom: 15px;
}

body > header .subnav {
	background-color: #f8f8f8;
	border-bottom: 1px solid rgb(231,231,231);
}

body > header #breadcrumb {
	padding: 10px !important;
	background: none;
	min-height:40px;
}

body > header #breadcrumb .breadcrumb {
	margin: 0;
}

body {
	font-size: 16px;
}

html[data-bs-theme='dark'] .logo.light {
	display: none;
}

html[data-bs-theme='light'] .logo.dark {
	display: none;
}

.navbar .navbar-nav a.nav-link.active
 {

	border-bottom: 4px solid #337ab7;
	font-weight: bold;
}

.navbar .navbar-nav a.nav-link:focus,
.navbar .navbar-nav a.nav-link:hover
{
	text-decoration:underline
}
/*================================================*/
/* Table of contents 
/*================================================*/
.toc li {
	padding-left: 1rem;
}

.toc .expand-stub:before {
	margin-left: -1rem;
}

.toc li.active a {

}

.toc li.active > a:first-of-type {
	font-weight: bold;
}



/*================================================*/
/* Affix 
/*================================================*/


#affix h5 {
	font-family: "Segoe UI";
	font-weight: 600;
	text-transform: none;
	border: none !important;
	font-size: 1.25rem;
	letter-spacing: initial;
}

#affix li {
	font-size: initial;
}

#affix li a {
	color: rgba(var(--bs-link-color-rgb)) !important;
}

#affix .link-secondary {
	margin-left: 1.5rem;
}

#affix .nav {
	--bs-nav-link-padding-x: 0;
	--bs-nav-link-padding-y: 0;
	display:inline;
}

#affix .nav a.nav-link {
	padding-left: 5px;
}

#affix .nav a.nav-link.active {
	font-weight: bold;
	border-left: 4px solid rgba(var(--bs-link-color-rgb));
	
}

body:not([data-search])[data-layout=""] > main > .affix, body:not([data-search])[data-layout=conceptual] > main > .affix {
	width: 260px;
}

/*================================================*/
/* Tabs
/*================================================*/

	.tabGroup .nav-tabs a[role="tab"] {
	color: #222;
}

.tabGroup .nav-tabs a[role="tab"][aria-selected="true"] {
	border-bottom: 2px solid #0050C5;
}

.tabGroup .nav-item {
	border: none;
}

/*********************************************\
/* Code boxes
\*********************************************/

article .code-header {
	font-size: 0.875em;
	background-color: var(--color-background-accent);
	display: flex;
	border: 1px solid var(--border-color);

	/*border-bottom: none;*/
	/*border-top-left-radius: 4px;*/
	border-top-right-radius: 4px;
	margin-top: 16px;
}

article .code-header .language {
	flex-grow: 1;
	margin-left: 5px;
	padding: 5px;
}

article .code-header button {
	background-color: transparent;
	border: none;
	padding: 5px;
	border-left: 1px solid var(--border-color);
	border-top-right-radius: 4px;
	display: flex;
	position: relative;
}

article .code-header button .copying {
	display: none;
}

article .code-header button.copied {
	display: flex;
	align-items: center;
}

article .code-header button.copied .copying {
	transition: background-color linear 1s;
	display: flex;
	background-color: green;
	position: absolute;
	left: 0;
	top: 0;
	color: #f5f5f5;
	width: 100%;
	height: 100%;
	text-align: center;
	padding: 5px;
	border-top-right-radius: 4px;
}

article .code-header button.copied .copying .icon {
	flex-grow: 1;
}


article .code-header button:hover {
	background-color: rgba(255,255,255,0.98);
}

pre {
	border: 1px solid #ccc;
}

pre, code {
	font-family: Consolas, "Courier New", monospace;
}

pre > .code-action {
	display: none !important;
}

pre.no-header code {
	display: inline;
}

pre.mermaid {
	padding:var(--bs-gutter-x);
}

article pre:not(.no-header) {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-top: none;
}

article pre > code {
	font-size: 0.75rem;
}

/* Inline code */
article :not(a):not(pre) > code {
	font-size: 0.8em;
	border-radius: 3px;
	padding: .1em .2em;
	background-color: #f5f5f5;
}

/*********************************************\
=3 Components
\*********************************************/

.email-example {
	border: 1px solid #ccc;
	border-radius: 8px;
	padding: 10px;
	font-family: Aptos, Arial, Helvetica, sans-serif
}

.email-example p:last-child {
	margin-bottom: 0 !important;
}

.temporary {
	border: 2px dashed #c4b37f;
	border-radius: 8px;
	background-color: rgb(255, 242.6, 205.4);
	padding:20px;
	font-family: Consolas, 'Lucida Console', 'Courier New', serif;
	margin-bottom:20px;
}

.temporary h1,
.temporary h2,
.temporary h3,
.temporary h4,
.temporary h5,
.temporary h6 {
	text-align: center;
}


.temporary h2::before {
	font-family: "font awesome 6 pro";
	font-weight: 400;
	content: "\e32e";
	margin-right: .75rem;
}

/*********************************************\
	Alerts
\*********************************************/

.alert {
	padding: 0.85rem;
}

.alert p {
	margin-bottom: 0;
}

.alert h5::before {
	font-family: "Font Awesome 6 Pro";
	font-weight: 900; /* weight 900 is fa-solid */
	vertical-align: bottom;
}

.alert.IMPORTANT h5::before {
	content: "\f06a"
}

.alert.CAUTION h5::before,
.alert.WARNING h5::before {
	content: "\f071";
}

.alert.NOTE h5::before {
	content: "\f4af"
}

.alert.TIP h5::before {
	content: "\f672"
}

.article-flag.policy h5::before {
	content: "\e247"
}

.article-flag.policy {
	border-width: 3px;
	--bs-alert-color: var(--bs-danger-text-emphasis);
	--bs-alert-bg: var(--bs-danger-border-subtle);
	--bs-alert-border-color: var(--bs-danger-text-emphasis);
	--bs-alert-link-color: var(--bs-danger-text-emphasis);
}

.article-flag.wip h5::before {
	content: "\f85e"
}

.article-flag.guideline h5::before {
	content: "\f316"
}

/*********************************************\
	Checklists
\*********************************************/

.checklist ul > li {
	list-style: none;
}

.checklist input[type=checkbox] {
}

.checklist input[type=checkbox][readonly].checklist-item {
	border-color: var(--disabled-background-color);
}

.checklist .checklist-item {
	border: 2px solid var(--border-color);
	color: #4CAF50;
	zoom: 1.3;
	margin-right: 5px;
	margin-top: 0;
	box-sizing: content-box;
}

.checklist .checklist-item:checked {
	border-color: #0d6efd;
}

.checklist .alert {
	margin-top: 10px;
}

.checklist li > p:first-of-type {
	display: inline;
}

.checklist #version {
	width: 300px;
	display: inline;
}

/*================================================*/
/* Tables										  */
/*================================================*/

table td,
table tr,
table th {
	border-color: #d2d2d2 !important;
	border-width: 0 !important;
}

table tr {
	border-width: 1px 1px !important;
}

article table {
	font-size:0.875rem;
}

/*================================================*/
/* Dark Theme */
/*================================================*/

html[data-bs-theme='dark'] {

	/* Redefine some variables */
	--bs-highlight-color: #333;

	body,
	header .navbar,
	.subnav,
	.footer {
		background-color: #171717;
		color: #e6e6e6;
	}

	article .code-header {
		background-color: var(--dark-table-background-color);
		border: 1px solid var(--dark-border-color);
	}

	article pre {
		border: 1px solid var(--dark-border-color);
		background-color: var(--dark-table-background-color);
		border-top: none;
	}

	:not(a):not(pre) > code {
		background-color: var(--dark-table-background-color);
	}

	.temporary {
		background-color: rgb(86, 81, 63);
	}

	body > header .subnav {
		border-color: var(--bs-border-color);
	}
}

/*================================================*/
/* API */
/*================================================*/

.api-endpoint {
	width: 100%;
	background-color: #c5c5c5;
	font-family: 'Lucida Console', 'Courier New', Courier, monospace;
	padding: 2px;
}

.api-method {
	display: inline-block;
	text-transform: uppercase;
	padding: 2px 10px;
	color: #FFF;
	border-radius: 4px;
	font-weight: 600;
	min-width: 75px;
	text-align: center;
}

.api-get {
	background-color: #3E7F1D;
}

.api-post {
	background-color: #005FBF;
}

.api-put {
	background-color: #5F00BF;
}

.api-patch {
	background-color: #d611d2;
}

.api-delete {
	background-color: #d61111;
}

.api-method-deprecated {
	background-color: #a7a7a7;
}

.api-deprecated {
	background-color: #b11d08;
	color: #ffffff;
	text-transform: uppercase;
	padding: 2px;
	font-size: 0.75em;
}