@use 'common-mixins';

.content-container {
    overflow: auto;
    @include common-mixins.scroll-bar;

    display: flex;
    flex-direction: column;
    align-items: center;

    .grid-container {
        width: calc(100% - 40px);
        display: grid;
        grid-template-columns: 1fr 2fr 2fr;
        margin: 20px;

        .row {
            display: contents;

            > div {
                padding: 8px 20px;

                &:first-of-type {
                    font-weight: 600;
                }

                &:nth-child(2) {
                    grid-column: span 2;
                }
            }

            &:hover {
                > div {
                    background-color: var(--iqser-alt-background);
                }
            }
        }

        .section-title {
            grid-column: span 3;
            padding: 20px 20px 8px;
            margin-bottom: 8px;
            border-bottom: 1px solid var(--iqser-separator);
        }

        redaction-chart {
            grid-column: span 3;
        }
    }
}
