:root {
    --main-bg-color: #f1f5f9;
    --primary-text-color: #808080;
    --menu-active-text-color: #537ebf;
}

* {
    box-sizing: border-box;
}
/* open-sans-regular - latin */
/* open-sans-regular - latin */

body{
    background-color:#f1f5f9!important;
}
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url('../../assets/fonts/open-sans-v16-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Open Sans Regular'), local('OpenSans-Regular'), url('../../assets/fonts/open-sans-v16-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../../assets/fonts/open-sans-v16-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('../../assets/fonts/open-sans-v16-latin-regular.woff') format('woff'), /* Modern Browsers */
    url('../../assets/fonts/open-sans-v16-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../../assets/fonts/open-sans-v16-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: url('../../assets/fonts/open-sans-v16-latin-600.eot'); /* IE9 Compat Modes */
    src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'), url('../../assets/fonts/open-sans-v16-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../../assets/fonts/open-sans-v16-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
    url('../../assets/fonts/open-sans-v16-latin-600.woff') format('woff'), /* Modern Browsers */
    url('../../assets/fonts/open-sans-v16-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../../assets/fonts/open-sans-v16-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800 - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 800;
    src: url('../../assets/fonts/open-sans-v16-latin-800.eot'); /* IE9 Compat Modes */
    src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url('../../assets/fonts/open-sans-v16-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../../assets/fonts/open-sans-v16-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
    url('../../assets/fonts/open-sans-v16-latin-800.woff') format('woff'), /* Modern Browsers */
    url('../../assets/fonts/open-sans-v16-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../../assets/fonts/open-sans-v16-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* poppins-regular - latin */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    src: url('../../assets/fonts/poppins-v6-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Poppins Regular'), local('Poppins-Regular'), url('../../assets/fonts/poppins-v6-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../../assets/fonts/poppins-v6-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('../../assets/fonts/poppins-v6-latin-regular.woff') format('woff'), /* Modern Browsers */
    url('../../assets/fonts/poppins-v6-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../../assets/fonts/poppins-v6-latin-regular.svg#Poppins') format('svg'); /* Legacy iOS */
}
/* poppins-500 - latin */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    src: url('../../assets/fonts/poppins-v6-latin-500.eot'); /* IE9 Compat Modes */
    src: local('Poppins Medium'), local('Poppins-Medium'), url('../../assets/fonts/poppins-v6-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../../assets/fonts/poppins-v6-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
    url('../../assets/fonts/poppins-v6-latin-500.woff') format('woff'), /* Modern Browsers */
    url('../../assets/fonts/poppins-v6-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../../assets/fonts/poppins-v6-latin-500.svg#Poppins') format('svg'); /* Legacy iOS */
}

body {
    font-family: 'Open Sans', sans-serif;
    line-height: 1.5;
    font-style: normal;
    font-size: 12px;
    margin: 0px;
    padding: 0px;
}
a {
    font-family: 'Open Sans', sans-serif;
    line-height: 1.5;
    font-style: normal;
    font-size: 14px;
    text-decoration:none;
    color:var(--primary-text-color);
}
.font8 {
    font-size: 8px;
}
.font10 {
    font-size: 10px;
}
.font17{
    font-size:17px;
}
.font13{
    font-size: 13px;
}
.font14{
    font-size: 14px;
}
.font12{
    font-size:12px;
}
.font16{
    font-size: 16px;
}
.font19{
    font-size:19px;
}
.font21 {
    font-size: 21px;
}
.font22 {
    font-size: 22px;
}
.font26 {
    font-size: 26px;
}
.font39 {
    font-size: 39px;
}
.font25{
    font-size:25px;
}
.height-38{
    height:38px;
}
.bg-halfwhite {
    background-color: #fffbf7;
}
.bg-orange {
    background-color: #ed8a19;
}

.opensans-regular {
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 400;
 

}

.opensans-bold {
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 600;
 
}

.poppins {
    font-family: 'Poppins';
}
.top {
    box-shadow: 0 -3px 3px -5px #333;
}

.right {
    box-shadow: 5px 0 5px -5px #333;
}

.bottom {
    box-shadow: 0px 3px 3px -3px #C1E3FF,0 -3px 3px -3px #C1E3FF;
}

.left {
    box-shadow: -5px 0 5px -5px #333;
}

.all {
    box-shadow: 0 0 5px #333;
}
.color_active{
    color:var(--menu-active-text-color);
}
p {
    font-family: 'Open Sans', sans-serif;
    line-height: 1.5;
    font-style: normal;
    font-size: 12px;
}
.text-green {
    color: #3bb149;
}

.text-rating {
    color: #f59121;
}
#wrapper {
    background-color: var(--main-bg-color);
    position: relative;
}

/*login-page css*/

.center-logo {
    /*background: url(../img/logo-circle.png) center no-repeat;*/
    position: relative;
    top: 5%;
    left: 50%;
    width: 200px;
    height: 124px;
    /* height: 14%; */
    z-index: 9999;
    transform: translate(-50%, -50%);
}
.wrapper-login-bg {
    position: relative;
    /*background: #ffebcc url("../img/bg.png") center no-repeat;*/
    /*background-position: 100%;*/
    width: 100%;
    height: 100vh;
}

.login-box{
    position:absolute;
    top:8%;
    left:56%;
}
/*@media(min-width:1440px) {
    .wrapper-login-bg {
        background: #ffebcc url("../img/bg@3x.png") center no-repeat;
    }
}
@media(min-width:1300px) {
    .wrapper-login-bg {
        background: #ffebcc url("../img/bg@2x.png") center no-repeat;
    }
  }*/

    @media(max-width:768px) {
        .login-box {
            position: static;
        }
    }

    div.overlay {
        /* overlay that covers entire page when menu is open */
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        opacity: 1;
        background: rgba(36, 35, 35, 0.85);
        z-index: 9;
        /*display: none;*/
        transition: opacity 0.5s; /* transition settings */
    }

   /* .d-block {
        display: block;
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        opacity: 0;
        background: black;
        z-index: 99;
        transition: opacity 0.5s; /* transition settings 
    }*/

    .sidebar {
        z-index: 9999;
    }

    .side-bar {
        position: absolute;
        top: 0;
        left: 0;
        width: 250px;
        height: 100vh;
        box-shadow: 0 3px 10px 1px rgba(0, 0, 0, 0.08);
        background-color: #ffffff;
        z-index: 10;
    }

    .nav {
        display: flex;
        flex-wrap: wrap;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
    }

    .flex-column {
        flex-direction: column !important;
    }

    .ant-designmenu-fold-outline {
        width: 20px;
        height: 20px;
        object-fit: contain;
    }
    ul.menu-list{
        padding-top:24px;
    }
    ul.menu-list li{
        border-bottom: solid 1px #f7f7f7!important;
    }

    li.nav-item {
        padding: 6px 0px 6px 16px;
    }

        li.nav-item a {
            font-family: 'Open Sans', sans-serif;
            font-size: 14px;
            font-weight: 600;
            font-style: normal;
            font-stretch: normal;
            line-height: 1;
            letter-spacing: normal;
            text-transform: uppercase;
            color: var(--primary-text-color);
            text-decoration: none;
        }

            li.nav-item a.active {
                color: var(--menu-active-text-color);
                background-color: #f4faff;
            }

        li.nav-item.active {
            color: var(--menu-active-text-color);
            background-color: #f4faff;
            box-shadow: 0px 3px 3px -3px #C1E3FF,0 -3px 3px -3px #C1E3FF;
        }

        li.nav-item.bottom {
            color: var(--menu-active-text-color);
            background-color: #f4faff;
            box-shadow: 0px 3px 3px -3px #C1E3FF,0 -3px 3px -3px #C1E3FF;
        }

        li.nav-item a:hover {
            color: var(--menu-active-text-color);
        }

        li.nav-item:hover {
            background-color: #f4faff;
            color: var(--menu-active-text-color);
        }

    .badge {
        display: inline;
    }

    .dashboard-icon:hover, .dashboard-icon.active {
        filter: invert(53%) sepia(25%) saturate(1000%) hue-rotate(177deg) brightness(85%) contrast(91%);
    }

    .orders-copy:hover, .orders-copy.active {
        filter: invert(53%) sepia(25%) saturate(1000%) hue-rotate(177deg) brightness(85%) contrast(91%);
    }

    .products-copy:hover, .products-copy.active {
        filter: invert(53%) sepia(25%) saturate(1000%) hue-rotate(177deg) brightness(85%) contrast(91%);
    }

    .notification-copy:hover, .notification-copy.active {
        filter: invert(53%) sepia(25%) saturate(1000%) hue-rotate(177deg) brightness(85%) contrast(91%);
    }

    .escalation-copy:hover, .escalation-copy.active {
        filter: invert(53%) sepia(25%) saturate(1000%) hue-rotate(177deg) brightness(85%) contrast(91%);
    }

    .Rohto-Pharma-India-P {
        width: 216px;
        height: 23px;
        font-family: 'Poppins', sans-serif;
        font-size: 16px;
        font-weight: 500;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #537ebf;
    }

    .section-header h3 {
        font-family: 'Poppins', sans-serif;
        font-size: 22px;
        font-weight: 500;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #333333;
    }

    .upcoming-deals {
        background-color: #fff;
        font-family: 'Open Sans', sans-serif;
        width: 100%;
        border-radius: 3px;
        box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.03);
    }

        .upcoming-deals th {
            color: var(--primary-text-color);
            font-family: 'Open Sans', sans-serif;
            font-size: 12px;
            font-weight: 600;
            font-style: normal;
            font-stretch: normal;
            line-height: 2;
            letter-spacing: normal;
        }

        .upcoming-deals td {
            font-family: 'Open Sans', sans-serif;
            font-size: 14px;
            font-weight: normal;
            font-style: normal;
            font-stretch: normal;
            line-height: 2;
            letter-spacing: normal;
            color: #333333;
        }

    .pdt-details td {
        font-family: 'Open Sans', sans-serif;
        font-size: 14px;
        font-weight: 600;
        font-style: normal;
        font-stretch: normal;
        line-height: 2;
        letter-spacing: normal;
        color: #333333;
    }

        .pdt-details td a {
            text-decoration: none;
        }

    .fa {
        padding-right: 2px;
        color: #333333;
    }

    .stats-img {
        width: 70px;
        height: 70px;
    }

    .store-stat {
        display: flex;
        flex-wrap: wrap;
        background-color: #fff;
        border-radius: 3px;
        box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.03);
    }

        .store-stat.suspended {
            display: flex;
            flex-wrap: wrap;
            border-radius: 3px;
            box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
            background-color: #e82629;
        }

            .store-stat.suspended span.stats-count, .store-stat.suspended span.stats-description, .store-stat.suspended span.stats-up-count {
                color: #fff;
            }

        .store-stat span.stats-count {
            font-family: 'Open Sans', sans-serif;
            font-size: 38px;
            font-weight: 800;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: normal;
            text-align: center;
            color: #333333;
        }

        .store-stat span.stats-description {
            font-family: 'Poppins', sans-serif;
            font-size: 16px;
            font-weight: normal;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: normal;
            text-align: center;
            color: #808080;
        }

        .store-stat span.stats-up-count {
            font-family: 'Open Sans', sans-serif;
            font-size: 16px;
            font-weight: bold;
            font-style: normal;
            font-stretch: normal;
            line-height: normal;
            letter-spacing: normal;
            text-align: center;
            color: #3bb149;
        }

        .store-stat span {
            text-decoration: none;
        }

    .acc-suspended-text {
        font-family: 'Open Sans', sans-serif;
        font-size: 16px;
        font-weight: 500;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .Arrow-Drop-Up {
        width: 21px;
        height: 11px;
        object-fit: contain;
    }

    .Arrow-Drop-Up-Copy {
        width: 21px;
        height: 11px;
        object-fit: contain;
    }

    .radius-19 {
        border-radius: 19px;
    }

    .radius-30 {
        border-radius: 30px;
    }

    .btn-grey {
        border: solid 2px #d8d8d8;
    }

    .timeline-data a {
        color: var( --primary-text-color);
        text-decoration: none;
    }

    .action-data a, .action-data .fa {
        color: #fff;
        text-decoration: none;
        font-family: 'Poppins', sans-serif;
        font-size: 14px;
        font-weight: 500;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #ffffff;
    }

    .btn-green {
        border: solid 2px #3db44c;
        background-image: linear-gradient(100deg, #3bb149, #3bb192)!important;
    }

    .healthy-reward a {
        font-family: 'Open Sans', sans-serif;
        font-size: 22px;
        font-weight: 500;
        color: #ffffff;
        text-decoration: none;
        line-height: 45px;
    }

    @media (max-width:768px) {

        .healthy-reward a {
            font-family: 'Open Sans', sans-serif;
            font-size: 18px;
            font-weight: 500;
            color: #ffffff;
            text-decoration: none;
            line-height: 26px;
        }
    }

    .user-profile-header {
        box-shadow: 0 8px 9px -7px #b7b2b2;
        background-color: #ffffff;
    }

    .user-notification a {
        text-decoration: none;
    }

        .user-notification a.bell-notify {
            position: relative;
        }

        .user-notification a i.fa-bell {
            position: relative;
            font-size: 25px;
            color: var(--primary-text-color);
        }

    a.user {
        font-family: 'Open Sans', sans-serif;
        font-size: 14px;
        font-weight: 600;
        color: #333333;
    }

    .user-notification a > span.badge.badge-pill.badge-danger.notification {
        position: absolute;
        top: -9px;
        right: 12px;
        z-index: 2;
    }

    .sidebar {
        width: 13%;
        padding: 0px;
    }

    .main-content {
        width: 87%;
        position: absolute;
        left: 250px;
        background-color: var(--main-bg-color);
    }

    @media (max-width:1500px) {

        .main-content {
           
            position: absolute;
            left: 250px;
            
            background-color: var(--main-bg-color);
        }
        .user-profile-header{
            width: 87%;
        }
    }

    @media (max-width:1200px) {

        .main-content {
          
            position: absolute;
           
            background-color: var(--main-bg-color);
        }
    }

    @media (max-width:768px) {
        .main-content {
            width: 100%;
            position: static;
            margin-left: 0;
        }
    }

    .show_hide {
        position: absolute;
        right: 1%;
    }

    a.logo-text {
        font-family: 'Poppins', sans-serif;
        font-size: 16px;
        font-weight: 600;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #537ebf;
    }

    .text-notify {
        background-color: #ff6567;
        color: #fff;
    }

    .healthy-reward .la {
        font-size: 49px;
        line-height: 34px;
        vertical-align: middle;
    }

    .nav .la {
        font-size: 14px;
    }

    .upcoming-deals tr:not(:last-child) {
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    }
    /*modal styles*/
    .modal.left .modal-dialog,
    .modal.right .modal-dialog {
        position: fixed;
        margin: auto;
        width: 100%;
        height: 100%;
        -webkit-transform: translate3d(0%, 0, 0);
        -ms-transform: translate3d(0%, 0, 0);
        -o-transform: translate3d(0%, 0, 0);
        transform: translate3d(0%, 0, 0);
    }

    .modal.left .modal-content,
    .modal.right .modal-content {
        height: 100%;
        overflow-y: auto;
    }

    .modal.left .modal-body,
    .modal.right .modal-body {
        padding: 15px 15px 80px;
    }

    /*Left*/
    .modal.left.fade .modal-dialog {
        left: -320px;
        -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
        -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
        -o-transition: opacity 0.3s linear, left 0.3s ease-out;
        transition: opacity 0.3s linear, left 0.3s ease-out;
    }

    .modal.left.fade.in .modal-dialog {
        left: 0;
    }



    /*Right*/
    .modal.right.fade .modal-dialog {
        right: 0;
        -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
        -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
        -o-transition: opacity 0.3s linear, right 0.3s ease-out;
        transition: opacity 0.3s linear, right 0.3s ease-out;
    }


    .modal.right.fade.in .modal-dialog {
        right: 0px;
    }

    #upcoming-deals input, select {
        border: 1px solid #eeeeee !important;
    }

    #upcoming-deals {
        color: var(--primary-text-color);
    }

        #upcoming-deals > input[placeholder], [placeholder] {
            color: rgba(0, 0, 0, 0.1);
        }

    input#mrp {
        background-color: #eeeeee;
    }

    .btn-outline-secondary {
        border: 2px solid #eeeeee !important;
    }

        .btn-outline-secondary:hover {
            border: 1px solid #ffffff;
            color: #383535;
            box-shadow: 1px 1px 1px 1px rgba(157, 161, 162, 0.5);
            background-color: #fff;
        }

    /*order_monthwise page css*/

    .order_details td:first-child {
        color: var(--menu-active-text-color);
        font-weight: 600;
        cursor: pointer;
    }
    .pdt-details td:first-child {
        color: var(--menu-active-text-color);
        font-weight: 600;
        cursor: pointer;
    }
    .escalation-details td:first-child, .escalation-details td:last-child{
        cursor: pointer;
    }
    .escalation-details td:first-child :hover, .escalation-details td:last-child:hover{
        cursor: pointer;
    }

    @media (max-width: 1440px) and (min-width: 450px){
        .order_details td:first-child {
           
            cursor: pointer;
        }
        .pdt-details td:first-child {
           
            cursor: pointer;
        }
        .escalation-details td:first-child, .escalation-details td:last-child{
            cursor: pointer;
        }
        .escalation-details td:first-child :hover, .escalation-details td:last-child:hover{
            cursor: pointer;
        } 
    }
    

    .order_details.pdt-table td:first-child {
        color: #333333;
        font-weight: 600;
    }

    .quantity_circle {
        padding: 2px 23px;
        border-radius: 17px;
        border: solid 2px #ffe2c1;
        font-family: 'Open Sans', sans-serif;
        font-size: 22px;
        font-weight: 600;
        font-style: normal;
        font-stretch: normal;
        line-height: normal;
        letter-spacing: normal;
        text-align: center;
        color: #f59121;
    }

    .filter-section {
        background-color: #fff;
    }

        .filter-section input {
            color: #3bb149;
            font-family: 'Open Sans',sans-serif;
            font-weight: 600;
            font-size: 14px;
            border: 1px solid #80798022;
            padding: 18px;
        }
        .filter-section input.order-filter {
            color: #495057!important;
            font-family: 'Open Sans',sans-serif!important;
            font-weight: 400!important;
            font-size: 14px;
          
        }v

        .filter-section.advanced input {
            color: #495057;
            font-family: 'Open Sans';
            font-weight: 400;
            font-size: 14px;
            border: 1px solid #80798022;
            padding: 0px;
            height: 38px;
        }

    .pdt-img {
        box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.07);
    }

    .pdt-details tr {
        border-top: 1px solid rgba(140, 134, 134, 0.1);
        border-bottom: 1px solid rgba(140, 134, 134, 0.1);
    }
    /*order_monthwise page css*/
    /*pdt edit details*/

    .all-edit-fields {
        background-color: #fff;
    }

    .aside-pdt-details .list-group-item {
        border: none;
    }

    .form-check-input {
        position: absolute;
        margin-top: .3rem;
        margin-left: -2.25rem;
    }

    .pdt-sub-menu {
        display: flex;
    }

    @media (max-width:760px) {
        .pdt-sub-menu {
            flex-flow: row;
            flex-wrap: wrap;
        }
    }

    input[type="checkbox"], input[type=radio] {
        box-sizing: border-box;
        padding: 5px;
        width: 20px;
        height: 20px;
        background-color: #fff;
        box-shadow: none;
        border: none;
    }

        input[type="checkbox"]:checked {
            border: solid 0.5px #3bb149;
            background-color: #3bb149;
        }

    .form-check-label {
        margin-bottom: 0;
        line-height: 30px;
    }

    .form-check {
        position: relative;
        display: block;
        padding-left: 1.25rem;
        padding-top: 10px;
    }

    input[type="checkbox"]:checked {
        border: 2px solid #28a745;
    }
    /*custom checkbox styles*/
    /*The container 
.container {
    display: block;
    position: relative;
    padding-left: 22px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 14px;
   font-weight:600;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

     Hide the browser's default checkbox 
    .container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

 Create a custom checkbox 
.checkmark {
    position: absolute;
    top: 13px;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #f8f9fa;
    border: 2px solid #dcdbdb;
    border-radius: 5px;
}

 On mouse-over, add a grey background color 
.container:hover input ~ .checkmark {
    background-color: #ccc;
    border:1px solid #ccc;
}

 When the checkbox is checked, add a blue background 
.container input:checked ~ .checkmark {
    background-color: #f8f9fa;
    border: 2px solid #28a745;
    border-radius: 5px;
}

 Create the checkmark/indicator (hidden when not checked) 
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

 Show the checkmark when checked 
.container input:checked ~ .checkmark:after {
    display: block;
}

 Style the checkmark/indicator 
.container .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: 2px solid #28a745;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
custom-styles checkbox*/
    #mceu_11 {
        display: block;
    }

    #mceu_11 {
        display: inline-block;
    }

    #mceu_32 {
        width: 196px;
        display: inline-block;
    }

    .mce-panel {
        border: 1px solid #f7f7f7;
        background-color: #fff;
    }

    .mce-label {
        display: none !important;
    }

    #classic_ifr {
        height: 200px;
    }

    .all-checkbox-fields {
        width: 100%;
        border: 1px solid #eaebec;
        background-color: #f7f7f7;
        padding: 21px 10px;
        margin: 10px 16px;
    }

    .form-control {
        display: block;
        width: 100%;
        height: calc(1.5em + .75rem + 2px);
        padding: .375rem .75rem;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5;
        color: #495057;
        background-color: #f7f7f7;
        background-clip: padding-box;
        border: 1px solid #eaebec;
        border-radius: .25rem;
        transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    }

    .file-upload-box {
        width: 98%;
        margin-left: 17px;
    }



    .ff_fileupload_wrap table.ff_fileupload_uploads {
        width: 100%;
    }

        .ff_fileupload_wrap table.ff_fileupload_uploads tr {
            width: 32%;
            display: inline-block;
            border: 1px solid rgba(0, 0, 0, 0.1);
            padding: 13px 13px;
            margin: 0px 5px;
        }

        .ff_fileupload_wrap table.ff_fileupload_uploads td.ff_fileupload_preview {
            width: 10%;
            border: 1px solid rgba(0, 0, 0, 0.2);
            padding: 9px 10px;
        }

        .ff_fileupload_wrap table.ff_fileupload_uploads td.ff_fileupload_summary {
            width: 80%;
        }

        .ff_fileupload_wrap table.ff_fileupload_uploads td.ff_fileupload_actions {
            width: 10%;
        }

    .ff_fileupload_wrap .ff_fileupload_dropzone {
        height: 100px;
    }

    .ff_fileupload_wrap table.ff_fileupload_uploads td.ff_fileupload_summary .ff_fileupload_filename input {
        border: 1px solid rgba(0, 0, 0, 0);
    }

    .ff_fileupload_wrap .ff_fileupload_dropzone:hover, .ff_fileupload_wrap .ff_fileupload_dropzone:focus, .ff_fileupload_wrap .ff_fileupload_dropzone:active {
        border-color: rgba(0, 0, 0, 0.2);
    }

    span.green.dot-bullet {
        width: 10px;
        height: 10px;
        border-radius: 12.5px;
        border: solid 3px #3ab14a;
        display: inline-block
    }

    span.orange.dot-bullet {
        width: 10px;
        height: 10px;
        border-radius: 12.5px;
        border: solid 3px #f69120;
        display: inline-block
    }

    span.red.dot-bullet {
        width: 10px;
        height: 10px;
        border-radius: 12.5px;
        border: solid 3px #e82429;
        display: inline-block
    }

    span.blue.dot-bullet {
        width: 10px;
        height: 10px;
        border-radius: 12.5px;
        border: solid 3px #547ebf;
        display: inline-block
    }

    span.grey.dot-bullet {
        width: 10px;
        height: 10px;
        border-radius: 12.5px;
        border: solid 3px #808080;
        display: inline-block
    }

    .text-blue {
        color: #547ebf;
    }

    .text-orange {
        color: #f69120;
    }

    .escalation-details td:first-child {
        color: #547ebf;
        font-family: 'Open Sans';
        font-weight: 600; 
        cursor: pointer;
    }
    @media (max-width: 1280px) and (min-width: 1000px){
        .escalation-details td:first-child {
           
            cursor: pointer;
        }
        .pad-right{
            padding-right: 100px;
        }
        
    }
    
    li.page-item > a.page-link {
        position: relative;
        margin: 0.5rem;
        display: block;
        padding: 0.5rem 0.5rem !important;
        line-height: 1.25;
        color: #002257;
        background-color: #fff;
        border: 1px solid #fff !important;
    }

        li.page-item > a.page-link:hover {
            background-color: #eff5fc;
        }

    .hidden {
        display: none;
    }

    .footer-pagination {
        display: flex;
    }

    .timeline-data .form-control {
        width: 150px;
        margin-left: 10px;
        background-color: #f1f5f9;
        border: 1px solid #f1f5f9;
    }

    .timeline-data.btn {
        padding: 0.075rem 0.175rem;
    }

    .timeline-data.btn {
        padding-right: 20px;
        height: 50px;
    }

    .ff_fileupload_wrap .ff_fileupload_dropzone {
        border: 1px dashed #A2B4CA;
    }

    .aside-pdt-details li.nav-item {
        padding: 5px 0px 5px 0px;
        width: 200px;
    }

    .aside-pdt-details .nav-pills .nav-link {
        height: 40px;
        border-radius: 0;
        width: 100%;
        vertical-align: middle;
        padding-top: 12px;
        color: var(--menu-active-text-color);
    }

        .aside-pdt-details .nav-pills .nav-link.active {
            color: #fff;
            background-color: var(--menu-active-text-color);
        }

    .aside-pdt-details .nav-pills a.nav-link:hover {
        border-radius: 0;
        color: #fff;
        background-color: var(--menu-active-text-color);
    }



    .aside-pdt-details .nav-pills .nav-link:hover {
        border-radius: 0;
        color: #fff;
    }
    /*pdt edit details*/
    /*ESCalation details*/
    .card {
        border: 1px solid rgba(0, 0, 0, 0.00);
    }

    input[type="text"].pdt-title::-webkit-input-placeholder {
        color: #333333;
        font-family: 'Open Sans';
        font-weight: 600;
    }

    .tab-content .container {
        max-width: 100%;
        margin-right: 0px;
        padding-top: 10px;
    }

    .tab-pane-title {
        border: 1px solid #eaebec;
    }

    .mce-panel {
        border: 0 solid #eaebec !important;
        background-color: #fff;
    }
    /*ESCalation details*/

    .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
        border: 1px solid #f1f5f9;
        background: #f1f5f9;
        font-weight: normal;
        color: #454545;
    }

    .comiseo-daterangepicker-triggerbutton.ui-button {
        text-align: left;
        min-width: 18em;
        margin-left: 5px;
        margin-top: 7px;
    }

    @media only screen and (max-width:992px) {

        .sidebar, .main-content {
            width: 100%;
        }

        .side-bar {
            z-index: 5;
            height: 100vh;
        }
    }

    @media only screen and (min-width:577px) and (max-width:768px) {

        .sidebar, .main-content {
            width: 100%;
        }

        .side-bar {
            z-index: 10;
            height: 100vh;
        }

        i.la-bars {
            font-size: 23px;
        }
    }

    @media only screen and (max-width:576px) {
        .sidebar, .main-content {
            width: 100%;
        }

        .side-bar {
            z-index: 10;
            height: 100vh;
        }

        a.logo-text {
            display: block;
            margin: 10px 0px;
        }

        i.la-bars {
            font-size: 23px;
        }
    }

    @media only screen and (max-width:320px) {
        .sidebar, .main-content {
            width: 100%;
        }
    }

    .rate-us {
        position: fixed;
        bottom: 14px;
        right: 33px;
        z-index: 12;
    }

    .star-rating i.la {
        color: #dfd3cf;
    }

    .close-btn {
        position: fixed;
        right: 32px;
        bottom: 198px;
        z-index: 99;
    }

    .healthy-reward .la-close {
        font-size: 22px;
        line-height: 34px;
        vertical-align: middle;
        color: #828282;
        cursor: pointer;
        z-index: 10;
    }


    .g-recaptcha * {
        width: 100%;
    }

    .width-500 {
        width: 100%;
        max-width: 500px;
        margin: 0 auto;
    }

    input.datepicker[placeholder], input.filter-field[placeholder] {
        padding-left: 10px;
    }

    .bg-output {
        background-color: #ffc079;
    }

    .w-auto {
        width: auto;
    }

    .stock-update .btn {
        height: 35px;
    }

    .show_hide {
        display: none;
    }

    .long-text {
        overflow: hidden;
        text-overflow: ellipsis;
        width: 182px;
        white-space: nowrap;
    }

    @media only screen and (max-width: 760px) {
        .long-text {
            overflow: hidden;
            text-overflow: ellipsis;
            width: 182px;
            white-space: normal;
        }
    }
    /*All tables responsive*/
    @media only screen and (max-width: 768px) {
        /*order table start*/
        .order_details table, .order_details thead, .order_details tbody, .order_details th, .order_details td, .order_details tr {
            display: block;
        }

            .order_details tr:nth-of-type(odd) {
                background: #eee;
            }
            /* Hide table headers (but not display: none;, for accessibility) */
            .order_details thead tr {
                position: absolute;
                top: -9999px;
                left: -9999px;
            }

        .order_details tr {
            border: 1px solid #ccc;
        }

        .order_details td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #e8e7e7 !important;
            position: relative;
            padding-left: 50% !important;
            padding-top: 2px;
        }
        .order_details td.no-records {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #e8e7e7 !important;
            position: relative;
            padding-left: 0% !important;
            padding-top: 5px;
            font-size: 12px;
        }

            .order_details td:before {
                /* Now like a table header */
                position: absolute;
                /* Top/left values mimic padding */
                top: 6px;
                left: 6px;
                width: 45%;
                padding-right: 10px;
                white-space: nowrap;
            }

            /*
	Label the data
    */
    /*.order_details tr:first-child td:first-child:nth-of-type(1):before {
        content: "";
    }*/ .order_details td:nth-of-type(1):before {
        content: "";
        font-size:12px;
    }
            .order_details td:nth-of-type(2):before {
                content: "ORDER ID";
                font-size:12px;
            }

            .order_details td:nth-of-type(3):before {
                content: "PRODUCT TITLE";
                font-size:12px;
            }

            .order_details td:nth-of-type(4):before {
                content: "QUANTITY ORDERED";
                font-size:12px;
            }

            .order_details td:nth-of-type(5):before {
                content: "ORDER DATE";
                font-size:12px;
            }

            .order_details td:nth-of-type(6):before {
                content: "ORDER STATUS";
                font-size:12px;
            }

        /*order table end*/
          /*packaging-material table */
          .packaging-material-table td:nth-of-type(1):before {
            content: "PRODUCT";
            font-size:12px;
        }
        .packaging-material-table td:nth-of-type(2):before {
                    content: "SKU";
                    font-size:12px;
                }
    
                .packaging-material-table td:nth-of-type(3):before {
                    content: "Size (Inches) LxWxH";
                    font-size:12px;
                }
    
                .packaging-material-table td:nth-of-type(4):before {
                    content: "PCS/PACK";
                    font-size:12px;
                }
    
                .packaging-material-table td:nth-of-type(5):before {
                    content: "PRICE PER PACK";
                    font-size:12px;
                }
    
                .packaging-material-table td:nth-of-type(6):before {
                    content: "QUANTITY";
                    font-size:12px;
                }
                .packaging-material-table td:nth-of-type(7):before {
                    content: "ADD TO CART OR BUY";
                    font-size:12px;
                }
           /*packaging-material table end*/
             /*order-history table */
             .pdt-details.order-history td:nth-of-type(1):before {
            content: "PRODUCT";
            font-size:12px;
        }
        .pdt-details.order-history td:nth-of-type(2):before {
                    content: "TITLE";
                    font-size:12px;
                }
    
                .pdt-details.order-history td:nth-of-type(3):before {
                    content: "TOTAL AMOUNT";
                    font-size:12px;
                }
    
                .pdt-details.order-history td:nth-of-type(4):before {
                    content: "QUANTITY";
                    font-size:12px;
                }
    
                .pdt-details.order-history td:nth-of-type(5):before {
                    content: "ORDER DATE";
                    font-size:12px;
                }
    
                .pdt-details.order-history td:nth-of-type(6):before {
                    content: "ORDER STATUS";
                    font-size:12px;
                }
                .pdt-details.order-history td:nth-of-type(7):before {
                    content: "TRACK ORDER";
                    font-size:12px;
                }
           /*shipping label table end*/
        .shipping-label td:nth-of-type(1):before {
            content: "DATE/TIME";
            font-size:12px;
        }
        .shipping-label td:nth-of-type(2):before {
                    content: "TOTAL ORDERS";
                    font-size:12px;
                }
    
                .shipping-label td:nth-of-type(3):before {
                    content: "";
                    font-size:12px;
                }
    
                .shipping-label td:nth-of-type(4):before {
                    content: "WAREHOUSE ADDRESS";
                    font-size:12px;
                }
    
                .shipping-label td:nth-of-type(5):before {
                    content: "COURIER NAME";
                    font-size:12px;
                }
    
                .shipping-label td:nth-of-type(6):before {
                    content: "MANIFEST";
                    font-size:12px;
                }
                .shipping-label td:nth-of-type(7):before {
                    content: "SHIPPING LABEL";
                    font-size:12px;
                }

        /*product list table*/
        .pdt-details table, .pdt-details thead, .pdt-details tbody, .pdt-details th, .pdt-details td, .pdt-details tr {
            display: block;
        }

            .pdt-details tr:nth-of-type(odd) {
                background: #eee;
            }
            /* Hide table headers (but not display: none;, for accessibility) */
            .pdt-details thead tr {
                position: absolute;
                top: -9999px;
                left: -9999px;
            }

        .pdt-details tr {
            border: 1px solid #ccc;
        }

        .pdt-details td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #e8e7e7 !important;
            position: relative;
            padding-left: 50% !important;
            padding-top: 5px;
            font-size: 12px;
        }

            .pdt-details td:before {
                /* Now like a table header */
                position: absolute;
                /* Top/left values mimic padding */
                top: 6px;
                left: 6px;
                width: 45%;
                padding-right: 10px;
                white-space: nowrap;
            }

            /*
	Label the data
	*/.pdt-details td.no-records {
        border: none;
        border-bottom: 1px solid #e8e7e7 !important;
        position: relative;
        padding-left: 0% !important;
        padding-top: 5px;
        font-size: 12px;
    }
    .pdt-details td:nth-of-type(1).no-records:before{
        content:"";
            }
            .pdt-details td:nth-of-type(1):before {
                content: "PRODUCT SKU";
                font-size:12px;
            }

            .pdt-details td:nth-of-type(2):before {
                content: "PRODUCT TITLE";
                font-size:12px;
            }

            .pdt-details td:nth-of-type(3):before {
                content: "AVG RATING";
                font-size:12px;
            }

            .pdt-details td:nth-of-type(4):before {
                content: "PRODUCT STOCK";
                font-size:12px;
            }

           
        /*product list table*/

        /*escalation list table*/

        .escalation-details table, .escalation-details thead, .escalation-details tbody, .escalation-details th, .escalation-details td, .escalation-details tr {
            display: block;
        }

            .escalation-details tr:nth-of-type(odd) {
                background: #eee;
            }
            /* Hide table headers (but not display: none;, for accessibility) */
            .escalation-details thead tr {
                position: absolute;
                top: -9999px;
                left: -9999px;
            }

        .escalation-details tr {
            border: 1px solid #ccc;
        }

        .escalation-details td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #e8e7e7 !important;
            position: relative;
            padding-left: 50% !important;
            padding-top: 5px;
            font-size: 12px;
        }

            .escalation-details td:before {
                /* Now like a table header */
                position: absolute;
                /* Top/left values mimic padding */
                top: 6px;
                left: 6px;
                width: 45%;
                padding-right: 10px;
                white-space: nowrap;
            }

            /*
	Label the data
	*/
            .escalation-details td:nth-of-type(1):before {
                content: "TICKET NO";
                font-size: 12px;
            }

            .escalation-details td:nth-of-type(2):before {
                content: "RAISED ON";
                font-size: 12px;
            }

            .escalation-details td:nth-of-type(3):before {
                content: "PRODUCT";
                font-size: 12px;
            }

            .escalation-details td:nth-of-type(4):before {
                content: "ORDER ID";
                font-size: 12px;
            }

            .escalation-details td:nth-of-type(5):before {
                content: "CONCERN";
                font-size: 12px;
            }
            .escalation-details td:nth-of-type(6):before {
                content: "STATUS";
                font-size: 12px;
            }
        /*escalation list table*/

        
        .upcoming-details table, .upcoming-details thead, .upcoming-details tbody, .upcoming-details th, .upcoming-details td, .upcoming-details tr {
            display: block;
        }

            .upcoming-details tr:nth-of-type(odd) {
                background: #eee;
            }
            /* Hide table headers (but not display: none;, for accessibility) */
            .upcoming-details thead tr {
                position: absolute;
                top: -9999px;
                left: -9999px;
            }

        .upcoming-details tr {
            border: 1px solid #ccc;
        }

        .upcoming-details td {
            /* Behave  like a "row" */
            border: none;
            font-size: 12px;
            border-bottom: 1px solid #e8e7e7 !important;
            position: relative;
            padding-left: 50% !important;
        }

            .upcoming-details td:before {
                /* Now like a table header */
                position: absolute;
                /* Top/left values mimic padding */
                top: 6px;
                left: 6px;
                width: 45%;
                padding-right: 10px;
                white-space: nowrap;
            }

            /*
	Label the data
	*/.upcoming-details tr:first-child td:first-child:nth-of-type(1):before {
        content: "";
    }
            .upcoming-details td:nth-of-type(1):before {
                content: "PRODUCT-TITLE";
            }

            .upcoming-details td:nth-of-type(2):before {
                content: "PRODUCT-PRICE";
            }

            .upcoming-details td:nth-of-type(3):before {
                content: "START DATE & TIME";
            }

            .upcoming-details td:nth-of-type(4):before {
                content: "END DATE & TIME";
            }

            


    }
