.ui-media-picture>img {
    max-width: 100px;
    max-height: 100px;
}

.ui-media-file {
    display: inline-flex;
    align-items: center;

    &::before {
        display: none;
    }

    >svg {
        width: 20px;
        height: 20px;
        fill: var(--secondary-link-color);
    }

    >a {
        margin-left: 6px;
        color: var(--link-color);
        font-size: var(--font-size);
    }
}

.ui-media-audio {
    display: inline-flex;
    align-items: center;
    background-color: #eee;
    border-radius: 20px;
    overflow: hidden;
    padding-right: 16px;

    >button {
        background-color: transparent;
        border: none;
        width: 40px;
        height: 40px;
        padding: 14px;
        display: flex;
        outline: none;

        &:hover {
            border: none;
        }

        &::after {
            display: none;
        }

        >svg {
            width: 100%;
            height: 100%;
        }
    }

    >.ui-media-timestamp {
        color: var(--secondary-color);
        font-size: var(--font-size);
        user-select: none;
    }
}

.ui-media-video {
    max-width: 200px;
    max-height: 200px;
}