.shop-details-main {}

.shop-dtl .el-input__inner,
.shop-dtl .el-input__inner::placeholder,
.shop-dtl .el-select .el-input .el-select__caret {
    color: #7c98ae !important;
}

.complaintsList .total p {
    color: #ed273f
}

.complaintsList .new p {
    color: #63aeff
}

.complaintsList .open p {
    color: #ffa6f5
}

.complaintsList .closed p {
    color: #33d3a8
}

.history-section .el-tabs__nav-wrap:after {
    background: #b9dde9;
    height: 3px;
}

.history-section .el-tabs__active-bar {
    height: 3px;
}

.history-section .el-tabs__item {
    color: #92aec4;
}

.history-section .el-tabs__item.is-active:after {
    content: "";
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #329fe2;
    position: absolute;
    bottom: 2px;
    left: 30px;
}

.history-section .el-tabs__content {
    background: #fff;
}

.history-section .el-tabs__header {
    margin: 0;
}

.history-section .el-tabs__nav-wrap::after {
    background-color: #fff;
}

/*********************************************/

.user-history-row {
    color: #a1a1a1;
    border-left: 2px solid #cbe4eb;
    padding: 0 0 12px 20px;
    margin-top: 12px;
    position: relative;
    left: 5px;
}

.user-history-row::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    background: #fff;
    border: 3px solid #33a0e5;
    border-radius: 50%;
    width: 12px;
    height: 12px;
    left: -6.5px;
    top: 0;
}

.user-history-row .date {
    font-size: 12px;
    padding-right: 4px;
}

.user-history-row .details {
    background: #f5f9f8;
    border-radius: 6px;
    padding: 10px;
}

.user-history-row .details p {
    color: #061838;
    font-size: 13px;
    margin-top: 2px;
}

.user-history-row .details span {
    color: #329fe2;
    font-size: 12px;
}

.user-history-row .details span.in {
    color: #06c855;
}

.user-history-row .details span.out {
    color: #f2136c;
}

.user-history-row .title {
    font-weight: 600;
    color: #061838;
    font-size: 13px;
}

/***********************************************/

.selectDropdowns .custom-select input {
    border-bottom: none;
    height: 30px;
}

.selectDropdowns .custom-select input .el-input__icon {
    line-height: 30px;
}

.selectDropdowns .selectDropdowns.today .custom-select .el-input__suffix-inner {
    width: 26px;
    height: 26px;
    border-radius: 100%;
    background: rgba(255, 255, 255, 0.3);
    display: block;
    line-height: 37px;
    color: #fff;
}

/**********************************/


.el-select.dash-week .el-input {
    width: 100px;
}

.el-select.dash-all .el-input {
    width: 60px;
}

.performerBlock .el-carousel__container {
    height: 280px;
}

.topShops .el-table {
    border-radius: 4px;
}

.topShops .el-table th > .cell {
    text-transform: none;
}

.topShops .el-tabs__header {
    margin-bottom: 2px;
}

.topShops .el-tabs__active-bar {
    background: #ed2940;
}

.topShops .el-tabs__nav-wrap::after {
    background: #fff;
}

.topShops .el-tabs__item.is-active {
    color: #ed2940;
    font-weight: bold;
}


/*******************************/

.mrgtp {
    margin-top: 20px;
}


.el-icon-location-outline {
    font-size: 17px;
}

.data-bg.sec1 {
    padding: 25px 20px !important;
}

.data-bg.sec2 {
    min-height: 200px !important;
    padding: 0 !important;
}

.hd-row {
    width: 100%;
    display: block;
    margin: 5px 0 10px;
}

.block_title {
    font-size: 18px;
    color: #7b7b7b;
    font-weight: 500;
    line-height: 1.1;
    width: auto;
    line-height: 30px;
    display: inline-block;
}

.shopOverviewBlock {
    width: 100%;
    background: #fff;
    border-radius: 0;
    padding: 0 15px;
    overflow: hidden;
}

.shopOverviewBlock h4 {
    font-size: 20px;
    margin-top: 25px;
}

.shopOverviewBlock p {
    line-height: 120%;
    color: #7b7b7b;
}

