.BadgeDetails {
    display: flex;
    flex-flow: column;
    height: 100%;
    padding: 10px;

    &--loading {
        justify-content: center;
        align-items: center;

        .spinner {
            width: 48px;
            height: 48px;
        }
    }

    .badge-info {
        display: flex;
        align-items: flex-start;
        border: 1px solid rgba(var(--center-channel-color-rgb), 0.16);
        border-radius: 6px;
        padding: 16px;
        margin-bottom: 16px;
        gap: 12px;
        position: relative;

        .badge-icon {
            flex-shrink: 0;
        }

        .badge-text {
            flex: 1;
            min-width: 0;
            padding-right: 100px;
        }

        .badge-label {
            font-weight: 400;
            color: rgba(var(--center-channel-color-rgb), 0.64);
            font-size: 12px;
        }

        .badge-name {
            font-size: 16px;
            font-weight: 600;
            padding-right: 7px;
            color: var(--center-channel-text);
        }

        .badge-description {
            font-size: 14px;
            color: rgba(var(--center-channel-color-rgb), 0.72);
            margin-top: 4px;
            word-break: break-word;

            p {
                margin: 0;
            }
        }

        .badge-meta {
            font-size: 12px;
            color: rgba(var(--center-channel-color-rgb), 0.64);
            margin-top: 8px;
        }
    }

     &__backHeader {
      padding: 4px;
    }

    &__editButton {
        position: absolute;
        top: 12px;
        right: 12px;
        background: none;
        border: 1px solid rgba(var(--center-channel-color-rgb, 61, 60, 64), 0.16);
        border-radius: 4px;
        padding: 4px 12px;
        font-size: 12px;
        font-weight: 600;
        color: var(--button-bg, #166de0);
        cursor: pointer;

        &:hover {
            background: rgba(var(--button-bg-rgb, 22, 109, 224), 0.08);
        }
    }

    .section-title {
        font-size: 14px;
        font-weight: 600;
        color: var(--center-channel-text);
        margin-bottom: 8px;
    }

    .empty-owners {
        font-size: 13px;
        color: rgba(var(--center-channel-color-rgb), 0.64);
        padding: 16px 0;
        text-align: center;
    }
}
