.table-bicolor {
    height: min-content;
    /*width: min-content; shrinks inputs and selects too much*/
    border-collapse: collapse !important;
}

    .table-bicolor tbody td {
        border-top: 1px dashed black;
        border-bottom: 1px dashed black;
    }

.data-color-indicator {
    min-width: 1rem;
    min-height: .75rem;
    border: 1px solid black;
    border-radius: 3px;
}

.table-bicolor td.data-cell > div {
    margin: 0 .5rem;
}

.table-bicolor td.data-color {
    text-align: right;
    border: 1px dashed black;
}

.table-bicolor thead {
    position: sticky;
    top: 0px;
    color: white;
    background-color: black;
    z-index: 101;
}


.table-bicolor-data tr > *:nth-child(1) {
    color: white;
    background-color: black;
    position: sticky;
    left: 0;
    z-index: 102;
}

div.loggis-grid > div.loggis-grid-header *, div.loggis-grid button {
    font-family: Verdana, Arial !important;
    font-weight: bold;
}

div.loggis-grid > div.loggis-grid-header * {
    font-size: .9rem;
}

div.loggis-grid > div.loggis-grid-header div {
    justify-content: center;
    text-align: center;
}

.table-bicolor input, div.loggis-grid input, .table-bicolor select, div.loggis-grid select, .table-bicolor span, div.loggis-grid span {
    white-space: nowrap !important;
    font-family: 'Lucida Console', monospace !important;
}

.table-bicolor *:not(h1, h2, h3, h4, h5), div.loggis-grid *:not(h1, h2, h3, h4, h5) {
    font-size: .75rem;
}

div.grid-cell {
    display: flex;
    justify-content: center;
    align-items: center;
}

div.loggis-grid-row input {
    margin-block: auto;
}

    div.loggis-grid-row input[type="checkbox"].w-1rem {
        width: 1rem;
        height: 1rem;
    }

    div.loggis-grid-row input[type="text"] {
        width: 100%;
    }

    div.loggis-grid-row input:not([type="checkbox"]) {
        flex-grow: 1;
    }

div.loggis-grid-vlines div.loggis-grid-row > *:first-child {
    border-left: none !important;
}

div.loggis-grid-vlines div.loggis-grid-row > * {
    padding-inline: .5rem;
    border-left: 1px solid black;
    /*outline: 1px solid black;*/
}

div.loggis-grid {
    display: grid;
    grid-template-rows: min-content;
    background-color: whitesmoke;
}


    div.loggis-grid * {
        white-space: nowrap;
    }

    div.loggis-grid textarea {
        resize: none;
    }

    div.loggis-grid .form-control, div.loggis-grid .form-select {
        padding-block: 0;
    }

    div.loggis-grid div.loggis-grid {
        border-top-style: none;
        border-right-style: none;
        border-bottom-style: solid;
        border-left-style: solid;
        border-width: 1px;
        border-color: black;
    }

    div.loggis-grid > div.loggis-grid-header > * {
        padding-top: 2px;
        padding-bottom: 2px;
        border-color: gray;
        border-style: solid;
        border-width: 0 0 1px 0;
        user-select: none;
    }

div.loggis-grid-pos3d input[type='number'] {
    width: 7rem !important; /* shows 1000000.0001 */
    font-size: 0.7rem !important; /* shows 1000000.0001 */
    font-family: 'Lucida Console', "Courier New", Courier, monospace !important;
    /*width: 6rem;
    -webkit-appearance: none;
    margin: 2px;
    -moz-appearance: textfield;*/
}

div.loggis-grid-pos3d div.grid-col-even, div.loggis-grid-pos3d div.grid-col-odd {
    padding: 0px;
    display: flex;    
}

div.loggis-grid-pos3d .action-icon {
    padding: 1px !important;
    display: flex;
}


div .loggis-grid-pos3d div.grid-col-even {
    background-color: hsl(0, 0%, 20%) !important;
}

    div.loggis-grid-pos3d div.grid-col-even .action-icon {
        border: 1px solid hsl(0, 0%, 80%);
    }

div.loggis-grid-pos3d div.grid-col-odd {
    background-color: hsl(0, 0%, 80%) !important;
}

    div.loggis-grid-pos3d div.grid-col-odd .action-icon {
        border: 1px solid hsl(0, 0%, 20%);
    }

div.loggis-grid-sticky > div.loggis-grid-header:first-of-type > div {
    /* we make only the first line sticky */
    position: sticky;
    top: 0;
    z-index: 3;
}
div.loggis-grid-sticky-self {
    position: sticky;
    top: 0;
    z-index: 3;
}

div.loggis-grid-sticky > div.loggis-grid-row > div:first-of-type {
    /* we make only the first line sticky */
    position: sticky;
    left: 0;
    z-index: 2;
}

div.loggis-grid > div.loggis-grid-header, div.loggis-grid > .loggis-grid-row {
    display: contents;
}

    div.loggis-grid > div.loggis-grid-header > *, div.loggis-grid > .loggis-grid-row > * {
        /*padding-inline: .25rem !important; /* elements have a small padding left and tight so that the content is not too close to the border */
    }

div.loggis-grid .loggis-grid-border-vertical > div:not(:last-of-type) {
    border-right: 1px solid gray; /* all elements have a thin border, except for the last one */
}

div.loggis-grid-bicolor select {
    background-color: white;
    border: 1px solid gray;
    border-radius: 0.25rem;
}

div.loggis-grid-bicolor > .loggis-grid-row:nth-child(2n) > div, .table-bicolor tbody > tr:nth-child(2n) {
    background-color: whitesmoke;
}

div.loggis-grid-bicolor > .loggis-grid-row-disabled > div {
    background-color: #FAA !important;
}

div.loggis-grid-bicolor > .loggis-grid-row-disabled input, 
div.loggis-grid-bicolor > .loggis-grid-row-disabled option, 
div.loggis-grid-bicolor > .loggis-grid-row-disabled select {
    text-decoration: line-through;
    background-color: darkgray !important;
}

div.loggis-grid-bicolor > .loggis-grid-row:nth-child(2n+1) > div, .table-bicolor tbody > tr:nth-child(2n+1) {
    background-color: lightgray;
}

.loggis-grid-resizable-input-container {
    /*display: flex;
    flex-direction: column;
    margin-block: auto;
    width: 100%;*/
}

    .loggis-grid-resizable-input-container * {
        font-size: 0.75rem !important;
    }

    .loggis-grid-resizable-input-container span {
        user-select: none;
        z-index: -1;
        height: 0px !important; /* has width base on text, but is invisible */
        padding-inline: .5rem; /* just a bit of extra space for the input*/
    }

    .loggis-grid-resizable-input-container input {
        margin: 0px !important;
        padding: 0px !important;
        min-width: 3ch;
    }