/** NEW COLOR SYSTEM **/
/* Colors */
:root {
  --blue-02: #020608;
  --blue-05: #091a25;
  --blue-10: #0d2635;
  --blue-15: #102f41;
  --blue-20: #153a51;
  --blue-30: #225677;
  --blue-40: #357197;
  --blue-50: #478db8;
  --blue-60: #58a8da;
  --blue-70: #2eafff;
  --blue-80: #99d8ff;
  --blue-85: #b2e2ff;
  --blue-90: #ccebff;
  --blue-95: #e5f5ff;
  --blue-98: #f5fbff;
  --grey-02: #050505;
  --grey-05: #0d0d0d;
  --grey-10: #1a1a1a;
  --grey-100: #ffffff;
  --grey-15: #262626;
  --grey-20: #333333;
  --grey-30: #4c4c4c;
  --grey-40: #666666;
  --grey-50: #808080;
  --grey-60: #999999;
  --grey-70: #b2b2b2;
  --grey-80: #cccccc;
  --grey-85: #d9d9d9;
  --grey-90: #e6e6e6;
  --grey-95: #f2f2f2;
  --grey-98: #fafafa;
  --grey-transparent-05: #0d0d0d99;
  --grey-transparent-10: #1a1a1a99;
  --grey-transparent-15: #26262699;
  --grey-transparent-20: #33333399;
  --grey-transparent-30: #4c4c4c99;
  --grey-transparent-85: #d9d9d999;
  --grey-transparent-90: #e6e6e699;
  --grey-transparent-95: #f2f2f299;
  --grey-transparent-98: #fafafa99;
  --orange-50: #ff6900;
  --purple-02: #030208;
  --purple-05: #0d0925;
  --purple-10: #130d35;
  --purple-15: #181041;
  --purple-20: #1e1551;
  --purple-30: #2f2277;
  --purple-40: #423597;
  --purple-50: #5647b8;
  --purple-60: #6a58da;
  --purple-70: #7d66ff;
  --purple-80: #a899ff;
  --purple-85: #beb3ff;
  --purple-90: #d4ccff;
  --purple-95: #e9e5ff;
  --purple-98: #f6f5ff;
  --purple-transparent-05: #0d092599;
  --purple-transparent-10: #130d3599;
  --purple-transparent-15: #18104199;
  --purple-transparent-20: #1e155199;
  --purple-transparent-85: #beb2ff99;
  --purple-transparent-90: #d4ccff99;
  --purple-transparent-95: #e9e5ff99;
  --purple-transparent-98: #f6f5ff99;
  --red-02: #0a0000;
  --red-05: #1a0000;
  --red-10: #330000;
  --red-15: #4d0000;
  --red-20: #660000;
  --red-30: #990000;
  --red-40: #cc0000;
  --red-50: #ff0000;
  --red-60: #ff3333;
  --red-70: #ff6666;
  --red-80: #ff9999;
  --red-85: #ffb2b2;
  --red-90: #ffcccc;
  --red-95: #ffe5e5;
  --red-98: #fff5f5;
  --red-transparent-05: #25090999;
  --red-transparent-10: #350d0d99;
  --red-transparent-15: #41101099;
  --red-transparent-20: #51151599;
  --red-transparent-85: #ffb2b299;
  --red-transparent-90: #ffcccc99;
  --red-transparent-95: #ffe5e599;
  --red-transparent-98: #fff5f599;
  --yellow-02: #0a0900;
  --yellow-05: #1a1700;
  --yellow-10: #332e00;
  --yellow-15: #4d4600;
  --yellow-20: #665d00;
  --yellow-30: #998b00;
  --yellow-40: #ccbd00;
  --yellow-45: #eddd0c;
  --yellow-48: #f3e71b;
  --yellow-50: #fff100;
  --yellow-55: #fff21a;
  --yellow-60: #fff433;
  --yellow-70: #fff866;
  --yellow-80: #fffa99;
  --yellow-85: #fffcb2;
  --yellow-90: #fffdcc;
  --yellow-95: #fffee5;
  --yellow-98: #fffff5;
  --yellow-transparent-05: #1a170099;
  --yellow-transparent-10: #332e0099;
  --yellow-transparent-15: #4d460099;
  --yellow-transparent-20: #665d0099;
  --yellow-transparent-30: #998b0099;
  --yellow-transparent-40: #ccbd0099;
  --yellow-transparent-50: #fff10099;
  --yellow-transparent-60: #fff43399;
  --yellow-transparent-70: #fff86699;
  --yellow-transparent-80: #fffa9999;
  --yellow-transparent-85: #fffcb299;
  --yellow-transparent-90: #fffdcc99;
  --yellow-transparent-95: #fffee599;
  --yellow-transparent-98: #fffff599;
  --ddbce-button-ce-background-color: var(--purple-80);
  --ddbce-button-ce-border-color: var(--purple-60);
  --ddbce-highlight-purple-background-color: var(--grey-10);
  --ddbce-highlight-purple-text-color: var(--purple-80);
  --ddbce-menu-ce-background-color: var(--purple-90);
  --doc-box-best-practice: var(--blue-70);
  --doc-box-deprecated: var(--purple-70);
  --doc-box-note: var(--grey-60);
  --doc-box-tip: #00c770;
  --doc-box-warning: var(--red-50);
  --doc-codebox-background-color: var(--grey-95);
  --doc-codebox-border-color: var(--grey-90);
  --doc-codebox-button-background-color-hover: var(--grey-transparent-85);
  --doc-menu-info-deprecated-border-color: var(--purple-70);
  --doc-scrollbar-bg: var(--grey-90);
  --doc-scrollbar-slider: var(--grey-80);
  --doc-search-background-color: var(--grey-transparent-90);
  --doc-sidebar-selected-background-color: var(--grey-95);
  --doc-sidebar-text-selected: var(--grey-05);
  --doc-sidebar-text-unselected: var(--grey-15);
  --doc-warning-background-color: var(--red-transparent-95);
  --doc-warning-border-color: var(--red-transparent-90);
  --interactive-button-black-background-color: var(--grey-10);
  --interactive-button-black-background-color-hover: var(--grey-30);
  --interactive-button-black-border-color: var(--grey-10);
  --interactive-button-black-text-color: var(--grey-90);
  --interactive-button-yellow-background-color: var(--yellow-50);
  --interactive-button-yellow-background-color-hover: var(--yellow-45);
  --interactive-button-yellow-border-color-hover: var(--yellow-45);
  --interactive-filter-selected-background-color: var(--grey-90);
  --interactive-filter-selected-background-color-hover: var(--grey-80);
  --interactive-filter-selected-text-color: var(--grey-10);
  --interactive-filter-unselected-text-color: var(--grey-40);
  --interactive-filter-unselected-text-color-hover: var(--grey-05);
  --interactive-filterbox-background-color: var(--grey-98);
  --interactive-filterbox-border-color: var(--grey-90);
  --interactive-folderbox-background-color: var(--grey-transparent-98);
  --interactive-folderbox-border-color: var(--grey-90);
  --interactive-folderbox-border-color-hover: var(--grey-80);
  --interactive-folderbox-text-color: var(--grey-10);
  --interactive-folderbox-text-color-hover: var(--grey-20);
  --main-blogpost-background-color: var(--grey-100);
  --main-blogpost-border-color: var(--grey-90);
  --main-body-background-color: var(--grey-98);
  --main-codebox-border-color: var(--grey-90);
  --main-codebox-dropshadow: #0000000d;
  --main-codebox-main-background-color: var(--grey-transparent-98);
  --main-codebox-sub-background-color: var(--grey-transparent-90);
  --main-highlight-purple-text-color: var(--purple-80);
  --main-highlight-yellow-background-color: var(--grey-10);
  --main-highlight-yellow-text-color: var(--yellow-50);
  --main-infobox-background-color: var(--purple-transparent-98);
  --main-infobox-border-color: var(--purple-transparent-90);
  --main-marker-background-color: var(--yellow-transparent-60);
  --main-marker-border-color: var(--yellow-45);
  --main-section-background-gradient-end-color: var(--grey-95);
  --main-section-background-gradient-start-color: var(--grey-98);
  --main-text-primary-color: var(--grey-05);
  --main-text-secondary-color: var(--grey-40);
  --main-text-tertiary-color: var(--grey-70);
  --menu-dropdown-background-color: var(--grey-95);
  --menu-dropdown-border-color: var(--grey-90);
  --menu-dropdown-item-background-hover: var(--grey-90);
  --menu-topmenu-background-color: var(--grey-transparent-98);
  --menu-topmenu-border-color: #e6e6e64d;
  --menu-topmenu-searchbar-border-color: var(--grey-transparent-85);
  --menu-topmenu-searchbar-shortcut-background-color: var(--grey-transparent-90);
  --menu-topmenu-searchbar-shortcut-text-color: var(--grey-60);
  --menu-topmenu-searchbar-text-color: var(--grey-transparent-30);
  --menu-topmenu-text-color: var(--grey-10);
  --menu-topmenu-text-color-hover: var(--purple-60);
  --social-shape-gradient-end-color: var(--yellow-48);
  --social-shape-gradient-start-color: var(--yellow-45);
  --social-thumbnail-background-color: var(--yellow-50);
  --social-thumbnail-button-background-color: var(--grey-10);
  --social-thumbnail-button-text-color: var(--yellow-50);
  --social-thumbnail-text-color: var(--grey-10);
}

