.b-locked-rows {
    --b-grid-cell-background : var(--b-neutral-97);
}

.b-sch-event-wrap .b-sch-event {
    display                     : grid;
    grid-template-columns       : 1fr;
    align-items                 : stretch;

    --b-sch-event-border-radius : 1em;
    --b-sch-event-padding-inline       : 1.5em;
    --b-sch-event-gap           : 0;

    /* Stack progress & content, without need for absolute positioning */
    .progress,
    .remaining,
    .b-sch-event-content {
        grid-area : 1 / 1;
    }

    .remaining {
        background-color : #ffffff60;
        justify-self     : end;

        .b-animating & {
            transition : width .2s ease-in-out;
        }
    }

    .progress {
        display         : flex;
        align-items     : center;
        justify-content : flex-end;
        min-width       : 24em;

        .b-animating & {
            transition : width .2s ease-in-out;
        }
    }

    .percent {
        font-size         : 2.5em;
        margin-inline-end : .5em;

        &:not(.hasValue) {
            display : none;
        }
    }

    .b-sch-event-content {
        flex-direction  : column;
        justify-content : center;
        align-items     : flex-start;
    }

    .name {
        font-size : 1.2em;
    }

    .desc {
        max-width   : 20em;
        white-space : normal;
        font-size   : 0.8em;
    }

    &.backlog-event {
        .percent,
        .desc {
            display : none;
        }
    }
}
