:root {
    --form-kolumna-table-header-border: none;
    --form-kolumna-table-header-top-color: var(--scheduler-accent-color-dark);
    --form-kolumna-table-header-top-background-color: var(--scheduler-accent-color-light);
    --form-kolumna-table-header-bottom-color: white;
    --form-kolumna-table-header-bottom-background-color: var(--scheduler-accent-color);
    --form-kolumna-cell-background-color: white;
    --form-kolumna-cell-unavaible-background-color: var(--content-background);

    --form-kolumna-cell-type-content-avaible-color: white;
    --form-kolumna-cell-type-content-avaible-color-hover: white;
    --form-kolumna-cell-type-content-unavaible-color: white;
    --form-kolumna-cell-type-content-avaible-background-color: var(--paper-green-600);
    --form-kolumna-cell-type-content-avaible-background-color-hover: var(--paper-green-800);
    --form-kolumna-cell-type-content-unavaible-background-color: var(--paper-pink-600);
}
:root.high-contrast {
    --form-kolumna-table-header-border: solid 1px var(--main-color);
    --form-kolumna-table-header-top-color: var(--main-color);
    --form-kolumna-table-header-top-background-color: var(--main-background-color);
    --form-kolumna-table-header-bottom-color: var(--main-color);
    --form-kolumna-table-header-bottom-background-color: var(--main-background-color);
    --form-kolumna-cell-background-color: var(--main-background-color);
    --form-kolumna-cell-unavaible-background-color: var(--main-background-color);    
    --form-kolumna-cell-type-content-avaible-color: MediumSpringGreen;
    --form-kolumna-cell-type-content-avaible-color-hover: var(--main-background-color);
    --form-kolumna-cell-type-content-unavaible-color: HotPink;
    --form-kolumna-cell-type-content-avaible-background-color: var(--main-background-color);
    --form-kolumna-cell-type-content-avaible-background-color-hover: var(--button-border-color-hover);
    --form-kolumna-cell-type-content-unavaible-background-color: var(--main-background-color);
}

.form-kolumna {
    padding-bottom: 1em;
    padding-left: 1em;
}
.form-kolumna .grid {
    display: grid;
}
.form-kolumna .table-header-cell {
    padding: 0.5em;
    text-align: center;
    border: var(--form-kolumna-table-header-border);
}
.form-kolumna .table-header-cell-top {
    color: var(--form-kolumna-table-header-top-color);
    background-color: var(--form-kolumna-table-header-top-background-color);
    border-top-left-radius: 0.25em;
    border-top-right-radius: 0.25em;
    display: flex;
    flex-direction: column;
    place-content: flex-end;
    border-bottom: none;
}
.form-kolumna .table-header-cell-bottom {
    background-color: var(--form-kolumna-table-header-bottom-background-color);
    color: var(--form-kolumna-table-header-bottom-color);
    display: table-cell;
}
.form-kolumna .table-header-cell-description {
    padding: 0.5em;
    text-align: center;
    border-bottom: 1px solid var(--main-dialog-border-color);
}
.form-kolumna .cell {
    padding-left: 0.5em;
    display: table-cell;
    background-color: var(--form-kolumna-cell-background-color);
    border-bottom: 1px solid var(--main-dialog-border-color);
    vertical-align: middle;
    text-align: center;
}
.form-kolumna .cell-order-no {
    display: table-cell;
    text-align: left;
}
.form-kolumna .cell-time {
    display: table-cell;
    white-space: nowrap;
}
.form-kolumna .cell-order-no-notempty {
    min-width: 3em;
}
.form-kolumna .cell-unavaible {
    background-color: var(--form-kolumna-cell-unavaible-background-color);
    color: var(--main-color-disabled);
}
.form-kolumna .cell-avaible {
    text-decoration: none;
}
.form-kolumna .cell-avaible:hover {
    cursor: pointer;
}
.cell-type {
    width: 100%;
    display: table-cell;
    padding-left: 0.5em;
    padding-right: 0.5em;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}
.form-kolumna .cell-type-content {
    color: var(--form-kolumna-cell-type-content-color);
    width: 100%;
    border-radius: 3px;
}
.form-kolumna .cell-avaible > .cell-type > .cell-type-content {
    color: var(--form-kolumna-cell-type-content-avaible-color);
    background-color: var(--form-kolumna-cell-type-content-avaible-background-color);    
}
.form-kolumna .cell-avaible:hover > .cell-type > .cell-type-content {
    color: var(--form-kolumna-cell-type-content-avaible-color-hover);
    background-color: var(--form-kolumna-cell-type-content-avaible-background-color-hover);
}
.form-kolumna .cell-unavaible > .cell-type > .cell-type-content {
    color: var(--form-kolumna-cell-type-content-unavaible-color);
    background-color: var(--form-kolumna-cell-type-content-unavaible-background-color);
}