@import url('../../../shared/theme.less');

session-list-item {
    color: @primary-text-color-white;
    padding: 10px;
    display: block;
    position: relative;
    border-bottom: 1px solid;
    border-color: @primary-bg-color-white;
    cursor: pointer;
}

session-list-item.selected {
    background-color: lighten(@primary-interaction-highlight-white, 30%);
}

.session-list-item-session-id::before {
    content: "Session: ";
}

.session-list-item-timestamp::before {
    content: "Created: ";
}

.session-list-item-timestamp {
    font-size: 12px;
    opacity: 0.9;
}

.session-list-item-session-id {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.session-list-item-number-of-changes {
    font-size: 12px;
    opacity: 0.6;
}

.session-list-item-number-of-changes::before {
    content: "Number of changes: ";
    position: relative;
    z-index: 0;
}

@media (prefers-color-scheme: dark) {
    session-list-item {
        border-color: @primary-bg-color-dark;
        color: @primary-text-color-dark;
    }

    session-list-item.selected {
        background-color: @primary-interaction-highlight-dark;
    }
}