.wrapper,.warper{
    background-color: var(--main-bg-color);
}
.Rectangle{
    border: solid 1px #d8d8d8;
    background-color: #eeeeee;
    cursor: context-menu;
}
.Rectangle a{
   
    cursor: context-menu;
}
.e-input{
    cursor: pointer;

}
.Rectangle:hover{
    border: solid 1px #d8d8d8;
    background-color: #eeeeee;
    cursor: context-menu;
}

select.decor {
    display: block;
    width: 100%;
    height: 38px;
    padding: .375rem .75rem;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #f7f7f7;
    background-clip: padding-box;
    border: 1px solid #eaebec;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.user-profile-header{
    height:65px;
}

input.e-input, textarea.e-input, .e-input-group, .e-input-group.e-control-wrapper {
    font-family: 'Open Sans';
    font-size: 14px;
    font-weight: 400;
}
.e-input-group input.e-input, .e-input-group.e-control-wrapper input.e-input  {
    border-color:#ffffff!important;
}
.e-input-group input.e-input:hover, .e-input-group.e-control-wrapper input.e-input:hover {
    border-color:#ffffff!important;
}
.e-input-group:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left), .e-input-group.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap, .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left), .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap, .e-float-input.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap, .e-float-input.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap {
    border-color: #ffffff;
    padding-left: 10px;
    height: 24px;
}

