@font-face {
    font-family: "Google Sans Bold";
    src: url("font/Google_Sans_Bold/Google Sans Bold.eot"); /* IE9*/
    src: url("font/Google_Sans_Bold/Google Sans Bold.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
        url("font/Google_Sans_Bold/Google Sans Bold.woff2") format("woff2"), /* chrome�firefox */
        url("font/Google_Sans_Bold/Google Sans Bold.woff") format("woff"), /* chrome�firefox */
        url("font/Google_Sans_Bold/Google Sans Bold.ttf") format("truetype"), /* chrome�firefox�opera�Safari, Android, iOS 4.2+*/
        url("font/Google_Sans_Bold/Google Sans Bold.svg#Google Sans Bold") format("svg"); /* iOS 4.1- */
}

@font-face {
    font-family: "Google Sans Medium";
    src: url("font/Google_Sans_Medium/Google Sans Medium.eot"); /* IE9*/
    src: url("font/Google_Sans_Medium/Google Sans Medium.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
        url("font/Google_Sans_Medium/Google Sans Medium.woff2") format("woff2"), /* chrome�firefox */
        url("font/Google_Sans_Medium/Google Sans Medium.woff") format("woff"), /* chrome�firefox */
        url("font/Google_Sans_Medium/Google Sans Medium.ttf") format("truetype"), /* chrome�firefox�opera�Safari, Android, iOS 4.2+*/
        url("font/Google_Sans_Medium/Google Sans Medium.svg#Google Sans Medium") format("svg"); /* iOS 4.1- */
}

@font-face {
    font-family: "Google Sans Regular";
    src: url("font/Google_Sans_Regular/Google Sans Regular.eot"); /* IE9*/
    src: url("font/Google_Sans_Regular/Google Sans Regular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
        url("font/Google_Sans_Regular/Google Sans Regular.woff2") format("woff2"), /* chrome�firefox */
        url("font/Google_Sans_Regular/Google Sans Regular.woff") format("woff"), /* chrome�firefox */
        url("font/Google_Sans_Regular/Google Sans Regular.ttf") format("truetype"), /* chrome�firefox�opera�Safari, Android, iOS 4.2+*/
        url("font/Google_Sans_Regular/Google Sans Regular.svg#Google Sans Regular") format("svg"); /* iOS 4.1- */
}

*, body {
    font-family: Google Sans Regular;
    letter-spacing: 0.2px;
    outline: 0;
}

button:focus, .form-control:focus {
    outline: 0;
    background-color: #ebedf0;
}

button:focus, button:hover {
    outline: 0;
    background-color: #ebedf0;
    background-image: none;
}

button.close:focus, button.close:hover {
    outline: 0;
    background-color: transparent;
    background-image: none;
}

button:active {
    border: 1px solid #b1bdc8;
    box-shadow: inset 0 0 4px 0 rgba(39,49,58,.26);
}

/******** Container splid start *******/

.main-container {
    display: block;
    clear: both;
}

.menu-container {
    width: 0px;
    float: left;
    height: 100vh;
    overflow-y: auto;
    background-color: #15202b;
}

.content-container {
    width: calc(100% - 175px);
    float: left;
    background-color: #ffffff;
    height: 100vh;
}

/******** Container splid end *******/


/****** Nav bar start ********/

.menu-container a {
    color: white!important;
}

.nav-logo {
    color: #ffffff;
    text-align: center;
    display: block;
    font-size: 25px;
    padding: 5px 5px;
    border-radius: 10px;
    margin-bottom: 12px;
}

.menu {
    color: #ffffff;
    text-align: center;
    display: block;
    margin-bottom: 12px;
}

.menu-wrapper {
    padding: 10px;
    border-radius: 3px;
    display: inline-block;
    line-height: 0px;
    position: relative;
}

.menu-wrapper:hover, .menu-wrapper:focus {
    /* background-color: #3490e1; */
}

.slide-menu .menu-wrapper img {
    padding-right: 10px;
    width: 24px;
}

.menu svg {
    width: 20px;
    height: 20px;
    opacity: 1;
    padding-right: 10px;
}

.cust-dropdown{
    min-width:27rem;
}

.selected {
    background-color: #2680eb!important;
    color: #ffffff!important;
}

.selected svg {
    opacity: 1;
}

/****** Nav bar end ********/


/******** Toolbars start *******/

.primary-toolbar {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    background-color: #ffffff;
}

.verticle-line {
    color: #e1e1e1;
    padding: 0px 10px;
}

.user-circle {
    width: 32px;
    height: 32px;
    display: inline-block;
    border-radius: 50%;
    text-align: center;
    color: #ffffff;
    background-color: #68c79a;
    border: none;
    font-size: 12px;
    cursor: pointer;
}

.user-note {
    font-size: 12px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.menu-notify {
    left: -310px;
    min-width: 348px;
}

.menu-notify.dropdown-menu {
    padding: 0px;
    box-shadow: 0 2px 18px 0 rgba(18,52,77,.16), 0 2px 4px 0 rgba(18,52,77,.06);
}

.menu-notify .dropdown-header {
    background-color: #f5f7f9;
    padding: 1rem;
    border-bottom: 1px #ebeff3 solid;
}

.menu-logout {
    left: -210px;
    min-width: 248px;
}

.menu-logout.dropdown-menu {
    padding: 0px;
    box-shadow: 0 2px 18px 0 rgba(18,52,77,.16), 0 2px 4px 0 rgba(18,52,77,.06);
}

.menu-logout .dropdown-header {
    background-color: #f5f7f9;
    padding: 1rem;
    border-bottom: 1px #ebeff3 solid;
}

.secondry-toolbar {
    display: flex;
    align-items: center;
    background-color: #fafafa;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    box-shadow: 0 2px 4px 0 rgba(24,50,71,.08);
}

.input-with-icon {
    position: relative;
    width: 100%;
}

.input-with-icon svg {
    position: absolute;
    left: 10px;
    top: 25%;
    width: 15px;
    height: 15px;
    z-index: 9;
}

.input-with-icon input {
    padding-left: 33px;
}

/******** Toolbars end *******/

.full-w-btn {
    width: 100%;
    display: block;
    text-align: left;
    font-size: 14px;
    background-color: transparent;
    border: none;
    padding: 0.5rem 1rem;
    cursor: pointer;
    color: #000;
}

.full-w-btn:hover {
    background-color: #f5f7f9;
}

.f-f-m {
    font-family: Google Sans Medium;
}

.f-s-12 {
    font-size:12px;
}

.zearo-header-input {
    padding: 4px;
    font-size: 12px;
    border: 1px solid #cfd7df;
    border-radius: 3px;
}

.full-width-modal .modal-dialog {
    max-width: 95%;
    width: 95%;
}

.half-width-modal .modal-dialog {
    max-width: 50%;
    width: 50%;
}

.title {
    font-size: 16px;
}

.title-padding {
    padding: 15px;
}

.bg-secondry {
    background-color: #f8f8f8;
}

.color-secondry {
    color: #7f7f7f;
}
.color-secondrys {
    color: #1c1919;
}

label {
    color: #4a4a4a;
    font-family: Google Sans Regular;
    margin-bottom: 0px;
}

.filter-select-box {
    background-color: transparent;
    border: 0px;
    border-bottom:  1px solid #dddddd;
    border-radius: 0px;
}

.form-group:last-child {
    margin-bottom: 0px;
}

.list {
    display: block;
    position: relative;
    border-bottom: 1px solid #dddddd;
    clear: both;
    overflow: hidden;
}

.list:last-child {
    border-bottom: 0px;
}

.list-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.list-avatar, .list-content {
    float: left;
}

.list-content {
    padding-left: 10px;
}

.list-title {
    font-family: Google Sans Regular;
    font-size: 13px;
}

.list-container {
    overflow: hidden;
    display: block;
    clear: both;
    font-size: 14px;
}

.form-control.no-border {
    background-color: transparent;
    border: 0px;
    padding: 0px;
}

.priority {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
}

.expiry-band-danger-popup {
    margin-bottom: 0.5rem;
    display: inline-block;
    overflow: hidden;
    padding: 0.5rem 1.5rem;
    background-color: #ffebeb;
    color: #f26a4b;
    border-radius: 20px;
}

.low {
    background-color: #96e837;
}

.color-primary {
    color: #2680eb;
}

.thumb-container {
    float: left;
    width: 15%;
    margin-right: 2rem;
    position: relative;
}

.thumb-img img {
    width: 100%;
    border-radius: 50%;
}

.thumb-title {
    padding-top: 5px;
    text-align: center;
}

.thumb-remove {
    position: absolute;
    top: 0px;
    right: -5px;
    font-size: 7px;
    background-color: #000000;
    color: #ffffff;
    border-radius: 50px;
    width: 14px;
    height: 14px;
    text-align: center;
    line-height: 12px;
    border: 1px solid #ffffff;
}

.list-content-secondry {
    float: right;
    max-width: 38%;
    text-align: right;
}

.list-content-secondry .list-title {
    font-size: 12px;
}

.calendar-table {
    width: 100%;
}

#containeragain {
    width : 300px;
    height: 300px;
    background-color: black;
}

.shape {
    position: absolute;
    width : 40px;
    height: 40px;
    background-color: white;
}

.form-group .form-control {
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #000000;
    font-size: 13px;
    padding-top: 4px;
    padding-bottom: 4px;
}

.form-group {
    margin-bottom: 0px !important;
}

.list-description {
    font-size: 13px;
}

.autocomplete-input-md-2, .autocomplete-input-md-2 .ui-select-match-text, .autocomplete-input-md-2 .form-control {
    max-width: 223px;
    font-size: 12px;
    min-width: 0px;
}
.autocomplete-input-md-1 .ui-select-dropdown {
    min-width: 100% !important; /* Ensures dropdown matches input width */
    width: 100% !important;
    font-size: 12px;
}
.autocomplete-input-md-1 .ui-select-match-text {
    font-size: 12px !important;  /* Change 14px to your preferred size */
}

.autocomplete-input, .autocomplete-input .ui-select-match-text, .autocomplete-input .form-control {
    max-width: 223px;
    font-size: 12px;
    min-width: 223px;
}

.autocomplete-input .ui-select-match-text {
    padding: 0px;
    max-width: 100%;
    min-width: 100%;
}

.ui-select-bootstrap .ui-select-choices-row>span {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 13px;
}

.zearo-form-input {
    border: 1px solid #f2f2f2;
    border-radius: 0px;
    width: 100%;
}
.form-control.zearo-form-input {
    margin-bottom: 20px;
}

.secondry-btn {
    font-size: 11px;
}

.dashboard-today .secondry-btn, .dashboard-time .secondry-btn  {
    padding: 5px 5px;
    font-size: 11px;
}

.secondry-btn, .secondry-select, .primary-btn {
    background-color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 3px;
    font-size: 12px;
    padding: 5px 7px;
    cursor: pointer;
    -webkit-font-smoothing: antialiased;
    transition: .1s ease-in;
    background-image: linear-gradient(to bottom,#fff,#f3f5f7);
}

.primary-btn {
    background-color: #2680eb;
    color: #ffffff;
    border: none;
}

.expiry-band svg, .expiry-band-danger svg {
    width: 13px;
    height: 13px;
    vertical-align: text-top;
}

.expiry-band, .expiry-band-danger {
    padding: 1px 10px;
    border-radius: 20px;
    font-size: 11px;
    margin: 0px 10px;
}

.expiry-band {
    background-color: #fff4e9;
    color: #ff9f42;
    border:  1px solid #ff9229;
}

.expiry-band-danger {
    background-color: #ffebeb;
    color: #f26a4b;
    border:  1px solid #f15632;
}

.shortcut {
    font-size: 10px;
    opacity: 0.7;
}

.shortcut-opacity {
    opacity: 0.7;
}

.icon-btn {
    border: 0;
    margin: 0px 10px;
    padding: 0;
    cursor: pointer;
    background-color: transparent;
    position: relative;
}

.icon-btn svg {
    width: 22px;
    height: 22px;
    vertical-align: middle;
    fill: #15202b;
}

.curve-btn {
    border-radius: 25px;
}

.curve-btn-focus {
    /* outline: 0;
    background-color: #ebedf0;
    background-image: none; */
    -moz-box-shadow:   inset 0px 0px 10px rgba(0,0,0,0.4);
    -webkit-box-shadow: inset 0px 0px 10px rgba(0,0,0,0.4);
    box-shadow: inset 0px 0px 10px rgba(0,0,0,0.4);
}

.zearo-form-input1 .btn-group .dropdown-toggle{
    background: transparent;
    text-align: left;
    font-size: 12px;
}

.zearo-form-input1 .caret {
    right: 20px !important;
    float: right;
    margin-top: 10px;
}

/* Toggle Switch */
.toggle-switch {
    position: relative;
    display: inline-block;
    width: 34px;
    height: 20px;
}

.toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: 0.4s;
    border-radius: 24px;
}

.slider:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 14px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.4s;
    border-radius: 50%;
}

input:checked + .slider {
    background-color: #2196F3;
}

input:checked + .slider:before {
    transform: translateX(14px);
}


.tool-icon svg, .normal-tool-icon svg, .secondry-btn svg {
    width: 13px;
    height: 13px;
    vertical-align: middle;
}

.normal-tool-icon {
    vertical-align: text-bottom;
}

.tool-icon.tool-icon-mr {
    min-width: 270px;
    float: none;
}

.tool-icon.tool-icon-mr svg {
    width: 16px;
    height: 16px;
    vertical-align: middle;
}

.secondry-btn svg {
    margin-right: 3px;
}

.verticle-center-padding {
    padding-top: .375rem;
    padding-bottom: .375rem;
}

.zearo-table, .zearo-table-pop, .zearo-dashboard-table, .zearo-order-table {
    width: 100%;
}

.zearo-table thead tr, .zearo-table-secondary thead tr {
    display: flex;
}

.zearo-table thead, .zearo-table-secondary thead {
    position: fixed;
    left: 190px;
    right: 20px;
    z-index: 99;
    background-color: #f2f2f2 !important;
}

.zearo-table thead {
    height: 47px;
    border-top: 15px solid #ffffff;
}

.zearo-table-secondary thead {
    height: 30px;
}

.zearo-common-table thead {
    position: sticky;
    top: 0;
    z-index: 99;
    background-color: #f2f2f2 !important;
}

.zearo-table thead th, .zearo-common-table thead th{
    padding: 0.6em;
    font-size: 11px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;
    background-color: #f2f2f2 !important;
}
.zearo-table-secondary thead th {
    padding: 0.6em;
    font-size: 11px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    /*    border-bottom: 1px solid #e2e2e2;*/
    background-color: #f2f2f2 !important;
}

.zearo-table tbody:before, .zearo-table-secondary tbody:before {
    content: "";
    display: block;
}

.zearo-table tbody:before {
    height: 47px;
}

.zearo-table-secondary tbody:before {
    height: 30px;
}

.zearo-table-pop thead {
    left: 79px;
    right: 20px;
    z-index: 99;
    /*border-top: 15px solid #ffffff;*/
    background-color: #f2f2f2 !important;
}


.zearo-table-pop thead th {
    padding: 0.6em;
    font-size: 11px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;
    background-color: #f2f2f2 !important;
}

.zearo-table-pop tbody:before {

}
.zearo-table-pop tbody td, .zearo-dashboard-table tbody td {
    padding: 0.8em;
    background-color: #ffffff;
    border-bottom: 1px solid #e2e2e2;
    font-size: 12px;
}


.zearo-dashboard-table thead th, .zearo-dashboard-table tbody td.tfoot {
    background-color: #ffffff;
    padding: 0.8em;
    font-size: 13px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;
}

.zearo-order-table thead th, .zearo-order-table tbody td.tfoot {
    background-color: #f2f2f2;
    padding: 0.5em;
    font-size: 13px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;
}

.form-cntrl1, .form-cntrl1 .btn {
    padding: 3px 10px !important;
    font-size: 12px !important;
}

.zearo-common-table tbody td {
    padding: 0.6em;
}

.zearo-table tbody td, .zearo-table-pop tbody td, .zearo-dashboard-table tbody td {
    padding: 0.5em;
}

.zearo-table tbody td, .zearo-table-pop tbody td, .zearo-common-table tbody td, .zearo-dashboard-table tbody td {
    background-color: #ffffff;
    border-bottom: 1px solid #e2e2e2;
    font-size: 11px;
}

/* .zearo-table-sub thead {
    position: fixed;
    height: 54px;
    left: 458px;
    right: 20px;
    z-index: 99;
    width:65%;
}
.zearo-table-sub thead th {
    padding: 0.8em;
    font-size: 13px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;    
}

.zearo-table-sub tbody td {
    padding: 0.8em;
    background-color: #ffffff;
    border-bottom: 1px solid #e2e2e2;
    font-size: 12px;
} */

.zearo-table-sub thead th {
    padding: 0.7em;
    font-size: 11px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;
    background-color: #f2f2f2 !important;
}

.zearo-table-sub tbody td {
    padding: 0.8em;
    background-color: #ffffff;
    border-bottom: 1px solid #e2e2e2;
    font-size: 12px;
}

/*.zearo-table-set thead th {
    padding: 0.7em;
    font-size: 11px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;
    background-color: #f2f2f2 !important;
}

.zearo-table-set tbody td {
    padding: 0.8em;
    background-color: #ffffff;
    border-bottom: 1px solid #e2e2e2;
    font-size: 12px;
}*/
.table-container1 {
    position: relative;
    width: 100%;
}

.table-header {
    overflow: hidden;
    width: 100%;
    top: 0;
    z-index: 1;
    background-color: #f2f2f2; /* Ensure the header has a background to cover body rows */
}

.table-body {
    max-height: 425px; /* Adjust the height as needed */
    overflow-y: auto;
    width: 100%;
}

.table-header table, .table-body table {
    width: 100%;
    table-layout: fixed;
    margin: 0;
    border-collapse: collapse; /* Ensure there is no gap between the header and the body */
}


/* Existing styles */
.zearo-table-set thead th {
    padding: 0.7em;
    font-size: 11px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;
    background-color: #f2f2f2 !important;
}

.zearo-table-set tbody td {
    padding: 0.8em;
    background-color: #ffffff;
    border-bottom: 1px solid #e2e2e2;
    font-size: 11px;
}
.table-header th, .table-body td {
    width: 10%;

}

.card> .zearo-dashboard-table thead th {
    background-color: #ffffff;
    padding-top: 0px;
    padding-bottom: 0px;
}

.grid-photo {
    width: 30px;
    height: auto;
    max-height: 30px;
    border-radius: 50%;
    vertical-align: middle;
}

.btn-group {
    /*border: 1px solid rgba(0, 0, 0, 0.1);*/
    border-radius: 3px;
    font-size: 12px;
    background: transparent;
}

.btn-group .save-btn:first-child {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.btn-group .save-btn:nth-child(2) {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.shortcut-highlight {
    text-decoration: underline;
    color: #f27358;
}

.shortcut-highlight1 {
    text-decoration: underline;
}

.qsale-logo {
    width: 15%;
    margin-top:2%;
}

.btn-log-reg {
    color: #ffffff;
    background-color: #ff5722;
    border: 0;
    margin: 0;
    padding: 5px 25px;
    border-radius: 100px;
}

/* -----------------------------------------------------------------*/
.forgot-pass {
    color: #000000;
}

.forgot-pass:hover {
    text-decoration: underline;
}

.card {
    background-color: #ffffff;
    display: block;
    width: 100%;
    text-align: left;
    align-items: start;
    flex-direction: unset;
}

.card-header {
    font-family: Google Sans Medium;
    border: none;
    background-color: inherit;
    font-size: 13px !important;
    padding-left: 0.8em;
    padding-right: 0.8em;
    display: block;
}

.card-sub-header {
    color: #2680eb;
    float: right;
    font-family: Google Sans Bold;
    font-size: 13px !important;
}

.report-title {
    font-size: 14px;
}

.report-subtitle {
    color: rgba(0,0,0,.54);
    display: block;
}

.ui-select-choices.dropdown-menu, .dropdown.open .dropdown-menu {
    /*display: inherit; */
}

.dropdown-toggle::after {
    display: none;
}

.logout-photo {
    width: 50px;
    height: auto;
    max-height: 50px;
    border-radius: 50%;
    vertical-align: middle;
}

.input-date {
    padding-left: 5px !important;
    padding-right: 5px !important;
    flex: inherit !important;
    width: 37% !important;
}

.uib-time input {
    font-size: 1rem !important;
    background: transparent;
    border: 0px;
}

.card-refresh {
    text-align: right;
    cursor: pointer;
}

.nav-logo img {
    width: 80%;
}

.submit-report {
    color: #ffffff;
    background-color: #2680eb;
    border: 0;
    margin-top: 10px;
    padding: 5px 30px;
    border-radius: 100px;
    cursor: pointer;
    font-size: 14px;
}

.submit-report:hover {
    color: #ffffff;
    background-color: #2680eb;
}

.submit-barcode-print {
    color: #ffffff;
    background-color: #2680eb;
    border: 0;
    margin-top: 10px;
    padding: 5px 30px;
    border-radius: 100px;
    cursor: pointer;
}

.cancel-barcode-print {
    border: 1px solid #b7b7b7;
    margin-top: 10px;
    padding: 5px 30px;
    border-radius: 100px;
    cursor: pointer;
}

.login-form-div {
    margin: 1.5em auto 10px auto;
    padding: 0px 1rem;
}

.breadcrumb-txt {
    font-size: 14px;
    font-family: Google Sans Medium;
    cursor: pointer;
}

.breadcrumb-txt a {
    color: inherit !important;
    font-size: 14px;
    font-family: Google Sans Medium;
}

.breadcrumb-txt i {
    font-weight: bold!important;
}

.highlight-row:hover td {
    cursor: pointer;
    background-color: #f8f8f8;
}
.highlight-rows {
    cursor: pointer;
    background-color: #2680eb!important;
    color: #fff;
}

.selected-row td {
    cursor: pointer;
    background-color: #2680eb!important;
    color: #fff;
}

.custbg-color td {
    cursor: pointer;
    background-color: #f6fafe !important;
}

.wht-bg{
    background: #fff;
    cursor: pointer;

}

.product-left-bar button:focus, .product-left-bar button:hover {
    background-color: transparent;
}

.product-left-bar .sub-tab-title{
    font-family: Google Sans Medium;
}

.btn-save {
    background-color: #4caf50 !important;
    border: 0px !important;
    color: white!important;
    padding: 4px 7px;
    border-radius: 3px;
    font-size: 12px!important;
    cursor: pointer;
}

.modal-backdrop.fade {
    opacity: 0.5;
}

.left-navbar {
    font-size: 14px;
    position: fixed;
    font-family: Google Sans Medium;
    max-width: inherit;
    padding-right: 10px !important;
    cursor: pointer;
}

.left-navbar .selected {
    background-color: white;
    color: #2680eb;
}

.left-navbar .nav-title {
    font-family: Google Sans Medium !important;
}

button:disabled {
    color: #dadfe3;
    background-color: #f3f5f7;
    cursor: no-drop;
    background-image: none;
}

.loader {
    width: 20px;
}

.left-navbar>.sub-tab-title i {
    display: none;
}

.left-navbar>.selected i {
    display: inherit;
}

.sub-tab-detail.selectedtab {
    display: inherit;
}

.sub-tab-detail {
    background-color: white;
    padding-top: 15px;
    padding-bottom: 1em;
    padding-left: 0;
    padding-right: 0;
    display: none;
}

.sub-tab-detail>.list, .sub-tab-detail>.grid {
    display: inherit !important;
}

.caret {
    display: inline-block;
    width: 0;
    vertical-align: middle;
    border-top: 4px dashed;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

.modal.radius-10 .modal-content {
    border: 0px;
    border-radius: 10px;
}

.modal::before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px;
}

.modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
}

.modal {
    text-align: center;
    padding: 0!important;
}

.err-msg {
    color: red;
}

.icon-v-center {
    vertical-align: text-top;
}

.dashboard-datetime {
    -webkit-appearance: media-slider !important;
    background-color: transparent;
}

.tooltip{
    max-width: 700px !important;
    min-width: 50px;
    background-color: rgba(0,0,0,0.8);
    border-radius:5px;
    position: absolute;
    z-index: 100000000;
    border:1px solid #ececec;
    font-size: 12px;
}

.tooltip-content {
    color: #ffffff;
    padding: 3px 7px;
    font-size: 12px;
}

.popover {
    max-width: 300px!important;
    white-space: nowrap;
    min-width: 100px;
    text-align: center;
}

.popover {
    background-color: rgba(0,0,0,0.8);
}

.popover-content {
    color: #ffffff;
    padding: 3px 7px;
    font-size: 12px;
}

.popover.top {
    margin: 0;
}

.popover.bottom {
    margin: 0;
}

.popover>.arrow {
    display: none;
}

.report-params label, label {
    font-size: 11px;
}

.page-loader-container {
    top: 40%;
    left: 45%;
    z-index: 99999;
    position: fixed;
    text-align: center;
}

.page-loader {
    background-color: #ffffff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin: 0px auto;
    -webkit-box-shadow: 2px 1px 5px 1px rgba(0,0,0,0.25);
    -moz-box-shadow: 2px 1px 5px 1px rgba(0,0,0,0.25);
    box-shadow: 2px 1px 5px 1px rgba(0,0,0,0.25);
    z-index: 99999;
}

.page-loader svg {
    width: 30px;
    height: 30px;
    -webkit-transform: translateY(30%);
    -ms-transform: translateY(30%);
    transform: translateY(30%);
}

.please-wait {
    font-size: 14px;
    margin-top: 15px;
    font-family: Google Sans Medium;
}

.save-btn {
    background-color: #4caf50!important;
    color: #ffffff;
    background-image: none;
}

.draft-btn {
    background-color: #ff6c2c!important;
    color: #ffffff;
    background-image: none;
}
.gn-btn {

    color: #ffffff;
    background-color: #4caf50!important;
    color: #ffffff;
    background-image: none;
    background-image: none;
}


/******* Scroll bar *******/

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3)!important;
    border-radius: 10px!important;
    background-color: #F5F5F5!important;
}

::-webkit-scrollbar {
    width: 6px!important;
    height: 6px!important;
    background-color: #F5F5F5!important;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px!important;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3)!important;
}

::-webkit-scrollbar-thumb {
    background-color: #15202b;
}

.color-orangered {
    color:orangered;
}

.circle {
    height: 25px;
    width: 25px;
    background-color: white;
    border-radius: 50%;
    display: inline-block;
}

.prd_image {
    height: 50px;
    width: 50px;
    background-color: white;
    border-radius: 50%;
    display: inline-block;
}

.address {
    background-color: #e9ecef;
    padding: 1em;

}

.disable-txt {
    padding-left: 1em;
    padding-top: 0.3em;
    padding-bottom: 0.4em;
    background-color: #e9ecef;
}

.dashboard-time {
    padding-top: 2px!important;
}

.dashboard-today {
    padding-top: 0px;
}

.dashboard-refresh-btn {
    text-align: right;
}

.cb-active {
    text-align: center;
}

.color-green {
    color:#4caf50;
}

.color-violet {
    color:#2680eb;
}

.blue-clr-with-border {
    color: #247fea;
    border-color:#247fea;
    background:transparent;
    padding: 5px 15px;
    margin: 0px 5px;
}

.align-center {
    text-align: center !important;
}

.cust-table-padding td{
    padding: 10px 0px !important;
    font-size:13px;
}

.color-gray{
    color:#a4a4a4;
    font-size: 11px;
}

.botm-brd-table td{
    border-bottom:1px solid #a4a4a4 !important;
}

.bg-gray{
    background:#f8f8f8;
}

.cust-padding-maincard{
    padding:0px 5px;
}

.cust-btn{
    width:15%;
    height:30px;
}

.curser-pointer {
    cursor: pointer;
}

tr.selected-rowtd td{
    background: #fffeec !important;
}

.zearo-table tbody td:first-child, .zearo-common-table tbody td:first-child {
    border-left: 1px solid #e2e2e2;
}

.zearo-table tbody td:last-child, .zearo-common-table tbody td:last-child {
    border-right: 1px solid #e2e2e2;
}

.product-left-bar{
    background-color: #f2f4f5;
    position: fixed;
    z-index: 1000;
    height: 100vh;
}

.product-right-bar{
    margin-left: 15%;
    max-width: 84%;
}

.product-right-bar .sub-tab-detail{
    /*padding-left:10px;*/
}

.getstarted-left-bar{
    background-color: #ffffff;
    margin: 10px 0 10px 10px;
    padding: 20px 10px !important;
    position: fixed;
    z-index: 1000;
    height: calc(100vh - 121px);
    max-width: 250px;
}

.getstarted-left-bar ul{
    padding-left: 5px;
    width: 100%;
}

.getstarted-left-bar li{
    background-color: #f2f4f5;
    list-style: none;
    margin:10px 0;
    padding:10px;
    border-radius:5px;
    cursor: pointer;
}

.getstarted-left-bar li a{
    color:#212529;
}

.getstarted-left-bar li.active{
    background: #e4f3e5;
}

.getstarted-left-bar li:hover{
    background: #e4f3e5;
}

.gs-submenu{
    display:none;
    background-color: #f2f4f5;
}

.gs-submenu li:hover{
    background: #2680eb;
    color:#fff;
}

.getstarted-left-bar li:hover ul.gs-submenu{
    display:block;
    transition: 0.3s;
    background-color: #f2f4f5;
    padding:0px;
    margin:0px;

}

.getstarted-right-bar{
    background-color: #ffffff;
    margin: 10px 0px 0px;
    padding: 19px !important;
    margin-left: 21%;
    max-width: 79%;
}

.order-status-all{
    margin: 0px 10px;
    padding: 5px 15px;
    background:#ffffff;
}

button.order-status-all:active, button.order-status-all:focus, button.order-status-all:hover{
    border: 1px solid #247fea;
    background-color: #247fea;
    color: #fff;
}

.order-status-btns{
    float: left;
    margin: 0px 3px;
    background: #FFFFFF;
}

button.order-status-btns:active, button.order-status-btns:focus, button.order-status-btns:hover{
    border: 1px solid #247fea;
    background-color: #247fea;
    color: #fff;
}

.active-order-btns{
    border: 1px solid #247fea;
    background-color: #247fea;
    color: #fff;
}

.cust-select{
    background: transparent;
    border: 0px;
    font-weight: bold;
    font-size: 13px;
    padding: 0 15px;
}

.cust-select-1{
    background: #dde0ff;
    border: 0px;
    font-size: 13px;
    padding: 5px 15px;
    color: #6a63d7;
    border-radius: 25px;
}

.tooltip-address{
    color: #494bf6!important;
    background:transparent;
    padding: 0px;
    font-size: 13px;
}

.dropdown-menu.shipping-address {
    padding: 15px;
    width: 170px;
    min-width: 170px;
    background: #f2f2f2;
}

.no-padding-b{
    padding-bottom:0px;
}

.open>.dropdown-menu {
    display: block;
}

.order-status {
    min-height: 70px;
    text-align: left;
    clear: both;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
    padding-bottom: 20px;
}
.status-bar:last-child {
    border-bottom: 0px;
}

.shipping-address li{
    font-size: 11px;
}

.zearo-order-table tr td{
    font-size: 13px;
    border-bottom: 1px solid #f2f2f2;
    padding: 5px 0px;
}

.zearo-order-table tr td:first-child{
    border-left: 1px solid #f2f2f2;
}

.zearo-order-table tr td:last-child{
    border-right: 1px solid #f2f2f2;
}

.status-bar {
    width: 160px;
    height: 15px;
    border-bottom: 5px solid #c6c5c2;
    position: relative;
    display: inline-block;
    margin-top: 50px;
}

.status-bar:first-child{
    margin-left:10px;
}

.status-bar span {
    position: absolute;
    left: 0px;
    top: -50px;
    font-size: 10px;
    text-align: left;
    font-weight: bold;
}

.status-bar span label {
    font-size: 10px;
    font-weight: normal;
}

.status-bar::after {
    content: "";
    width: 15px;
    display: block;
    overflow: hidden;
    height: 15px;
    background-color:  #c6c5c2;
    border-radius: 50%;
    position: absolute;
    top: 35%;
    left: -1px;
}

/* .filled::after {
    background-color: #f26c4f;
} */
.zea-table {
    table-layout: fixed;
    width: 100%;
}

.zea-table thead {
    display: table;
    width: calc(100% - 17px); /* Adjust according to your scrollbar width */
    table-layout: fixed;
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: #fff;
}

.zea-table tbody {
    display: block;
    overflow-y: auto;
    height: 100%; /* Adjust the height as needed */
}

.zea-table tbody tr {
    width: 100%;
    display: table;
    table-layout: fixed;
}

.zea-table td, .zea-table th {
    padding: 8px 15px;
    text-align: left;
    vertical-align: middle;
}

.filled::after {
    color: rgb(255, 255, 255);
    line-height: 15px;
    font-size: 10px;
    background-color: rgb(242, 108, 79) !important;
    content: "✓" !important;
    text-align: center;
}

.crossed {
    border-color: #f26c4f;
}

.filter-mobile {
    background-color: #f6f6f6;
    padding: 10px 15px;
    margin-bottom: 20px;
}

.order-status-mobile {
    display: block;
    text-align: center;
    clear: both;
    min-height: 30px;
    text-align: center;
    clear: both;
    margin: 0 auto;
    position: relative;
}

.status-bar-mobile.crossed {
    border-left: 5px solid #f26c4f !important;
}

.status-bar-mobile {
    width: 15px;
    height: 80px;
    border-left: 5px solid #c6c5c2;
    position: relative;
}

.status-bar-mobile:last-child {
    height: 0px!important;
}

.status-bar-mobile::after {
    content: "";
    width: 15px;
    display: block;
    overflow: hidden;
    height: 15px;
    background-color: #c6c5c2;
    border-radius: 50%;
    position: absolute;
    top: 0px;
    right: 5px;
}

.status-bar-mobile span {
    position: absolute;
    left: 50px;
    top: 0px;
    font-size: 12px;
    width: 150px;
    text-align: left;
}

.slideGLEditor{
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 10000;
    top: 0;
    right: 0;
    background-color: #ffffff;
    transition: 0.5s;
}

.openfilter{
    height: 100%;
    width: 25%;
    position: fixed;
    z-index: 10000;
    top: 0;
    right: 0;
    background-color: #ffffff;
    transition: 0.5s;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 10000;
    top: 0;
    left: 0;
    background-color: #15202b;
    transition: 0.5s;
    padding-top: 5px;
}

.sidenav a {
    text-decoration: none;
    font-size: 15px;
    color: #818181;
    display: block;
    transition: 0.3s;
}

.sidenav a:hover {
    color: #f1f1f1;
}

.sidenav .closebtn {
    position: absolute;
    top: 2px;
    left: 120px;
    font-size: 22px;
}

.main-container {
    display: block;
    clear: both;
}

.slide-menu-container {
    width: 100%;
    float: left;
    height: calc(100vh - 158px);
    overflow-y: auto;
    background-color: #15202b;
}

.support-detail-section {
    height: 80px;
    overflow: hidden;
    display: block;
    width: 100%;
    color: #ffffff;
    padding: 5px 10px 0px 10px;
    background-color: #323E4A;
}

.contact-detail img, .contact-detail svg {
    vertical-align: middle;
}

.contact-detail img {
    width: 14px;
}

.contact-detail a {
    font-size: 12px;
    color: #ffffff;
}

.contact-detail {
    display: flex;
    align-items: center;
    justify-content: start;
}

.slide-menu-container a {
    color: white !important;
    margin: 2px 12px;
}

.slide-menu-container a:first-child{
    margin: 0;
}

.slide-nav-logo {
    color: #ffffff;
    text-align: left;
    display: block;
    font-size: 25px;
    padding: 5px 5px;
    margin-bottom: 0px;
    /* background: #363e45; */
}

.slide-nav-logo img{
    width: 60%;
    padding-right: 10px;
    min-width: 60px;
}

.slide-nav-logo p{
    font-size: 20px;
    margin-bottom: 0px;
    padding-top: 15px;
    line-height: 24px;

}

.slide-nav-logo small{
    font-size: 11px;
    vertical-align: super;
}

.slide-menu {
    color: #ffffff;
    text-align: left;
    display: block;
    margin-bottom: 12px;
}

.slide-menu .menu-wrapper {
    padding: 5px 10px;
    border-radius: 3px;
    display: inline-block;
    line-height: 0px;
    width: 100%;
}

.slide-menu label{
    color:#fff;
    padding: 10px 0px;
    font-size: 11px;
    cursor: pointer;
}

.slide-menu:hover, .slide-menu:focus {
    background-color: #3490e1;
    border-radius: 5px;
}

.slide-menu svg {
    width: 24px;
    opacity: 1 !important;
    vertical-align: text-bottom;
}

.slide-menu .selected {
    background-color: #2680eb!important;
    border-radius: 5px;
    width:100%;
}

.slide-menu .selected svg {
    opacity: 1;
}

.mstr-menu{
    cursor: pointer;
}

.mstr-menu:visited ul.sub-mnus {
    display:block !important;
    margin-left: 20px;
    transition: 0.5s;
}

.sub-mnus{
    display:none;
}

.slide-menu-container ul {
    margin: 0px;
    padding: 0px 5px 0 5px;

}

.slide-menu-lis li {
    margin: 8px 0px;
}

ul.sub-mnus li {
    margin: 5px 5px 5px 5px;
}

ul.sub-mnus1 li {
    margin-left:10px;
}

.p-t-20 {
    padding-top: 20px;
}

.p-b-20 {
    padding-bottom: 20px;
}

.p-b-10 {
    padding-bottom:10px;
}

.m-t-20 {
    margin-top: 20px;
}

.green-bckgrd, .green-bckgrd:hover{
    background: #2780EA !important;
    color: #fff !important;
    font-weight: normal !important;
    padding: 5px 30px !important;
}

.red-bckgrd, .red-bckgrd:hover{
    background: #FF5C5D !important;
    color: #fff !important;
    font-weight: normal !important;
    padding: 5px 30px !important;
}

.no-records-found {
    display: block;
}

.no-records-found-data{
    color: #a3a3a3;
    text-align: center;
    vertical-align: middle;
    line-height: 430px;
}

.no-records-found-data1{
    text-align: center;
    vertical-align: middle;
    line-height: 400px;
}

.no-records-found-data1 img{
    width:80%;
}

.modal-content {
    border-radius: 5px !important;
}

.modal-content {
    border:0px !important;
    font-size: 12px;
}
/*.modal-contents {
    width: 600px;
    height:350px;
}*/

/*.modal-body {
    padding: 15px 5px 0px !important;
}*/

.modal-sm{
    width: 30% !important;
}

.modal-footer{
    border-top:0px;
    margin-top: 20px;
}

.modal-footer .cancel{
    border: 1px solid #b7b7b7;
    cursor: pointer;
    color:#010101;
    background:transparent;
    padding: 5px 25px;
}

.modal-footer .ok{
    border: 1px solid #2580eb;
    cursor: pointer;
    color:#ffffff;
    background:#2580eb;
    padding: 5px 40px;
}

.modal-footer {
    justify-content: center;
    margin-top: 10px;
}

.p-0{
    padding:0px;
}

.cust-toast{
    position: absolute;
}

.gl-sub-head{
    padding: 20px 0 20px 10px;
}

.gl-sub-head label{
    margin-top:10px;
    font-size:12px;
}

.gl-sub-head .complete-btn{
    background:#4caf50;
    color:#fff;
    padding:5px 10px;
}

.gl-sub-head .draft-btn{
    background:#ff6c2c;
    color:#fff;
    padding:5px 10px;
}

.gl-more-icons{
    background-color: inherit;
    border: 0px;
    background-repeat: no-repeat;
    vertical-align: middle;
}

.sec-rht{
    padding-left:0px;
}

.sec-lft{
    float: left;
    padding-left: 0px;
}

.clr{
    clear:both;
}

.transparent-btn{
    background: transparent;
    border:1px solid #b7b7b7;
    border-radius: 5px;
    color: #000000;
    padding: 5px 20px;
    font-size: 12px;

}

.transparent-btn1{
    background: transparent;
    border:1px solid #b7b7b7;
    border-radius: 3px;
    color: #000000;
    padding: 4px 7px;
    font-size: 12px;

}
.table-container {
    overflow-y: auto;
}

.scrollable-body {
    display: block; /* Enable block-level display for the tbody */
}

.blue-btn{
    background: #2680eb;
    color: #ffffff;
    border-radius: 5px;
    padding: 5px 10px;
    font-size: 12px;

}

.blue-btn1{
    background: #2680eb;
    color: #ffffff;
    border-radius: 5px;
    padding: 5px 10px;
    font-size: 12px;

}

.red-btn{
    background: #f24f4f;
    color: #ffffff;
    border-radius: 5px;
    padding: 5px 10px;
    font-size: 12px;
}
.add-btn{        
    border-radius: 5px;
    padding: 5px 10px;
    font-size: 12px;
    border-color: grey;
}
.m-r-10{
    margin-right:10px;
}

.m-r-5{
    margin-right:5px;
}

.cust-dropdown-menu{
    padding-left: 7px;
    font-family: google sans medium;
    font-size: 12px;
}

.hgt-26{
    height: 26px;
}

.del-code{
    color: red;
    padding-top: 25px;
    font-size: 14px;
    padding-bottom: 0px;
    margin-bottom: 0px;
    font-family: Google Sans medium;
}

.wo-filter {
    position: absolute;
    width: calc(64% - 45px);
    top: 20px;
    right: 32%;
    background-color: rgba(255,255,255,0.9);
    padding: 12px 5px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4pt 8pt;
    -moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 4pt 8pt;
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 4pt 8pt;
    border-radius: 3px;
}

.wo-filter-select {
    width: 27%;
    background-color: transparent;
}

.wo-filter-select button, .full-width-dropdown button {
    width: 100%!important;
    position: relative;
    text-align: left;
}

.wo-filter-select button {
    border: none;
    background-color: transparent;
}

.full-width-dropdown {
    width: 100%;
}

.wo-filter-select button .caret, .full-width-dropdown button .caret {
    position: absolute;
    right: 0px;
    top: 45%;
}

.full-width-dropdown button .caret {
    right: 15px;
}

.wo-filter-select button:hover, .wo-filter-select button:active, .wo-filter-select button:focus, .wo-filter-select button:after, .wo-filter-select button:before {
    background-color: transparent!important;
    box-shadow: none!important;
}

.full-width-textarea {
    width: 100%;
    border-radius: 5px;
    padding: 5px;
}

/*.dropdown-menu>.active>a, */.dropdown-menu>.active>a:hover, .ui-select-bootstrap .ui-select-choices-row.active>span {
    background-color: #15202b;
    color: #ffffff;
    font-weight: normal;
}

.dropdown-menu .glyphicon {
    display: none;
}

.uib-daypicker .glyphicon, .uib-timepicker .glyphicon {
    display: block!important;
}

.uib-typeahead-match.active {
    background-color: #e2e2e2;
}

.dropdown-menu {
    max-height: 350px;
    overflow-y: auto;
}

.location-search-container .icon {
    position: absolute;
    left: 10px;
    top: 25%;
}

.location-search-container input {
    border: 1px solid #e8e8e8;
    padding: 15px 15px 15px 40px;
    width: 100%;
}

.location-search-container {
    position: relative;
}

.fnt-s-14 {
    font-size: 14px;
}

.fnt-s-12 {
    font-size: 12px;
}

.dropdown-menu-form li{
    padding-left:20px;
}

.dropdown-menu-form li a{
    color:#333;
    font-size:14px;
}

.zearo-form-input1 {
    border-radius: 0px;
    width: 100%;
}

.dropdown-header {
    padding:0;
    padding-right: 20px;
    font-size: 14px;
}

.zearo-form-input1 .caret {
    right: 20px !important;
}

.multiselect-parent {
    width: 100%;
}

.multiselect-parent .dropdown-toggle {
    width: 100%;
}

.multiselect-parent .dropdown-menu {
    width: 100%;
}

.multiselect-parent > div {
    width: 100%;
}

.pop-container{
    width:350px;
    background: #fff;
    box-shadow: 1px 1px 10px #ccc;
    border-radius:5px;
    position:fixed;
    z-index:100;
    right:20px;
    top:50px;
}

.pop-header{
    background:url('../img/icons/pop-bg-yellow.png');
    background-repeat: no-repeat;
    border: 0px;
    padding-bottom: 0px;
}

.pop-hdr-round-img{
    background: #fff;
    border-radius: 50%;
    box-shadow: 1px 1px 5px #ccc;
    width: 70px;
    height: 70px;
    text-align: center;
    margin-top: 30px;
    margin-left: 35%;
}

.pop-hdr-round-img img{
    width: 50%;
    padding-top: 16px;
}

.pop-header .close:hover{
    background:transparent;
}

.pop-body-content{
    padding:20px !important;
}

.pop-body-content p{
    font-family: Google Sans regular;
    font-size: 14px;
}

.pop-body-content p.title{
    font-family: Google Sans Medium;
    font-size: 14px;
}

.pop-body-content p img{
    padding-right: 10px;
    width:30px;
    height:auto;
}

.pop-paid{
    background: #6aa821;
    color: #fff;
    padding: 3px 10px;
    border-radius:5px;
}

.acct-btn{
    background: #4cb050;
    color:#fff;
    font-family: Google Sans regular;
    margin-right:10px;
    border-radius:25px;
    font-size:14px;
}

.acct-btn:hover{
    background: #4cb050;
    color:#fff;
}

.rjct-btn:hover{
    background: #f34f50;
    color:#fff;
}

.rjct-btn{
    background: #f34f50;
    color:#fff;
    font-family: Google Sans regular;
    border-radius:25px;
    font-size:14px;
}

.pop-body-content a{
    font-family: Google Sans regular;
    font-size:14px;
}

.banktransec{
    padding:0 10px;
}

.p-10{
    padding:10px;
}

.m-b-100{
    margin-bottom: 100px;
}

.m-l-25{
    margin-left: 25px;
}

.m-l-15{
    margin-left: 15px;
}

.p-l-10px{
    padding-left: 10px;
}

.files1 input {
    border: 0px dashed #e9ecef !important;
    -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
    transition: outline-offset .15s ease-in-out, background-color .15s linear;
    padding: 0;
    text-align: center !important;
    margin: 0;
    width: 100% !important;
    color: #fff;
    font-size: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100px;
    background: #f1f3f4;
}

.files1 input:focus{
    outline: 2px dashed #92b0b3;
    outline-offset: -10px;
    -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
    transition: outline-offset .15s ease-in-out, background-color .15s linear;
    border:1px solid #92b0b3;
}

.files1{
    position:relative
}

.files1:after {
    pointer-events: none;
    position: absolute;
    top: 30px;
    left: 50%;
    width: 25px;
    right: 0;
    height: 23px;
    content: "";
    background-image: url(../img/upload-icon.jpg);
    display: block;
    /* margin: 0 auto; */
    background-size: 100%;
    background-repeat: no-repeat;
}

.files1:before {
    position: absolute;
    bottom: 10px;
    left: 0;
    pointer-events: none;
    width: 100%;
    right: 0;
    height: 30px;
    content: "Upload a file or drag and drop the file";
    display: block;
    margin: 0 auto;
    color: #000000;
    font-family: Google Sans Medium;
    /* text-transform: capitalize; */
    text-align: center;
}

.files input {
    border: 2px dashed #e9ecef !important;
    -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
    transition: outline-offset .15s ease-in-out, background-color .15s linear;
    padding: 0;
    text-align: center !important;
    margin: 0;
    width: 100% !important;
    color: #fff;
    font-size: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100px;
}

.files input:focus{
    outline: 2px dashed #92b0b3;
    outline-offset: -10px;
    -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
    transition: outline-offset .15s ease-in-out, background-color .15s linear;
    border:1px solid #92b0b3;
}

.files{
    position:relative
}

.files:after {
    pointer-events: none;
    position: absolute;
    top: 30px;
    left: 26%;
    width: 43px;
    right: 0;
    height: 42px;
    content: "";
    background-image: url(../img/attachment-icon.jpg);
    display: block;
    /* margin: 0 auto; */
    background-size: 100%;
    background-repeat: no-repeat;
}

.color input{
    background-color:#f1f1f1;
}

.files:before {
    position: absolute;
    bottom: 10px;
    left: 0;
    pointer-events: none;
    width: 100%;
    right: 0;
    height: 50px;
    content: "Drag & drop or browse to upload(Alt + U)";
    display: block;
    margin: 0 auto;
    color: #000000;
    font-family: Google Sans Medium;
    /* text-transform: capitalize; */
    text-align: center;
}

.d-none {
    display: none;
}

.productpopup .zearo-table thead th:first-child {
    border-left: 1px solid #e2e2e2;
}

.productpopup .zearo-table thead th {
    border-top: 1px solid #e2e2e2;
}

.productpopup .zearo-table thead th:last-child {
    border-right: 1px solid #e2e2e2;
}

.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
    color: #262626;
    text-decoration: none;
    background-color: #f5f5f5;
}

