moodle_local_treestudyplan/scss/studyplan-report.scss

.path-local-treestudyplan {
    font: inherit;
    --border-color: var(--primary);
    --conditions-bgcolor: #e7e7e7;
    --courseresult-bgcolor: white;
    --studentinfo-bgcolor: white;

    table.q-studyplanreport {
        table-layout: fixed;
        width: calc(12rem + (var(--resultColCount) * 4rem));
    }

    .q-header, .q-student-results {
        background-color: var(--courseresult-bgcolor);

        .q-period-heading, .q-line-heading, .q-item-heading, .q-condition-heading
         {
            border-right: 1px solid var(--border-color);
            border-top: 1px solid var(--border-color);
            padding: 0.5rem;
        }

        .q-period-heading, .q-line-heading, .q-item-heading, 
        .q-condition-heading.overall, .q-result.overall {
            background-color: var(--courseresult-bgcolor);
        }

        .q-period-heading.collapsed {
            width:12rem;
        }

        .q-result {
            height: 2rem;
            padding-top: 0.25rem;
        }
  
        .q-line-heading,
        .q-item-heading,
        .q-condition-heading {
            width: 2rem;
            writing-mode: vertical-rl;
            text-orientation: sideways;
            .q-chevron {
                text-orientation: initial;
                writing-mode: horizontal-tb;
            }
        }

        .q-period-heading,
        .q-line-heading,
        .q-item-heading,
        .q-condition-heading {
            vertical-align: top;
        }

        .q-line-heading > span.q-wrap{
            display:inline-block;
            height: 7rem;
        }
        .q-item-heading > span.q-wrap{
            display:inline-block;
            height: 7rem;
            white-space: nowrap;
        }
        .q-condition-heading {
            > span.q-wrap {
                display:inline-block;
                height: 8rem;
            }
            text-align: left;
            background: var(--conditions-bgcolor);
        }

    }

    .q-result {
        text-align: center;
        vertical-align: middle;
        border-right: 1px solid var(--border-color);
        width: 4rem;
        padding-left: 0.25rem;
        padding-right: 0.25rem;
        background-color: var(--conditions-bgcolor);
        &.overall, &.collapsed {
            background-color: var(--courseresult-bgcolor);
        }
    }

    .q-studentname {
        padding: 0.5em;
        border-right: 2px solid var(--border-color);
        width: 12rem;
        background-color: var(--studentinfo-bgcolor);
    }

    .q-courseresult,
    .q-conditionresult{
        i.fa {
            font-size: 21px;
            vertical-align: middle;
        }
    }

    .q-conditionresult{

        font-size: 1.2rem;
        display: inline-block;
        width: 100%;
    }

}