@import "../../variables";

$bookchart_legend_marker_width: 25px;
$bookchart_legend_marker_height: 2px;
$bookchart_legend_select_width: 180px;

.Bookchart {
    display: flex;
    flex-direction: column;
    margin: $offset_main * 2 0;
}

.Bookchart-period {
    float: left;
    line-height: $control_height_normal;
    list-style: none;
    margin: 0;
    padding: 0;
}

.Bookchart-period-item {
    float: left;
    margin: 0;
    &::after {
        content: "|";
        margin: $offset_main / 2;
    }
    &:last-child::after {
        content: "";
    }
}

.Bookchart-currentperiod {
    color: $color_dark_text;
}

.Bookchart-wrapper {
    display: flex;
    flex-direction: column;
    margin-bottom: $offset_main * 3;
}

.Bookchart-container {
    display: flex;
    flex-wrap: wrap;
}

.Bookchart-chart {
    flex-basis: 0;
}

.Bookchart-prevnext {
    flex-basis: 100%;
    margin: $offset_main 0;
}

.Bookchart-legend {
    flex-basis: 0;
    flex-grow: 1;
    padding: $offset_main * 2 0 0 $offset_main;
}

.Bookchart-legenditem {
    clear: both;
    float: left;
    margin-bottom: $offset_main / 2;
    padding: 0 0 0 $bookchart_legend_marker_width + $offset_main;
    position: relative;
}

.Bookchart-legendinfo {
    margin: $offset_main 0;
}

.Bookchart-legendselect {
    padding-right: $offset_main;
    width: $bookchart_legend_select_width;
}

.Bookchart-legend-marker {
    float: left;
    height: $bookchart_legend_marker_height;
    left: 0;
    margin-right: $offset_main;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: $bookchart_legend_marker_width;
}

/* stylelint-disable rule-non-nested-empty-line-before */

.Bookchart-legend-nodata {
    @extend .Bookchart-legend-marker;
    background-color: $koala;
}
.Bookchart-legend-setprice {
    @extend .Bookchart-legend-marker;
    background: url("/production/images/bookpub/set_price.gif") repeat-x;
}

/* stylelint-enable rule-non-nested-empty-line-before */

.Bookchart-chartimage {
    margin: 0;
}

.Bookchart-input-error {
    border-color: $color_danger;
}