/*** ℳagicTable ***/

.ℳ-Tabelle-Container > thead > tr:hover,
.ℳ-Tabelle-Container > tbody > tr:hover {
    background-color: rgba(255, 165, 0, 0.2);
}

.ℳ-Tabelle-Container > tbody > tr > td:nth-child(n+6):nth-child(-n+9) {
    text-align: center;
}

.drop-indicator-arrow {
    position: fixed;

    height: 24px;
    width: 24px;
    margin-left: -13.5px;
    margin-top: -24px;

    display: none;
    background-image: url(icons/drop-indicator.svg);
    background-position: center;
    background-size: contain;
    /* background-color: var(--header-background-color); */
    /* box-shadow:  0px 0px 20px 00px var(--header-background-color); */
    /* border-radius: 100%; */
    /* border: 2px var(--header-background-color) solid; */

    transform: rotate(-90deg);

    z-index: 1000;

}

.below {
    transform: rotate(90deg);
    margin-top: 0px;
    visibility: hidden;
}

.drop-indicator-line {
    position: fixed;
    height: 400px;
    width: 0px;

    top: 0px;
    left: 0px;

    border-left: 2px black solid;
    background-color: var(--header-background-color);

    margin-left: -2px;
    display: none;
}

.source-column {
    background-color: lightgrey;
}

.dragged {
    background-color: darkgray;
}

.sort-desc:after {
    content: "⯆" attr(data-sortorder);
    white-space: nowrap;
    position: absolute;
    margin-top: -3px;

}

.sort-asc:after {
    content: "⯅" attr(data-sortorder);
    white-space: nowrap;
    position: absolute;
    margin-top: -3px;
}

.ℳ-Tabelle-Container {
    margin: 0em 0.5em 1em 0.5em;    
}


.ℳ-table {
    margin-top: -2px;
    margin-right: 0.5em;
    white-space: nowrap;
}

.ℳ-table > thead {
    white-space: nowrap;
    position: sticky;
    top: 0px;

    background-color: rgb(var(--shade-of-grey), var(--shade-of-grey), var(--shade-of-grey));
}

.ℳ-table > thead > tr > th {

    vertical-align: bottom;

    /* font-family: */
    /*'Josefin Sans',*/
    /* "Hind"; */

    font-family: var(--font-family);

    font-weight: bold;
    text-decoration: underline;

    box-shadow: inset 0 -3px 0 black;
}


.ℳ-table > tbody > tr {
    vertical-align: middle;
}

.ℳ-table > thead > tr > th,
.ℳ-table > tbody > tr > td {
    padding: 6px 4px;
}

.ℳ-table > tbody > tr:nth-child(odd) {
    /* background-color: #ddd; */
    background-color: #eee;
}

.ℳ-table > tbody > tr:nth-child(even) {
    /* background-color: #ccc; */
}

.ℳ-table > tbody > tr > td > span {
    width: 100%;
    display: inline-block;
}

#content[data-selected="Kunden"],
#content[data-selected="Fahrtwünsche"] {
    overflow-y: hidden !important;
    height: 100%;
}


.ℳ-Tabelle-Container {
    height: calc(100% - 30px);
    padding-top: 10px;
}

.ℳ-outer {
    height: 100%;
}

.ℳ-inner {
    overflow-x: auto;
    height: calc(100% - 2em);
}

.ℳ-table {
    max-height: 100%;
    border-collapse: collapse;
}


.ℳ-button-bar {
    margin-top: 1em;
    display: none;
}

.ℳ-pagination {
    margin-top: 1em;
    overflow: auto;
    white-space: nowrap;
    padding-bottom: 0.5em;
}

.ℳ-pagination > label > input {
    width: 4em;
    height: 5px;
    margin-left: 0.5em;
    margin-right: 2em;
}

.ℳ-pagination > label > select {
    margin-left: 0.5em;
    margin-right: 2em;
}


/* Löschbutton */
.ℳ-button-bar > button:first-of-type {
    margin-left: 0.75em;
}

/* Rückgängigbutton */
.ℳ-button-bar > button:not(:first-of-type) {
    margin-left: 1em;
}


.ℳ-button-bar > button[disabled] {
    opacity: 0.5;
}


/* Spalteneinstellungen */
.ℳ-column-settings-button {
    background-image: url(icons/ℳ-Column-Settings.svg);
    background-size: contain;
    height: 1em;
    width: 1em;
    z-index: 10;
    position: relative;
    float: right;
    right: 1.5em;

    font-family: var(--font-family);
    font-weight: normal;

    margin-top: -6px;
    margin-right: -22px;

    color: black;
}


