/* _my_be.css */ 

/* ... Misc ...
-----------------------------------------------*/
#container,
#headerXXX {
  max-width: 1200px;
  margin: 0 auto;
}
@media (min-width: 992px) {
  .backend-search:not(.search--hidden) .backend-search_inner {
    width: min( calc(100% - 235px), 1220px )
  }
}
/* ... Misc ... END
-----------------------------------------------*/



/* ... Test ... END
-----------------------------------------------*/
/**/
body#top:not(.popup) {
  line-height: 1;
	background-color: #111411;
	background-color: #1C1B22;	
	color: #fff;
	overflow-y: scroll;
}
header {
  line-height: 1;
}
#container {
	color: #444;
}
#main_headline span {
	line-height: normal;
}
/**/
fieldset {
	--saturation: 20%;
	--luminanz: 20%;
	--alpha: 1;
}
fieldset:is(.tl_box, .tl_tbox) > legend {
	background-color: hsla(100, var(--saturation), var(--luminanz), var(--alpha));
	color: #fff;
	width: 100%;
	font-size: 1.1em;
	transition: all .1s ease 0s;
}

fieldset.collapsed > legend {
	background-color: hsla(10, var(--saturation), var(--luminanz), var(--alpha));
}
fieldset:is(.tl_box, .tl_tbox) > legend:hover {
	--saturation: 30%;
}
/* Choosen */
.chzn-container-multi .chzn-choices .search-choice .search-choice-close {
	right: 0;
	top: 0;
	width: 18px;
	height: 19px;
	background-image: none;
}
.chzn-container-multi .chzn-choices .search-choice .search-choice-close::after {
	content: 'x';
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	height: 100%;
	font-size: 1rem;
	text-align: center;
	line-height: 15px;
	font-weight: bold;
}
.chzn-container-multi .chzn-choices .search-choice .search-choice-close:is(:focus, :hover):after {
	background-color: rgba(255, 255, 255, .5);
}
.tl_help,
.tl_help a {
	line-height: inherit;
}

/* change this bad orange */
#header .inner,
#tl_crawl .progress-bar.running {
	background-color: #81A100;
}
#tmenu sup {
	color: #81A100;
}
#tl_navigation .menu_level_1 li.current {
	border-left-color: #81A100;
}
#tmenu a:hover,
#tmenu a.hover,
#tmenu li:hover .h2,
#tmenu .active .h2,
#tmenu .burger button:hover {
	background-color: #718D00;
}

/* Filter buttons */
@media (min-width: 1440px) {
	.vmjs .tl_submit_panel {
		min-width: 40px;
		letter-spacing: normal;
		padding: 0;
	}
	.vmjs .tl_submit_panel button {
		width: 36px;
		aspect-ratio: 1 / 1;
		height: auto;
		top: 0;
		text-indent: 36px;
		background-size: 75%;
		transition: all .1s ease 0s;
	}
	.vmjs .tl_submit_panel button:hover {
		background-size: 100%;
	}
	.vmjs #filter {
		display: none;
	}
}