.dropdown-menu>li>a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: normal;
    font-size:12px;
}

.table-secondary {
    border: 1px solid #F2F2F2;
}

.table-secondary, .table-secondary>td, .table-secondary>th {
    background-color: #F2F2F2;
}

.password-eye{
    position: absolute;
    top: 27px;
    right: 20px;
    width: 20px;
    height: 23px;
    background:url('../img/icons/pass-eye.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.comma-seperate:after{
    content: ", ";
    font-family: Google Sans Medium;
}

.comma-seperate:last-child:after{
    content: " ";
}

.orderlistes{
    overflow-y:auto;
    height:420px;
    position: relative;
}

.mbl-block{
    display:none !important;
}

.web-block{
    display:block !important;
}

.mbl-bloc{
    display: none;
}

.order-detail-name, .order-detail-img {
    display: inline-block;
}

.order-detail-img {
    width: 26px;
    height: 26px;
    margin-right: 10px;
}

.order-detail-img img {
    width: 100%;
    height: auto;
    max-height: 26px;
}

.order-detail-img span {
    text-align: center;
    line-height: 26px;
    display: block;
}

.ordered-product-detail {
    padding-bottom: 10px;
    border-bottom: 1px solid #eeeeee;
}

.margin-b-15 {
    margin-bottom: 15px!important;
}

.margin-t-15 {
    margin-top: 15px!important;
}

.margin-t-10 {
    margin-top: 10px!important;
}

.fnt-14{
    font-size: 14px;
}

.text-rght{
    text-align: right;
}

.pd-t-10{
    padding-top:10px;
}

.accordion {
    background-color: #f2f2f2;
    padding: 5px 0px;
    cursor: pointer;
}

.crd-scrol-avoid{
    height:464px;
    overflow-y:auto;
}

.dsh-hdr-sub-txt {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    background-color: #ffffff;
    font-size: 10px;
    color: black;
    float: right;
}

.mbl-nne{
    display:block;
}

.mbl-vis{
    display:none;
}

.getstarted-right-bar12{
    max-width: 80%;
    overflow: hidden;
    height: calc(100vh - 121px);
}

@media screen and (min-width: 1400px) {
    .banner-icons-section{
        margin-top:50px;
        margin-left: 17%;
        text-align: center;
    }
    .banner-bg-color-new {
        background: url(../img/pos/banner_bg.svg);
        background-position: 0 -200px;
        background-repeat: no-repeat;
        background-size: cover;
        height: 80vh !important;
        width: 100%;
    }
    .banner-bg-color-new1 {
        background: url(../img/inventory/bg.svg);
        background-position: 0 -200px;
        background-repeat: no-repeat;
        background-size: cover;
        height: 80vh !important;
        width: 100%;
    }
    #myCarousel1 .carousel-indicators {
        bottom: -10% !important;
    }
    .cust-blog-first{
        width: 40%;
    }
    .orderlistes {
        overflow-y: auto;
        height: 460px;
        position: relative;
    }

    .crd-scrol-avoid {
        height: 505px;
        overflow-y: auto;
    }

}

