
//
// Dependencies
// --------------------------------------------------

@import "global.less";
@import "icon.less";
@import "chart.less";
@import "toolbar.less";

//
// Scoreboard
// --------------------------------------------------

div.scoreboard {
    position: relative;
    padding: 0;

    .horizontal-scroll-indicators(@color-scroll-indicator);
    &:before, &:after { margin-top: -10px; }
    &:before { left: 7px; }
    &:after { right: 10px; }

    div.scoreboard-item {
        display: inline-block;
        margin-right: 40px;
        margin-bottom: 20px;
        vertical-align: top;

        &:last-child {
            margin-right: 0;
        }
    }

    .control-chart {
        // Setup the chart height in the scoreboard
        // and set offsets so that the elements do not
        // "jump" when the chart script loads and
        // adds the canvas and color indicator elements.
        height: 67px;

        ul {
            margin-left: 77px;
            top: -2px;

            li {
                padding-left: 18px;
                & > i { margin-left: -18px; }
            }
        }

        .canvas + ul { margin-left: 0; }
    }

    .scoreboard-offset {
        padding-left: 20px;
    }
}

body.slim-container {
    div.scoreboard {
        padding: 0 20px;
    }
}