@charset "UTF-8";

/* general tags */
body {font-family:Arial; font-size:14px; margin:0; padding:0;}
body > section {width:100%;}
section {display:inline-block; vertical-align:top;}
h1 { font-size: 28px;}
/** border = 0, cellpadding = 0, cellspacing = 0 **/
table { 
    border-spacing: 0px;
    border: 0;
    border-collapse: collapse;
}
span.error_indicator  {padding-left: 16px; margin-left: 3px; }

/* https://www.tutorialspoint.com/Style-select-options-with-CSS */
/* https://www.educba.com/css-triangle-generator/ */
div.arrow-down {
    width: 0px;
    height: 0px;
    border: 200px solid;
    border-bottom-color: transparent;
    border-top-color: var(--app-color-fold);
    border-left-color: transparent;
    border-right-color: transparent;
}
div.arrow-up {
    width: 0px;
    height: 0px;
    border: 200px solid;
    border-bottom-color: var(--app-color-fold);
    border-top-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
}
div.arrow-right {
    width: 0px;
    height: 0px;
    border: 200px solid;
    border-bottom-color: transparent;
    border-top-color: transparent;
    border-left-color: var(--app-color-fold);
    border-right-color: transparent;
}
div.arrow-left {
    width: 0px;
    height: 0px;
    border: 200px solid;
    border-bottom-color: transparent;
    border-top-color: transparent;
    border-left-color: transparent;
    border-right-color: var(--app-color-fold);
}