.typeahead-demo .custom-popup-wrapper {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    background-color: #f9f9f9;
}

.typeahead-demo .custom-popup-wrapper > .message {
    padding: 10px 20px;
    border-bottom: 1px solid #ddd;
    color: #868686;
}

.typeahead-demo .custom-popup-wrapper > .dropdown-menu {
    position: static;
    float: none;
    display: block;
    min-width: 160px;
    background-color: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.mid-half-width-modal .modal-dialog {
    max-width: 70%;
    width: 70%;
}

/* .success-checkmark:after {
    content: '✔';
    color:#fff;
    position: absolute;
    left:0; top: 2px;
    width: 25px; 
    height: 25px;
    text-align: center;
    border: 1px solid #f26c4f;
    background: #f26c4f;
    border-radius: 50%;
    font-size: 17px;
  } */

.success-checkmark li, .success-checkmark1 li {
    height: 2em;
    text-align: center;
    line-height: 2em;
    border-radius: 1em;
    background: #e3e3e3;
    margin: 0 5em;
    display: inline-block;
    color: white;
}

.success-checkmark.mr-success {
    margin-top: 8em;
    display: block;
}

.success-checkmark.mr-success li {
    height: 4em;
    line-height: 4em;
    margin: 0 auto;
    width: 4em;
    border-radius: 50%;
}

.success-checkmark li::before, .success-checkmark1 li::before{
    content: '';
    position: absolute;
    top: .9em;
    left: 21.7em;
    width: 10.5em;
    height: .2em;
    background: #e3e3e3;
    z-index: 0;
}

.success-checkmark1 li::before{
    content: '';
    position: absolute;
    top: .9em;
    left: 17.8em;
    width: 10.5em;
    height: .2em;
    background: #e3e3e3;
    z-index: 0;
}

.success-checkmark li.active::before, .success-checkmark1 li.active::before {
    background: #f26c4f;
    z-index: 0;
    width: 22.5em;
    left: 9.5em;
}

.success-checkmark li:nth-child(2):before, .success-checkmark1 li:nth-child(2):before {
    width: 22.5em;
    left: 9.5em;
}

.success-checkmark li.active:nth-child(2):before, .success-checkmark1 li.active:nth-child(2):before {
    width: 10.5em;
    left: 9.5em;
}

.success-checkmark1 li.active:nth-child(2):before {
    width: 8.5em;
    left: 7.5em;
}

.success-checkmark p, .success-checkmark1 p{
    margin-left: 18%;
    font-size: 13px;
    float: left;
    margin-bottom:0px;
}

.success-checkmark1 p{
    margin-left: 11%;
}

.success-checkmark .p1{
    margin-left: 11%;
}

.success-checkmark1 .p1{
    margin-left: 9%;
}

.ml-20{
    padding-left:38px;
}

.success-checkmark p:first-child, .success-checkmark1 p:first-child{
    margin-left: 25%;
    font-size: 13px;
}

.success-checkmark li::after, .success-checkmark1 li::after{
    content: '✔';
    position: relative;
    /* top: 0em; */
    color: #fff;
    z-index: 1;
    /* left: 0; */
    /* width: 25px; */
    /* height: 25px; */
    font-size: 20px;
    padding: 6px;
    left: -3px;
    width: 20em;
    height: .2em;
}

.success-checkmark.mr-success li::after {
    width: 40em;
    height: .4em;
}

.success-checkmark  li:first-child::before, .success-checkmark1  li:first-child::before {
    display: none;
}

.success-checkmark .active, .success-checkmark1 .active {
    background: #f26c4f;
    z-index: 1;
}

.success-checkmark li.active, .success-checkmark1 li.active {
    background: #f26c4f;
}

.success-checkmark.mr-success li.active {
    background: #43a047;
}

@media screen and (min-width: 1600px) {

    .orderlistes {
        overflow-y: auto;
        height: 530px;
        position: relative;
    }

    .crd-scrol-avoid {
        height: 577px;
        overflow-y: auto;
    }

}
/* Desktop col-lg*/
@media screen and (max-width: 992px) {
}

/* Tablet col-md*/
@media screen and (max-width: 768px) {
    .mbl-nne{
        display:none;
    }
    .mbl-vis{
        display:block;
    }
    .getstarted-right-bar12{
        max-width: 100%;
        overflow: hidden;
        height: calc(100vh - 121px);
        margin-left:0px;
    }
    .qsale-logo {
        width: 20%;
    }
    .left-navbar{
        position: inherit;
    }
    .role-back {
        text-align: center;
        padding: 10px !important;
    }
    .secondry-toolbar {
        padding: 10px;
        display: flex;
        align-items: center;
        background-color: #f8f8f8;
        border-top: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        box-shadow: 0 2px 4px 0 rgba(24,50,71,.08);
    }
    .secondry-toolbar.show {
        height: auto;
    }
    .responsive>tbody>tr>td {
        width: auto !important;
    }
    .cb-active {
        text-align: left;
    }
    .dashboard-time {
        padding-top: 10px;
    }
    .dashboard-refresh-btn {
        padding-top: 10px;
        text-align:left;
    }
    .collapse.show {
        display: inherit;
    }
    .tool-icon {
        float: inherit;
        margin-top: 10px;
        margin-bottom: 5px;
    }
    .page-loader-container {
        top: 25%;
        left: 25%;
    }
    .dashboard-today {
        padding-top: 10px;
    }
    /* Menu slide responsive */
    .mbl-block{
        display:block !important;
    }
    .web-block{
        display:none !important;
    }
    .content-container {
        width: 100%;
    }
    .sidenav .closebtn {
        left: 150px !important;
        font-size: 30px !important;
        color: #fff !important;
    }
    .sidenav {
        position: absolute !important;
    }
    .ordrlsts{
        display:none;
    }
    .mbl-bloc{
        display: block;
        font-size: 15px;
        font-weight: bold;
        cursor: pointer;
        text-decoration: underline;
    }
    .modal-sm {
        width: 80% !important;
    }
    .cust-padding-maincard .card {
        background-color: transparent  !important;
    }

}

/* Mobile col-sm*/
@media screen and (max-width: 576px) {
    .pop-container {
        width: 280px;
    }
    .mbl-10{
        width:10%;
    }
    .mbl-30{
        width:30%;
    }
    .mbl-40{
        width:40%;
    }
    .mbl-50{
        width:50%;
    }
    .mbl-80{
        width:80%;
    }
    .mbl-50-non{
        display:none;
    }
    .breadcrumb-txt, .breadcrumb-txt a {
        font-size: 11px;
    }
    .btn-log-reg {
        padding: 2px 12px;
        font-size: 12px;
    }
    .card-refresh {
        text-align: inherit;
    }
    .left-navbar{
        position: inherit;
    }
    .secondry-toolbar {
        padding: 10px;
        display: flex;
        align-items: center;
        background-color: #f8f8f8;
        border-top: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        box-shadow: 0 2px 4px 0 rgba(24,50,71,.08);
    }
    .secondry-toolbar.show {
        height: auto;
    }
    .responsive>tbody>tr>td {
        width: auto !important;
    }
    .orderlistes{
        overflow-y:auto;
        height:auto;
        position: relative;
    }
    .crd-scrol-avoid{
        height:auto;
        overflow-y:visible;
        padding-bottom:50px;
    }
    .status-bar {
        width: 15px;
        height: 80px;
        border-left: 5px solid #c6c5c2;
        position: relative;
        display: inline-block;
        margin-top: 50px;
    }
    .status-bar span {
        position: absolute;
        left: 0px;
        top: 0px;
        font-size: 10px;
        text-align: left;
        font-weight: bold;
    }
    .status-bar span label {
        font-size: 10px;
        font-weight: normal;
    }
    .status-bar::after {
        content: "";
        width: 15px;
        display: block;
        overflow: hidden;
        height: 15px;
        background-color:  #c6c5c2;
        border-radius: 50%;
        position: absolute;
        top: 0%;
        left: 0px;
    }

}

.view-response {
    color: #408eed!important;
    padding: 0px 0.75rem 0.75rem;
    font-size: 12px;
    display: inline-block;
    cursor: pointer;
}

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

    .qsale-logo {
        width: 50%;
    }
    .sidenav {
        padding-top: 0px;
    }
    .sidenav a {
        font-size: 18px;
    }


}