.e-input:focus:not(.e-success):not(.e-warning):not(.e-error), .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus, .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus, .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus, .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus {
    border-color: #ffffff!important;
}
.btn.date-range:hover{
    background-color: #fafafa00; 
    border: solid 2px #d8d8d8;
    border-radius: 19px;
}
.e-input-group:hover:not(.e-disabled):not(.e-float-icon-left), .e-input-group.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left), .e-float-input:hover:not(.e-disabled):not(.e-float-icon-left), .e-float-input:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]), .e-float-input:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]), .e-float-input:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]), .e-float-input:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]), .e-float-input.e-control-wrapper:hover:not(.e-disabled):not(.e-float-icon-left), .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]), .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]), .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]), .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]) {
    border-color:#ffffff!important;
}
.e-input:focus:not(.e-success):not(.e-warning):not(.e-error), .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus, .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus, .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus, .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus {
    border-color: #d8d8d8;
}

.products-popup.d-block{
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    opacity: 0;
    background: black;
    transition: opacity 0.5s;
}

/*Edit shipping dialog CSS*/

.custom-dialog-container .mat-dialog-container {
    overflow: hidden;
    border-radius: 20px !important;
    padding: 5px;
}

.container1 {
    margin-left: 28px;
    margin-right: 28px;
}