html.darkmode {
  --ddbce-button-ce-background-color: var(--purple-80);
  --ddbce-button-ce-border-color: var(--purple-60);
  --ddbce-highlight-purple-background-color: var(--purple-80);
  --ddbce-highlight-purple-text-color: var(--grey-10);
  --ddbce-menu-ce-background-color: var(--purple-10);
  --doc-box-best-practice: var(--blue-20);
  --doc-box-deprecated: var(--purple-30);
  --doc-box-note: var(--grey-20);
  --doc-box-tip: #004d2b;
  --doc-box-warning: var(--red-20);
  --doc-codebox-background-color: var(--grey-10);
  --doc-codebox-border-color: var(--grey-20);
  --doc-codebox-button-background-color-hover: var(--grey-transparent-20);
  --doc-menu-info-deprecated-border-color: var(--purple-80);
  --doc-scrollbar-bg: var(--grey-15);
  --doc-scrollbar-slider: var(--grey-20);
  --doc-search-background-color: var(--grey-transparent-20);
  --doc-sidebar-selected-background-color: var(--grey-10);
  --doc-sidebar-text-selected: var(--grey-98);
  --doc-sidebar-text-unselected: var(--grey-85);
  --doc-warning-background-color: var(--red-transparent-15);
  --doc-warning-border-color: var(--red-transparent-20);
  --interactive-button-black-background-color: var(--grey-90);
  --interactive-button-black-background-color-hover: var(--grey-70);
  --interactive-button-black-border-color: var(--grey-60);
  --interactive-button-black-text-color: var(--grey-10);
  --interactive-button-yellow-background-color: var(--yellow-50);
  --interactive-button-yellow-background-color-hover: var(--yellow-45);
  --interactive-button-yellow-border-color-hover: var(--yellow-45);
  --interactive-filter-selected-background-color: var(--grey-15);
  --interactive-filter-selected-background-color-hover: var(--grey-20);
  --interactive-filter-selected-text-color: var(--grey-90);
  --interactive-filter-unselected-text-color: var(--grey-70);
  --interactive-filter-unselected-text-color-hover: var(--grey-95);
  --interactive-filterbox-background-color: var(--grey-05);
  --interactive-filterbox-border-color: var(--grey-20);
  --interactive-folderbox-background-color: var(--grey-transparent-10);
  --interactive-folderbox-border-color: var(--grey-20);
  --interactive-folderbox-border-color-hover: var(--grey-30);
  --interactive-folderbox-text-color: var(--grey-90);
  --interactive-folderbox-text-color-hover: var(--grey-80);
  --main-blogpost-background-color: var(--grey-02);
  --main-blogpost-border-color: var(--grey-20);
  --main-body-background-color: var(--grey-05);
  --main-codebox-border-color: var(--grey-20);
  --main-codebox-dropshadow: #fff10012;
  --main-codebox-main-background-color: var(--grey-transparent-05);
  --main-codebox-sub-background-color: var(--grey-transparent-20);
  --main-highlight-purple-text-color: var(--purple-80);
  --main-highlight-yellow-background-color: var(--yellow-50);
  --main-highlight-yellow-text-color: var(--grey-10);
  --main-infobox-background-color: var(--grey-transparent-15);
  --main-infobox-border-color: var(--grey-transparent-20);
  --main-marker-background-color: var(--yellow-transparent-30);
  --main-marker-border-color: var(--yellow-transparent-40);
  --main-section-background-gradient-end-color: var(--grey-10);
  --main-section-background-gradient-start-color: var(--grey-05);
  --main-text-primary-color: var(--grey-95);
  --main-text-secondary-color: var(--grey-70);
  --main-text-tertiary-color: var(--grey-50);
  --menu-dropdown-background-color: var(--grey-05);
  --menu-dropdown-border-color: var(--grey-20);
  --menu-dropdown-item-background-hover: var(--grey-15);
  --menu-topmenu-background-color: var(--grey-transparent-10);
  --menu-topmenu-border-color: #2626264d;
  --menu-topmenu-searchbar-border-color: var(--grey-transparent-15);
  --menu-topmenu-searchbar-shortcut-background-color: var(--grey-transparent-30);
  --menu-topmenu-searchbar-shortcut-text-color: var(--grey-60);
  --menu-topmenu-searchbar-text-color: var(--grey-transparent-85);
  --menu-topmenu-text-color: var(--grey-98);
  --menu-topmenu-text-color-hover: var(--yellow-50);
  --social-shape-gradient-end-color: var(--yellow-48);
  --social-shape-gradient-start-color: var(--yellow-45);
  --social-thumbnail-background-color: var(--grey-10);
  --social-thumbnail-button-background-color: var(--yellow-50);
  --social-thumbnail-button-text-color: var(--grey-02);
  --social-thumbnail-text-color: var(--grey-95);
}

