* {
    box-sizing: border-box;
	font-size: 16px;
}

body {
    font-family: 'Roboto';
    /*font-family: Verdana, 'Segoe UI', Tahoma, Geneva, sans-serif;
    min-height: 100vh;
    padding: 20px;*/
}

#topContainer {
	text-align: right;
    position: relative;
	padding-bottom: 50px;
	padding-top: 10px;
}

#TopMenu {
	border-bottom: 2px solid #012169;
	text-align: left;
	margin-bottom: 12px;
	padding-bottom: 8px;
}
#TopMenu>div {
	display: inline-block;
	margin-right: 12px;
	padding-top: 6px;
	padding-bottom: 7px;
}
#TopMenu>div.btn.m-active {
	transform: translateY(1px);
	box-shadow: 0 0px 0 #000c3a;
	background-color: #0132a0;
	cursor: default; 
	pointer-events: none;
}

#outerContainer {
	height: 100%;
	width: 100%;
	min-height: 100%;
	min-width: 100%;
	text-align: center;
	padding-top: 12px;
}

#mainContainer {
    width: 990px;
	margin: 0 auto;
	display: inline-block;
	text-align: center;
}

#loginError {
	position: absolute;
	top: 145px;
}

#frmSelectKunde {
	margin: 0 auto;	
}

#frmChangePasswort,
#frmLogin {
    display: inline-block;
    margin: 0 auto;
    text-align: left;
}

#frmChangePasswort>div {
    padding-top: 12px; 
}

#frmChangePasswort input {
    width: 300px; 
}

.pwd-reset-form {
	display: inline-block;
	margin-right: 6px;
}

button, .btn  {
	background-color: #012169;
	color: white;
	margin-top: 4px;
	border: none;
	cursor: pointer;
	box-shadow: 0 1px 3px #000c3a;	
    padding: 9px 25px 9px 25px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn-smaller {
    padding: 7px 20px 7px 20px;
	box-shadow: 0 1px 1px #000c3a;	
	display: inline-block;
}

/* Hover-Effekt */
button:hover, .btn:hover {
	background-color: #0132a0;
}

/* Klick-Effekt */
button:not(:disabled):active, .btn:active {
	transform: translateY(1px);
	box-shadow: 0 0px 0 #000c3a;
}

button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	transform: none;
	box-shadow: none;
}

.button-logout {
	margin-right: 0px;
	display: inline-block !important;
}

.btn-toggle-pdf-upload {
	margin-right: 6px;
	display: inline-block !important;	
}
#btn-upload-ma,
#btn-select-kunde {
	margin: 0 auto;
}

.topmenu-item {
	display: inline-block;
}
.topmenu-item.m-active {
	background-color: #0132a0;
	box-shadow: none !important;
}

#CollumnChoice {
	display: flex;
	flex-wrap: wrap;
}

#CollumnChoice .column-choice-field {
	flex: 1;
	padding: 0px 0px 18px 12px;
	min-width: 25%;
}
#CollumnChoice .column-choice-field:nth-child(5), 
#CollumnChoice .column-choice-field:first-child {
	padding: 0px 0px 18px 0px;
}

.required,
.column-choice-field.field-required .column-choice-field-header {
	font-weight: 700;
	color: rgb(149, 31, 16)
} 

.cbo-excel-fields {
	width: 100%;
}

#mitarbeiter-main-table-wrap {
	/*width: 100vw;
	margin-left: calc(50% - 50vw);
	padding: 0px 40px 0px 40px;*/
}

#MaActionHilfetext {
	padding-top: 10px;
	font-size: 14px;
	padding-bottom: 8px;
}

#mitarbeiter-main-table { 
	height: 530px; 
	transition: "opacity 10ms linear";
	border: 0;
}

#mitarbeiter-main-table .tabulator-row {
	padding-top: 7px;
	padding-bottom: 3px;
	position: relative;
}

/* Zeile ist im Edit-Modus */
#mitarbeiter-main-table .tabulator-row.row-dirty::before,
#mitarbeiter-main-table .tabulator-row.row-editing::before {
	content: " ";
	width: 11px;
	height: 11px;
	border-radius: 8px;
	position: absolute;
	background-color: #f59e0b;
	top: 0px;
	left: 0px;	
	z-index: 99;
  	font-size: 12px;
  	font-weight: 700;	
}

#mitarbeiter-main-table .tabulator-row.row-dirty::before {
	background-color: #ef4444;
}

#mitarbeiter-main-table .tabulator-col-title {
	font-family: 'Roboto Condensed';
	font-weight: 500;
	font-size: 14px;
	padding-top: 2px;
}

#multi-edit-table .tabulator-cell,
#mitarbeiter-main-table .tabulator-cell {
	font-size: 14px;
	line-height: 24px;
	font-weight: 300;
	border: 0px;
	font-family: 'Roboto Condensed';
}

