/* Inline Styles */

button.solidbtn.mp-report.btnPriceTrendReport{
    background-color: transparent;
    border-color: #2A82BC;
    color: #2A82BC;
    font-size: 14px;
    padding-left: 10px;
    padding-right: 10px;
}
.content-wrapper{
    margin-top: 0px !important;
}
.wrapper.mobwrap{
    padding-top: 1.5em !important;
}
#findSkus h4{
    text-decoration: underline;
}
#findSkus p{
    font-style: italic;
}

/* Price Trend Modal CSS */

#histogramSlider, #histogramSlider2, #comp {
    max-width: 723px;
    margin: auto;
}
.content-wrapper{
    margin-top: 0px !important;
 }
 .wrapper.mobwrap{
    padding-top: 1.5em !important;
 }
 #findSkus h4{
    text-decoration: underline;
 }
 #findSkus p{
    font-style: italic;
 }

/* Monthly Price Report */

button.mp-report{
 font-size: 12px;
}

/* highcharts css */

#priceTrendReportChart{
    display: flex;
    justify-content: center;
}

 #priceTrendReport div.modal-dialog{
    min-width: fit-content !important;
    height: 100vh;
    position: relative;
 }

 #priceTrendReport .modal-body{
    width: fit-content;
    display: block;
    margin: 0 auto;
 }

 #priceTrendReport .modal-body h4 {
    padding-bottom: 15px;
    padding-top: 40px;
    text-decoration: none;
 }

 .modal-body .text-left {
    padding-left: 10px;
}

 #priceTrendReport .modal-content {
    background-color: #ffffff;
    padding-bottom: 20px;
    top: 25px;
    width: 85%;
    margin: 0 auto;
 }

 #priceTrendReport .modal-content .close{
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 30px;
    font-weight: 300;
 }

 #priceTrendReport img.brand-logo {
    position: absolute;
    right: 108px;
    width: 15%;
    top: 25%;
 }

 /* Time Selections */

 .report-time{
    display: flex;
    flex: auto;
    flex-direction: row;
    align-items: center;
    margin-bottom: 40px;
    margin-top: 30px;
 }

 .report-time svg{
    margin: 0 10px;
 }

.report-quart span {
    display: inline-block;
    padding: 0px 20px;
    border-right: 1px solid #C7C7C7;
    box-sizing: border-box;
    font-size: 16px;
    font-weight: 300;
    cursor: pointer;
}

.report-quart span.no-border {
    border-right: none;
}

.report-quart span.active{
    font-weight: 500;
}
.col-md-5.left-10 {
    margin-left: 5px;
}
.user-rating .review {
    position: absolute;
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 5px;
    width: 20%;
    z-index: 9999 !important;
    display: block;
    padding: 25px 27px 35px !important;
    left: 32%;
    top: auto;
    margin-top: 10px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.user-rating .review::before{
    content: url("{{ asset('assets/shared/img/arrow-up.svg') }}");
    width: 19px;
    height: 9px;
    position: absolute;
    top: -9.5px;
    right: 50%;
}

.user-rating .review .row{
    padding-left: 10px !important;
    /* padding-right: 30px; */
}

.user-rating .col-md-6.left-10 {
    padding-left: 5px !important;
}

.user-rating .review .row div{
    padding-right: 0px !important;
}

.star-rates{
    padding:0px;
}

.hide-star{
    display:none !important;
}

/* .star-rates .meter {
    box-sizing: content-box;
    width: 63%;
    height: 20px;
    margin: 0px 10px;
    position: relative;
    background: #F0F2F2;
    border: 1px solid #E4E6E6;
    border-radius: 25px;
    padding: 0px;
    box-shadow: inset 0 -1px 1px rgb(255 255 255 / 30%);
} */

/* .review:before{
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    border-bottom: 11px solid #FFFFFF;
    left: 48%;
    top: -11px;
} */

.review p.usr-num {
    margin-top: 5px;
    font-size: 15px;
}
.star-rates {
    margin-top: 20px;
}
.star-rates .rate{
    display: flex;
    flex: auto;
    flex-direction: row;
    margin: 10px 0px;
    align-items: center;
    justify-content: center;
}

.meter {
    box-sizing: content-box;
    width: 70%;
    height: 20px;
    margin: 0px 10px;
    position: relative;
    background: #F0F2F2;
    border: 1px solid #E4E6E6;
    border-radius: 3px;
    padding: 0px;
}

.meter > span {
    display: block;
    height: 100%;
    border-radius: 3px;
    position: relative;
    overflow: hidden;
}
.meter > span:after,
.animate > span > span {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
    background-size: 50px 50px;
    overflow: hidden;
}

.animate > span:after {
    display: none;
}

@keyframes move {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 50px 50px;
    }
}

.orange > span {
    background-image: linear-gradient(#FFAD25, #FFAD25);
}

.nostripes > span > span,
.nostripes > span::after {
    background-image: none;
}

.rate span{
    color: #2A82BC;
    font-size: 15px;
}

span.usr-odd {
    font-size: 19px;
    font-weight: 600;
}

.star-svg-sm img {
    width: 20px;
}

/* End Inline Styles */