.cke_button__save, .cke_button__newpage, .cke_button__preview, .cke_button__print, .cke_button__templates, .cke_button__pastetext, .cke_button__pastefromword {
    display: none!important;
}

.survey-container {
    border-top: 5px solid #a30233;
    border-radius: 5px;
    padding: 1em 0px;
    background-color: #ffffff;
}

.survey-questions {
    position: relative;
    overflow: hidden;
}

.survey-question {
    margin: 1em 0px;
    background-color: #ffffff;
    border-radius: 5px;
    border-left: 5px solid transparent;
    padding: 1em 0px;
    position: relative;
}

.newrecord {
    position: absolute;
    left: 0px;
    bottom: 1em;
    background-color: #ffffff;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
    border: none;
}

.survey-question.active {
    border-color: #287fea;
}

.option-question {
    border: 1px solid #c6c6c6;
    border-radius: 50%;
    margin-right: 5px;
    width: 15px;
    height: 15px;
    display: inline-block;
    vertical-align: middle;
}

.choice {
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.choice .form-control {
    width: 70%;
    display: inline-block;
}

.option-remove {
    cursor: pointer;
    background-color: transparent;
    border: none;
}

.option-add {
    cursor: pointer;
    color: #287fea!important;
    background-color: transparent;
    border: none;
}

.actions-container {
    margin-top: 15px;
    border-top: 1px solid #c6c6c6;
    padding-top: 15px;
    text-align: right;
}

.action-icon {
    font-size: 22px;
    color: #727579!important;
    cursor: pointer;
    background: transparent;
    border: none;
}

.survey-confirm .modal-body {
    padding: 1rem!important;
}

.survey-confirm .modal-dialog {
    width: 80%;
    max-width: 80%;
}

.survey-tab .nav-tabs .uib-tab a {
    background-color: #ffffff;
    padding: 1em 0em;
    color: #000000;
    font-size: 14px;
    border-bottom: 2px solid transparent;
}

.nav-tabs .uib-tab a:hover {
    color: #287fea;
    border-color: transparent;
    border-bottom-color: #287fea;
}

.survey-tab .nav-tabs .uib-tab.active a, .nav-tabs .uib-tab.active a {
    color: #287fea;
    border-bottom-color: #287fea;
}

.response-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1em;
    background-color: #ffffff;
    padding: 1em;
}