body.search {
  height: 100vh;
  overflow: hidden;
}

.searchoverlay {
  opacity: 0;
  pointer-events: none;
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100vh;
  z-index: 9001;
  background: var(--doc-search-background-color, rgba(230, 230, 230, 0.6));
  backdrop-filter: blur(2.5px);
}
.searchoverlay.active {
  opacity: 1;
  pointer-events: all;
}
.searchoverlay > div {
  border-radius: 15px;
  position: fixed;
  top: 90px;
  left: calc(50% - 400px);
  width: 800px;
  background: var(--main-body-background-color, #FAFAFA);
  border: 1px solid var(--doc-codebox-border-color, #E6E6E6);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 25px 30px 5px 30px;
}
.searchoverlay > div form {
  padding: 0;
  background: transparent;
}
.searchoverlay > div form input {
  padding: 10px;
  width: 100%;
  font-family: "SuisseIntl-Book", Helvetica, Arial, sans-serif;
  padding-left: 45px;
  background: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.0731 10.1924L13.9998 14.1192' stroke='%237E7E7E' stroke-width='1.5'/%3E%3Ccircle cx='5.92301' cy='6.80338' r='5.17301' stroke='%237E7E7E' stroke-width='1.5'/%3E%3C/svg%3E%0A") no-repeat scroll 15px 15px;
  background-position: 13px center;
  background-size: 15px;
  background-color: transparent;
  border-radius: 10px;
  border: 1px solid var(--doc-codebox-border-color, #E6E6E6);
  color: var(--main-text-primary-color, #0D0D0D);
}
.searchoverlay > div form input::-webkit-input-placeholder {
  color: var(--main-text-secondary-color, #666);
}
.searchoverlay > div form input::-moz-placeholder {
  color: var(--main-text-secondary-color, #666);
}
.searchoverlay > div form input:-ms-input-placeholder {
  color: var(--main-text-secondary-color, #666);
}
.searchoverlay > div form input::-ms-input-placeholder {
  color: var(--main-text-secondary-color, #666);
}
.searchoverlay > div form input::placeholder {
  color: var(--main-text-secondary-color, #666);
}
.searchoverlay > div form input:active, .searchoverlay > div form input:focus {
  border: 1px solid var(--doc-codebox-border-color, #E6E6E6);
  outline: 0;
}
.searchoverlay > div form .empty_input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' fill='none' viewBox='0 0 13 13'%3E%3Cpath fill='%23666' d='M13 11.757 7.727 6.5 13 1.243 11.731 0 6.486 5.257 1.24 0 0 1.243 5.245 6.5 0 11.757 1.24 13l5.246-5.257L11.73 13 13 11.757Z'/%3E%3C/svg%3E");
  background-size: contain;
  width: 14px;
  height: 14px;
  position: absolute;
  right: 13px;
  top: 13px;
  cursor: pointer;
}
.searchoverlay > div .shortcuts {
  position: fixed;
  bottom: 20px;
  right: 20px;
  color: var(--main-text-secondary-color, #666);
  font-size: 14px;
}
.searchoverlay > div .shortcuts span {
  background: var(--doc-codebox-background-color, #F2F2F2);
  border: 1px solid var(--doc-codebox-border-color, #E6E6E6);
  border-radius: 50px;
  padding: 2px 8px;
}
.searchoverlay > div #search_results {
  overflow-y: auto;
  max-height: calc(100vh - 270px);
  border-radius: 10px;
  margin-top: 20px;
}
.searchoverlay > div #search_results::-webkit-scrollbar {
  width: 3px;
}
.searchoverlay > div #search_results::-webkit-scrollbar-track {
  background: var(--doc-scrollbar-bg, #E6E6E6);
}
.searchoverlay > div #search_results::-webkit-scrollbar-thumb {
  background: var(--doc-scrollbar-slider, #CCC);
}
.searchoverlay > div #search_results h2 {
  font-size: 16px;
  margin-top: 0;
  margin-bottom: 9px;
  text-decoration: none;
  font-weight: 700;
}
.searchoverlay > div #search_results h2 u {
  text-decoration: underline;
}
.searchoverlay > div #search_results .search_result {
  background: var(--doc-codebox-background-color, #F2F2F2);
  border-radius: 10px;
  padding: 15px;
  width: calc(100% - 10px);
  margin: 0;
  margin-top: 5px;
  position: relative;
}
.searchoverlay > div #search_results .search_result.selected {
  background: #e6e6e6;
}
.searchoverlay > div #search_results .search_result:last-child {
  margin-bottom: 20px;
}
.searchoverlay > div #search_results .search_result > a {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 400;
  top: 0;
  left: 0;
  border-radius: 10px;
}
.searchoverlay > div #search_results .search_result > a:hover {
  background: rgba(0, 0, 0, 0.05);
}
.searchoverlay > div #search_results .search_result .search_text {
  font-size: 14px;
  color: var(--main-text-secondary-color, #666);
}
.searchoverlay > div #search_results .search_result .search_text u {
  font-weight: normal;
  text-decoration: underline;
}
.searchoverlay > div #search_results .search_category {
  border-radius: 50px;
  border: 1px solid var(--doc-codebox-border-color, #E6E6E6);
  background: var(--interactive-filterbox-background-color, #FAFAFA);
  font-size: 11px;
  padding: 3px 8px;
  margin-top: 10px;
  display: inline-block;
}

.autocomplete {
  /*the container must be positioned relative:*/
  position: relative;
  display: inline-block;
  width: 100%;
}

/*
input {
	border: 1px solid;
	background-color: #f1f1f1;
	padding: 10px;
	font-size: 16px;
}
input[type=text] {
	background-color: #f1f1f1;
	width: 100%;
  }
input[type=submit] {
	background-color: DodgerBlue;
	color: #fff;
}
.autocomplete-items {
	position: relative;
	border-bottom: none;
	border-top: none;
	z-index: 99;
	top: 100%;
	left: 0;
	right: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	gap: 5px;
	padding: 12px;
	border: 1px solid #E6E6E6;
	border-radius: 15px;
	background: white;
}
.autocomplete-items div {
	padding: 5px 10px;
	cursor: pointer;
	background-color: #f7f7f7;
	border: 1px solid #E0E0E0;
	border-radius: 15px;
	font-size: 14px;
}
.autocomplete-items div:hover {
	background-color: #e9e9e9;
}
.autocomplete-active {
	background-color: #fff100 !important;
	color: black;
}
*/
@media only screen and (max-width: 810px) {
  .searchoverlay > div {
    width: calc(100% - 30px);
    left: 15px;
    top: 85px;
    padding: 15px 15px 0px 15px;
  }
  .searchoverlay > div #search_results {
    margin-top: 15px;
    max-height: calc(100vh - 250px);
  }
}

/*# sourceMappingURL=search.css.map */