#mitarbeiter-main-table .tabulator-cell[tabulator-field="easywize"] span {
	font-weight: 400;
	font-size: 14px;
	font-family: 'Roboto Condensed';
}



#mitarbeiter-main-table .tabulator-header .tabulator-col,
#mitarbeiter-main-table .tabulator-header .tabulator-frozen.tabulator-frozen-lef
#mitarbeiter-main-table .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left {
	border: 0;
}

#mitarbeiter-main-table .tabulator-header .tabulator-col[tabulator-field="has_verst"] div,
#mitarbeiter-main-table .tabulator-header .tabulator-col[tabulator-field="has_verst"] {
	overflow: visible;
}
#mitarbeiter-main-table .tabulator-header .tabulator-col[tabulator-field="has_verst"] .tabulator-col-content .tabulator-col-sorter {
	right: -18px;
	z-index: 999;
}

/*
#mitarbeiter-main-table .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left input {
	position: relative;
	top: -2px;
}*/

.tbl-icon-btn {
	background: transparent;
	border: 0;
	padding: 4px 6px;
	cursor: pointer;
	line-height: 0;
	display: inline-block;
	background-color: #eceff6;
	margin-top: 0px;
	position: relative;
	top: -3px;
}
.tbl-icon-btn:hover,
.tbl-icon-btn:disabled {
	background-color: #d4dffa !important;
}

.tbl-icon-btn:disabled {
  border: 1px dotted #141414;
  cursor: not-allowed;
}


.tbl-icon-btn svg{
	width: 16px;
	height: 16px;
	display: inline-block;
}

.tbl-icon-btn.danger{ opacity: .9; }
.tbl-icon-btn:hover{ opacity: .75; }


.select-look {
  display: inline-block;
  min-width: 100%;
  padding: 4px 24px 4px 8px;
  border: 1px solid #bbb;
  border-radius: 4px;
  position: relative;
  box-sizing: border-box;
  background: #fff;
}

.select-look::after {
  content: "▾";
  float: right;
  color: #000;
  position: relative;
  right: -10px;
}

.ew-status {
	font-weight: 600;
	color: green; 
}
.ew-fehlt {
	color: red;
}
.ew-gesperrt {
	color: rgb(178, 178, 178);
}

/* Overlay über kompletter Seite */
.overlay {
    position: fixed;
    inset: 0; /* top:0; right:0; bottom:0; left:0 */
    background: rgba(0, 0, 0, 0.45); /* halbtransparent */
    z-index: 9998;

    display: flex;
    align-items: center;
    justify-content: center;


    /* Blur-Effekt */
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px); /* Safari */

    /* verhindert Klicks auf alles darunter */
    pointer-events: all;
}
#pageOverlay.overlay {
	z-index: 9999;
}

/* Spinner */
.overlay-spinner {
    margin-top: -20%;
    width: 180px;
    height: auto;
    display: inline block; 
    text-align: center;
}
.overlay-spinner img {
    width: 220px;
}
/* versteckt */
.overlay.hidden {
    display: none;
}

#multi-edit-box{
  margin-bottom: 14px;
  padding: 10px;
  border: 1px solid #dbe3ea;
  background: #f8fbff;
  border-radius: 8px;
  font-size: 14px;
}

.multi-edit-head{
  font-weight: 600;
  margin-bottom: 8px;
}

.multi-edit-actions{
  margin-top: 8px;
  display: flex;
  gap: 8px;
}

#multi-edit-table .tabulator{
  border: 1px solid #dbe3ea;
}

.tabulator .tabulator-row.tabulator-selected{
  background: #e8f2ff;
}

.tabulator .tabulator-row.row-bulk-dirty{
  box-shadow: inset 4px 0 0 #2563eb;
}

.synch-wrap {
  	top: 2px;
	float: right;
	position: relative;
	left: -8px;
}

.synch-wrap span {
	display: inline-block;
	width: 21px;	
	margin-left: 6px;
}

.synch-wrap span svg {
	height: 34px;
  	position: relative;
  	top: -2px;
}

.synch_dirty span {
	color: red;
}

.synch_aktuell span {
	color: green;
}

.synch-wrap-text {
	float: left;
	font-size: 14px;
	line-height: 16px;
}

#buttonSynchNow {
	display: inline-block;
	padding: 3px 4px 0px 4px;
	color: white;
	position: relative;
  	top: -7px;
  	left: 18px;
}

#buttonSynchNow svg {
	width: 26px;
}

#ma-action-wrap {
	text-align: left;
}

.ma-action-link {
	display: inline-block;
	margin-right: 10px;
	background-color: #eceff6;
}

.ma-action-link:hover {
	background-color: #d4dffa;
}

.ma-action-link.btn-is-active {
	box-shadow: 0 0px 0 #000c3a;
	background-color: #d4dffa;
}

.ma-action-link img {
	max-height: 44px;
	max-width: 50px;
}

#maSubTabActionsBtnWrap {
	padding: 12px 0px 12px 0px;
	text-align: right;
}