:not(:defined) {
    visibility: hidden;
}

sl-alert {
    z-index: 200;
}

sl-avatar {
    cursor: pointer;
}

sl-card div[slot='header'] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

sl-input {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

sl-button.active::part(base) {
    color: var(--sl-color-primary-800);
}

sl-card div[slot="header"] {
    font-weight: bold;
}

sl-card div[slot="footer"] {
    display: flex;
    justify-content: flex-end;
    gap: 1em;
}

.listTable {
    border-collapse: collapse;
    width: 100%;
}

    .listTable tr {
        border-bottom: 1px solid #e4e4e7;
    }

        .listTable tr:hover {
            background-color: #99999910;
        }

        .listTable tr.selected {
            background-color: hsl(200.61deg 63.87% 69.61% / 20%);
        }

            .listTable tr.selected:hover {
                background-color: hsl(200.61deg 63.87% 69.61% / 30%);
            }

    .listTable td {
        padding: 7px 10px;
    }

.listGrid {
    display: grid;
    align-items: center;
    width: 100%;
}

.listGridRow {
    display: contents;
}

    .listGridRow:hover > div {
        background-color: #99999910;
    }

    .listGridRow.selected > div {
        background-color: hsl(200.61deg 63.87% 69.61% / 20%);
    }

    .listGridRow.selected:hover > div {
        background-color: hsl(200.61deg 63.87% 69.61% / 30%);
    }

.listGridCell {
    padding: 7px 10px;
    border-bottom: 1px solid #e4e4e7;
    height: 100%;
    display: flex;
    align-items: center;
}

sl-input[data-user-invalid]::part(base) {
    background-color: var(--sl-input-background-color-focus);
    border-color: hsl(0deg 88.7% 48.4%);
    box-shadow: 0 0 0 var(--sl-focus-ring-width) hsl(0deg 88.7% 48.4% / 40%);
}

sl-divider {
    border: revert-layer;
}