:root{
  --color-text-regular:#606266;
  --color-text-strong:#424242;
  --color-text-white:#fff;
  --color-text-disabled:#C0C4CC;
  --color-text-info:#909399;
  --color-text-primary:#2196F3;
  --color-text-warning: #E6A23C;
  --color-text-error: #F56C6C;
  --color-link-primary:#2196F3;
  --color-text-input:#606266;
  --color-link-primary-hover: #1C7ECC;
  --color-text-primary-hover: #1C7ECC;
  
  --color-link-delete:#F56C6C;
  --color-btn-delete: #F56C6C;
  --color-btn-delete-light: #FEF0F0;
  
  --color-bg-white:#fff;
  --color-bg-light:#fafafa;
  --color-bg-middle:#eeeeee;
  /* --color-bg-dark:#424242;  */
  --color-bg-dark:#2c363c;
  --color-bg-primary:#2196F3;
  --color-bg-primary-hover: #136bb2;
  --color-bg-primary-pressed:#1C7ECC;
  --color-bg-secondary-light:#F2F9FE;
  --color-bg-warning: #FDF6EC;
  --color-bg-warning-hover: #E6A23C;
  --color-bg-error: #FEF0F0;
  --color-bg-error-hover: #F56C6C;
  --color-bg-interrupt: #FEF0F0;
  --color-bg-input: #fff;
  --color-bg-success: #67C23A;
  
  --color-border-light:#DCDCDC;
  --color-border-dark: #909399;
  --color-border-warning: #E6A23C;
  --color-border-error: #F56C6C;
  --color-border-primary: #2196F3;
  --color-border-secondary-light: #F2F9FE;
  
  --color-drop-shadow:#00000030;
 
  accent-color: var(--color-link-primary);

}


@media (prefers-reduced-motion:no-preference) {
    @view-transition {
        navigation: auto;
    }
}

/*module colors for special view*/
:root {
	--color-help-article: #76D6FD;
	
	--color-help-gallery: #e7945d;
	--color-help-mediadisplay: #D88DBC;
	--color-help-mediaconsent: #FC7C7C;
	
	--color-help-cst: #F2D87D;

	--color-help-newsletter: var(--color-border-light);
	--color-help-tuerchen: var(--color-border-light);
	--color-help-formhandler: var(--color-border-light);
	
	--color-help-group: #d9c5c5;
	--color-help-html: #C7EBA1; 

	--color-help-clone: var(--color-border-light);
	--color-help-proxy: var(--color-border-light);
	--color-help-container: var(--color-border-light);
	--color-help-nav: var(--color-border-light) ;
	--color-help-search: var(--color-border-light);
	--color-help-googlesitemap: var(--color-border-light);
	--color-help-legal: var(--color-border-light);
	
	--color-help-map: var(--color-border-light);
	--color-help-wheater: var(--color-border-light);
	--color-help-socialmedia: var(--color-border-light);
	--color-help-weblog: var(--color-border-light);
	
	--color-help-shop: var(--color-border-light);
	--color-help-calendar: var(--color-border-light);
	--color-help-contacts: var(--color-border-light);

	--color-help-general: var(--color-border-light);

	--color-bg-tinytoolbar: #f5f4f4;

	--color-dev: #4ac09f;
	/* --color-dev: #fd6161; */
}



.login-logo-white{
	display: none;
}
.login-logo-black{
	display: block;
}