.shopOverviewBlock .block_title {
    color: #fff !important;
}


.shop-picture-wrapper {
    width: 100%;
    background: #061838;
    min-height: 300px;
    position: relative;
}

.shop-picture-wrapper img {
    width: 100%;
    height: 100%;
    z-index: 10;
    position: absolute;
}


.button-wapper {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 10;
    top: 0;
}

.button-wapper button {
    width: 120px;
    background: #fff;
    color: #ed273f;
    display: block;
    margin: 240px auto 0 auto;
    border-radius: 30px;
    border: none;
    padding: 10px;
}



.monthleyAverageBlock {
    display: inline-block;
    width: 100%;
    background: #eef3ff;
    padding: 20px;
    border-radius: 4px;
    min-height: 110px;
    margin-top: 15px;
}

.monthleyAverageBlock h4 {
    font-size: 18px;
    margin: 0 0 15px 0;
    font-weight: 500;
}

.monthleyAverageList {
    list-style: none;
    width: 100%;
    margin: 0;
    padding: 0;

}

.content-blocks {
    width: 100%;
    display: block;
}

.content-blocks h3 {
    font-size: 14px !important;
    color: #061838;
    margin: 10px 0 5px;
    font-weight: 500;
}

.content-blocks .round-icon {
    display: inline-block;
    margin: 10px 0 0px 0;
    width: 48px;
    height: 48px;
    line-height: 48px;
    border-radius: 100%;
    float: left;
    text-align: left;
    color: #061838;
    font-size: 48px;
}

.content-blocks .text_blocks {
    display: inline-block;
    width: 100%;
}

.content-blocks .text_blocks h4 {
    margin: 15px 0 5px 0;
    color: #ed2940;
}

.content-blocks .text_blocks p {
    color: #7b7b7b;
    font-size: 12px;
    margin: 0 0 5px 0;
}

.text_blocks h4 {
    margin: 15px 0 5px 0;
    color: #ed2940;
}

.text_blocks p {
    color: #7b7b7b;
    font-size: 12px;
    margin: 0 0 5px 0;
}

.green {
    color: #33d3a8 !important;
}

.t-color-black {
    color: #000 !important;
}

.t-color-red {
    color: #ed273f !important;
}

.t-color-white {
    color: #ffffff !important;
}

.mobile-text-left {
    text-align: right !important;
}

.text-bold {
    font-weight: 500 !important;
}

.no-mar-pad {
    margin: 0 !important;
    padding: 0 !important;
}

.target_collection_block {
    padding: 25px 10px;
    display: inline-block;
    width: 100%;
}

.selectDropdowns {
    min-width: 100px;
    float: right;
    display: inline-block;
    margin-left: 10px;

    .custom-select {
        width: 100px;
    }
}

.pad-left-0 {
    padding-left: 0 !important;
}

