Vmeda.Online/src/theme/components/rubrics.scss

core-format-text {

    .gradingform_rubric_editform .status {
        font-weight: normal;
        text-transform: uppercase;
        font-size: 60%;
        padding: 0.25em;
        border: 1px solid var(--gray-200);
    }

    .gradingform_rubric_editform .status.ready {
        background-color: var(--green-light);
        border-color: var(--green);
    }

    .gradingform_rubric_editform .status.draft {
        background-color: var(--yellow-light);
        border-color: var(--yellow);
    }

    .gradingform_rubric {
        overflow: auto;
        padding-bottom: 1.5em;
        max-width: 720px;
        position: relative;
        margin: 0 auto;
        tbody {
            background-color: var(--white);
            color: var(--text-color);
        }
    }

    // Do not display remark column.
    .gradingform_rubric .criterion .remark {
        display: none;
    }

    .gradingform_rubric.editor .criterion .controls,
    .gradingform_rubric .criterion .description,
    .gradingform_rubric .criterion .levels,
    .gradingform_rubric.editor .criterion .addlevel,
    .gradingform_rubric .criterion .remark,
    .gradingform_rubric .criterion .levels .level {
        vertical-align: top;
    }

    .gradingform_rubric.editor .criterion .controls,
    .gradingform_rubric .criterion .description,
    .gradingform_rubric.editor .criterion .addlevel,
    .gradingform_rubric .criterion .remark,
    .gradingform_rubric .criterion .levels .level {
        padding: 3px;
    }

    .gradingform_rubric .criteria {
        height: 100%;
    }

    .gradingform_rubric .criterion {
        border: 1px solid var(--stroke);
        overflow: hidden;
    }

    .gradingform_rubric .criterion.even {
        background-color: var(--light);
    }

    .gradingform_rubric .criterion .description {
        width: 150px;
        font-weight: bold;
    }

    .gradingform_rubric .criterion .levels table {
        width: 100%;
        height: 100%;
    }

    .gradingform_rubric .criterion .levels,
    .gradingform_rubric .criterion .levels table,
    .gradingform_rubric .criterion .levels table tbody {
        padding: 0;
        margin: 0;
    }

    .gradingform_rubric .criterion .levels .level {
        border-left: 1px solid var(--stroke);
        max-width: 150px;
    }

    .gradingform_rubric .criterion .levels .level .level-wrapper {
        position: relative;
    }

    .gradingform_rubric .criterion .levels .level.last {
        border-right: 1px solid var(--stroke);
    }

    .gradingform_rubric .plainvalue.empty {
        font-style: italic;
        color: var(--gray-500);
    }

    .gradingform_rubric.editor .criterion .levels .level .delete {
        position: absolute;
        right: 0;
    }

    .gradingform_rubric .criterion .levels .level .score {
        font-style: italic;
        color: var(--green);
        font-weight: bold;
        margin-top: 5px;
        white-space: nowrap;
    }

    .gradingform_rubric .criterion .levels .level .score .scorevalue {
        padding-right: 5px;
    }

    /* Make invisible the buttons 'Move up' for the first criterion and
       'Move down' for the last, because those buttons will make no change */
    .gradingform_rubric.editor .criterion.first .controls .moveup input,
    .gradingform_rubric.editor .criterion.last .controls .movedown input {
        display: none;
    }

    /* evaluation */
    .gradingform_rubric .criterion .levels .level.currentchecked {
        background-color: #fff0f0;
    }

    .gradingform_rubric .criterion .levels .level.checked {
        background-color: var(--green-light);
        border: 1px solid var(--medium);
    }

    .gradingform_rubric .options .optionsheading {
        font-weight: bold;
        font-size: 1.1em;
        padding-bottom: 5px;
    }

    .gradingform_rubric .options .option {
        padding-bottom: 2px;
    }

    .gradingform_rubric .options .option label {
        margin-left: 5px;
    }

    .gradingform_rubric .options .option .value {
        margin-left: 5px;
        font-weight: bold;
    }

    .gradingform_rubric .criterion .levels.error {
        border: 1px solid var(--red);
    }

    .gradingform_rubric .criterion .description.error,
    .gradingform_rubric .criterion .levels .level .definition.error,
    .gradingform_rubric .criterion .levels .level .score.error {
        background-color: var(--light);
    }

    .gradingform_rubric-regrade {
        padding: 10px;
        background-color: var(--light);
        border: 1px solid var(--red-light);
        margin-bottom: 10px;
    }

    .gradingform_rubric-restored {
        padding: 10px;
        background-color: var(--yellow-light);
        border: 1px solid var(--yellow);
        margin-bottom: 10px;
    }

    .gradingform_rubric-error {
        color: var(--red);
        font-weight: bold;
    }

    /* special classes for elements created by rubriceditor.js */
    .gradingform_rubric.editor .hiddenelement {
        display: none;
    }

    .gradingform_rubric.editor .pseudotablink {
        background-color: transparent;
        border: 0 solid;
        height: 1px;
        width: 1px;
        color: transparent;
        padding: 0;
        margin: 0;
        position: relative;
        float: right;
    }

    .gradingform_rubric {
        padding-bottom: 0;
        max-width: none;
    }

    .gradingform_rubric .criterion .description {
        font-weight: 500;
        min-width: 150px;
    }

    .gradingform_rubric .criterion .levels {
        background-color: var(--white);
    }

    .gradingform_rubric .criterion,
    .gradingform_rubric .criterion.even {
        background-color: transparent;
    }

    .gradingform_rubric.evaluate .criterion .levels .level:hover {
        background-color: var(--green-light);
    }

    .gradingform_rubric .criterion .levels .level.checked {
        background-color: var(--green-light);
        border: none;
        border-left: 1px solid var(--stroke);
    }

    .gradingform_rubric .criterion .levels .level .score {
        color: var(--green);
        font-weight: 500;
        font-style: normal;
        margin-top: 20px;
    }

    .gradingform_rubric .criterion .remark textarea {
        margin-bottom: 0;
    }
}