@media (prefers-color-scheme: WIP-dark) {
	:root {
		--color-text-regular: #eeeeee;
		--color-text-strong: #eeeeee; 
		--color-text-input: #eeeeee;
		--color-text-white: #eeeeee;
		--color-text-disabled: #848484;
		--color-text-info: #A6A6A6;
		--color-text-primary: #2196F3;
		--color-text-warning: #FFC96B;
		--color-text-error: #FF8A8A;

		--color-link-primary: #2196F3;
		--color-link-primary-hover: #51a6eb;
		--color-text-primary-hover: #51a6eb;

		--color-link-delete: #FF8A8A;
		--color-btn-delete: #FF8A8A;
		--color-btn-delete-light: #4C0000;

		--color-bg-white: #272a30;
		--color-bg-light: #222629;
		--color-bg-middle:#131a1d;
		--color-bg-dark: #191b1c;
		--color-bg-primary: #2196F3; 
		--color-bg-primary-hover: #3579b0; 
		--color-bg-primary-pressed: #3579b0; 	  
		--color-bg-secondary-light: #38444b;
		--color-bg-warning: #746925;
		--color-bg-error: #8B0000; 
		--color-bg-error-hover: #FF8A8A; 
		--color-bg-interrupt: #3c1f1f;
		--color-bg-input: #212425;
		--color-bg-success: #67C23A;

		--color-border-light: #38444b;
		--color-border-dark: #A6A6A6;
		--color-border-warning: #FFC96B;
		--color-border-error: #FF8A8A;
		--color-border-primary: #2196F3;
		--color-border-secondary-light: #2c363c;

		--color-drop-shadow: #000000;

		--color-help-article: #4592c3;

		--color-help-gallery: #917c30;
		--color-help-mediadisplay: #917c30;
		--color-help-mediaconsent: #917c30;

		--color-help-cst: #769253;
		--color-help-newsletter: #769253;
		--color-help-tuerchen: #769253;
		--color-help-formhandler: #769253;

		--color-help-group: #857474;

		--color-help-map: #873b74;
		--color-help-wheater: #873b74;
		--color-help-socialmedia: #873b74;
		--color-help-weblog: #873b74;

		--color-help-shop: #962f2f;
		--color-help-calendar: #962f2f;
		--color-help-contacts: #962f2f;
	}
	.login-logo-white{
		display: block;
	}
	.login-logo-black{
		display: none;
	}
  }

@media (prefers-color-scheme: dark) {
	:root {
		--color-bg-middle:#131a1d;
	}
}


/*ReSetCSS*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/***/


html{
	overscroll-behavior: none;
}

html,
body{
	background: var(--color-bg-white);
}

body:has(table.box){
	background: var(--color-bg-light);
	padding-bottom: 1rem;
	min-height: 100vh;
	overflow-x: hidden;
}

body *{
    font-size: 16px;
    line-height: 1.2;
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: 400;
    color: var(--color-text-regular);
	font-optical-sizing: auto;
	letter-spacing: .025rem;
}

body:has(#Tree) {
    background: var(--color-bg-white);
}

a:link, a:visited, a:hover, a:active {
    text-decoration: none;
    font-size: 1rem;
    color: var(--color-text-regular);
}

strong {
    font-weight: 600;
}

.nobr{
	background: transparent;
}


#frame-tree,
#frame-media-tree,
#frame-contacts,
#frame-calendars,
#frame-calendar-view-calendar-month,
#frame-calendar-view-calendar-day,
#frame-containers,
#frame-dms,
#frame-estate,
#frame-shop{
	html, body{
    background: var(--color-bg-white);
	}
  border-right: 0.0625rem solid var(--color-border-light);
}

html:has(#Tree){
  background: var(--color-bg-white);
}


/* Fallback für ältere Browser */
::-webkit-scrollbar {
    background: transparent;
    width: .375rem;
}

::-webkit-scrollbar-thumb {
    background-color: var(--color-border-light);
}

/* Für moderne Browser */
:root {
    scrollbar-width: thin;
    scrollbar-color: var(--color-border-light) var(--color-bg-white);
}

/*Datepicker bspw. Publikationsdaten*/

.ui-datepicker-header.ui-widget-header {
    border: .0625rem solid var(--color-bg-primary);
    background: var(--color-bg-primary);
	.ui-datepicker-title span{
		color: var(--color-text-white)
	}
}
.ui-datepicker-calendar{
	.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
		border: .0625rem solid var(--color-border-light);
		background:  var(--color-bg-light);
		color: var(--color-text-primary);
	}
}

/*presentation*/

/* .sidebar-icons.dev-yes{
	background-color: var(--color-bg-primary) !important;
}
.sidebar-system {
    & #sidebar-system-logo {
        & a {
            strong {
                color: var(--color-text-disabled) !important;
            }
        }
    }
} */
/***********/