.response-export-btn {
    color: #327d34!important;
    border: 1px solid #327d34;
    border-radius: 40px;
    padding: 0.5em 2em;
    font-size: 12px;
    cursor: pointer;
}

.response-export-btn.pdf {
    color: #d60e13!important;
    border: 1px solid #d60e13;
}

.welcome-cart, .question-cart {
    margin-top: 2em;
    background-color: #ffffff;
    padding: 2em;
}

.take-survey {
    background-color: #a30233;
    border: 0px;
    padding: 0.8em 2em;
    color: #ffffff;
    border: 1px solid #a30233;
    cursor: pointer;
}

.take-survey:hover {
    background-color: #ffffff;
    color: #a30233;
}

.survey-hint {
    color: #6e6e6e;
}

.current-question {
    font-weight: bold;
    border-bottom: 1px solid #a30233;
    font-size: 15px;
}

.question {
    font-weight: bold;
    font-size: 16px;
    padding-bottom: 1em;
}

.next-survey {
    border: 1px solid #a30233;
    color: #a30233;
    background-color: #ffffff;
    padding: 0.4em 1.5em;
    cursor: pointer;
}

.next-survey:hover {
    background-color: #a30233;
    color: #ffffff;
}

.question-option {
    color: #6e6e6e;
    padding-bottom: 1em;
    font-size: 14px;
}