/* pagination */
.pagination {
	padding: 0;
	display: flex;
	justify-content: space-between;
}
.pagination p {
	width: auto;
	float: none;
	margin-bottom: 0;
	padding: .5em;
	font-weight: bold;
}
.pagination ul {
	width: auto;
	float: none;
	padding-right: 0;
	display: flex;
}
.pagination li {
	padding: 0;
}
.pagination li > * {
	padding: .5em .75em;
	display: block;
}
.pagination li strong.active {
	background-color: #999;
	color: white;
	font-weight: bold;
}
.pagination li a:is(:focus, :active, :hover) {
	background-color: #666;
	color: white;
}
[data-color-scheme=dark] #container {
	color: white;
}
html[data-color-scheme="dark"] {
	color-scheme: dark;
	--text: #ddd;
	--body-bg: #121416;
	--content-bg: #1b1d21;
	--content-border: #414448;
	--black: #fff;
	--white: #000;
	--blue: #0073a8;
	--orange: #d68c23;
	--contao: #f47c00;
	--border: #303236;
	--nav-bg: #1b1d21;
	--nav-hover-bg: #1b325f;
	--nav-current: #272a30;
	--nav-separator: #3f3f3f;
	--hover-row: #1b325f;
	--header-bg: #292c32;
	--header-bg-hover: #202327;
	--header-text: white;
	--invert-bg: #333;
	--invert-text: lightgreen;
	--table-header: #232529;
	--table-odd: #1b1d21;
	--table-even: #1e2024;
	--table-nb-header: #292c32;
	--table-nb-odd: #1b1d21;
	--table-nb-even: #23252a;
	--panel-bg: #272a30;
	--tree-header: #272a30;
	--tree-header-border: #3f4146;
	--form-text-disabled: #666;
	--form-border: #44464b;
	--form-border-disabled: #3a3c40;
	--form-bg: #151619;
	--form-bg-hover: #1e2024;
	--form-bg-disabled: #1e2024;
	--form-button: #31333a;
	--form-button-hover: #383a42;
	--form-button-active: #777;
	--form-button-disabled: #26272c;
	--diff-left: rgba(248,81,73,.17);
	--diff-del: rgba(248,81,73,.4);
	--diff-right: rgba(46,160,67,.17);
	--diff-ins: rgba(46,160,67,.4);
	--code-bg: #30343b;
	--checkerbox-bg: #30343b;
	--info: #9095a2;
	--active-bg: #1b325f;
	--active-border: #264787;
	--drag-bg: #1b325f;
	--legend: #747b8b;
	--serp-preview: #bdc1c6;
	--serp-preview-title: #8ab4f8;
	--nested-bg: #1e2024;
}


/* Contao 5 */
fieldset:is(.tl_tbox, .tl_box) > legend > button {
	background-color: transparent;
	width: 100%;
}
fieldset:is(.tl_tbox, .tl_box) > legend:has(> button) {
	background-color: hsla(100, var(--saturation), var(--luminanz), var(--alpha));
	color: #fff;
	width: 100%;
	font-size: 1.1em;
	transition: all .2s ease 0s;
}
fieldset.collapsed > legend:has(> button) {
	background-color: hsla(10, var(--saturation), var(--luminanz), var(--alpha));
}
.jump-targets {
  display: none;
}
/* ... Test ... END
-----------------------------------------------*/



/* ... Article listview ... (only works with _my_be.js and appropriate dcaconfig settings)
-----------------------------------------------*
.tl_listing [id^='tl_article_tl_page_tree_'] .tl_left {
  position: relative;
}
#top ul.tl_tree_xtnd li.tl_folder_top div.tl_left,
#top ul.tl_tree_xtnd li.tl_folder div.tl_left {
  box-sizing: border-box;
  width: 620px;
}
.article_format {
  display: block;
  margin-top: -17px;
  text-indent: 0;
  cursor: default;
}
.article_title,
.article_section,
.article_id,
.article_css {
  float: left;
  padding-right: .5em;
  cursor: help;
}
.article_title {
  color: #b05701;
}
.article_title:empty:before {
  content: "no alias";
  color: #CB7474;
}
.article_section {
  color: #aaa;
}
.article_cssId {
  float: left;
}
.article_id {
  color: #70A6CB;
}
.article_css {
  color: #72CB73;
}
/* ... Article listview ... END
-----------------------------------------------*/



/* ... Page listview ... (only works with _my_be.js and appropriate dcaconfig settings)
-----------------------------------------------*
.page_cssClass:empty,
.page_layout {
  display: none;
}
.page_layout.has_layout {
  display: inline;
}
.page_alias,
.page_cssClass,
.page_layout {
  cursor: help;
  white-space: nowrap;
  font-weight: normal;
}
.page_alias {
  color: #aaa;
}
.page_alias:empty:before {
  content: "no alias";
  color: #CB7474;
}
.page_cssClass {
  color: #72CB73;
}
.page_layout {
  background-color: #aaa;
  border-radius: 2px;
  color: #fff;
  padding: 0 2px;
  font-size: 10px;
}
/* ... Page listview ... END
-----------------------------------------------*/



