reports.css

.report-checkbox-container {
    margin-bottom: 0.5rem;
    display: table;
}

#columnNames {
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
    margin: 0.5rem 0 1rem 0;

    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}

.columnName {
    padding: 0.5rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.25);
    background-color: var(--color-white);
    cursor: pointer;
}

.columnName-checkbox-label {
    font-weight: 600;
}

.columnName-label {
    color: #212121;
    font-weight: 600;
}

.columnName-disabled {
    background-color: #EEEEEE;
}

.columnName-disabled .columnName-label {
    color: #878787;
}

.columnName-selected {
    background-color: var(--color-blue-light);
}


/* dark theme */
[data-theme="dark"] #columnNames {
    border-top: 1px solid #333333;
    border-right: 1px solid #333333;
    border-left: 1px solid #333333;
}

[data-theme="dark"] .columnName {
    background-color: var(--color-grey);
}

[data-theme="dark"] .columnName-disabled {
    background-color: #999999;
}

[data-theme="dark"] .columnName-disabled .columnName-label {
    color: #666666;
}

[data-theme="dark"] .report-checkbox-container input[type="checkbox"]:not(.filled-in) + span:not(.lever)::after {
    border: 2px solid rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .report-checkbox-container input[type="checkbox"]:checked + span:not(.lever)::before {
    border-top: 3px solid transparent;
    border-left: 3px solid transparent;
    border-right: 3px solid #45A0EF;
    border-bottom: 3px solid #45A0EF;
}