.option-input {
    margin-right: 10px!important;
    padding-bottom: 5px;
    vertical-align: middle;
}

/* The device with borders */
.smartphone {
    position: relative;
    width: 360px;
    height: 640px;
    margin: auto;
    border: 16px black solid;
    border-top-width: 60px;
    border-bottom-width: 60px;
    border-radius: 36px;
}

/* The horizontal line on the top of the device */
.smartphone:before {
    content: '';
    display: block;
    width: 60px;
    height: 5px;
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #333;
    border-radius: 10px;
}

/* The circle on the bottom of the device */
.smartphone:after {
    content: '';
    display: block;
    width: 35px;
    height: 35px;
    position: absolute;
    left: 50%;
    bottom: -65px;
    transform: translate(-50%, -50%);
    background: #333;
    border-radius: 50%;
}

/* The screen (or content) of the device */
.smartphone .content {
    width: 100%;
    height: 100%;
    background: white;
}

/* The laptop with borders */
.laptop {
    /*-webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scale(.6) translate(-50%); /* Scaled down for a better Try-it experience (change to 1 for full scale) */
    /*transform: scale(.6) translate(-50%); /* Scaled down for a better Try-it experience (change to 1 for full scale) */
    /*left: 50%;
    position: absolute;*/
    width: 100%;
    height: 800px;
    border-radius: 6px;
    border-style: solid;
    border-color: black;
    border-width: 24px 24px 80px;
    background-color: black;
    margin: auto;

}

/* The keyboard of the laptop */
/*.laptop:after {
    content: '';
    display: block;
    position: absolute;
    width: 115%;
    height: 60px;
    margin: 80px 0 0 -110px;
    background: black;
    border-radius: 6px;
}*/

/* The top of the keyboard */
/*.laptop:before {
    content: '';
    display: block;
    position: absolute;
    width: 250px;
    height: 30px;
    bottom: -110px;
    left: 50%;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    background: #f1f1f1;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    z-index: 1;
}*/

/* The screen (or content) of the device */
.laptop .content {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border: none;
}

.group-title {
    background-color: #687074 !important;
    color: #FFF !important;
}

.has-sub-nodes {
    color: #8c9aa6!important;
    padding-right: 5px;
}

.no-sub-nodes {
    width: 12px;
    height: 12px;
    display: inline-block;
    background-color: #d1d8dc!important;
    border-radius: 50%;
    margin-right: 5px;
}

.angular-ui-tree-handle {
    font-size: 12px;
    cursor: pointer;
    position: relative;
    font-weight: normal;
    padding: 5px 15px;
}

li > ol > li .angular-ui-tree-handle:before {
    content: "";
    position: absolute;
    border-bottom: 1px solid #d1d8dc;
    width: 13px;
    left: 0px;
    bottom: 50%;
}

ol > li > .angular-ui-tree-handle:after {
    content: "";
    position: absolute;
    border-right: 1px solid #d1d8dc;
    height: 100%;
    left: 0px;
    bottom: 50%;
    z-index: -3;
}

.angular-ui-tree-handle:hover, .angular-ui-tree-handle.selected {
    background-color: #bcd2ee!important;
}

.angular-ui-tree-empty {
    background-image: none;
    background-color: transparent;
    border: none;
}

.dropdown-menu {
    z-index: 99999;
}

.survey-templates {
    margin-bottom: 1em;
    padding: 1em;
    background-color: #ffffff;
}

.survery-template {
    font-size: 13px;
    padding: 0.5em 1em;
    border: 1px solid #eeeeee;
    display: inline-block;
    margin-right: 1em;
    margin-bottom: 1em;
    cursor: pointer;
    background-color: transparent;
}

.survery-template.selected-template {
    border: 1px solid #287fea;
}

.arrow-down:after,.arrow-up:after{
    content: ' ';
    position: relative;
    left: 4px;
    border: 5px solid transparent;
}

.arrow-down:after{
    top: 12px;
    border-top-color: black;
}

.arrow-up:after{
    bottom: 10px;
    border-bottom-color: black;
}

.arrow-down,.arrow-up{
    padding-right: 10px;
}

.header-secondry-label {
    padding: 5px 7px;
    font-size: 13px;
    color: #2680eb;
}

.branch-card {
    margin-bottom: 1em;
    padding: 1.5em 0;
    text-align: center;
    position: relative;
}

.expand {
    color: #cccccc;
}

.branch-name {
    color: #515151;
}

.branch-name, .expand {
    font-family: Google Sans Regular;
    font-size: 12px;
}

.branch-revenue {
    font-family: Google Sans Bold;
    font-size: 18px;
    padding: 0.5em 0;
}

.revenue-down {
    color: red;
}

.revenue-up {
    color: green;
}

.revenue-up, .revenue-down {
    font-size: 14px;
}

select.form-cntrl1 {
    height: auto!important;
}

.embedClass iframe {
    height: 100vh !important;
}

.grid-btn {
    font-size: 11px!important;
    padding: 3px 5px!important;
}

select.staticselect{
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #000000;
    font-size: 13px;
    width: 100%;
    margin: 2px ​0px 10px;
    padding: 7px;
    border-radius: 5px;
}

.homemenucard {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    width: 85%;
    background-color: #ffffff;
    height: 380px;
    margin: 0px auto 2em auto;
    border-radius: 10px;
}

.homewidthless{
    height: auto;
}

.homemenulist {
    padding-top: 1em;
}

.homemenulist ul{
    list-style: none;
    padding-left: 0px;
    font-size: smaller;
    padding-bottom: 10px;
}

.homemenulist ul li{
    padding-top: 5px;
}

.homemenulist a{
    font-family: Google Sans Regular!important;
}

.homeicon img {
    vertical-align: middle;
}

.homeicon {
    border-radius: 5px;
    width: 40px;
    height: 40px;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    line-height: 40px;
}

.homeheading{
    padding: 1em 2em;
}

.homeheading a, .homeheading span {
    color: black;
    font-family: Google Sans Medium;
    font-size: 12px;
}

.homeheading a:hover {
    text-decoration: underline;
}

.menu-down-arrow {
    position: absolute;
    right: 0px;
    bottom: 35%;
}

.red-font {
    color: red;
}

.f-s-20 {
    font-size: 20px;
}

.release-list {
    border-bottom: 1px solid #dddddd;
    padding-bottom: 1rem;
}

.release-list {
    font-size: 12px;
}

.release-date {
    font-size: 14px;
    font-family: Google Sans Medium;
}

.selected-doc {
    background-color: #e9f2fd;
    padding: 5px 10px;
    font-size: 12px;
    margin-left: 8px;
    font-weight: normal;
    text-align: center;
    border-radius: 2px;
    display: inline-block;
}

.btn-consolidate-view {
    color: #2680eb;
    border-color: #c6c6c6;
    font-size: 11px;
}

.btn-consolidate-view.active {
    color: #ffffff;
    background-color: #2680eb;
    border-color: #2680eb;
}

.expense {
    color: #ffa34e;
    background-color: #fff7dd;
}

.deposit {
    color: #4eb6e3;
    background-color: #e4f8ff;
}

.withdrawal {
    color: #ff786a;
    background-color: #ffe4e4;
}

