.container {
    height: 154px;
    width: 100%;
    background-color: var(--surface-a);
    border-top: 1px solid var(--surface-border);
    box-shadow: var(--surface-b) 0px -3px 10px 1px;
}

.contentContainer {
    height: 136px;
    overflow: auto;
}

.infoContainer {
    font-size: 11px;
    text-align: center;
    height: 18px;
    line-height: 18px;
    background-color: var(--surface-g);
    border-radius: 0 0 2px 2px;
    border-bottom: 1px solid var(--surface-border);
}

.filesContent {
    font-size: 13px;
    margin: 2px 6px;
    display: inline-block;

    & [class~='file'] {
        line-height: 22px;
        margin-left: 20px;
        img {
            height: 18px;
        }
        [class~='pi'] {
            font-size: 18px;
        }
        [class~='iconus'] {
            top: 3px;
            left: -21px;
        }
    }
}

.textContent {
    margin: 2px 6px;
    white-space: pre;
    display: inline-block;
}

.htmlContent {
    margin: 2px 6px;
    user-select: none;
    display: inline-block;
}

.imageContent {
    text-align: center;
    user-select: none;
    padding: 5px;
}

.failed {
    height: 100%;
    width: 100%;
}