.popUp-header {
    width: 198px;
    height: 26px;
    font-family: Open Sans !important;
    font-size: 21px;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: normal;
    color: #333333;
  }

  .panel-heading1 {
    font-weight: 700;
    border-bottom: solid 5px #f7f7f7;
}

.Shipping-Detail {
    width: 132px;
    height: 24px;
    font-family: Open Sans !important;
    font-size: 18px;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #333333;
  }

  .Shipping-Method {
    width: 111px;
    height: 22px;
    font-family: Open Sans;
    font-size: 12px;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.83;
    letter-spacing: normal;
    color: #808080;
  }

  .Rectangle-Copy {
    width: 440px !important;
    height: 46px !important;
    border-radius: 5px;
    border: solid 1px #eaebec !important;
    font-size: 16px !important;
  }

  select {
    width: 79px;
    height: 22px;
    font-family: Open Sans !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.38 !important;
    letter-spacing: normal;
    color: #808080;
  }

  .Fill-1 {
    width: 135px !important;
    height: 45px !important;
    border: solid 2px #3db44c;
    border-radius: 25px !important;
    font-size: 20px !important;
    background-image: linear-gradient(106deg, #3bb149, #3bb192);
  }

  .Save {
    width: 48px;
    height: 27px;
    font-family: Open Sans;
    font-size: 20px;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
  }

  .Shape {
    width: 16px;
    height: 8px;
    background-color: #a6b2c4;
  }
.side-bar-escalation{
    height:100%;
}
.bg-light {
    background-color: #f4faff!important;
}
.action-buttons{
    padding: 22px 0px;
background-color: #f5f8fc;
}

.action-buttons {
    padding: 22px 47px;
    background-color: #f5f8fc;
    margin-left: -25px;
    position: fixed;
    margin-top: -86px;
    z-index: 7;
    width: 86%;
}
@media (max-width: 1800px) and (min-width: 1601px){

    .action-buttons{
      
        margin-left: -20px;
        width: 84%;
    }

}
@media (max-width: 1600px) and (min-width: 1501px){

    .action-buttons {
      
        margin-left: -20px;
        width: 83%;
    }

}
@media (max-width: 1500px) and (min-width:1441px){

    .action-buttons {
        width: 83%;
    }
    .pad-right{
        padding-right: 100px;
    }
}
@media (max-width: 1440px) and (min-width: 1281px){

    .action-buttons{
        width: 83%;
    }
    .pad-right{
        padding-right: 100px;
    }
  

}




@media (max-width: 1280px) and (min-width: 1000px){

    .action-buttons[_ngcontent-c3] {
        width: 81%;
        margin-left: -20px;
    }

}
@media (max-width: 999px) and (min-width: 769px){

    .action-buttons[_ngcontent-c3] {
        width: 74%;
    }

}
@media (max-width: 768px){

   

}
.footer-section{
    height:50px;
    background-color: #e2e6eb;
}
.box-shape{
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

.escalation-details .table > thead > tr > th {
    border-top: 1px solid #f1f5f9 !important;
    border-bottom: 2px solid #f1f5f9  !important; 
}

.pdt-details .table > thead > tr > th {
    border-top: 1px solid #f1f5f9 !important;
    border-bottom: 2px solid #f1f5f9  !important; 
}
.order_details .table > thead > tr > th {
    border-top: 1px solid #f1f5f9 !important;
    border-bottom: 2px solid #f1f5f9  !important; 
}
select{
    color: #808080;
    font-family: 'Open Sans'!important;
    font-style: normal;
    font-weight: 400!important;

}
.filter-section.advanced input.order-filter{
    color: #808080;
    font-family: 'Open Sans',sans-serif;
    font-weight: 400;
    font-size: 14px;
  
}
.filter-section.advanced select.order-filter{
    color: #808080;
    font-family: 'Open Sans'!important;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
  
}
.context-menu {cursor: context-menu;}
.pointer {cursor: pointer;}

.store-stat a{
    cursor: context-menu;
}

.pagination{
    margin:0px;
}
.footer-row{
    margin-left: -26px;
    margin-right: -33px;
}
.spnTooltip > * {
    color: #bebebe;
}

.edit-f,.cancel-f {
    color: #bebebe;
}
.edit-f i,.cancel-f i, .arrow i{
    color: #bebebe;
    font-size: 20px;
}

.overlay-border-right {
    border-right: 1px solid #474747!important;
    padding-top: 5px;
    padding-bottom: 5px;
}

.popup-border-top{
    
    border-top: solid 5px #f7f7f7;

}
.popup-border-bottom{
    
    border-bottom: solid 5px #f7f7f7;

}
.warper {
    
    padding-bottom: 0px;
   
}

.cdk-global-scrollblock {
    position: fixed;
    width: 100%;
    overflow: hidden!important;
}

input[name="fileinput"] {
    width: 100%;
  }
  .mat-dialog-container {
  
    border-radius: 20px!important;
  
}
.text-error{
    color:#e82629
}
.custom-file-input::-webkit-file-upload-button {
    visibility: hidden;
  }
  .customs-file-input::before {
    content: 'Choose file';
    display: inline-block;
    border: solid 1px #f7f7f7;
  background-color: #f7f7f7;
    border-radius: 3px;
    padding: 5px 8px;
    outline: none;
    white-space: nowrap;
    -webkit-user-select: none;
    cursor: pointer;
    font-weight: 600;
    font-size: 16px;
    font-family: 'Open Sans';
    width:100%;
  }
  .customs-file-input:hover::before {
    border-color: black;
  }
  .customsfile-input:active::before {
    background-color: #f7f7f7;
  }
  .line-ht17{
      line-height: 17px;
  }

  .btn.custom-input-btn{
    font-weight: 600;
    font-size: 16px;
    font-family: 'Open Sans';
    width:100%;
    border: solid 1px #f7f7f7;
    background-color: #f7f7f7;
      border-radius: 23px;
      height:46px;
  }
  .btn.custom-input-btn:hover{
    font-weight: 600;
    height:46px;
    font-size: 16px;
    font-family: 'Open Sans';
    width:100%;
    border: solid 1px #f7f7f7;
    background-color: #f7f7f7;
      border-radius: 23px;
    
  }

  .rate-us .la-close {
    font-size: 22px;
    line-height: 34px;
    vertical-align: middle;
    color: #828282;
    cursor: pointer;
    z-index: 10;
}
.rate-us.btn:hover {
    background-color: #fafafa00; 
 border: 1px solid #fafafa00; 
}

.f_color {
    color: black;
}

.error_txt_size {
    font-size: 16px;
}

.txtArea_fsize {
    font-size: 12px !important;
}
ul.pagination li a.page-link {
    color: #6c757d;
    pointer-events: auto;
    cursor: pointer;
}
ul.pagination li a.active {
    background-color: #f1f5f9!important;
    color: #ff6567;
}

pre{
    word-break: break-word;
}
td:hover .spnTooltip.esc {
    display: inline;
    position: absolute;
    color: #fff;
    border: none;
    background:  #246096;
    font-family: Open Sans;
    font-weight:400;

}
.unread{
    color: #333;
    font-weight: 600;}
    
td:hover .spnTooltip.orders {
    display: inline;
    position: absolute;
    color:  #bebebe;
   
    background: #333333;
}

span.readmore:hover{
    cursor: pointer;
}
.mat-dialog-container {
    display: block;
    padding: 20px 17px ;
    border-radius: 4px;
    box-sizing: border-box;
    overflow: hidden !important;
    outline: 0;
    width: 100%;
    height: 100%;
    min-height: inherit;
    max-height: inherit;
}
.e-input-group.e-error, .e-input-group.e-control-wrapper.e-error, .e-input-group.e-error:not(.e-float-icon-left), .e-input-group.e-control-wrapper.e-error:not(.e-float-icon-left) {
    border-bottom-color: #fff;
    margin-bottom: 0px;
}
.e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::after, .e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::before, .e-float-input.e-control-wrapper.e-input-group:not(.e-float-icon-left) .e-float-line::after, .e-float-input.e-control-wrapper.e-input-group:not(.e-float-icon-left) .e-float-line::before, .e-float-input.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::after, .e-float-input.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::before, .e-float-input.e-input-group:not(.e-float-icon-left) .e-float-line::after, .e-float-input.e-input-group:not(.e-float-icon-left) .e-float-line::before, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group:not(.e-float-icon-left):not(.e-float-input)::before
{ border-bottom-color: #fff;

}


.e-input-group:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after {
    background: #fff;
}

.datepicker-w{
    width:270px;
}

#ej2-datetimepicker_0_input{
    padding: 0px;
}
td.font-weight-600{
    font-weight: 600!important;
}
.font-weight-600{
    font-weight:600;
}

.ng-star-inserted{
    font-size: 16px;
}
.mat-progress-bar {
    display: none;
    
}
.upld-text li{
    color:#333333;
}
.e-input-group .e-clear-icon, .e-input-group.e-control-wrapper .e-clear-icon {
    min-height: 18px;
    min-width: 18px;
    padding: 4px 4px 0px;
}
#ej2-datetimepicker_0_input {
    padding: 0px;
    padding-left: 10px;
}
.loader-div{
    display: none;
}
/*mat-progress-bar{
    display: none!important;
}*/