tr.locked td, tr.locked a, tr.locked td select, tr.locked td input { color: red; }
td { padding: 0px;}
input, select, textarea {border-radius: 0.3em; border-color:#ccc;}
button {
    margin: .5em .4em .5em 0;
	/* margin-bottom: 0; */
    cursor: pointer;
    color: #ffffff;
    border-color: #c0c0c0;
	display: inline-block;
	padding: 6px 12px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	/* background-image: none; */
	border: 1px solid transparent;
	border-radius: 4px;
}

.bootstrap-dialog-draggable {cursor: grab;}
/* damit close ganz rechts ist */
.bootstrap-dialog-header {width: 100%;}

.itemRow_new {display:none;}
.stdItemsTable {width:100%; margin:0;}
    .stdHeadItem {
        background:#f0f0f0; 
        border-right:1px solid #ffffff; 
        padding:0.25em; 
        vertical-align:top;
    }
    .stdHeadItemOps {width:21px; padding:0 0.5em;}
    .stdItem {padding:0.2em 0 0 0; vertical-align:top;}
        .stdItemOps {width: 40px; padding:0 0.5em; text-align:center;}
        .stdAddItem {padding:0.25em 0}
        
.dialog_details_row .ui-spinner {width:100%;}           
.dialog_details_leftCell {text-align:left; vertical-align:top;
    white-space:nowrap; font-weight:bold;
    padding:0.25em 1em 1em 0;}
.dialog_details_rightCell {text-align:left; vertical-align:top; width:100%;
    padding:0 1em 0 0;}
.dialog_details_edit_leftCell {text-align:right; vertical-align:top;
    white-space:nowrap; font-weight:bold;
    padding:0.25em 1em 0.5em 0;}
.dialog_details_edit_rightCell {text-align:left; vertical-align:top; }
.dialog_details_bothCell {text-align:left; vertical-align:top;
    padding:0.25em 1em 0.5em 0;}

.description {font-style:italic; padding-left:1em; }
.description.readonly {padding-left:0.4em;}
.dialog_details_vertical .description {padding-left:0em; display:block;}
.dialog_details_vertical .input_help {float: unset;}

.inputTime {width:3.5em;}

.dialog_radio_label {padding:0 0.75em 0 0.25em;}

div.groupToggler {
    cursor:pointer;
    color: white;
    background-color: #2f8ab9;
    width: 100%;
}

.form-group {margin-top: 10px;}

/* dialogDetails */
table.dialog_details_table {width: calc(100% - 20px); margin-left: 10px; margin-right: 10px; margin-top: 10px;}
table.dialog_details_table_colx {width: 100%;}
td.dialog_details_table_colx {width: 1em;}
table.dialog_details_table_colx .dialog_details_rightCell {width: unset; }
/* bei verticalLayout false: Abstand bei rowcolx unter rechter Spalte */
/* .dialog_details_rightCell:has(table.dialog_details_table_colx) {padding-bottom: 1em; padding-right: 0px;} */
.colx_container  {
    /* padding-bottom: 1em !important; 
    padding-right: 0px  !important; */
    padding-bottom: 1em; 
    padding-right: 0px;
}
.dialog_details_row td.dialog_details_vertical.colx_container {
    padding-bottom: 0px; 
    padding-right: 0px;
}

/*table.dialog_details_table input[type="checkbox"],*/
table.dialog_details_table input[type="text"], 
table.dialog_details_table input[type="file"], 
table.dialog_details_table select, 
table.dialog_details_table textarea {width: 100%;}

table.dialog_details_table input.inputDate[data-withtime="1"],
.inputDate[data-withtime="1"] { width:8.5em; margin-right:0.2em;}
table.dialog_details_table input.inputDate[data-withtime="0"],
.inputDate[data-withtime="0"] {width:6em; margin-right:0.2em;}
.hasDatepicker {width:6em; margin-right:0.2em;}
.inputDate + img {width: 24px; cursor: pointer;}

.model_modified_info {font-size: 85%; padding-right:6px; text-align: right;}
table.dialog_details_table label.error {display:none;}
.headerRecordInfo {float:right; text-align: right; font-size:80%; margin-left: 30px;}

header h1 { padding-top:7px;}

    .pwdOps {margin-top:1.5em;}
        .pwdLink  {text-decoration:underline; font-style:italic;}
            .dialog_details_row td.dialog_details_vertical {padding-bottom: 12px; vertical-align: top;}
            .dialog_details_row td.nopadding {padding: 0px;}
            .dialog_details_row .ui-spinner {width:100%;}           
            .dialog_details_leftCell {text-align:left; vertical-align:top;
                white-space:nowrap; font-weight:bold;
                padding:0.25em 1em 1em 0;}
            .dialog_details_rightCell {text-align:left; vertical-align:top; width:100%;
                padding:0 1em 0 0;}
            .dialog_details_edit_leftCell {text-align:right; vertical-align:top;
                white-space:nowrap; font-weight:bold;
                padding:0.25em 1em 0.5em 0;}
            .dialog_details_edit_rightCell {text-align:left; vertical-align:top; }
            .dialog_details_bothCell {text-align:left; vertical-align:top;
                padding:0.25em 1em 0.5em 0;}

/* the datatable */
table.dataTable tbody tr,
table.dataTable > tbody > tr th,
table.dataTable > tbody > tr td {background: transparent;}
table.dataTable > tbody > tr.odd > td {padding:0.5em; background: #ffffff;}
table.dataTable > tbody > tr.even > td {padding:0.5em; background: #ffffc6;}
table.dataTable > tfoot > tr > td {padding:0.5em; background: #E0E0E0;}
table.dataTable > thead.footer > tr > td {padding:0.5em; background: #E0E0E0;}

#registerErrorDiv,
#registerMandatorDiv {
   width: 100%;
   padding: 30px; 
}

.dialog_details_tableProfil { 
    width: calc(100% - 20px);
}


.vertical-lr {writing-mode: vertical-rl;}
.vertical-rl {writing-mode: vertical-lr;}
.dialog_details_vertical .dialog_edit_text > .dialog_edit_text {display: block;}
/* in Edit Dialogen wird der Abstand nach unten ueber dialog_details_leftCell geloest
   bei textarea ist die rechte Zelle groesser - also Abstand unter edit_textnl */
.dialog_edit_textnl {margin-bottom: 1em;}
/* aber nur im horizontal layout */
.dialog_details_vertical .dialog_edit_textnl {margin-bottom: 0;}

/** Helper **/
#toast-container > .toast-info {background-color: #008ae6;}
.toast-top-right {top: 66px;}
label {font-weight: bold;}
.input_help {float:left; font-style:italic; font-weight: normal;}
.input_help_inline {font-style:italic; font-weight: normal;}
.input_help_block {display:block; font-style:italic; font-weight: normal;}

.red {background: red !important;}
.yellow {background: yellow !important;}
/* .yellow {background: #9c9c40 !important;} */
.green {background: green !important;}
.redText {color:red !important;}
.yellowText {color:#9c9c40 !important;}
.greenText {color:green !important;}
.blueText {color:rgb(2, 29, 177) !important;}
.nobr {white-space:nowrap;}
.imgButton {cursor:pointer; padding:0 0.25em;}
.extraButton {margin-left:0.5em;}
.sheetLink {text-decoration:underline; font-weight:bold;}
.disabled {background:#f0f0f0;}
input.readonly {background:#f0f0f0; border:1px solid #b0b0b0;}
input:disabled, select:disabled {background:#f0f0f0 !important; }
.striked {text-decoration:line-through;}
.pointer {cursor:pointer;}

img.link {padding-left: 5px;padding-right: 5px;}
.buttonBar {margin:0 0 0.75em 0;}
th .buttonBar {margin:0 0 0 0;}
.msgArea {font-weight:bold; font-size:1.2em; margin-top:1.5em;}
.save_info {padding:0.5em 1.5em; background:#ffffe3; border:1px solid #d0d0d0;}
.error {font-weight:bold; color:red;}
.success {font-weight:bold; color:green;}
.warning {color:#FF8C00;}
.info {background:#ffffb3;}
label#passwd-error {font-size: 80%;}

.requiresRefresh {text-decoration: underline;}

/*position:fixed noetig, das man sonst aus dem Bereich rausscollen kann! */
#wait_for_loaded {position:fixed; top:0; left:0; bottom:0; right:0;
                  z-index:1000000; display:none;
                  cursor:wait; background:transparent;}
/* #qtip-container {display:none;} */
  
.loadingDiv {display:inline-block;
             position:absolute; top:0; left:0; bottom:0; right:0;
             background:rgba(0,0,0,0.25);
             display:none; z-index:10;}
    .loading {display:inline-block;
              position:absolute; top:125px; left:48%;
              background:white; padding:0.75em; border:1px solid #808080;
              color:red; font-weight:bold;}

header {color:#ffffff; padding:0.5em 0; display:table; width:100%;}
    header h1 {vertical-align:middle; padding-top:0px; display:table-cell; font-size:1.5em; font-weight:bold; text-align:left; white-space:nowrap;}
    .headerInfo {display:table-cell; font-size:1em; font-weight:bold; padding:0 1em 0 1em;}
    .headerInfoMandant {width: 100%; font-size:1em; font-weight:bold; text-align:right; padding:0 1em 0 1em;}
        .headerInfoItemLeft {display:inline-block; padding-left:1em; vertical-align:top;}
        .headerInfoItemRight {float:right; display:block; padding-right:1em; padding-bottom: 4px; padding-left: 1em;}
        .headerInfoItemFirst {padding-left:0em;}
        .headerInfoItemLast {padding-right:0em;}
        .headerInfoTitle {display:inline-block; width:100%; padding-left:0em; vertical-align:top;}
        .headerInfoSubitem {display:inline-block; /*padding-right:1em; */text-align:left;vertical-align:top;}
        .headerInfoTitle img.logo {padding:2px; padding-bottom:4px; padding-right:1em; height: 35px; float:left;}
/** laeuft noch nicht */
@media screen and (max-width: 376px) 
{
    .headerInfoItemLeft {padding-left: 0px; max-width: 280px;}
    .headerInfoItemLeft h1 {max-width: 220px; overflow: hidden;}
    #loginHeaderInfoDetails {float: left;}
    .headerInfoSubitem select {max-width: 270px;}
    .headerInfoItemRight {padding-right: 0.3em; padding-left: 0.3em;}
}

/** Application / Tabs / Help Tabs **/
/* overwrite default jqueryUI */
#dlgTabContainerOverlay {position:fixed; z-index: 300; display: none; opacity:0.4; background-color:#000000; cursor: no-drop;}
ul#dlgTabs {display:block; background:#ffffff; text-align:left; 
                padding:0.25em 2.5em 0em 0.5em; margin-left: -2px; margin-right: 2px; 
                margin-bottom: 2px;}
/* kopiert von jQueryUI */
ul#dlgTabs > liX {
    list-style: none;
    float: left;
    position: relative;
    top: 0;
    margin: 1px .2em 0 0;
    border-bottom-width: 0;
    padding: 0;
    white-space: nowrap;
}

li.dlgTab {
    border:1px solid rgb(170, 170, 170); 
    border-bottom-width:0px; 
    border-top-left-radius:4px; 
    border-top-right-radius:4px;
    display:inline-block; cursor:pointer;
    padding:0.25em 1.5em; margin:0px 0.25px -1px 0px;
}
li.dlgTabActive {color:#000000; background:#ffffff;}
li.dlgTabPassive {color:#808080; background:#f0f0f0;}
div.dlgTabPassive {display:none;}

.tabCloser {padding:0.4em 0.4em 0 0; cursor:pointer;}

/* tabs */
#tabContainer { display:none; padding: 0px; border: 0;}
#tabContent {background:#f0f0f0;}
#tabContent > div.ui-tabs-panel {overflow:auto;}
#tabs {border: 0; background:#ffffff;}
#tabs > li {background:#ffffff;}
#tabs > li:focus {border: 0px !important;}

/* tabsHelp */
#tabHelpContent {padding: 10px; background:#fffad3;}
#tabHelpContent > div.ui-tabs-panel {overflow:auto;}
#tabHelpContainer { display: none; }
#tabsHelp {background:#9d8e18;}
#tabsHelp > li {background:#e1d67b; cursor: pointer; padding: 4px;}
#tabsHelp > li.ui-tabs-active {background:#fffad3;}
#tabsHelp > li > a {font-weight: normal;text-decoration:none;}

.help_text { background-color:#fffad3; font-size: 120%; line-height: 1.5em;}
/** rgb(255, 255, 198); **/
.help_wrapper {padding-right: 8px; float:right; max-width:20px;}

.usage_info {display:inline-block; margin:0.5em; padding:0.5em; background:#ffffe3; border:1px solid #d0d0d0;}

.mandatoryNote {margin: 0px 10px 0.5em 0.5em;}
#mandatoryInfo {display:none;}
    .mandatory {background:#ffffb3 !important;}
    .mandatory_option {background:#ffffE1 !important;}
    .mandatory.disabled {background:#f0f0f0 !important;}
    .mandatoryAsterisk {display:none;}
.dialog_details_table.readonly .mandatory {background: unset !important;}

.inputTimeHide > input.readonly {background:#f0f0f0; color:#f0f0f0; border:1px solid #b0b0b0;}


/** DataTables **/
div.dataTables_wrapper div.dataTables_processing {
    border: 1px solid #c0c0c0;
    background: red; 
    z-index: 2; 
    color: white; 
    font-weight: bold;
    top: 54px; 
    vertical-align: middle;
    padding: 0.75em 0 1em 0;
    width: calc(80%vw);
    left: calc(20%vw / 2);
}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTableFilter {
    float: left;
}
.dataTables_wrapper .dataTables_filter {
    float: right;
}
.dataTables_wrapper .dataTables_filter input {
    background-color: #ffffff;
    padding:1px;
    margin-bottom: 3px;
}
.dataTables_wrapper .dataTables_length select {
    background-color: #ffffff;
}
.datatableFilter {display:inline-block; padding:0;}
.datatableFilterItem {display:inline-block; vertical-align:top; margin:0 0 0 1em;}
.datatableFilterItemLabel {display:inline-block; margin:0 0.5em 0 0.5em;}
.datatableFilterItemLabel2 {margin-left:0.5em;}
.datatableFilterItem > label {
    padding-left: 0em;
}

/* settings */
table.settings_table { display: none; margin-left: 30px;}
#SettingsTable .settings_menu_spacer { 
    border-right: 1px solid #c5c5c5;
    height: 4px;
}
#SettingsTable > tbody > tr > td { vertical-align: top; }
#SettingsTable > tbody > tr > td > div.settings_menu_item  {
	cursor: pointer;
    background-color: white;
	font-size: 120%;
	/* margin-bottom: 4px; */
	padding: 8px;
	color: #8c8c8c;
	border: 1px solid #c5c5c5;
	/* border-right-width: 1px; */
	border-radius: 3px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}
#SettingsTable div.settings_menu_item.settingsTabActive {
	color: black;
	/* font-weight: bold; */
	background-color: #f0f0f0;
	/* border: 1px solid #6a6a6a; */
	border: 1px solid #93b699;
	border-right: 0px;
	padding-right: 0px;
	border-radius: 3px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}

.settingsTableFrame {margin:0.5em 0;}
        .settingLabelCell {vertical-align: top; padding:0.25em 1em 0.25em 0; font-weight:bold;}
        .settingInputCell {vertical-align: top; padding:0.25em 1em 0.5em 0; }
            .settingRadioLabel {padding:0 0.75em 0 0.25em;}
            .SettingRadioImg   {padding:0 0 0 2em;}


.qtip-content {padding: 0.4em; background-color: #fffad3;}
.qtip-content .help_text th { background-color: #e1d67b;}
.qtip-content .help_text td { background-color: #fffad3;}
.qtip-titlebar { 
    color: #fff !important;
    background-color: black !important;
}
.border {border: 1px solid #000000;}
span.circle {
            border-radius: 50%;
            vertical-align: middle;
            display: inline-block;
            width: 18px;
            height: 18px;
            color: white;
            margin-left: -2px;
            padding-left: 4px;
            padding-top: 1px;
            margin-bottom: -1px;
            font-size: 10pt;
            font-weight: 900;
            cursor: pointer;
           }
span.circle-sm {
            border-radius: 50%;
            display: inline-block;
            width: 14px;
            height: 14px;
            color: white;
            margin-left: -2px;
            padding-left: 4px;
            padding-top: 1px;
            margin-bottom: -1px;
            font-size: 10pt;
            font-weight: 900;
            cursor: pointer;
           }

/** jQuery UI **/
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor, 
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor, 
.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
    color: #000000;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    color: #808080;
}
.ui-dialog {
    box-shadow : rgb(91, 85, 85) 5px 5px 5px;
    -webkit-box-shadow: 0px 0px 10px rgba(91, 85, 85, 0.5);  
    -moz-box-shadow: 0px 0px 10px rgba(91, 85, 85, 0.5); 
}
.ui-dialog .ui-dialog-title { width:100%; padding-right: 15px;}

.ui-autocomplete {
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid #d3d3d3;
}
.ui-spinner-input {
    border: inherit;
    padding: inherit;
    margin: inherit;
    margin-left: inherit;
    margin-right: inherit;
}
.ui-corner-all {border-radius:0;}

.ui-button:focus, input:focus, select:focus, button:focus, .btn-default:focus {
    border-color: #c0c0c0 !important;
}
input.ui-widget-content.ui-state-default {
    color: black;
    background: white;
}
a.ui-button.ui-widget.ui-state-default.ui-button-icon-only.custom-combobox-toggle {
    border: 1px solid #d3d3d3;
    background: #e6e6e6 url('../images/ui/ui-bg_glass_75_e6e6e6_1x400.png') 50% 50% repeat-x;
    font-weight: normal;
    color: #000000;
}
/* 
.toast-success{background-color:#51a351}
.toast-error{background-color:#bd362f}
.toast-info{background-color:#2f96b4}
.toast-warning{background-color:#f89406}
*/
.error-gradient {
    background: -moz-linear-gradient(top,  #ffb9b9 0%, #bd362f 100%) !important; /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb9b9), color-stop(100%,#bd362f)) !important; /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffb9b9 0%,#bd362f 100%) !important; /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffb9b9 0%,#bd362f 100%) !important; /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffb9b9 0%,#bd362f 100%) !important; /* IE10+ */
	background: linear-gradient(to bottom,  #ffb9b9 0%,#bd362f 100%) !important; /* W3C */
}
.warning-gradient {
    background: -moz-linear-gradient(top,  #ffdaa7 0%, #f89406 100%) !important; /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffdaa7), color-stop(100%,#f89406)) !important; /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffdaa7 0%,#f89406 100%) !important; /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffdaa7 0%,#f89406 100%) !important; /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffdaa7 0%,#f89406 100%) !important; /* IE10+ */
	background: linear-gradient(to bottom,  #ffdaa7 0%,#f89406 100%) !important; /* W3C */
}
.info-gradient {
    background: -moz-linear-gradient(top,  #62daff 0%, #2f96b4 100%) !important; /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#62daff), color-stop(100%,#2f96b4)) !important; /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #62daff 0%,#2f96b4 100%) !important; /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #62daff 0%,#2f96b4 100%) !important; /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #62daff 0%,#2f96b4 100%) !important; /* IE10+ */
	background: linear-gradient(to bottom,  #62daff 0%,#2f96b4 100%) !important; /* W3C */
}
button[disabled="disabled"],
button[disabled="disabled"]:focus, 
button[disabled="disabled"]:hover {
    background: linear-gradient(to bottom, #F0F0F0 0%,#808080 100%);
    cursor: not-allowed;
    box-shadow: none;
    opacity: .65;
}
div.ui-dialog-titlebar.error-gradient button.ui-button.ui-dialog-titlebar-close,
div.ui-dialog-titlebar.warning-gradient button.ui-button.ui-dialog-titlebar-close,
div.ui-dialog-titlebar.info-gradient button.ui-button.ui-dialog-titlebar-close {
    background: unset;
}
div.ui-dialog-titlebar.error-gradient button.ui-button.ui-dialog-titlebar-close .ui-button-icon,
div.ui-dialog-titlebar.warning-gradient button.ui-button.ui-dialog-titlebar-close .ui-button-icon,
div.ui-dialog-titlebar.info-gradient button.ui-button.ui-dialog-titlebar-close .ui-button-icon {
    background-image: url('images/ui-icons_ffffff_256x240.png');
}
