.dbqdb-input-property-icon-display {
    display: inline-flex;
    align-items: center;
    gap: $margin-default;
    cursor: default;
    max-width: 100%;

    &__icon-circle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: $color-primary;

        svg {
            width: 24px;
            height: 24px;
            fill: $color-white;
        }

        &--preserve-colors {
            svg {
                fill: unset;
            }
        }
    }

    &__icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 0;
    }

    &__content {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 36px;
        min-width: 0;
    }

    &__label {
        line-height: 1.5;
        font-size: $font-size-small;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    &--with-top-label &__value {
        line-height: 1;
    }

    &__value {
        color: $text-color-default;
        font-size: inherit;
        line-height: inherit;
        word-break: break-word;
    }
}