.gradient-bg {
    background-image: linear-gradient(to bottom,
            #eaeffc,
            #ffffff,
            #ffffff,
            #ffffff,
            #ffffff);
}

.order-visit-Innerwrapper {
    width: 100%;
    /* background: #fff; */
    border-radius: 4px;
    padding: 0;
    display: inline-block;
    overflow: hidden;
    margin: 20px 0 10px 0;
}

.orderList,
.visitList {
    list-style: none;
    width: 100%;
    margin: 0;
    padding: 0;
}

.orderList h4,
.visitList h4 {
    margin: 5px 0 15px 0;
    color: #061838;
}

.orderList p,
.visitList p {
    margin: 0;
    word-break: break-word;
}

.collection-complaints-list-wrapper {
    background: #134975;
    border-radius: 4px;
    display: inline-block;
    padding: 0;
    overflow: hidden;
    margin: 0;
    height: 285px;
}

.collectionList .complaintsList {
    list-style: none;
    width: 100%;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
}

.complaintsList {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.complaintsList li {
    flex: 0 0 50%;
    padding: 0 15px;
    margin-top: 30px;
}

.collectionList h4,
.complaintsList h4 {
    margin: 5px 0 15px 0;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
}

.collectionList p,
.complaintsList p {
    margin: 10px 0 0;
}


.bg-light {
    background: rgba(255, 255, 255, 0.1);
}

.pad-top-bot-10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.shop-main .pending {
    color: #f99f00;
}

.shop-main .rejected {
    color: #f30c98;
}

.shop-main .dispatched {
    color: #0c9ef3;
}

.shop-main .delivered {
    color: #02d2e7;
}

.shopMoreDetailsWrapper {
    width: 100%;
    border-radius: 0 0 4px 4px;
    display: inline-block;
    padding: 0 0px 15px 0;
    overflow: hidden;
}

.shop-details-list {
    list-style: none;
    width: 100%;
    margin: 0;
    padding: 0;
    color: #7b7b7b;
}

.shop-details-list li {
    width: 100%;
    margin-bottom: 15px;
}

.shop-details-list .label {
    display: inline-block;
    font-size: 14px;
    color: #7b7b7b;
    width: 170px;
    margin-right: 10px;
    text-align: left;
    font-weight: normal;
    margin: 0;
    padding: 0;
}

.shop-details-list .value {
    display: inline-block;
    width: calc(100% - 170px);
    float: right;
    text-align: left;
    color: #061838;
}

.shop-details-list .value:before {
    content: ":";
    margin-right: 10px;
}

.shop-details-list i {
    display: inline-block;
    font-size: 14px;
    color: #7b7b7b;
    width: 20px;
    margin-right: 10px;
}

.shop-details-list span {
    display: inline-block;
    font-size: 14px;
    color: #7b7b7b;
    width: calc(100% - 30px);
    float: right;
}

/*********************************/

.addressBlock {
    margin-bottom: 20px;
}

.addressBlock .label {
    width: 100%;
    font-size: 14px;
    font-weight: normal;
    display: inline-block;
    margin: 0;
    padding: 0;
}

.addressBlock .label i {
    display: inline-block;
    font-size: 14px;
    color: #ed273f !important;
    width: 20px;
    text-align: left;
}

.addressBlock .label span {
    display: inline-block;
    font-size: 14px;
    color: #ed273f !important;
    text-align: left;
    width: calc(100% - 20px);
    float: right;
}

.addressBlock .value {
    width: 100%;
    display: inline-block;
    padding-left: 20px;
    margin-top: 5px;
}

/*****************************/

.bg-grey {
    background: #eeeffd;
}

.graph-bg {
    background: #fbfbfb;
    padding-top: 20px;
}

.graphWrapper {
    padding: 15px 0;
}

.graphWrapperBlock {
    padding: 25px 15px 10px 15px;
    width: 100%;
    display: inline-block;
}

.graphWrapperBlock .WrapperOrder {
    width: 100%;
    display: inline-block;
}

.graphWrapperBlock .WrapperCollection {
    width: 100%;
    display: inline-block;
    background: #f7f7f7;
    padding: 20px 0;
}

.history-section {
    background: #d1eafe;
    padding: 20px 15px 30px;
}

.history-section .el-tabs__nav-wrap:after {
    background: #b9dde9;
    height: 3px;
}

.history-section .el-tabs__active-bar {
    height: 3px;
}

.history-section .el-tabs__item {
    color: #92aec4;
}

.history-section .el-tabs__item.is-active:after {
    content: "";
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #329fe2;
    position: absolute;
    bottom: 2px;
    left: 30px;
}

.history-section .user-history-row {
    color: #a1a1a1;
    border-left: 2px solid #cbe4eb;
    padding: 0 0 12px 20px;
    margin-top: 12px;
    position: relative;
    left: 5px;
}

.history-section .user-history-row::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    background: #fff;
    border: 3px solid #33a0e5;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    width: 12px;
    height: 12px;
    left: -6.5px;
    top: 0;
}

.history-section .user-history-row .title {
    font-weight: 600;
    color: #061838;
    font-size: 13px;
}


/*************************************/

.timelineWrapper {
    padding: 15px 0;
}

ul.timeline {
    list-style-type: none;
    position: relative;
}

ul.timeline:before {
    content: " ";
    background: #cbe3eb;
    display: inline-block;
    position: absolute;
    left: 20px;
    width: 2px;
    height: 100%;
    z-index: 400;
}

ul.timeline li {
    margin: 20px 0;
    padding-left: 40px;
}

ul.timeline li:before {
    content: " ";
    background: white;
    display: inline-block;
    position: absolute;
    border-radius: 50%;
    border: 3px solid #32a0e5;
    left: 15px;
    width: 12px;
    height: 12px;
    z-index: 400;
}

ul.timeline li .date {
    font-size: 11px;
}

ul.timeline li p {
    color: #7b7b7b;
    width: calc(100% - 15px);
    margin: 0 0 5px 0;
}

ul.timeline li p span {
    font-size: 14px;
    font-weight: bold;
    color: #061838 !important;
}

/************************************/

.shop-top-right {
    background: #d2ebff;
}

.monthleyAverageBlock {
    background: #fff;
}

.shop-img {
    height: 300px;
    background: #061838;
}

/*************************************************************/

.shop-visit-location-map .google-map {
    width: 100%;
    height: 360px;
    margin: 0 auto;
    background: gray;
}

.shop-visit-location-map .punch-btn {
    color: #fff;
    border-radius: 50px;
    padding: 10px 12px;
    font-size: 13px;
}

.shop-visit-location-map .punch-out-btn {
    border: 1px solid #ed273f !important;
    color: #ed273f !important;
}

.shop-visit-location-map .punch-out-btn.active1 {
    background: #ed273f !important;
    color: #fff;
}

.shop-visit-location-map .punch-in-btn {
    border: 1px solid;
    color: ;
}

.shop-visit-location-map .punch-in-btn.active1 {
    background: ;
    color: #fff;
}


.shop-visit-location-map .punch-in-time b {
    color:
}

.shop-visit-location-map .punch-out-time b {
    color: #ed273f !important
}

.map-location-button {
    margin-top: 25px;
}

/*******************************/

.shop-location-icon {
    font-size: 13px;
}

.shop-map .google-map {
    width: 100%;
    height: 360px;
    margin: 0 auto;
    background: gray;
}

.view-shop-details .colum-style:nth-child(3n+1) {
    clear: left;
}

.shop-list-table .el-icon-data-analysis {
    font-size: 13px;
}

.shop-list-table .el-icon-data-analysis {
    font-size: 16px;
}

.shop-details-main .el-input__inner {
    background: transparent;
    border: 0;
    padding: 0;
}

.shop-details-main .dash-year {
    width: 65px;
}

.shop-details-main .dash-month {
    width: 106px;
}

.shop-details-main .orderList li {
    margin-top: 20px;
}

.shop-details-main .addressBlock {
    padding-left: 30px;
}

@media(min-width:992px) {
    .shopOverviewBlock {
        display: flex
    }

    .visit-col {
        border-right: 2px solid #d3e0e9
    }

    .order-col {
        padding-left: 30px;
    }


    .data-bg.sec2 {
        display: flex;
    }
}

@media(min-width:768px) {

    .monthleyAverageList {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
    }

    .orderList,
    .visitList {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
    }

    .shop-details-main .orderList li {
        padding: 0 15px;
    }
}

@media(max-width:991px) {
    .shopOverviewBlock .el-image {
        text-align: center;
        width: 100%;
        height: 300px;
    }

    .shop-top-right {
        padding: 0 0 20px;
    }

    .data-bg.sec1 {
        padding: 15px 0 !important
    }

    .graphWrapperBlock {
        padding: 0 10px 10px 0;
    }

    .shopMoreDetailsWrapper {
        margin: 15px -15px 0;
    }


}

@media(max-width:767px) {
    .shop-details-main .orderList li {
        float: left;
        width: 50%;
    }

    .shop-details-list .label {
        width: 100%;
    }

    .shop-details-list .value {
        float: left;
        width: 100%;
        margin-top: 2px;
        padding-left: 30px;
    }

    .shop-details-list li {
        float: left;
    }

    .shop-details-list .value::before {
        content: none;
        margin-right: 0;
    }


    .history-section {
        padding: 10px 10px 10px;
    }

    .shop-details-main .visitList {
        display: flex;
    }

    .shop-details-main .visitList li {
        flex: 1
    }
}