.inline-card-container {
    --inline-card-size: var(--input-height-regular);
    --inline-card-radius-ratio: var(--button-radius-ratio);

    display: inline-flex;
    align-items: center;
    flex-grow: 0;
    flex-shrink: 1;
    min-width: var(--inline-card-size);
    line-height: 0;

    position: relative;
    font-weight: normal;
    color: var(--palette-background-text);
    border: 1px solid var(--palette-background-dim-1);
    background-color: var(--palette-background-paper);
    border-radius: calc(0.5 * var(--inline-card-radius-ratio) * var(--inline-card-size));
    margin-bottom: calc(0.4 * var(--spacing));
}
    .inline-card-container > span:last-of-type {
        margin-right: calc(0.25 * var(--inline-card-size));
    }

    .inline-card-container.inline-card-standalone {
        margin: 0px 8px;
        background-color: var(--palette-background-dim-1);
    }

    .inline-card-container.with-context-menu {
        cursor: pointer;
        border: 1px solid var(--palette-primary-main);
        background-color: var(--palette-background-input);
    }
        .inline-card-container.with-context-menu:hover {
            color: var(--palette-primary-dim);
            border-color: var(--palette-primary-dim);
        }


.inline-card-context-menu {
    position: absolute;
    border-radius: var(--border-radius);
}
    .inline-card-context-menu a {
        display: flex;
    }
        .inline-card-context-menu a.ui-state-active {
            background: transparent;
        }

.inline-card-nick {
    line-height: 110%;
    max-width: 200px;
    margin-left: 4px;
    margin-right: 4px;
    flex-grow: 0;
    flex-shrink: 1;
    text-align: left;
}
    .inline-card-nick:empty {
        display: none;
    }