html,
body {
    height: 100%;
    padding: 0;
    margin: 0;
}

#content-wrapper {
    min-height: calc(100vh - 2rem);
    /* Adjust 100px to header and footer combined height */
    /* background-color: green; */
    /* padding: 20px; */
    box-sizing: border-box;
}

#toolbar {
    padding-right: 10px;
}

.dx-drawer {
    display: flex;
    flex-flow: column;
    height: 100% !important;
}

.footer {
    position: fixed;
    /* padding: 10px; */
    line-height: 2rem;
    padding-left: 10px;
    left: 0;
    bottom: 0;
    width: 100%;
    /* height: 2rem; */
    text-align: left;
    /* background-color: #333; */
    /* color: white; */
}

.footer a {
    /* text-decoration: underline; */
    text-decoration: none;
    font-weight: bold;
}

.dx-scrollbar-vertical.dx-scrollbar-hoverable {
    width: 13px;
}

.dx-scrollbar-vertical .dx-scrollable-scroll {
    width: 13px;
}

#drawer .dx-list-group-header {
    display: none;
}


/*******************************************\
/* Terminkalender
\*******************************************/
#scheduler .dx-scheduler-cell-sizes-vertical {
    /* Zellenhöhe verkleinern */
    height: 25px;
}

/*******************************************\
/* Mitarbeiterverwaltung zusammenstauchen
\*******************************************/
.dx-popup-content .dx-field-item-label-location-top {
    padding-top: 0;
}

.dx-popup-content .dx-field-item:not(.dx-field-item-has-group):not(.dx-field-item-has-tabs):not(.dx-first-row):not(.dx-label-v-align) {
    padding-top: 0;
}

.dx-popup-content .dx-layout-manager:not(.dx-layout-manager-one-col) .dx-field-item-has-group,
.dx-popup-content .dx-form-group-with-caption>.dx-form-group-content {
    /* Rand unter Passfoto-Editor entfernen */
    padding-bottom: 0;
}

.dx-popup-content .dx-layout-manager .dx-field-item:not(.dx-first-row) {
    /* Tabs unten hoch rücken */
    padding-top: 0;
}

.dx-popup-content .dx-layout-manager:not(.dx-layout-manager-one-col) .dx-datagrid-edit-form-item.dx-first-row.dx-last-col.dx-field-item.dx-field-item-has-tabs {
    /* Details-Tabs und Passfoto Editor sich überlappen lassen */
    margin-bottom: -75px;
}

.dx-popup-content .dx-layout-manager:not(.dx-layout-manager-one-col) .dx-datagrid-edit-form-item.dx-first-row.dx-last-col.dx-field-item.dx-field-item-has-group {
    /* Details-Tabs und Passfoto Editor sich überlappen lassen */
    margin-bottom: -40px;
}

.dx-popup-content :not(.dx-layout-manager-one-col) .dx-tabs.dx-widget.dx-collection.dx-tabs-expanded {
    /* Tableiste transparent machen, damit der "Bild auswählen" Button auch bei Überlappung sichtbar bleibt */
    background-color: transparent;
    /* Mausereignisse für die Leiste selbst deaktivieren, damit mit dem "Bild auswählen" Button darunter interagiert werden kann */
    pointer-events: none;
}

.dx-popup-content :not(.dx-layout-manager-one-col) .dx-tab.dx-tabpanel-tab {
    /* Mausereignisse für Tabs selbst wieder aktivieren */
    pointer-events: auto;
}

.dx-checkbox-container {
    /* Checkboxen vertikal ausrichten */
    padding: 9px 0;
}

.dx-item.dx-menu-item:has(.dx-submenu) {
    /* Contextmenüpunkte mit Unterpunkten mit Mauszeiger statt Pointer anzeigen */
    cursor: auto;
}

.dx-scheduler-appointment.dx-scheduler-appointment-locked,
.dx-scheduler-appointment.dx-scheduler-appointment-locked * {
    cursor: auto;
}


/* .dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row)>td:not(.dx-focused) { */
/* Mauszeiger als Hand anzeigen über Zeilen in Tabelle */
/* cursor: pointer; */
/* } */