.ℳ-columns-list {
    position: absolute;
    right: 0px;

    background-color: var(--sidebar-background-color);
    text-align: left;
    padding-left: 0;
    list-style-type: none;
    cursor: default;

    font-weight: normal;
    color: black;

    border-radius: 8px;
    box-shadow: 0px 0px 5px 0px black;

    overflow-y: auto;
}

.ℳ-columns-list > li {
    padding-top: 0.25em;
    padding-bottom: 0.25em;
    padding-right: 1em;
    white-space: nowrap;
}

.ℳ-columns-list > li:hover {
    background-color: rgba(255, 255, 255, 0.50);
}

.ℳ-columns-list-is-visible:before {
    content: "✓";
    padding: 0em 1em;
    width: 0.5em;
    display: inline-block;
}

.ℳ-columns-list-is-not-visible {
    padding-left: 2.5em;
}

.ℳ-columns-reset {
    padding-top: 0em !important;
    padding-left: 0.5em;
    padding-right: 0.5em;

}

.ℳ-columns-reset > div {
    border-top: 1px solid gray;
    padding-top: 0.25em;
    padding-left: 0.5em;
    padding-right: 0.5em;
}

.ℳ-inline-button {
    white-space: nowrap;
    vertical-align: middle;
}

tr.highlight {
    box-shadow: inset 0px 0px 0px 3px black;
}

tr.selected,
tr.selected > td {
    background-color: var(--tour-background-color);
    color: var(--tour-text-color);
    /* font-weight: bold; */

}

tr.selected.highlight > td {
    --selected-highlight: linear-gradient(to top, black 3px, transparent 3px), linear-gradient(to bottom, black 3px, transparent 3px);
    background-image: var(--selected-highlight);
}

tr.selected.highlight > td:first-child {
    background-image: linear-gradient(to right, black 3px, transparent 3px), var(--selected-highlight);
}

tr.selected.highlight > td:last-child {
    background-image: linear-gradient(to right, black 3px, transparent 3px), var(--selected-highlight);
}



/* FIXME: !!! */
/* .ℳ-pagination {
    margin-top:-100px
} */

.ℳ-show-filter-dialog {
    margin-right: 2em;
}

.ℳ-show-filter-dialog:disabled {
    color: gray;
}

.ℳ-filter-dialog {
    /* margin-bottom:2em; */
    /* width: 95%; */

    border-radius: 8px;
    box-shadow: 0px 0px 5px 0px black;

    padding: 25px;
    min-width: 250px;
    /* background-color: var(--sidebar-background-color); */
    background-color: rgb(var(--shade-of-grey), var(--shade-of-grey), var(--shade-of-grey));
}

.ℳ-filter-dialog-headline {
    margin-top: 0px;
    text-align: center;
}

.ℳ-filter {
    display: table-row;
    height: 1.5em;
}

.ℳ-filter-parameter {
    padding-left: 3em;
    padding-right: 0.5em;
}

.ℳ-filter > label,
.ℳ-filter > input {
    display: table-cell;
    height: 1.5em;
}

.ℳ-filter > input,
.ℳ-filter > div > input {
    height: 1.5em;
    padding-top: 0px;
    padding-bottom: 0px;
}

.ℳ-filter > auto-complete-input,
.ℳ-filter > address-auto-complete-input {
    height: 1.5em;
    display: inline-block;

    width: 100%;
    overflow: unset;
}

.ℳ-filter-error-message {
    float: right;
    margin-top: 6px;
    color: red;
}

.ℳ-filter.selected {
    font-family: var(--font-family);
    font-weight: bold;
}


.ℳ-filter * {
    white-space: nowrap;
}

.ℳ-filter-group {
    overflow-x: auto;
    overflow-y: hidden;
    /* width: 100%; */
    /* margin-top:1em; */

    margin-bottom: 15px;
    padding: 10px;
    border-radius: 7px;
}

.ℳ-filter-group > div {
    overflow-x: auto;
    overflow-y: hidden;
}

.ℳ-filter-dialog > .dialog-ok-button-wrapper {
    margin-top: 1em;
}

.ℳ-message {
    font-style: italic;
    margin-top: 3em;
    margin-left: 2em;
    position: absolute;
    z-index: 1;
}

.ℳ-message.error {
    color: red;
    font-weight: bold;
}
/* 
.ℳ-data-query-error {
    margin-top: 1em;
    color: red;
    font-weight: bold;
    margin-left: 2em;
} */

.ℳ-ancestors-list {
    display: none;
}


.ℳ-table tr td {
    color: var(--row-color);
}