.dashboard-card {
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.overall-count-section {
    float: left;
    overflow: hidden;
    width: 33.33%;
    padding: 10px 0px;
}

.overall-count-label {
    font-family: Google Sans Medium;
    font-size: 14px;
}

.overall-count-value {
    font-family: Google Sans Bold;
    font-size: 40px;
}

.overall-progress {
    width: 100%;
    height: 5px;
    border-radius: 20px;
}

.progress-open, .progress-close, .progress-notopen {
    float: left;
    height: 8px;
}

.left-radius-for-status {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.progress-open {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    background-color: #ABEAEC;
}

.progress-close {
    background-color: #6680EA;
}

.progress-notopen {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    background-color: #FF6C6C;
}

.overall-terminal-status-section {
    overflow: hidden;
    padding: 10px 0px;
}

.overall-progress-label {
    margin: 10px 0px 0px 5px;
}

.progress-open-label, .progress-close-label, .progress-notopen-label {
    text-align: center;
    font-size: 16px;
    color: #808080;
    float: left;
}

.overall-count-terminal-section {
    float: left;
    overflow: hidden;
    width: 33.33%;
    padding: 10px 0px;
}

.zone-count-section {
    overflow: hidden;
}

.overall-count-terminal-label, .zone-count-label {
    font-family: Google Sans Medium;
    font-size: 12px;
}

.zone-count-label {
    margin-left: 20px;
}

.overall-count-terminal-value, .zone-count-value, .zone-count-value span {
    font-family: Google Sans Bold;
    font-size: 25px;
}

.zone-count-value {
    align-items: center;
    justify-content: flex-start;
    display: flex;
}

.status-box {
    width: 10px;
    height: 15px;
    display: inline-block;
    border-radius: 3px;
}

.zone-status-box {
    width: 15px;
    height: 10px;
    display: inline-block;
    border-radius: 3px;
    margin-right: 5px;
}

.open-status {
    background-color: #ABEAEC;
}

.close-status {
    background-color: #6680EA;
}

.notopen-status {
    background-color: #FF6C6C;
}

.sync-section {
    padding: 10px 0px;
}

.padding-b-5 {
    padding-bottom: 5px;
}

.padding-b-10 {
    padding-bottom: 10px;
}

.sync-label {
    font-size: 12px;
    color: #808080;
}

.sync-value {
    font-family: Google Sans Bold;
    font-size: 13px;
}

.refresh-section {
    padding: 10px 0px;
    text-align: right;
}

.margin-b-30 {
    margin-bottom: 30px;
}

.margin-b-20 {
    margin-bottom: 20px;
}

.modal-dialog.modal-lg {
    min-width: 400px;
}

.modal-body .autocomplete-input, .modal-body .autocomplete-input .form-control, .modal-body .autocomplete-input-md-2 .form-control, .modal-body .autocomplete-input-md-2 {
    max-width: 100%;
}

.form-control:disabled, .form-control[readonly] {
    background-color: #e9ecef!important;
}

small {
    font-size: 11px!important;
}

.link {
    color: #2680eb!important;
}

.btn-callcenter {
    background-color: #ffffff;
    font-size: 12px;
    color: #000000;
}
.btn-center {
    background-color: #ffffff;
    font-size: 12px;
    color: #000000;
    border: 1px solid #eeeeee;

}
.btn-center.active {
    background-color: #2680eb!important;
    color: #ffffff;
}

.btn-callcenter.active {
    background-color: #2680eb!important;
    color: #ffffff;
}

.m-w-120 {
    min-width: 120px;
}

.callcenter-customer-search-container {
    justify-content: center;
    display: flex;
    position: relative;
}

.callcenter-customer-search-container .dropdown-menu {
    width: 100%;
    min-width: 300px;
}

.dropdown-menu-no-result {
    min-width: 400px;
    position: absolute;
    left: 0px;
    top: 100%;
    border: 1px solid #eeeeee;
    margin-top: 2px;
    padding: 5px;
    z-index: 999999;
    background-color: #ffffff;
}

.callcenter-customer {
    position: relative;
    overflow: hidden;
    width: 100%;
    display: block!important;
    border-bottom: 1px solid #eeeeee;
}

.callcenter-customer-name {
    font-weight: bold;
}

.callcenter-customer-search {
    font-size: 18px;
    width: 100%;
    min-width: 400px;
    padding: 7px;
    border: 1px solid #EFEFEE;
}

.callcenter-customer-name, .callcenter-customer-mobile {
    display: block;
}

.callcenter-customer-search-icon {
    border-radius: 0px;
    color: #ffffff;
    outline: 0px;
}

.dropdown-menu-no-result .callcenter-customer-name, .dropdown-menu-no-result .callcenter-customer-mobile {
    color: #f02b37;
    font-weight: normal;
    font-size: 12px;
}

.callcenter-create-customer {
    color: #439bef;
    border: 1px solid #439bef;
    border-radius: 20px;
    font-size: 12px;
    background-color: transparent;
    cursor: pointer;
}

.dropdown-menu-no-result .callcenter-customer {
    border-bottom: 0px;
    display: flex!important;
    position: relative;
    justify-content: space-between;
    align-items: center;
}

.callcenter-customer-phone-label, .callcenter-customer-name-label {
    color: #7a7a7a;
    font-size: 13px;
}

.no-padding {
    padding: 0px;
}

.padding-top-only {
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 16px;
    padding-bottom: 0px;
}

.no-padding-vertical {
    padding-left: 0px;
    padding-right: 0px;
}

.callcenter-customer-name-input, .callcenter-customer-name-input {
    border: 0px;
    border-bottom: 1px solid #eeeeee;
    font-size: 23px;
}

.padding-l-r-15 {
    padding-left: 15px;
    padding-right: 15px;
}

.no-r-padding {
    padding-right: 0px;
}

.callcenter-delivery-address {
    position: relative;
    overflow: hidden;
    clear: both;
    border: 1px solid #eeeeee;
    border-radius: 5px;
    padding: 5px 25px;
    margin-right: 15px;
    cursor: pointer;
}

.callcenter-delivery-address .editbtn {
    position: absolute;
    top: 3px;
    right: 5px;
    font-size: 11px;
    color: #2680eb;
}

.callcenter-delivery-address .checkbox {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0px;
    left: 0px;
    -webkit-box-shadow: inset -2px -2px 0px 0px rgba(220,220,220,1);
    -moz-box-shadow: inset -2px -2px 0px 0px rgba(220,220,220,1);
    box-shadow: inset -2px -2px 0px 0px rgba(220,220,220,1);
    text-align: center;
    color: #2680ea;
    font-size: 12px;
}

.callcenter-delivery-address .location-map {
    width: 15px;
    height: 15px;
    position: absolute;
    top: 30px;
    left: 3px;
    font-size: 12px;
}

.callcenter-address-name, .callcenter-address-detail {
    font-size: 13px;
}

.callcenter-address-name {
    font-weight: bold;
}

.callcenter-address-detail {
    padding-top: 5px;
    padding-bottom: 5px;
}

.callcenter-delivery-address.active {
    border-left: 5px solid #2680ea;
}

.callcenter-delivery-address.active .checkbox {
    background-color: #2680ea;
    box-shadow: none;
    border-right: 5px solid #2680ea;
}

.callcenter-delivery-type.active {
    background-color: #2680ea;
    color: #ffffff;
}

.callcenter-delivery-type {
    background-color: transparent;
    border: 1px solid #dedede;
    border-radius: 20px;
    font-size: 13px;
    margin-right: 10px;
    padding: 8px 16px;
    cursor: pointer;
}

.callcenter-place-order-container .modal-dialog {
    width: 98%;
    max-width: 98%;
}

.callcenter-place-order-container .modal-content {
    width: 100%;
    height: 90vh;
}

.callcenter-summary-container {
    display: block;
    background-color: #fbfbfb;
}

.callcenter-summary-container {
    display: block;
    background-color: #fbfbfb;
    padding: 10px 15px;
    border-radius: 5px;
    border: 1px solid #eaeaea;
}

.callcenter-cart-container {
    margin-top: 15px;
    border-radius: 5px;
    border: 1px solid #eaeaea;
}

.callcenter-cart-header {
    padding: 10px 15px;
    background-color: #fbfbfb;
    border-bottom: 1px solid #eaeaea;
}

.callcenter-cart-item {
    padding: 10px 15px;
    display: flex;
    justify-content: start;
    align-items: center;
    border-bottom: 1px solid #eaeaea;
}

.callcenter-cart-body {
    height: calc(100vh - 336px);
    overflow-y: auto;
}

.callcenter-cart-footer table {
    width: 100%;
}

.callcenter-cart-footer {
    padding: 10px 15px;
    border-top: 1px solid #eaeaea;
}

.cart-item-text {
    color: #000000;
    font-family: Google Sans Medium;
    font-size: 14px;
}

.addon-item-group-text {
    color: #000000;
    font-size: 11px;
}

.addon-item-text {
    color: #000000;
    font-family: Google Sans Medium;
    font-size: 11px;
}

.cart-adjust-btn {
    background-color: #f6f6f6;
    border: 1px solid #e6e6e6;
    color: #000000;
    text-align: center;
    float: left;
    width: 28px;
    font-size: 14px;
    cursor: pointer;
}

.cart-adjust-qty {
    width: 45px;
    border: 1px solid #a7a7a7;
    border-radius: 5px;
    padding: 7px 5px;
    text-align: center;
}

.cart-qty {
    clear: both;
    display: flex;
    overflow: hidden;
    align-items: center;
    justify-content: start;
}

.callcenter-customer-info {
    font-size: 12px;
    color: #2981eb;
}

.callcenter-cart-search {
    width: 100%;
    border-radius: 3px;
    border: 1px solid #a9a9a9;
    padding: 5px;
}

.m-b-15 {
    margin-bottom: 15px;
}

.m-b-5 {
    margin-bottom: 5px;
}

.padding-h-5 {
    padding-left: 5px;
    padding-right: 5px;
}

.cart-item-label {
    color: #404040;
}

.cart-item-delete svg {
    fill: #ec0000;
    width: 18px;
    height: 18px;
}

.cart-item-delete {
    background-color: transparent;
    border: none;
    cursor: pointer;
    vertical-align: middle;
}

.cart-categories-container {
    border: 1px solid #eaeaea;
    border-radius: 5px;
}

.cart-category-container::-webkit-scrollbar {
    /*display: none;*/
}

.cart-category-container {
    white-space: nowrap;
}

.cart-category-header, .cart-category-footer {
    background-color: #f6f6f6;
    padding: 5px 5px;
    display: flex;
    align-items: center;
    justify-content: start;
}

.cart-category-header {
    border-bottom: 1px solid #eaeaea;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

.cart-category-footer {
    border-top: 1px solid #eaeaea;
}

.cart-cateogry-arrow {

}

.cart-category-btn.active {
    font-weight: bold;
    color: #000000;
    background-color: #ccffcc;
}

.cart-category-btn {
    border: 1px solid #c8dffb;
    border-radius: 5px;
    background-color: #e9f2fd;
    color: #000000;
    width: 120px;
    height: 120px;
    float: left;
    cursor: pointer;
    margin-right: 10px;
    margin-bottom: 5px;
}

.cart-category-label {
    font-size: 12px;
    font-weight: bold;
}

.cart-category-body {
    height: calc(100vh - 326px);
    padding: 10px 15px;
    overflow: auto;
}

.cart-category-sub-body {
    height: 120px;
    padding: 10px 15px;
    overflow: auto;
    border-bottom: 1px solid #A9A9A9;
}

.cart-product-category-btn {
    border: 1px solid #c8dffb;
    border-radius: 5px;
    background-color: #e7f4e7;
    color: #000000;
    width: 85px;
    height: 40px;
    float: left;
    cursor: pointer;
    margin-right: 10px;
    margin-bottom: 8px;
    font-size: 11px;
    line-height: 12px;
}

.cart-product-category-btn.active {
    background-color: #bce0bc;
}

.cart-product-btn {
    border: 1px solid #c8dffb;
    border-radius: 5px;
    background-color: #e9f2fd;
    color: #000000;
    width: 85px;
    height: 75px;
    float: left;
    cursor: pointer;
    margin-right: 10px;
    margin-bottom: 8px;
    font-size: 11px;
    line-height: 12px;
}

.padding-t-10 {
    padding-top: 10px;
}

.callcenter-notes {
    margin-right: 5px;
    width: 100%;
    padding: 5px;
}

.callcenter-address-container {
    border: 1px solid #eaeaea;
    padding-left: 15px;
    padding-bottom: 15px;
    border-radius: 5px;
}
.search-with-icon {
    position: relative;
    width: 100%;
}

.search-with-icon svg {
    position: absolute;
    left: 10px;
    top: 25%;
    width: 15px;
    height: 15px;
    z-index: 9;
}

.search-with-icon input {
    padding-left: 10px;
    width: 93.5%;
}
.search-with-icon1 {
    position: relative;
    width: 100%;
}

.search-with-icon1 svg {
    position: absolute;
    left: 10px;
    top: 25%;
    width: 15px;
    height: 15px;
    z-index: 9;
}

.search-with-icon1 input {
    padding-left: 33px;
    width: 100%;
    height:30px;

}
.border-sides {
    border-left: 1px solid #000; /* Add left border */
    border-right: 1px solid #000; /* Add right border */
}
.allocation1-customer-info {
    font-size: 11px;

}
.allocation-customer-info {
    font-size: 11px;
    text-align: left;
}
.allocation-customer-info1 {
    font-size: 10px;

}
.allocation-payment-label {
    font-size: 12px;
    font-weight: bold;
    margin-top:10px;
    margin-bottom:10px;
}
.allocation-invoice-label {
    font-size: 12px;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom:10px;

}
.allocation-container {
    border: 1px solid #eaeaea;
    padding-bottom: 1px;
    border-radius: 5px;

}
.allocation-customer-item {
    padding-top: 10px ;
    display: flex;
    text-align: left;
    justify-content: start;
    align-items: center;
    border-bottom: 1px solid #eaeaea;
}
.allocation-customer-item1 {
    padding-top: 5px ;
    display: flex;
    text-align: left;
    overflow-y: auto;
    overflow-x: hidden;
    border-bottom: 1px solid #eaeaea;
}
.invoice-container {
    border: 1px solid #eaeaea;
    border-radius: 5px;
    top: 10%;
}
.customer-header1, .customer-footer1 {
    border: 1px solid #eaeaea;
    padding-left: 15px;
    padding-right:  5px;
    padding-bottom: 15px;
    border-radius: 5px;
    height:115px;
    margin-bottom: 5px;

}

.customer-header1 {
    border-bottom: 1px solid #eaeaea;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    padding-bottom: 5px;
}
.customer-header, .customer-footer {
    border: 1px solid #eaeaea;
    padding-bottom: 15px;
    border-radius: 5px;
    height:65px;
    margin-bottom: 5px;
}

.customer-header {
    border-bottom: 1px solid #eaeaea;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    padding-bottom: 5px;
}
.allocation-header, .allocation-footer {
    border: 1px solid #eaeaea;
    padding-left: 15px;
    padding-right:  5px;
    padding-bottom: 15px;
    border-radius: 5px;
    height:75px;
    margin-bottom: 5px;

}

.allocation-header {
    border-bottom: 1px solid #eaeaea;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    padding-bottom: 5px;
}
.payment-footer {
    border: 1px solid #eaeaea;
    padding-bottom: 15px;
    border-radius: 5px;
    height:50px;
    margin-bottom: 15px;

}

.padding-vertical {
    padding-top: 15px;
    padding-bottom: 15px;
}

.padding-vertical-5 {
    padding-top: 5px;
    padding-bottom: 5px;
}

.callcenter-insights-table {
    width: 100%;
    border: 1px solid #e2e2e2;
}

.callcenter-insights-table thead {
    background-color: #f2f2f2 !important
}

.callcenter-insights-table thead th {
    padding: 0.6em;
    font-size: 11px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;
    background-color: #f2f2f2 !important;
}

.callcenter1-insights-table {
    width: 100%;

}
.tool-icon {
    min-width: 70px;
    float: left;
}

.callcenter1-insights-table thead {
    background-color: #f2f2f2 !important
}

.callcenter1-insights-table thead th {
    padding: 0.6em;
    font-size: 11px;
    font-weight: inherit;
    font-family: Google Sans Medium;
    border-bottom: 1px solid #e2e2e2;
    background-color: #f2f2f2 !important;
}
.customer-insight-count-container.total {
    border-color: #d9e9fc;
    background-color: #e9f2fd;
}

.customer-insight-count-container.delivered {
    border-color: #c2e5c3;
    background-color: #e7f4e7;
}

.customer-insight-count-container.cancelled {
    border-color: #fddddf;
    background-color: #fde5e6;
}

.customer-insight-count-container {
    position: relative;
    clear: both;
    display: block;
    text-align: center;
    font-family: Google Sans Medium;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #333333;
    width: 95%;
}

.customer-insight-count-label {
    font-size: 13px;
    margin-bottom: 5px;
}

.customer-insight-count-data {
    font-weight: bold;
    font-size: 18px;
}

.cart-category-body.customer-insight {
    height: auto;
}

.callcenter-insights-table tbody td {
    border-bottom: 1px solid #e2e2e2;
    font-size: 11px;
    padding: 0.6em;
}

.callcenter-insights-table tbody tr:nth-child(odd) {
    background-color: #f8f8f8;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.cart-search-icon {
    position: absolute;
    right: 10px;
    top: 25%;
}

.back-btn-addon, .reset-customization {
    border: none;
    background-color: transparent;
    font-size: 14px;
    cursor: pointer;
}

.back-btn-addon {
    color: #000000;
}

.reset-customization {
    color: #e40000;
    float: right;
    font-size: 12px;
}

.addon-header {
    background-color: #f6f6f6;
    padding: 10px 0px;
}

.addon-product {
    padding: 5px 0px;
}

.addon-change-btn:disabled {
    background-color: transparent;
    border-color: #666666;
    color: #666666;
}

.addon-change-btn {
    border: 1px solid #0009eb;
    background-color: transparent;
    color: #0009eb;
    border-radius: 5px;
    font-size: 10px;
    padding: 4px 5px;
    margin-left: 10px;
    cursor: pointer;
}

.addon-add-cart {
    color: #0074ea;
    font-family: Google Sans Bold;
    background-color: transparent;
    border: none;
    font-size: 15px;
    cursor: pointer;
    padding: 0px;
}

.no-padding-left {
    padding-left: 0px;
}

.no-padding-right {
    padding-right: 0px;
}

.addons-product-container {
    height: calc(100vh - 251px);
    overflow: auto;
}

.disable-layer {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    z-index: 999;
}
.icon-btn {
    background: none; /* Remove background */
    border: none; /* Remove border */
    padding: 5px 10px; /* Adjust padding if needed */
    color: black; /* Ensure text is black */
    outline: none; /* Remove outline */
}

.icon-small {
    font-size: 10px; /* Smaller size for the icon */
    color: black; /* Black color for the icon */
}

.icon-btn i {
    border: none; /* Ensure no border around the icon */
    outline: none; /* Ensure no outline around the icon */
    box-shadow: none; /* Remove any box-shadow */
}

span.img-close {
    position: absolute;
    right: -10px;
    top: -10px;
    width: 20px;
    height: 20px;
    cursor: pointer;
    background-color: red;
    border-radius: 50%;
    overflow: hidden;
    text-align: center;
    font-size: 5px;
    line-height: 20px;
}

.img-close svg {
    width: 50%;
    fill: #ffffff;
    vertical-align: middle;
}

.outline-btn {
    background-color: transparent;
    font-size: 12px;

}

.warn-outline {
    border: 1px solid #f24f4f;
    color: #f24f4f;
}

.primary-outline {
    border: 1px solid #2680eb;
    color: #2680eb;
}

.v-center {
    justify-content: center;
    align-items: center;
    display: flex;
}
.gl-approvals {
    margin-top: 5px;
}

.gl-approval {
    font-size: 12px;
    color: #333;
    margin-bottom: 5px;
    margin-left: 5px;
}
.highlighted-user {
    font-weight: bold; /* Makes the text bold */
    color: black;    /* Changes the text color to a highlight color */
    background-color: #f0f8ff; /* Optional: Adds a background color to highlight */
    padding: 2px 4px; /* Optional: Adds some padding around the text */
    border-radius: 3px; /* Optional: Rounds the corners of the background */
}
.disabled-link {
    pointer-events: none;
    opacity: 0.5;
}

.disabled-text {
    pointer-events: none;
    opacity: 0.5;
}
.material-request-container {
    margin-top: 10px; /* Adjust margin as needed */
}

.delivery-note {
    white-space: pre-wrap; /* Preserve whitespace formatting */
    word-break: break-word; /* Break long words to avoid overflow */
}
.refresh-warning {
    position: fixed;
    top: 75px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    width: 250px;
    padding: 5px 12px;
    background-color: #fff4e9;
    color: #f26a4b;
    border-radius: 20px;
    border: 2px solid #ffebeb;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.2);
    text-align: center;
    font-size: 13px;
    line-height: 1.2;
    display: flex;
    align-items: center;
    gap: 5px;
}
.alert-icon {
    color: #fff; /* Set icon color to white */
    font-size: 16px; /* Adjust icon size if needed */
}
.custom-dropdown .dropdown-menu {
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.bp-dropdown .dropdown-menu {
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.product-dropdown .dropdown-menu {/*For Product */
    width: 350px;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.products-dropdown .dropdown-menu {/*For Product */
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.report-param-dropdown .dropdown-menu {/* For reports param */
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.account-dropdown .dropdown-menu {
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.accounts-dropdown .dropdown-menu {/* for general leder */
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.tbaccounts-dropdown .dropdown-menu {/*for trial balance*/
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.staccounts-dropdown .dropdown-menu { /*for statement of accounts*/
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.barcode-product .dropdown-menu {/* For product barcode param */
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
.report-product-dropdown .dropdown-menu {
    width: 100%;
    height: 225px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
}
input.custom-input,
textarea.custom-textarea:focus{
    background-color: white !important;
    color: inherit;
    border-color:#f2f2f2;
    border-radius: 3px;
}
input.custom-input:disabled,
input.custom-input[readonly]{
    background-color: white !important;
    color: inherit;
    border-color:#f2f2f2;
    border-radius: 3px;
    cursor: not-allowed;
}
input.custom-input,
textarea.custom-textarea:focus{
    background-color: white !important;
    color: inherit;
    border-color:#f2f2f2;
    border-radius: 3px;
}
input.custom-input:disabled,
input.custom-input[readonly]{
    background-color: white !important;
    color: inherit;
    border-color:#f2f2f2;
    border-radius: 3px;
    cursor: not-allowed;
}
input.custom-inputs:disabled,
input.custom-inputs[readonly]{
    background-color: #e9ecef!important;
    color: inherit;
    border-color:#f2f2f2;
    border-radius: 3px;
    cursor: not-allowed;
}
textarea.custom-textarea:disabled,
textarea.custom-textarea[readonly]{
    background-color: #f2f2f2 !important;
    color: inherit;
    border-color:#f2f2f2;
    border-radius: 3px;
    cursor: not-allowed;
}
input#data::placeholder {
    font-weight: normal;
}
input::placeholder {
    font-weight: normal;
}
.focus-normal {
    background-color: white !important;
    border-radius: 3px;
    border-color:#f2f2f2;
}

.blur-red {
    background-color: #f2f2f2 !important;
    border-radius: 3px;
    border-color:#f2f2f2;

}
input[type="checkbox"]:focus,
.toggle-switch input[type="checkbox"]:focus + .slider {
    outline: 2px solid #2680eb; /* Highlight color */
    outline-offset: 2px;
}

.cpy-btn-group{
    background: #0F52BA;
    color: #ffffff;
    border-radius: 5px;
    padding: 5px 20px;
    font-size: 12px;

}

.batch-expiry .popover-inner {
    text-align: left;
}

.batch-expiry {
    background-color: #ffffff;
}

.f-s-11 {
    font-size: 11px!important;
}
.modal-scrollable {
    max-height: 400px; /* Adjust the height as needed */
    overflow-y: auto;
    padding-top: 0px;
}

.sticky-header {
    position: sticky;
    top: 0;
    background-color: #f8f9fa; /* Background color for the header */
    z-index: 1;
    text-align: left;
}
.emoji {
    font-size: 2rem; /* Larger emoji size */
    cursor: pointer;
    transition: transform 0.2s ease-in-out;
}

.emoji:hover {
    transform: scale(1.2); /* Enlarge on hover */
}

.emoji-selected {
    border: 2px solid #FFD700; /* Highlight selected emoji */
    border-radius: 50%;
    padding: 5px;
}

.ta-editor {
    min-height: 300px;
    height: auto;
    overflow: auto;
    font-family: inherit;
    font-size: 100%;
}
.scrollable-form {
    max-height: 300px; /* Adjust based on row height */
    overflow-y: auto;
    padding-right: 10px;
}
.zearo-form-input2 {
    border: 1px solid #f2f2f2;
    border-radius: 0px;
    width: 100%;
    margin-bottom: 15px;
}
.small-text {
    font-size: 12px; /* or whatever size you prefer */
}
.batcbtn-save {
    background-color: #4caf50 !important;   
    color: white!important;
    font-size: 12px!important;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 3px;
    font-size: 12px;
    padding: 5px 7px;
    cursor: pointer;
    -webkit-font-smoothing: antialiased;
    transition: .1s ease-in;
}