table.dialogue-table td{
cursor:context-menu;
}
.margin-top-mob{
    margin-top:0px;
}

.pdt-details1 td {
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: normal;
    color: #333333;
}
.date-range{
    margin-left:15px;
}
.rohto-mobile{
    display: none;
}
.rohto img{
    height:41px;
}
.rohto{
    display: block;
}

.la-times{
    font-size:16px;
}
.up-section{
 padding:20px;   
}
.upcoming-details td:first-child{
    border-bottom:none;
    border-top: 1px solid #ddd;

}
.upcoming-details tr:first-child td{
    border-bottom:1px solid #ddd0;
    border-top: 1px solid #ddd0;

}
.no-records{
    cursor:context-menu !important;
}
/*if top 3 buttons hided in order file*/
.container-fluid.orders{
    margin-top: 58px;
}
/*if top 3 buttons are not hided in order file*/
/*.container-fluid.orders{
    margin-top: 116px;
}*/
#daterangepicker_input{
    padding-left:10px;
}
.ng-star-inserted {
    font-size: 12px;
}
.btn-area{
    padding-top:20px;
}
.list-section-import{
    padding: 20px 10px;
}
.pdt-detatils-img img{
    width:100%;
}

@media (min-width: 769px){
    .show_hide.desktop  {
        display: none !important;
    }
    button.show_hide.tab > i.la.la-times{
   
        color:#fff;
      
    }
    .order-info-padding{
        padding-top: 0px;
        padding-bottom: 0px;
    }
}
@media (max-width: 768px) and (min-width: 577px){
    
    .action-buttons {
        width: 100%;
        margin-left: -35px;
    }
    .show_hide.tab{
        display: block;
        position: absolute;
    right: 8% !important;
    }
    .btn.show_hide,.btn.show_hide:hover,.btn.show_hide:active,.btn.show_hide:focus{
        background-color: #eee0;
    border-color: #e6e6e600;
    position: absolute;
    right: -94%;
    z-index:90;
    }
    .m-top{
        margin-top:100px !important;
    }
    .container-fluid.dashb{
        padding-left:0px !important;
    }
    .container-fluid.orders{
        margin-top:0px !important;
    }
    .main-content.products{
        left: 0%;
        margin-left: 0%;
        width: 100%;
        margin-top: 70px !important;
    }
    .img-wrap-quotes{
       
        margin: 0 auto;
    }
    .rohto-mobile{
        display: none;
    }
    .rohto{
        display: block;
    }
    img.rohto {
        height:41px;
    }
}


