table,
th,
td {
    border: 1px solid #ddd;
}

th,
td {
    padding: 10px;
    text-align: left;
    white-space: nowrap;
}

th {
    background-color: #f4f4f4;
}

thead.sticky tr th {
    position: sticky;
    top: -1px;
    z-index: 2;
}

tr.disabled td {
    color:
        color-mix(in oklab, currentColor, transparent 10%);
    text-decoration-color: var(--wa-color-danger-on-quiet);
    text-decoration-line: line-through;
    text-decoration-thickness: 0.09375em;
}

.booking-form {
    max-width: 400px;
    margin: auto;
}

wa-card {
    max-width: 620px;
    margin: auto;
}

body:not(.initialized) .hide-initially,
body:not(.initialized) .hide-while-loading,
body.loading .hide-while-loading {
    display: none;
}

body:not(.loading) .show-while-loading {
    display: none;
}

.mark-if-empty:empty::before {
    content: '?';
    color: grey;
    font-weight: normal;
}

body:not(.booking-has) .booking-existing,
body.booking-has .booking-new {
    display: none;
}

.request-detail-info {
    font-weight: bold;
}

.request-detail>span:first-child {
    width: 100px;
    display: inline-block;
}

.request-detail-inline:not(.request-detail-ok)>.request-detail-exists,
.request-detail:not(.request-detail-ok)>.request-detail-exists {
    display: none;
}

.request-detail-inline.request-detail-ok>.request-detail-missing,
.request-detail.request-detail-ok>.request-detail-missing {
    display: none;
}

.booking-type>span:not(:empty):before {
    content: ' / ';
}

.booking-type-color-private,
.booking-type-private {
    color: #00c;
}

.booking-type-private::before {
    content: 'Privat';
}

.booking-type-color-public,
.booking-type-public {
    color: #09f;
}

.booking-type-public::before {
    content: 'Forening';
}

.booking-type-custom,
.booking-type-color-custom {
    color: #808;
}

.booking-type-custom::before {
    content: 'Andet';
}

.booking-state-request::before {
    color: #b60;
    content: 'Ny';
}

.booking-state-preliminary::before {
    color: #b60;
    content: 'Forespørgsel';
}

.booking-state-confirmed::before {
    color: #090;
    content: 'Bekræftet';
}

.booking-state-ready::before {
    color: #0c0;
    content: 'Klar';
}

.booking-state-past::before {
    color: #999;
    content: 'Gammel';
}

.booking-state-cancelled::before {
    color: #900;
    content: 'Annuleret';
}

td.booking-state-cancelled {
    color: white;
    background-color: #900;
}

td.booking-state-cancelled::before {
    color: inherit;
}

.calendar-colors {
    float: right;
    line-height: 2em;

    & span {
        display: inline-block;
        margin-left: 3pt;
        padding: 2px 6px;
        border-radius: 3px;
    }
}

.changelog-entry {
    &>span:not(:last-child):after {
        content: ' | ';
        color: var(--wa-color-gray-80);
    }

    .changelog-oldValue {
        color: var(--wa-color-red-40);

        &:after {
            content: ' >> ' !important;
        }
    }

    .changelog-newValue {
        color: var(--wa-color-green-40);
    }
}