.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row>td.dx-cell-modified:not(.dx-field-item-content):not(.dx-validation-pending).dx-command-edit.dx-command-edit-with-icons .dx-link,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row>td.dx-datagrid-invalid:not(.dx-field-item-content):not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row>td:not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link {
    /* Icons in Tabelle grau und größer darstellen */
    font-size: 26px;
    margin-right: 3px;
    opacity: 0.8;
}

.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row>td.dx-cell-modified:not(.dx-field-item-content):not(.dx-validation-pending).dx-command-edit.dx-command-edit-with-icons .dx-link:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row>td.dx-datagrid-invalid:not(.dx-field-item-content):not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link:hover,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row>td:not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link:hover {
    /* Icons in Tabelle blau darstellen, wenn Mauszeiger darüber ist */
    opacity: 1;
    color: #3580ce;
}

.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row>.dx-command-edit.dx-command-edit-with-icons {
    padding-left: 0;
}



.dx-toast-stack {
    margin-bottom: 5px;
}

.inner-cell {
    background-color: #ddd;
}

.dx-datagrid .dx-data-row>td.bullet {
    padding-top: 0;
    padding-bottom: 0;
}

.badge:before {
    content: 'badge'
}

.check:before {
    content: 'check'
}

.check_placeholder:before {
    content: 'check';
    opacity: 0;
}

.check_box:before {
    content: 'check_box'
}

.check_box_outline_blank:before {
    content: 'check_box_outline_blank'
}

.check_box_placeholder:before {
    content: 'check_box_outline_blank';
    opacity: 0;
}

.radio_button_checked:before {
    content: 'radio_button_checked'
}

.radio_button_unchecked:before {
    content: 'radio_button_unchecked'
}

.radio_button_placeholder:before {
    content: 'radio_button_unchecked';
    opacity: 0;
}

.groups:before {
    content: 'groups'
}

.business:before {
    content: 'business'
}

.calendar_month:before {
    content: 'calendar_month'
}

.explore:before {
    content: 'explore'
}

.description:before {
    content: 'description'
}

.edit:before {
    content: 'edit'
}

.delete:before {
    content: 'delete'
}

.clear:before {
    content: 'clear'
}

.list_status:before {
    content: 'list_status'
}

.checklist:before {
    content: 'checklist'
}

.chevron_right:before {
    content: 'chevron_right'
}

.mail:before {
    content: 'mail'
}

.logout:before {
    content: 'logout'
}

.password:before {
    content: 'password'
}

.upload_file:before {
    content: 'upload_file'
}

.admin_panel_settings:before {
    content: 'admin_panel_settings'
}

.airline_stops:before {
    content: 'airline_stops'
}

.accountHeader h2 {
    margin: 10px 0 7px 0;
    font-size: 16px;
    font-weight: bold;
}

.border-box {
    text-align: left;
    max-width: 475px;
    /*margin: 20px;
    margin-top: 50px;*/
    margin-top: 5vh;
    padding: 20px;
    padding-top: 10px;
    /*border: 1px solid rgba(50, 50, 50, 0.35);
    border-radius: 5px;
    -webkit-box-shadow: 1px 1px 6px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 1px 1px 6px 0px rgba(50, 50, 50, 0.75);
    box-shadow: 1px 1px 6px 0px rgba(50, 50, 50, 0.75);*/

    background-color: white;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 2px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}

/* Default style when window height is less than 550px */
.border-box {
    margin-top: 0px;
}

#toolbar {
    padding-left: 15px;
}

/* .dx-field-item:  */

/* When window height is at least 550px */
@media (min-height: 550px) {
    .border-box {
        margin-top: 10vh;
    }
}

@media (max-height: 550px) {
    .border-box .dx-layout-manager .dx-field-item {
        padding-bottom: 0px;
    }

    .border-box .dx-layout-manager .dx-last-row.dx-field-item {
        padding-top: 0px;
    }

    .border-box .dx-layout-manager .dx-field-item-label-location-top {
        padding-top: 0px;
    }
}