@media (max-width:576px){
  
    .order_details td:nth-of-type(1).no-records:before{
content:"";
    }
    .order_details td:nth-of-type(1).hidden:before {
        display:none;
    }
    td .spnTooltip.esc {
        width: 100% !important;
    }
    .Rectangle-Copy {
        width: 100% !important;
    }
    .img-wrap-quotes {
        max-height: 194px;
        max-width: 203px;
        width: 157px;
        height: 112px;
        text-align: center;
    }
    .line-height-ordrs{
        line-height: 1.2;
    }
    .list-section-import{
        padding:0px;
    }
    .btn-area{
        padding-top:0px;
    }
    ul.import-bulk-list{
        padding:0px;
    }
    .long-text {
        width: 100%;
    }
    .table-responsive > .table > thead > tr > th, .table-responsive > .table > tbody > tr > th, .table-responsive > .table > tfoot > tr > th, .table-responsive > .table > thead > tr > td, .table-responsive > .table > tbody > tr > td, .table-responsive > .table > tfoot > tr > td {
        white-space: normal;
    }
    .update-box {
      
        width: 52px;
        font-size: 12px;
    }
    .stock-update .btn {
        height: 35px;
        font-size: 12px;
    }
    .container-fluid.orders{
        margin-top: 181px;
    }

    .up-section{
        padding:0px;   
       }
    .section-header h3{
        font-size: 17px;
    }
    .healthy-reward a{
width:100%;

    }
    .healthy-reward button{
        width:100%;
        font-size: 15px;

    }
    .quantity_circle {
        padding: 2px 10px;
        margin-left:30px;
    }
    .btn.show_hide,.btn.show_hide:hover,.btn.show_hide:active,.btn.show_hide:focus{
        background-color: #eee0;
    border-color: #e6e6e600;
    }
.margin-top-mob{
    margin-top:250px;
}
.main-content.products {
    
    left:0%;
    margin:0%;
    width: 100%;
}
.action-buttons {
    width: 100%;
    margin-top: -158px;
    margin-left: -32px;
}
.action-buttons.dashb {
    width: 100%;
    margin-top: -77px;
}
.action-data{
    width:70%;
}
.justify-content-end.pl-4{
    padding-left: 0px !important;
}
.store-stat-box .col-12, .store-stat-box .col-sm-6, .store-stat-box .col-lg-3 {
    padding-left:0px;
}
.main-content.products{
    background-color: #f1f5f903 !important;
    margin-top: 10%!important;
}
.pagination-text{
    padding-bottom: 20px;
}
.pagination{
    padding-bottom: 10px;
}
.margin-top-100[_ngcontent-c3] {
    margin-top: 52px;
    margin-left: 0px;
}


.filter-section.advanced select.order-filter, option {
    width: 250px;
}

.filter-section.advanced select.order-filter option {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.mat-dialog-container{
    width:100%;
}
.mat-dialog-content{
    width:100% !important;
    margin:0px !important;
    padding:0px !important;
}
.font-sm-title{
    font-size: 16px;
}
.img-wrap-quotes{
    margin:0 auto;
}
.rohto-mobile{
    display: block;
}
.rohto{
    display: none;
}
img.rohto-mobile{
    height:41px;
}
.pdt-details1 > table > tbody > tr > td{

    padding:3px;
}
.up-section-pad .col-12{
    padding-left: 0px!important;
    padding-right: 0px!important;
}

}

.cursorNotAllowed{
    cursor: not-allowed !important;
    pointer-events: none !important;
}

.thyrocareTopMargin {
    margin-top: 50px !important;
}
.footer-row{
    margin-left: -26px;
    margin-right: -33px;
    position: fixed;
    bottom: 0px;
    width: 100%;
}