/* ... Semantic HTML5 - Content element ...
-----------------------------------------------*
.sh5-tag {
  height: 39px;
  background: lightyellow;
}
/* ... Semantic HTML5 - Content element ... END
-----------------------------------------------*/



/* ... Misc ...
-----------------------------------------------*
.tl_panel {
  position: relative;
  text-align: left;
}
.tl_subpanel {
  float: none;
  display: inline-block;
  padding-left: 6px;
}
.tl_submit_panel {
  float: right;
}
.tl_submit_panel .tl_img_submit {
  width: 23px;
  top: auto;
}
.reset_button {
  width: 23px;
  height: 23px;
  background-image: url(../../system/themes/default/images/reload.gif);
  filter: hue-rotate(45deg);
  background-size: cover;
  display: inline-block;
  cursor: pointer;
}
a[href$="haste"],
a[href$="MultiColumnWizard"],
a[href$="NamespaceClassLoader"],
a[href$="tivoka"]{
  color: #ccc;
}
[class^="ce_"].invisible,
[class^="ce_"] .invisible {
  border: inherit;
  clip: inherit;
  height: inherit;
  margin: 0 0 1em;
  overflow: inherit;
  padding: 20px 0 3px;
  position: relative;
  width: inherit;
  background-color: rgba(75, 133, 186, .1);
}
[class^="ce_"].invisible::after,
[class^="ce_"] .invisible::after {
  content: "Screenreaders only";
  position: absolute;
  top: 0px;
  right: 3px;
  color: #4b85ba;
  font-weight: normal;
  font-style: italic;
}
.mod_repository .col_functions {
  padding: 0;
}
.mod_repository .col_functions a {
  float: left;
  padding: 4px 3px;
}
.mod_repository .col_functions a.edit + a.manual16 {
  margin-left: 20px;
}
.mod_repository .col_functions a.uninstall + a.forum16,
.mod_repository .col_functions a.manual16 + a.ok16 {
  margin-left: 22px;
}
.mod_repository .col_functions a.uninstall + a.ok16 {
  margin-left: 44px;
}
.mod_repository .col_functions a:focus,
.mod_repository .col_functions a:hover {
  outline: dotted thin tomato;
}
/* ... Misc ... END
-----------------------------------------------*/



/** *
#top .invisible {
  border: inherit;
  clip: inherit;
  height: inherit;
  margin: 0 0 1em;
  overflow: inherit;
  padding: 20px 0 3px;
  position: relative;
  width: inherit;
  background-color: rgba(75, 133, 186, .1);
  display: block;
  min-width: 200px;
  min-height: 200px;
  background: red;
}
/** */

/* ... TinyMCE ...
-----------------------------------------------*
textarea.mce-textbox {
  font-family: Consolas, mono-space !important;
  font-size: 1rem !important;
  background-color: #444 !important;
  color: #fff !important;
}
/* ... TinyMCE ... END
-----------------------------------------------*/



/* ... Debug ...
-----------------------------------------------*
.tl_listing .tl_left,
.tl_listing .tl_left span {
  outline: 1px solid orange;
}
.tl_listing [id^='tl_article_tl_page_tree_'] .tl_left {
  background: rgba(255, 0, 0, 0.1);
}
#top ul.tl_tree_xtnd li.tl_folder_top div.tl_left,
#top ul.tl_tree_xtnd li.tl_folder div.tl_left {
  background: rgba(0, 0, 255, 0.1);
}
#top ul.tl_tree_xtnd li.tl_file div.tl_left {
  background: rgba(0, 255, 0, 0.1);
}
/* ... Debug ... END
-----------------------------------------------*/