@import url('https://fonts.googleapis.com/css?family=Roboto:400,600&display=swap');

@font-face {
    font-family: 'CircularStd-Book';
    src: url('../fonts/CircularStd-Book.woff') format('woff');
    font-style: normal;
    font-weight: normal;
}

@font-face {
    font-family: 'CircularStd-Medium';
    src: url('../fonts/CircularStd-Medium.woff') format('woff');
    font-style: normal;
    font-weight: normal;
}

@font-face {
    font-family: 'CircularStd-Bold';
    src: url('../fonts/CircularStd-Bold.woff') format('woff');
    font-style: normal;
    font-weight: normal;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
    font-family: 'CircularStd-Book', sans-serif;
    font-weight: 400;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

.bg-white {
    background: #fff;
}

.menu-area {
    background: #22232F;
    height: 70px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    /* padding-right: 17px; */
}

/* body.ce-order-body .menu-area {
    padding-right: 0;
} */

.dropdown-menu {
    padding: 0;
    margin: 0;
    border: 0 solid transition !important;
    border: 0 solid rgba(0, 0, 0, .15);
    border-radius: 0;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    z-index: 8 !important;
}

.mainmenu .navbar-nav li>a,
.navbar-default .navbar-nav>li>a,
.mainmenu>ul>li>a,
.navbar-expand-lg .navbar-nav .nav-link {
    color: #fff;
    font-size: 16px;
    text-transform: capitalize;
    padding: 0;
    font-family: 'CircularStd-Book', sans-serif;
    display: block !important;
    border-bottom: solid 3px transparent;
    margin: 0 12px;
}

.mainmenu li.active a,
.mainmenu .active a:focus,
.mainmenu .active a:hover,
.mainmenu li a:hover,
.mainmenu li a:focus,
.navbar-default .navbar-nav>.show>a,
.navbar-default .navbar-nav>.show>a:focus,
.navbar-default .navbar-nav>.show>a:hover {
    color: #fff;
    outline: 0;
    border-bottom: solid 3px #56A8FE;
    text-decoration: none;
    padding-bottom: 0px;
}

nav.navbar.mainmenu ul.navbar-nav.mr-auto>li {
    margin: 0 10px;
    position: relative;
}

nav.navbar.mainmenu ul.navbar-nav.mr-auto>li>a>span {
    top: 0;
}

nav.navbar.mainmenu ul.navbar-nav.mr-auto>li ul.dropdown-menu li a {
    white-space: nowrap;
}

.dark-theme nav.navbar.mainmenu ul.navbar-nav.mr-auto>li ul.dropdown-menu li a {
    white-space: nowrap;
    background: #22232F !important;
}

ul.navbar-nav.mr-auto>li>a {
    font-family: CircularStd-Book;
    font-size: 14px;
    color: #FFFFFF;
    letter-spacing: 1px;
    text-transform: uppercase;
    display: inline-block !important;
}

ul.navbar-nav.mr-auto>li>a.dropdown-toggle:before {
    content: "";
    height: 44px;
    position: absolute;
    top: 0px;
    width: 100%;
}

.mainmenu .collapse ul ul.dropdown-menu {
    margin-top: 25px;
}

/*==========Sub Menu=v==========*/
/* .mainmenu .collapse ul > li:hover > a {
   background: #56A8FE;
} */

.mainmenu .collapse ul ul>li:hover>a,
.navbar-default .navbar-nav .show .dropdown-menu>li>a:focus,
.navbar-default .navbar-nav .show .dropdown-menu>li>a:hover {
    background: #56A8FE;
    transition: all 0.5s ease;
}

.mainmenu .collapse ul ul ul>li:hover>a {
    background: #56A8FE;
}

.mainmenu .collapse ul ul,
.mainmenu .collapse ul ul.dropdown-menu {
    background: #22232f;
    font-size: 14px;
    font-family: 'CircularStd-Book', sans-serif;
}

.bootstrap-select .dropdown-toggle:focus {
    border: 1px solid #56A8FE !important;
    outline: 0 !important;
    outline-offset: 0;
}

.dark-theme .mainmenu .collapse ul ul,
.mainmenu .collapse ul ul.dropdown-menu {
    background-color: #22232F !important;
}

.dark-theme nav.navbar.mainmenu ul.navbar-nav.mr-auto>li ul.dropdown-menu li {
    border: 1px solid #333333;
}

.dark-theme nav.navbar.mainmenu ul.navbar-nav.mr-auto>li ul.dropdown-menu li a:hover {
    background-color: #56A8FE !important;
}

.mainmenu .collapse ul ul ul,
.mainmenu .collapse ul ul ul.dropdown-menu {
    background: #1E88E5
}

.mainmenu .collapse ul ul ul ul,
.mainmenu .collapse ul ul ul ul.dropdown-menu {
    background: #64B5F6
}

.fa,
.far,
.fas {
    font-family: "FontAwesome" !important;
    font-weight: normal !important;
}

/******************************Drop-down menu work on hover**********************************/
.mainmenu {
    background: none;
    border: 0 solid;
    margin: 0;
    padding: 0;
    min-height: 20px;
    width: 100%;
    height: 70px;
    flex-wrap: nowrap;
}

.mainmenu .navbar-brand {
    padding: 16px 0 15px 0;
    border-bottom: 0;
    margin-left: 0;
    outline: 0 !important;
    height: 70px;
}

.pagination-btn {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
}

.pagination-btn a {
    background: #231f20;
    color: #fff;
    font-size: 19px;
    font-family: 'CircularStd-Book';
    line-height: 36px;
    display: inline-block;
    padding: 0 22px;
}

.pagination-btn a:focus,
.pagination-btn a:hover,
.pagination-btn a:active {
    opacity: 0.9;
    text-decoration: none;
}

.custom-table {
    color: #231f20;
    font-size: 14px;
}

.custom-table thead th,
.custom-table1 thead th {
    padding: 0px 8px !important;
    font-size: 15px;
    vertical-align: middle;
    white-space: nowrap;
    font-family: CircularStd-Book, sans-serif;
    color: #22232F;
    letter-spacing: 0;
}

.custom-table thead th.pymnt-box {
    text-align: center;
}

.payment-icon {
    font-size: 1.5em !important;
    color: #AFADAD;
    padding-right: 12px !important;
    text-align: center;
}

.green-color {
    color: #44ae1f;
}

.blue-color {
    color: #56A8FE;
}

.orange-color {
    color: #E8AD14;
}

.purple-color {
    color: #A020F0;
}

.order-actv-order-tab tr td:nth-last-child(2) {
    text-align: center;
}

.customer-list tr td:nth-last-child(2) {
    text-align: center;
}

#completed-order-table_wrapper tr td:nth-last-child(2) {
    text-align: center;
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc_disabled:before,
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
    top: 8px;
}

thead>tr {
    height: 50px;
    background: #F5F7FC;
    border: 1px solid #ECEEF3;
    border-radius: 0px;
}

.datepicker thead>tr {
    height: auto;
}

td img:hover {
    cursor: pointer;
}

.table tr td {
    font-size: 15px;
    color: #3e4555;
    background: #ffffff;
}

.custom-table tbody td,
.custom-table1 tbody td {
    padding: 10px 8px !important;
    height: auto;
    vertical-align: middle;
    line-height: 1.1;
    font-family: CircularStd-Book;
    color: #3e4555;
    letter-spacing: 0;
    font-size: 13px;
}

.custom-table tbody td i,
.custom-table1 tbody td i {
    padding-right: 5px;
}

.custom-shadow {
    background: #FFFFFF;
    box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.03);
    border-radius: 4px;
}

.system-msg {
    display: block;
    font-size: 14px;
    background-color: #ffc5cc;
    color: #ec1c24;
    padding: 10px;
    margin-bottom: 20px;
}

.l-blue {
    background: #56A8FE;
    color: #E6F2FF !important;
    font-family: CircularStd-Book;
    font-size: 12px;
    letter-spacing: 0;
}

.l-red {
    background: #FF5B5B !important;
    color: #FFE6E6 !important;
    font-family: CircularStd-Book;
    font-size: 12px;
    letter-spacing: 0;
}

.l-orange {
    background: #E8AD14 !important;
    color: #FFE6B9 !important;
    font-family: CircularStd-Book;
    font-size: 12px;
    letter-spacing: 0;
}

.l-green {
    background: #44ae1f !important;
    color: #DFF8EC !important;
    font-family: CircularStd-Book;
    font-size: 12px;
    letter-spacing: 0;
}

.l-gray {
    background: #e8eaec;
    color: #717c88 !important;
    font-family: CircularStd-Book;
    font-size: 12px;
    letter-spacing: 0;
}

.d-gray {
    background: #58595b;
    color: #fff !important;
}

.d-gray:hover {
    opacity: 0.9;
}

.c-btn {
    border-radius: 4px;
    padding: 4px 10px;
    font-size: 17px;
    font-family: 'CircularStd-Book';
}

.c-btn:hover,
.c-btn:focus,
.c-btn:active,
.c-btn.active {
    opacity: 0.9;
    color: #fff;
}

.btn-space {
    margin: 3px 2px;
}

.panel-body {
    border: solid 1px #e7e8e9;
    /* overflow: scroll; */
    /* white-space: nowrap; */
    background: #FFFFFF;
    box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.03);
    border-radius: 4px;
    padding: 24px 24px;
}

.panel-body label {
    line-height: initial;
}

.panel-body table {
    white-space: nowrap;
}

.panel-body table p {
    white-space: wrap;
}

.add-new {
    border-radius: 0;
    font-size: 14px;
}

.btn {
    font-family: 'CircularStd-Medium';
    font-size: 15px;
    border-radius: 4px;
    padding: 12px 22px;
}

.add-new:hover,
.add-new:focus {
    color: #fff;
    opacity: 0.9;
}

.login {
    flex-direction: column;
    align-items: center;
    height: 100vh;
}

.new-company-welcome {
    flex-direction: column;
    align-items: center;
}

.login-form {
    width: 400px;
    padding: 40px 20px;
}

.forget-pwd {
    color: #fff !important;
    font-size: 14px;
}

.form-control {
    border-radius: 0px !important;
    height: 40px;
    border: 1px solid rgba(57, 73, 107, 0.3);
    border-radius: 4px;
    border-width: 1px !important;
    color: #3E4555;
    font-family: 'CircularStd-Book';
    font-size: 14px;
    background: #ffffff;
}

.form-control::-webkit-input-placeholder {
    color: rgba(62, 69, 85, 0.5) !important;
    font-family: 'CircularStd-Book';
}

.form-control::-moz-placeholder {
    color: rgba(62, 69, 85, 0.5) !important;
    font-family: 'CircularStd-Book';
}

.form-control:-ms-input-placeholder {
    color: rgba(62, 69, 85, 0.5) !important;
    font-family: 'CircularStd-Book';
}

.form-control:-moz-placeholder {
    color: rgba(62, 69, 85, 0.5) !important;
    font-family: 'CircularStd-Book';
}

.form-control.supplier_notes::-webkit-input-placeholder {
    color: rgba(62, 69, 85, 0.5) !important;
    font-family: 'CircularStd-Book';
}

.form-control.supplier_notes::-moz-placeholder {
    color: rgba(62, 69, 85, 0.5) !important;
    font-family: 'CircularStd-Book';
}

.form-control.supplier_notes:-ms-input-placeholder {
    color: rgba(62, 69, 85, 0.5) !important;
    font-family: 'CircularStd-Book';
}

.form-control.supplier_notes:-moz-placeholder {
    color: rgba(62, 69, 85, 0.5) !important;
    font-family: 'CircularStd-Book';
}

body.dark-theme .form-control::-webkit-input-placeholder {
    color: #ffffff !important;
}

body.dark-theme .form-control::-moz-placeholder {
    color: #ffffff !important;
}

body.dark-theme .form-control:-ms-input-placeholder {
    color: #ffffff !important;
}

body.dark-theme .form-control:-moz-placeholder {
    color: #ffffff !important;
}

.tagify.form-control {
    height: auto !important;
}

.searchbox {
    position: relative;
    min-width: 250px;
}

.actions_tops .searchbox {
    max-width: 250px;
    margin-left: auto;
}

.searchbox .form-control {
    padding-right: 35px;
}

.searchbox button {
    border: 0px;
    background: transparent;
    box-shadow: none;
    outline: none;
    position: absolute;
    right: 10px;
    z-index: 1;
    top: 50%;
    transform: translateY(-50%);
    color: #56A8FE;
}

.login .form-control {
    border: none;
    border-radius: 0;
    padding: 10px 9px;
    height: 44px;
}

.login .btn {
    height: 40px;
}

.usrlogin-btn .btn {
    background: #56a8fe;
    width: 210px !important;
    margin: 0 auto !important;
    float: none !important;
    border-radius: 30px;
    color: #fff !important;
}

.lgn-frgt-txt p {
    color: #fff;
}

.login .form-group input:focus,
.login .form-group textarea:focus {
    outline: none;
}

.usrlogin-btn {
    margin-top: 40px;
    margin-bottom: 20px;
}

.rst-pss-btn {
    margin-top: 20px !important;
    margin-bottom: 50px !important;
}

/* ==== SIGNUP PAGE ==== */

/******************************404,500,403,400,405,503 and Invalid Token/******************************/

.not-found {
    background-color: #e7e8e9;
    height: 100vh;
    flex-direction: column;
    align-items: center;
}

.not-found p {
    font-size: 14px;
    letter-spacing: 0.1px;
}

.not-found .found-text {
    font-size: 150px;
    line-height: 150px;
    font-family: 'CircularStd-Book';
    text-shadow: -5px 0px 1px #fff;
}

.not-found .found-text span {
    margin: 0 0 0 -25px;
}

.not-found .found-text i {
    margin: 0 0 0 -30px;
    font-style: italic;
}

.dataTables_filter,
.dataTables_length {
    padding: 10px 0 10px 0;
    margin-bottom: 10px;
}

.dataTables_filter input {
    border-style: solid;
    border-color: rgba(57, 73, 107, 0.3);
    border-width: 1px;
    border-radius: 0;
    padding: 8px 10px;
    font-size: 15px;
}

/* Disable browser close icon for Chrome */
/* input[type="search"]::-webkit-search-cancel-button {
    color: red !important;
    padding: 10px !important;
    background: red !important;
    text-decoration-color: red !important;
    -webkit-appearance: none;
    height: 40px;
    width: 40px;
    background-image: linear-gradient(90deg, transparent 50%, rgba(255, 255, 255, .1) 50%), linear-gradient(0deg, transparent 0%, rgba(1, 1, 1, .2) 50%);
    background-size: cover;
    opacity: 1;
} */

.dataTables_wrapper .dataTables_filter input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    height: 20px;
    width: 20px;
    background-image: url(../images/times.svg) !important;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 0;
    pointer-events: none;
}

.dataTables_wrapper .dataTables_filter input[type="search"]:focus::-webkit-search-cancel-button {
    opacity: 1;
    pointer-events: all;
}

.dataTables_filter label {
    font-size: 14px;
}

.dataTables_paginate {
    padding: 5px 10px 10px 10px;
}

.dataTables_paginate .paginate_button {
    background-color: #ddd;
    margin: 5px 2px;
    padding: 5px 10px;
    display: inline-block;
    color: #222;
    text-decoration: none;
}

/******************************loader******************************/
.loader-outer {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 9999;
    display: block;
}

.loader-outer-cancel {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 9999;
    display: block;
}

.loader {
    animation: spin 2s linear infinite;
    margin: 0 auto;
    border-radius: 50%;
}

.loader-small {
    width: 60px;
    height: 60px;
    border: 6px solid #f3f3f3;
    /* Light grey */
    border-top: 6px solid #56A8FE;
}

.loader-out {
    max-width: 300px;
    padding: 20px;
    background: white;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    display: block;
    border-radius: 4px;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/******************************Modal******************************/

.custom-modal .modal-header {
    background: #56A8FE;
    color: #fff;
}

.custom-modal .modal-content {
    border: 0;
}

.custom-modal .close {
    color: #fff;
    opacity: 1;
    text-shadow: none;
}

/******************************Modal-Confirm******************************/
.modal-confirm {
    color: #636363;
    width: 400px;
}

.modal-confirm .modal-content {
    padding: 20px;
    border-radius: 4px;
    border: none;
    text-align: center;
    font-size: 14px;
}

.modal-confirm .modal-header .close {
    color: #1b1c1e !important;
}

body.dark-theme .modal-confirm .modal-header .close {
    color: #ffffff !important;
}

.modal .modal-dialog.modal-confirm .modal-header {
    background: transparent;
    color: #39496B;
}

.modal .modal-dialog.modal-confirm .modal-header h4 {
    text-align: center;
    font-size: 26px;
    margin: 0 0 -10px;
    flex: 1;
    color: #39496B;
}

body.dark-theme .modal .modal-dialog.modal-confirm .modal-header h4 {
    color: #ffffff;
}

.modal-confirm .close {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    outline: none;
}

.modal-confirm .modal-body {
    color: #999;
    padding: 0 1rem 1rem;
}

.modal-confirm .modal-body p {
    line-height: 18px;
}

.modal-confirm .modal-footer {
    border: none;
    text-align: center;
    border-radius: 4px;
    font-size: 13px;
    padding: 10px 15px 5px;
    justify-content: center;
}

.modal-confirm .modal-footer a {
    color: #999;
}

.modal-confirm .icon-box {
    width: 60px;
    height: 60px;
    margin: 0 auto;
    border-radius: 50%;
    z-index: 9;
    text-align: center;
    border: 3px solid #f15e5e;
}

.modal-confirm .icon-box i {
    color: #f15e5e;
    font-size: 40px;
    display: inline-block;
    margin-top: 8px;
}

.modal-confirm .btn {
    color: #fff;
    background: #60c7c1;
    text-decoration: none;
    transition: all 0.4s;
    line-height: normal;
    min-width: 120px;
    border: none;
    min-height: 40px;
    border-radius: 4px;
    margin: 0 5px;
    outline: none !important;
}

.modal-confirm .btn {
    line-height: initial;
}

.modal-confirm .a {
    color: #fff;
    border-radius: 4px;
    background: #60c7c1;
    text-decoration: none;
    transition: all 0.4s;
    line-height: normal;
    min-width: 120px;
    border: none;
    min-height: 40px;
    border-radius: 4px;
    margin: 0 5px;
    outline: none !important;
}

.modal-confirm .btn-info {
    background: #c1c1c1;
}

.modal-confirm .btn-info:hover,
.modal-confirm .btn-info:focus {
    background: #a8a8a8;
}

.modal-confirm .btn-danger {
    background: #f15e5e;
}

.modal-confirm .btn-danger:hover,
.modal-confirm .btn-danger:focus {
    background: #ee3535;
}

/* ------------------------------------------------------------------
   SA059 confirmation modal (resources/views/common/confirm_action_modal.blade.php)

   Confirm-then-POST prompt for state-changing actions. It reuses .modal-confirm
   for base layout, so everything below is namespaced under .confirm-action-modal
   to avoid restyling #confirm-modal, the red delete prompt in
   resources/views/common/modals.blade.php.
   ------------------------------------------------------------------ */

/* Default (amber) — a "do you want to continue?" prompt, not a warning. */
.confirm-action-modal .icon-box {
    border-color: #F5A623;
    /*
       Centre the glyph on both axes here rather than trying to hit it with line-height
       and margins on the icon itself. The shared `.modal-confirm .icon-box i` rule above
       is 2 classes + a type selector, so it outranked the 2-class override that used to
       live here and kept applying its own font-size and margin-top:8px — which is what
       pushed the icon low in the circle. Flex centring is independent of the glyph's own
       metrics, so `?` and the warning triangle both sit true.
    */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Three classes, so this reliably outranks `.modal-confirm .icon-box i` (0,2,1). */
.confirm-action-modal .icon-box .confirm-action-icon {
    color: #F5A623;
    font-size: 28px;
    line-height: 1;
    margin: 0;
}

.confirm-action-modal .confirm-action-submit {
    background: #F5A623;
    /* Dark label: white on this amber is only 2:1, which fails WCAG AA. This is 8.6:1. */
    color: #1a1a1a;
    font-weight: 600;
}

.confirm-action-modal .confirm-action-submit:hover,
.confirm-action-modal .confirm-action-submit:focus {
    background: #DB9312;
    color: #1a1a1a;
}

.confirm-action-modal .confirm-action-submit:disabled {
    opacity: .65;
    cursor: not-allowed;
}

/* Destructive variant — irreversible deletes must not read as a neutral "continue?". */
.confirm-action-modal.confirm-action-danger .icon-box {
    border-color: #DC3545;
}

.confirm-action-modal.confirm-action-danger .icon-box .confirm-action-icon {
    color: #DC3545;
}

.confirm-action-modal.confirm-action-danger .confirm-action-submit {
    /* #DC3545 clears 4.5:1 against white; the .modal-confirm red (#f15e5e) is only 3.2:1. */
    background: #DC3545;
    color: #fff;
}

.confirm-action-modal.confirm-action-danger .confirm-action-submit:hover,
.confirm-action-modal.confirm-action-danger .confirm-action-submit:focus {
    background: #BD2130;
    color: #fff;
}

/*
   .modal-confirm is a fixed 400px, which leaves ~310px for both buttons once the 20px
   content padding, 15px footer padding and 5px button margins are taken out. A long
   label (the old "Delete Branding Methods" button) overran that and spilled past the
   button edge. Wrapping plus normal white-space makes the footer degrade gracefully
   instead — keep labels short and this never triggers.
*/
.confirm-action-modal .confirm-action-footer {
    flex-wrap: wrap;
}

.confirm-action-modal .confirm-action-footer .btn {
    white-space: normal;
    max-width: 100%;
}

.trigger-btn {
    display: inline-block;
    margin: 0;
}

.text-muted {
    display: block;
}

.parsley-errors-list {
    color: red;
    margin: 5px 0 0 0;
    font-size: 14px;
    line-height: normal;
}

#all-products-container .custom-table .error-qty {
    color: red;
    font-size: 14px;
}

#all-products-container #error-order {
    color: red;
    font-size: 14px;
}

#split-order-form .split-btns {
    float: right;
    margin-top: 13px;
}

.dataTables_processing {
    top: 64px !important;
    z-index: 11000 !important;
    background: #fff;
    border: solid 1px #ddd;
    font-size: 14px;
}

.flex-container {
    display: flex;
    margin: 0 -5px;
    flex-wrap: wrap;
}

.flex-container>a {
    margin: 5px;
    padding: 5px 10px;
    font-size: 30px;
    border: solid 1px #e6e5e5;
    width: 6%;
}

.flex-container>a img {
    vertical-align: middle;
}

.question-mark p {
    color: #fff;
    font-size: 16px;
    line-height: normal;
    margin: 0 0 0 15px;
}

.question-mark a {
    padding: 0;
    font-size: 16px;
    display: inline-block !important;
}

.question-mark a:focus,
.question-mark a:hover,
.question-mark a:active {
    text-decoration: none;
    color: #25a9e0;
}

.question-mark img {
    align-self: center;
}

.custom-multi-select .dropdown-toggle {
    line-height: 15px;
    font-size: 14px;
    padding: 0 9px !important;
    min-height: 40px;
}

.new-customer {
    color: #56A8FE;
}

.new-customer:focus,
.new-customer:hover,
.new-customer:active {
    color: #231f20;
    text-decoration: none;
}

.custom-multi-select .bootstrap-select .dropdown-menu li small {
    padding-left: 0;
    font-size: 13px;
    padding: 3px 0 0 0;
}

.custom-multi-select .bootstrap-select .dropdown-menu {
    background: #fff;
    border: solid 2px #e6e5e5;
    border-top: 0;
}

.custom-multi-select .bootstrap-select .dropdown-menu li a {
    padding: 8px 10px;
}

.imp-note {
    color: red;
    display: block;
    margin: 5px 0;
    font-size: 14px;
}

.avtar-name span {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    max-width: 100px;
    display: inline-block;
    font-family: CircularStd-Book;
    line-height: 1.2;
}

.avtar-name a {
    border: 0 !important;
}

.avtar-name .dropdown-menu li a {
    padding: 10px 25px 10px 20px;
    text-transform: capitalize;
    margin: 0;
    font-size: 14px;
    font-family: 'CircularStd-Book', sans-serif;
}

.navbar-light .navbar-toggler {
    border-color: #fff;
    background: #fff;
}

.parsley-required,
.parsley-type {
    margin: 5px 0 0 0;
    font-size: 14px;
    line-height: normal;
}

.custom-dropzone {
    margin-bottom: 25px;
}

.btn {
    border-radius: 4px;
}

.h-auto {
    height: auto !important;
}

.custom-multi-select .inner.show {
    max-height: 200px;
}

.login .navbar-brand {
    width: 400px;
    margin: 0;
    text-align: center;
    padding: 10px 0 22px 7px;
    font-size: 40px;
    color: #fff;
    position: relative;
}

.login .navbar-brand:after,
.new-company-welcome .navbar-brand:after {
    content: "";
    width: 37%;
    height: 3px;
    background: #56a8fe;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 0);
}

.new-company-welcome .navbar-brand {
    width: 400px;
    margin: 0;
    text-align: center;
    padding: 10px 0 22px 7px;
    font-size: 40px;
    position: relative;
}

.custom-select-box .dropdown-menu.show {
    border-top: 0;
    border-radius: 4px;
    font-size: 14px;
    min-width: 100% !important;
    transform: none !important;
}

.add-pro-custom .custom-select-box .select2-container {
    width: 100% !important;
}

.custom-select-box .dropdown-menu .inner.show {
    max-height: 400px !important;
}

.custom-select-box.rpt-mngr .dropdown-menu .inner.show {
    max-height: 170px !important;
}

.custom-select-box.brd-theme .dropdown-menu .inner.show {
    max-height: 170px !important;
}

.custom-select-box.store-ids-select .dropdown-menu .inner.show {
    max-height: 170px !important;
}

.filter-group-box .custom-select-box.custom-select-box-arrow {
    padding: 0 !important;
}

.orderfilter-box .filter-group-box .form-group .form-control {
    padding: 0 30px 0 10px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px;
}

.filter-group-box .custom-select-box.custom-select-box-arrow:before {
    content: "\f0d7";
    font-family: "FontAwesome" !important;
    position: absolute;
    right: 15px;
    top: calc(50% - 8px);
    color: #56A8FE;
    z-index: 1;
    pointer-events: none;
}

.orderfilter-box .filter-group-box {
    padding: 0 !important;
    justify-content: space-between;
}

.orderfilter-box .sidebar-body {
    max-height: calc(100vh - 121px);
    min-height: calc(100vh - 121px);
    padding-bottom: 50px;
}

.supplier-qty.modify-row .custom-select-box .dropdown-menu .inner.show {
    max-height: 250px !important;
}

.custom-table.data-table-btn .btn {
    font-size: 14px;
    padding: 5px 12px 5px 12px;
    font-weight: normal;
    font-family: 'CircularStd-Book';
    min-width: 120px;
    color: #fff;
    border-radius: 4px;
    text-align: center;
    height: auto;
    line-height: 20px;
}

.custom-table.data-table-btn .btn+.btn {
    margin-left: 5px;
}

.custom-table i.far {
    font-size: 16px !important;
    padding: 0 5px;
}

.custom-table td a:hover {
    text-decoration: none;
}

.action-flex {
    display: flex;
    align-items: center;
}

#toast-container>div {
    width: 400px;
}

.custom-multi-select span.text {
    white-space: nowrap;
    word-break: break-word;
}

.product-select .filter-option-inner-inner {
    text-overflow: ellipsis;
    display: block;
    width: 280px;
    white-space: nowrap;
    padding: 0 45px 0 0;
}

.custom-multi-select .filter-option-inner-inner {
    text-overflow: ellipsis;
    display: block;
    width: auto;
    white-space: nowrap;
    padding: 0 45px 0 0;
}

.nowarp {
    white-space: nowrap;
}

.custom-top {
    top: 80px;
}

#toast-container ul {
    margin-right: 20px;
}

.o-height {
    min-height: 70px;
    overflow-y: auto;
    height: 70px;
}

.dataTables_paginate {
    float: left !important;
}

/*.dataTables_processing {
    top: 64px !important;
    z-index: 11000 !important;
}

.dataTables_processing {
    background: rgba(0, 0, 0, 0.7);
    width: 100% !important;
    height: 100%;
    top: 0 !important;
    left: 0 !important;
    right: 0;
    margin: 0 auto !important;
    padding: 0 !important;
    font-size: 0;
}

.dataTables_processing:before {
    content: 'Loading records...';
    font-size: 25px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    color: #fff;
}*/

.dataTables_wrapper {
    position: relative;
}

.nav-tabs .nav-link.active {
    background: transparent;
}

.nav-link.active {
    font-family: CircularStd-Book;
    color: #12203E !important;
    opacity: 1;
}

.nav-link {
    font-family: CircularStd-Book;
    font-size: 15px;
    color: #12203E;
    opacity: 0.6;
}

.custom-tab.nav-tabs .nav-item .nav-link.active {
    border-color: #22232F !important;
    position: relative;
    opacity: 1;
}

.custom-tab.nav-tabs .nav-item .nav-link.active:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #56A8FE;
    bottom: -2.5px;
    left: 0;
}

.order-date {
    position: relative;
}

.order-date .input-group-addon {
    position: absolute;
    right: 9px;
    top: 8px;
    z-index: 8;
}

.artwork-b {
    display: flex;
    flex-direction: row;
    margin: 0 0 10px;
    flex: 0 0 33.33%;
    padding: 0 5px;
}

.artwork-outer .artwork-b {
    flex: auto;
    text-align: center;
}

.artwork-b .art-work-inner {
    border: solid 1px #ddd;
    padding: 10px;
}

.artwork-b .art-work-infor {
    padding-left: 10px;
}

.artwork-b .art-work-infor .a-name {
    font-family: 'CircularStd-Book';
    font-size: 15px;
    display: block;
}

.artwork-b .art-work-infor .a-note {
    display: block;
    font-size: 12px;
    margin: 18px 0 5px 0;
}

.artwork-b .art-work-infor .c-dwnlod {
    background: #56A8FE;
    color: #fff;
    text-decoration: none !important;
    display: inline-block;
    padding: 8px 15px 8px 15px;
    font-size: 13px;
}

.artwork-b .art-work-infor .c-preview {
    color: #fff;
    text-decoration: none !important;
    display: inline-block;
    padding: 5px 15px 5px 15px;
    font-size: 13px;
    height: 30px;
}

.artwork-b span {
    font-size: 13px;
    margin-top: 5px;
}

.custom-multi-select .filter-option-inner-inner small {
    padding: 2px 0 0 0;
}

.custom-select-box select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.custom-select-box {
    position: relative;
    width: 100%;
}

.custom-select-box select {
    width: 100%;
    height: 40px;
    padding: 0 10px;
    cursor: pointer;
}

.custom-select-box:before {
    content: "\f002";
    font-family: "FontAwesome" !important;
    position: absolute;
    right: 15px;
    top: calc(50% - 8px);
    color: #56A8FE;
    z-index: 1;
    pointer-events: none;
}

.tagify.custom-select-box:before {
    top: 12px;
}

.custom-select-box.approve-custom-select .dropdown-toggle {
    height: 35px;
    padding: .375rem .75rem;
    font-size: 14px;
    background-color: #ffffff;
}

.custom-select-box.approve-custom-select:before { content: "\f0d7";
    font-family: "FontAwesome" !important;
    position: absolute;
    right: 15px;
    top: calc(50% - 8px);
    color: #3E4555;
    z-index: 1;
    pointer-events: none; }

.production-popup .modal-dialog {
    width: 1200px;
    max-width: 96%;
}

.doc-popup .modal-dialog {
    width: 1200px;
    max-width: 96%;
}

.custom-select-box .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    text-overflow: ellipsis;
    padding-right: 39px;
    color: #3E4555;
    font-size: 14px;
}

.custom-select-box.custom-dropdown-approve .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    font-family: 'Roboto', sans-serif;
}

body.dark-theme .custom-select-box .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    color: #ffffff;
}

.custom-select-box .dropdown-toggle::after {
    border-bottom: 0;
    display: none;
}

.custom-card {
    box-shadow: 0px 0 6px rgba(0, 0, 0, 0.2);
    margin: 0 0 30px 0;
    position: relative;
}

.bar-box {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 0 0 0 12px;
    position: relative;
}

.bar-box span {
    padding-right: 5px;
    position: absolute;
    left: 0;
    font-size: 12px;
}

.bar-box .skills.sky-bar {
    background-color: #00adef;
}

.bar-box .skills.blue-bar {
    background-color: #2c3792;
}

.bar-box .skills.ornage-bar {
    background-color: #f14623;
}

.bar-box .skills.yellow-bar {
    background-color: #f9a72b;
}

.bar-box .skills.pink-bar {
    background-color: #ee127b;
}

.bar-box .skills.purple-bar {
    background-color: #5d2491;
}

.bar-box .skills {
    text-align: right;
    padding-top: 13px;
    padding-bottom: 13px;
    color: white;
}

.round-icon {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    padding: 0 !important;
    margin: 0;
}

.round-icon.ornage-icon {
    background-color: #f14623;
}

.round-icon.yellow-icon {
    background-color: #f9a72b;
}

.round-icon.sky-icon {
    background-color: #00adef;
}

.round-icon.blue-icon {
    background-color: #2c3792;
}

.round-icon.gray-icon {
    background-color: #a7a6a6;
}

.round-icon.pink-icon {
    background-color: #ee127b;
}

.round-icon.purple-icon {
    background-color: #5d2491;
}

.filter-panel div {
    padding: 0 5px 10px 5px;
}

.filter-panel {
    font-size: 15px;
    position: absolute;
    right: 20px;
    top: 15px;
    z-index: 1;
}

.dataTables_paginate .paginate_button:hover {
    background: #56A8FE;
    color: #fff;
}

/* FILTER DESIGN */
.filtrbox {
    padding: 0 !important;
}

.filtrbox.fltr-value input {
    border: 1px solid #cacaca !important;
    font-size: 12px;
    padding: 6px 6px 6px 18px;
    height: 40px;
    border-radius: 0px;
}

.filtrbox.fltr-value input:focus {
    outline: none !important;
}

.fltr-ordr-vl {
    display: flex;
    align-items: center;
    padding-bottom: 0 !important;
    margin-bottom: 6px;
    gap: 5px;
}

.fltr-ordr-vl span {
    width: 34px;
    flex: none;
    font-size: 14px;
}

.fltr-ordr-vl input {
    width: 100px;
}

.fltr-ordr-vl-input {
    position: relative;
    padding-bottom: 0 !important;
}

.fltr-ordr-vl-input:before {
    content: var(--currency-sym, "$");
    top: 13px;
    position: absolute;
    left: 13px;
    font-size: 13px;
}

/*checkbox*/
.cus-chk-block {
    float: left;
    width: 100%;
}

.cus-chk-block input[type="checkbox"] {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    margin: 0;
    display: none;
}

.cus-chk-block .cus-chklabel {
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: normal;
}

.cus-chk-block .cus-chklabel::before {
    vertical-align: middle;
    width: 17px;
    height: 17px;
    background: url(../images/checkbg3.png) 0 -19px no-repeat;
    display: inline-block;
    content: "";
    background-size: cover;
}

.cus-chk-block input[type="checkbox"]:checked+label::before {
    width: 17px;
    height: 17px;
    border: 1px solid #5f5f5f;
    border: 0;
    background: url(../images/checkbg3.png) left 0 no-repeat;
    padding: 2px;
    display: inline-block;
    content: "";
    background-size: cover;
}

.cus-chk-block .cus-chklabel p a {
    color: #56A8FE;
}

.cus-chk-block .cus-chklabel p {
    display: inline-block;
    width: calc(100% - 27px);
    margin: 0 0 0 10px;
    vertical-align: top;
}

.filter-panel .fa-calendar {
    padding: 0 5px 0 0;
}

.filter-panel .fa-caret-down {
    padding: 0 0 0 5px;
}

ul .avtar-name .dropdown-menu.show {
    left: inherit;
    right: 0;
}

.quote-response-textarea {
    height: 104px !important;
    min-height: 104px !important;
    resize: vertical;
}

@-moz-document url-prefix() {
    .filter-panel {
        font-size: 14px;
    }

    div.dataTables_wrapper div.dataTables_filter input {
        width: 42%;
    }
}

.new-row {
    display: flex;
}

.new-row>div {
    margin: 0 5px;
}

.cus-row.product-row .supplier-qty.modify-row {
    flex: 0 0 36%;
}

.f-47 {
    flex: 0 0 47%;
}

.f-48 {
    flex: 0 0 48%;
}

.button-outer {
    text-align: center;
}

.button-outer ul li span {
    display: block;
    width: 100%;
    margin-bottom: 15px;
}

.button-outer ul li {
    display: inline-block;
}

button.approve-btn {
    background: #00a651;
    border-radius: 4px;
    color: #fff;
    font-size: 16px;
    border: 0;
    padding: 0 50px 0 15px;
    line-height: 40px;
    margin: 0 10px;
    position: relative;
}

button.approve-btn i,
button.change-btn i {
    font-size: 20px;
    margin: 0 0 0 5px;
    position: absolute;
    right: 15px;
    top: 9px;
}

button.change-btn {
    background: #56A8FE;
    border-radius: 4px;
    color: #fff;
    font-size: 16px;
    border: 0;
    padding: 0 50px 0 15px;
    line-height: 40px;
    margin: 0 10px;
    position: relative;
}

button.approve-btn:hover,
button.change-btn:hover,
.company-info ul li button.email-btn:hover {
    opacity: 0.8;
    cursor: pointer;
}

.company-info {
    border: solid 1px #e0e0e2;
    padding: 12px;
    margin-top: 50px;
    font-size: 16px;
    text-align: center;
}

.company-info ul {
    margin-top: 15px;
}

.company-info ul li {
    display: inline-block;
}

.company-info ul li button.email-btn {
    border: solid 1px #cfd0d2;
    background: transparent;
    border-radius: 4px;
    padding: 0 15px;
    line-height: 35px;
    color: #19adee;
    margin: 0 30px 0 0;
}

.company-info ul li a.email-btn {
    border: solid 1px #cfd0d2;
    background: transparent;
    border-radius: 4px;
    padding: 0 15px;
    line-height: 35px;
    color: #19adee;
    margin: 0 30px 0 0;
    display: inline-block;
}

.company-info ul li a.email-btn:hover {
    text-decoration: none;
    background: #19adee;
    color: #fff;
    border-color: #19adee;
}

.l-red {
    background: #ee1c25;
    color: #fff;
}

.l-light-green {
    background: #6bca52;
    color: #fff;
}

.l-light-red {
    background: #d87575;
    color: #fff;
}

.l-red i {
    padding: 0 0 0 5px;
}

.approval-btn {
    width: 100%;
    font-size: 18px;
}

.big-title {
    font-size: 25px !important;
    margin: 0 0 10px 0;
}

.attachment-action {
    padding: 10px 0 0 0;
}

.attachment-action .form-group {
    width: auto;
    display: inline-block;
}

.attachment-action .form-group.flex {
    display: inline-flex;
    padding: 0 0 0 90px;
}

.attachment-action .form-group .custom-label {
    line-height: 22px;
    margin: 0;
    font-family: 'CircularStd-Book';
}

.attachment-action .fancy-radio {
    font-size: 14px;
    padding: 0 0 0 25px;
}

.billing-note {
    font-size: 14px;
}

.preview-div {
    width: 49%;
    display: inline-block;
    text-align: center;
}

.border-less td,
.border-less th {
    border: none;
    border-top: none;
}

.btn-remove,
.btn-add {
    width: 34px;
    height: 34px;
    padding: 4px;
}

.create-new-icon {
    position: absolute;
    left: 10px;
}

.blue-btn {
    background: #56A8FE;
    color: #fff;
    width: 32px;
    line-height: 44px;
    text-align: center;
    font-size: 14px;
    cursor: pointer;
}

.d-flex {
    display: flex;
    align-items: center;
}

.flex-start {
    align-items: flex-start;
}

.flex-end {
    justify-content: flex-end;
}

.justify-content-between {
    justify-content: space-between;
}

.flex-100 {
    flex: 0 0 100%;
    max-width: 100%;
}

.d-flex .fancy-radio {
    margin: 0 15px 0 0;
}

.bold {
    padding: 0 0 8px 0;
    display: inline-block;
    color: #575F76;
    font-family: 'CircularStd-Bold';
}

.dark-theme .bold {
    color: #e5e6e8 !important;
}

.span {
    font-size: 12px;
}

.small-label {
    font-size: 14px
}

.p0 {
    padding: 0;
}

.cuttom-drp .dropdown-menu.show {
    padding: 5px 0;
}

.cuttom-drp .dropdown-menu {
    background: #fff;
    border: solid 1px #ddd;
}

.cuttom-drp .dropdown-menu-in {
    display: flex;
    font-size: 12px;
    padding: 5px 10px;
}

.cuttom-drp .dropdown-menu-in a {
    color: #3e4555;
    text-decoration: none !important;
    display: block
}

.cuttom-drp .dropdown-menu-in button {
    display: block;
    background: transparent;
    border: none;
    white-space: nowrap;
    padding: 0;
    cursor: pointer;
}

/* NEW CSS ADDED  */
body {
    background: #F5F7FC;
    color: #22232F;
}

p {
    font-size: 14px;
    color: #231F20;
    line-height: 18px;
    margin-bottom: 5px;
}

a,
a:hover {
    color: #56A8FE;
}

.container.new-ui-page {
    padding: 10px 15px;
    padding-top: 0;
}

.com-info-txt {
    display: flex;
    align-items: flex-start;
    margin: 20px 0;
}

.com-info-txt p+br {
    display: none;
}

.com-info-txt div p:last-child {
    margin-bottom: 0px;
}

.com-info-txt i.fa {
    color: #56A8FE;
    font-size: 18px;
    margin-right: 10px;
}

.title-container.row {
    display: flex;
    align-items: center;
}

.form-con-box .title-container {
    border-bottom: 1px solid #D0D2D3;
    padding-bottom: 8px;
    margin-bottom: 15px;
}

.form-con-box .title-container .title {
    font-size: 18px;
    margin-right: 10px;
    font-family: 'CircularStd-Book';
    letter-spacing: 0.5px;
}

.brng-lgimg img {
    width: auto;
    height: auto;
    min-width: auto;
    max-width: 200px;
    min-height: auto;
    max-height: 500px;
}

.accntg-app-int-page .form-con-box {
    background: #fff;
    padding-bottom: 10px;
}

.card-block-section {
    background: #fff;
    padding: 20px;
    margin-bottom: 20px;
    border: 1px solid rgba(57, 73, 107, 0.3);
}

.card-block-section .title-container {
    justify-content: normal;
}

.btn.add-new {
    background: #56A8FE;
    color: #fff;
}

.custom-border {
    border: 1px solid #CECFD0;
    border-radius: 4px;
}

.btn-light {
    color: #212529;
    border: 1px solid #CECFD0;
    background-color: #f8f9fa;

}

.custom-btn:hover {
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.20);
    transform: translateY(-1px);
}

.btn-save.btn.add-new.green-bg .btn-save {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    opacity: 0;
    cursor: pointer;
}

button.btn-save.btn.add-new {
    background: #44ae1f;
}

.btn.add-new i.fa,
.right-con i.fa {
    font-family: FontAwesome !important;
    font-weight: 500;
}

.btn.add-new span {
    font-size: 15px;
    padding: 0px 15px;
    font-family: CircularStd-Book;
    color: #FFFFFF;
    letter-spacing: 0;
    display: inline-block;
}

.ci-adrs textarea {
    min-height: 100px;
    max-height: 100px;
}

.form-group input:focus,
.form-group textarea:focus {
    border: 2px solid #56A8FE !important;
}

.ci-ftr-btn {
    justify-content: flex-end !important;
}

.aly-clr-btn .float-left {
    margin-right: 20px;
}

a.btn-save.btn.add-new {
    background: #44ae1f;
}

a.btn-cancel i.fa {
    font-family: 'CircularStd-Book';
}

.dropdown-toggle::after {
    content: "";
    border-top: 0.55em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
    right: -5px;
    position: absolute;
    top: calc(50% - 5px);
    color: #56A8FE;
}

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

.errow_none #open_toggle {
    display: block;
    top: 2px;
}

.find-txt-stng {
    margin: 10px 0;
}

.find-txt-stng h4 {
    font-size: 20px;
    margin-bottom: 25px;
    font-family: 'CircularStd-Book', sans-serif;
}

.find-txt-stng a {
    font-size: 14px;
    padding: 10px 50px;
    background: #fff;
    box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.03);
    border-radius: 4px;
}

/* ==== FOOTER SECTION ===== */

.footer {
    width: 100%;
    background: #272732;
    height: 50px;
    display: flex;
    align-items: center;
    position: fixed;
    bottom: 0;
    z-index: 201;
}

.footer-info {
    display: flex;
    justify-content: space-between;
}

.footer-info .left-con span {
    font-size: 14px;
    color: #fff;
    margin-right: 5px;
}

.footer-info .left-con a {
    font-size: 14px;
    color: #56A8FE;
}

.footer-info .right-con a {
    font-size: 14px;
    color: #fff;
    margin-right: 15px;
}

.footer-info .right-con a:last-child {
    margin-right: 0
}

.footer-info .right-con i.fa {
    color: #fff;
    font-size: 28px;
    margin-right: 10px;
}

.footer-info .left-con,
.footer-info .right-con {
    display: flex;
    align-items: center;
}

.footer-info .right-con a:after {
    content: "|";
    position: relative;
    right: -9px;
}

.footer-info .right-con a:last-child:after {
    display: none;
}

/* ==== PROFILE MENU ===== */
.profile-menu {
    position: relative;
}

.profile-box {
    display: flex !important;
    align-items: center;
    color: #fff;
    cursor: pointer;
}

.profile-menu .profile-nav {
    margin-top: 0;
}

.profile-info {
    margin-right: 18px;
}

.profile-menu .dropdown-toggle::after {
    right: 3px;
}

.profile-name {
    font-size: 14px;
    max-width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.profile-info .dropdown-toggle::after {
    top: calc(50% - 3px)
}

figure.profile-img {
    padding: 1px;
    width: 49px;
    height: 49px;
    border-radius: 50%;
    margin-right: 6px;
    background: linear-gradient(90deg, rgba(218, 69, 73, 1) 0%, rgba(105, 52, 113, 1) 50%, rgba(69, 47, 126, 1) 100%);
}

.profile-img-bg {
    width: 47px;
    height: 47px;
    border-radius: 50%;
    overflow: hidden;
    vertical-align: middle;
}

figure.profile-img img {
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    max-width: 100%;
    max-height: 100%;
}

.profile-name {
    font-size: 14px;
}

.profile-nav {
    margin-top: 4px;
}

.profile-nav ul {
    display: flex;
    background: #22232F !important;
}

.profile-nav ul li {
    margin-right: 8px;
}

.profile-nav ul li a {
    font-size: 12px;
    color: #fff;
    margin-right: 5px;
}

.profile-nav ul li:hover a {
    background: none !important;
}

.profile-nav ul li a i.fa {
    font-size: 16px;
    margin-right: 8px;
    color: #fff;
    position: relative;
    top: -2px;
}

.profile-nav ul li:hover a,
.profile-nav ul li:hover a i.fa {
    background: #56A8FE !important;
    transition: all 0.5s ease;
    color: #fff;
}

/* ==== CARD DESIGN CSS ==== */
.card {
    border: none;
    box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.03);
    border-radius: 4px;
}

.card-header {
    border: none;
    background: none;
    padding: 10px 10px;
    border-bottom: 1px solid #D0D2D3;
}

.card-body {
    padding: 10px 10px;
}

.card-title {
    font-family: 'CircularStd-Book', sans-serif;
    font-size: 20px;
}

.card-body .link-nav {
    margin: 10px 0 0 0;
}

.card-body .link-nav li {
    display: inline;
}

.card-body .link-nav li:after {
    content: "|";
    color: #56A8FE;
}

.card-body .link-nav li:last-child:after {
    display: none;
}

.card-body .link-nav li a {
    font-size: 14px;
    color: #56A8FE;
}

.setting-page .card {
    margin: 20px 0;
}

.chk-ttl-inline {
    font-size: 14px;
    font-family: 'CircularStd-Book';
    color: #231F20;
    padding-right: 0px;
    display: flex;
    flex: 0 0 100%;
    width: 100%;
    align-items: center;
    line-height: 20px;
    margin-bottom: 10px;
}

.flex-auto {
    flex: 0 0 auto !important;
    width: auto !important;
}

.com-info-txt p {
    font-size: 14px;
    color: #929497;
}

.com-info-txt p strong {
    font-family: 'CircularStd-Book';
}

.card-block-section .com-info-txt i.fa {
    color: #BBBDBF;
    font-size: 18px;
}

.card-block-section .com-info-txt {
    align-items: normal;
    margin-bottom: 5px;
    margin-top: 8px;
}

.red-txt {
    color: #FF7979 !important;
}

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

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

.card-block-section.m-t-10 .title-container p {
    margin-left: 30px;
    font-size: 13px;
}

.card-block-section.m-t-10 .title-container p a {
    font-size: 13px;
}

.sendto-box input {
    font-size: 13px;
    color: #BBBDBF;
    padding: 5px 8px;
    border-radius: 0;
    flex: 0 0 100%;
    width: 100%;
    margin-top: 5px;
}

.sendto-box {
    display: flex;
    font-size: 14px;
    color: #231F20;
    align-items: center;
    margin-top: 10px;
}

.sendto-box span {
    width: 70px;
    font-family: 'CircularStd-Medium';
}

span.chk-ttl-inline i.fa {
    color: #56A8FE;
    font-size: 21px;
    margin-right: 6px;
}

.sendto-box+.com-info-txt {
    margin-top: 10px;
}

/* CUSTOME NAVBAR */

.custom-tab.nav-tabs {
    margin-bottom: 20px;
}

.nav-tabs {
    border-bottom: 0
}

.custom-tab.nav-tabs .nav-item {
    margin-bottom: 0;
}

.custom-tab.nav-tabs .nav-link {
    border-radius: 0;
    border: none;
    color: #22232F;
    opacity: 1;
    font-family: 'CircularStd-Book', sans-serif;
    white-space: nowrap;
    display: flex;
    align-items: center;
}

.tab-filter-grps {
    display: flex;
    width: auto;
    align-items: center;
    justify-content: flex-end;
    position: absolute;
    right: 20px;
    margin: 13px 0 0 0;
    text-align: right;
}

.search-all-box {
    width: 200px;
    position: relative;
}

.search-all-box span {
    position: absolute;
    right: 0;
    z-index: 1;
    font-size: 12px;
    margin: 11px 10px 0 0;
    cursor: pointer;
    color: #56A8FE;
}

.search-all-box input {
    border: 1px solid #d9d9d9;
    padding: 9px;
    color: #6d6e70;
    font-size: 13px;
    height: 31px;
    width: 200px;
}

.table-filter-box {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.dropdown-content.dropdown-menu {
    display: none !important;
}

.dropdown-content.dropdown-menu.show {
    display: block !important;
}

.dropdown-content form,
.dropdown-content div {
    cursor: pointer;
    position: relative;
    border-bottom: 1px solid #d7d7d7;
}

.bulk-actn-grpsbox .dropdown .dropdown-content {
    min-width: 180px;
    z-index: 3;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.45) !important;
}

.dark-theme .bulk-actn-grpsbox .dropdown-content [type=submit],
.dark-theme .bulk-actn-grpsbox .dropdown-content a {
    background: #22232f;
    color: #56A8FE;
}

body.dark-theme .ordr-actndw.ttl-drdwn .dropdown-item,
body.dark-theme .dropdown-content div,
body.dark-theme .dropdown-content form:last-child {
    border-bottom: 1px solid #333333;
}

body.dark-theme .brand_ref * {
    color: #ffffff;
}

body.dark-theme .product-supplier-detail .product-supplier--head .inn h3 {
    color: #ffffff !important;
    background: #22232F;
}

.dark-theme .bulk-actn-grpsbox .dropdown-content [type=submit]:hover {
    background: #353439;
    color: #dadada;
}

.bulk-actn-grpsbox .dropdown-content form:focus {
    outline: none;
}

.bulk-actn-grpsbox .dropdown-content [type=submit],
.bulk-actn-grpsbox .dropdown-content a {
    text-align: left;
    border: none;
    background: #fff;
    padding: 5px;
    color: #56A8FE;
    padding: 10px 15px;
    text-decoration: none;
    display: block;
    font-size: 14px;
    margin: 0;
    width: 100%;
    cursor: pointer;
}

.bulk-actn-grpsbox .dropdown {
    margin-right: 70px;
}

/*
.orderfilter-box {
    position: absolute;
    background: #fff;
    padding: 15px;
    width: 100%;
    box-sizing: border-box;
    z-index: 2;
    margin-top: -20px;
    border-bottom: 1px solid #C2C2C2;
}*/

.orderfilter-box {
    width: 100%;
    width: 530px;
    height: 100%;
    border-left: 1px solid #f7f5f6;
    background: #fff;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 999;
    box-shadow: 0 5px 12px 0 rgb(0 0 0 / 10%);
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    visibility: visible;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    border-radius: 0;
    max-width: 90%;
}

body.sidebar-open-filter {
    overflow: hidden;
}

body.sidebar-open-filter:after {
    content: "";
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9;
}

body.sidebar-open-filter #global-search-filter {
    visibility: visible;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    right: 0;
}

.order-search-filter-row.lead-tab-hidden,
.lead-search-filter-row.lead-tab-hidden {
    display: none !important;
}
.order-search-filter-row.lead-tab-visible,
.lead-search-filter-row.lead-tab-visible {
    display: flex !important;
}

#lead-filter-panel .filtrbox.fltr-date .ins-date-box {
    cursor: pointer;
    min-height: 40px;
}
#lead-filter-panel .filtrbox.fltr-date .ins-date-box:focus {
    outline: none;
    border-color: #cacaca;
}

body.sidebar-open-lead-filter {
    overflow: hidden;
}

body.sidebar-open-lead-filter:after {
    content: "";
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9;
}

body.sidebar-open-lead-filter #lead-filter-panel {
    visibility: visible;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    right: 0;
}

body.sidebar-open-filter1 {
    overflow: hidden;
}

body.sidebar-open-filter1:after {
    content: "";
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9;
}

body.sidebar-open-filter1 .orderfilter-box {
    visibility: visible;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    right: 0;

}

.sidebar-open-filter .daterangepicker {
    right: 20px !important;
}

button.btn.btn-outline-info.add-new.green-bg {
    border-color: #44ae1f !important;
}

.sidebar-open-filter .daterangepicker.opensright:before {
    left: auto;
    right: 8px;
}

.sidebar-open-filter .daterangepicker.opensright:after {
    left: auto;
    right: 9px;
}

/* tags.tagify.form-control.tagify--outside {
    background: #f5f6f6 !important;
} */

.orderfilter-box .tagify__input {
    background: #fff !important;
}

.filtrbox.fltr-date .ins-date-box {
    border: 1px solid #cacaca !important;
    font-size: 13px;
    padding: 6px 6px 6px 11px;
    margin-right: 0;
    width: 100%;
    height: 40px;
    background: #fff;
    border-radius: 4px;
}

.filtrbox.fltr-date .ins-date-box .custom-select-box {
    width: 100%;
}

.filtrbox.fltr-date .ins-date-box .fa {
    position: absolute;
    right: 4px;
}

.filtrbox.fltr-date .ins-date-box>span {
    line-height: 16px;
}

.orderfilter-box .filter-panel .filtrbox .form-group {
    margin-bottom: 10px;
}

.acknow-mdl-body {
    background: #F5F5F5;
}

.acknow-mdl-body .custom-table tbody td:last-child {
    padding-right: 10px;
}

.acknow-mdl-body .table-responsive .custom-table tbody td:last-child {
    background: transparent !important;
}

.custom-select-box.splr-wh-clr {
    position: relative;
}

.custom-select-box.splr-wh-clr i.fa {
    right: 39px;
    top: 9px;
    position: absolute;
    z-index: 1;
    color: #56A8FE;
    cursor: pointer;
}

.product-row .supplier-qty .custom-select-box.splr-wh-clr i.fa {
    top: 12px;
}


.product-row .product-qty .form-control.sub-total {
    line-height: 30px;
}

.ttl-drdwn .dropdown-item button:focus {
    outline: none;
}

.custom-select-box .dropdown-menu.show {
    z-index: 8 !important;
}

/*.filtrbox.fltr-value {
    width: 160px !important;
}*/

/*.filtrbox.fltr-date {
    width: 150px !important;
}*/

.filter-group-box {
    display: flex;
    flex-flow: wrap;
    width: 100%;
}

.orderfilter-box .filter-panel {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-wrap: wrap;
}

.orderfilter-box .filter-panel .filtrbox {
    width: 100%;
}

.orderfilter-box .filter-group-box .filtrbox {
    width: 49%;
}

.tagify.form-control {
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

.rfq-row .content-box .form-group .tagify.form-control {
    border: none !important;
    height: auto !important;
}

#global-search-filter .filterOrderTags tag.tagify__tag {
    background-color: var(--tag-bg);
}

#global-search-filter .filterOrderTags .tagify__tag>div {
    background: var(--tag-bg) !important;
}

#global-search-filter .filterOrderTags .tagify .tagify__tag>div::before {
    background: var(--tag-bg) !important;
    box-shadow: none !important;
}

#global-search-filter .filterOrderTags .tagify__tag>div span.tagify__tag-text {
    color: var(--tag-text) !important;
}

#global-search-filter .filterOrderTags .tagify .tagify__tag__removeBtn::after {
    color: var(--tag-text) !important;
}

#global-search-filter .filterCustomerTags tag.tagify__tag {
    background-color: var(--tag-bg);
}

#global-search-filter .filterCustomerTags .tagify__tag>div {
    background: var(--tag-bg) !important;
}

#global-search-filter .filterCustomerTags .tagify .tagify__tag>div::before {
    background: var(--tag-bg) !important;
    box-shadow: none !important;
}

#global-search-filter .filterCustomerTags .tagify__tag>div span.tagify__tag-text {
    color: var(--tag-text) !important;
}

#global-search-filter .filterCustomerTags .tagify .tagify__tag__removeBtn::after {
    color: var(--tag-text) !important;
}
#customer-tag-form .filterCustomerTags .tagify .tagify__tag__removeBtn::after {
    color: var(--tag-text) !important;
}

.tagify__tag {
    z-index: 2 !important;
}

.tagify__tag>div {
    background: #56A8FE !important;
    color: #fff !important;
    padding: 5px 20px 5px 8px !important;
    font-size: 12px;
}

.tagify .tagify__input {
    margin: 0 !important;
    border-color: rgba(57, 73, 107, 0.3) !important;
    font-size: 14px;
    padding: 6px;
    display: inherit;
}

.tagify .tagify__tag {
    margin: 5px 5px 0 0;
    font-size: 12px;
    border-radius: 4px;
    overflow: hidden;
    padding: 0 1px;
}

.tagify .tagify__tag>div::before {
    background: #00abe3 !important;
    box-shadow: none !important;
}

.tagify .tagify__tag__removeBtn {
    color: #fff;
    background: transparent;
    width: 16px;
    height: 16px;
    margin: 0 2px 0 5px;
    opacity: 1 !important;
    font-family: inherit;
    position: absolute;
    float: right;
    right: 0;
    z-index: 1;
}

.tagify .tagify__tag__removeBtn::after {
    content: "\00D7";
    color: #ffffff;
    font-size: 13px;
    opacity: 1;
    font-family: 'CircularStd-Bold';
    line-height: 0;
    left: 5px;
    top: 8px;
    position: absolute;
}

.tagify__tag>div span.tagify__tag-text {
    max-width: 150px;
    padding-right: 2px;
}


#order-tag-form tag.tagify__tag {
    background-color: var(--tag-bg);
}

#order-tag-form .tagify__tag>div {
    background: var(--tag-bg) !important;
}

#order-tag-form .tagify .tagify__tag>div::before {
    background: var(--tag-bg) !important;
    box-shadow: none !important;
}

#customer-tag-form tag.tagify__tag {
    background-color: var(--tag-bg);
}

#customer-tag-form .tagify__tag>div {
    background: var(--tag-bg) !important;
}

#customer-tag-form .tagify .tagify__tag>div::before {
    background: var(--tag-bg) !important;
    box-shadow: none !important;
}

#order-tag-form .tagify__tag>div span.tagify__tag-text {
    color: var(--tag-text) !important;
}

#order-tag-form .tagify .tagify__tag__removeBtn::after {
    color: var(--tag-text) !important;
}

#customer-tag-form .tagify .tagify__tag__removeBtn::after {
    color: var(--tag-text) !important;
}
#customer-tag-form .tagify__tag>div span.tagify__tag-text {
    color: var(--tag-text) !important;
}

.filtrbox.fltr-invoice label.fancy-radio {
    margin-bottom: 7px;
}

.table-filter-box span {
    margin: 5px 0 0 7px;
    font-family: 'CircularStd-Book', sans-serif;
}

.table-filter-box i.fa {
    font-size: 22px;
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc_disabled:before {
    display: none;
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
    content: "";
    border-top: 8px solid #22232F;
    border-right: 5px solid transparent;
    border-bottom: 0;
    border-left: 5px solid transparent;
    left: auto;
    position: unset;
    top: calc(50% - 5px);
    color: #22232F;
    width: 10px;
    opacity: 1;
    display: inline-block;
    right: auto;
    margin-left: 8px;
}

table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_desc_disabled:after {
    transform: rotate(180deg);
    bottom: 20px !important;
}

.custom-table tbody td a {
    position: relative;
    padding-right: 10px;
    width: auto;
    display: inline-block;
}

.custom-table tbody td a i {
    /* position: absolute;
    left: 0;
    padding: 0;
    top: 0; */
}

.dropzone_box {
    border: 2px dashed #5BA6FF;
    padding: 10px;
    text-align: center;
    background: rgba(0, 0, 0, 0.03);
    border-radius: 4px;
}

.dropzone_box p {
    font-size: 12px;
}

.custom-table tbody td a.btn.l-blue i {
    position: relative;
}

.custom-table a.btn.btn-warning.c-btn.btn-space i.fa {
    position: relative;
}

.container {
    max-width: 1660px;
}

/* CREATE ORDER PAGE */

.order-create-form {
    margin-top: 30px;
}

.create-order-page .form-group .custom-label {
    font-size: 16px;
    color: #22232F;
    margin-bottom: 5px;
}

.create-order-page .custom-select-box .dropdown-toggle {
    background: #ffffff;
    border: 1px solid rgba(57, 73, 107, 0.3);
    border-radius: 0px !important;
}

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

.order-create-form .product-row.cus-row {
    background: #fff;
    padding: 10px;
}

.order-create-form .title-container.product-select.d-flex {
    margin: 30px 0 10px 0;
    border: none;
}

.advncd-ckoptn strong {
    font-size: 15px;
    font-family: 'CircularStd-Book';
}

.advncd-ckoptn label {
    margin-left: 15px;
    font-size: 12px;
}

.order-create-form .product-row .heading {
    font-size: 18px;
    color: #231f20;
    font-family: 'CircularStd-Book';
}

.supplier-qty.modify-row p.heading {
    font-size: 16px;
}

.mt-2.new-row .f-60 {
    /*   width: 235px; */
    width: 70%
}

.mt-2.new-row .f-40 {
    /*    width: 100%; */
}

.mt-2.new-row .f-40 span.sub-total {
    border: none;
    padding: 10px 0;
}

.order-create-form .product-row>div {
    padding: 0 10px;
}

.order-create-form .supplier-qty.modify-row .form-control,
.product-row .supplier-qty .custom-select-box .dropdown-toggle {
    height: 35px;
}

.product-row .supplier-qty .custom-select-box .supplier_select .dropdown-toggle {
    height: 40px;
}

.product-row .supplier-qty .custom-select-box .supplier_select .dropdown-toggle .filter-option-inner-inner {
    line-height: 35px;
}

.product-row .supplier-qty .custom-select-box .dropdown-toggle {
    padding: 4px 8px !important;
}

.order-create-form .supplier-qty .new-row>div {
    margin: 0 10px;
}

.product-row .add-more .btn {
    padding: 4px;
    background: none;
    border: none;
}

.product-row .add-more i.fa {
    color: #FF7979;
    font-size: 18px;
    margin-bottom: 10px;
}

.product-row .add-more .dlct-icn i.fa {
    color: #56A8FE;
}

.custom-select-box.ad-pro-slctbox {
    display: flex;
    align-items: center;
    margin-top: 10px;
}

.add-pro-ttlbox .custom-select-box.ad-pro-slctbox {
    min-width: 350px;
    max-width: 350px;
}

.dynamic-gift-box .form-control.size-sm {
    padding: 10px;
    height: 40px;
}

.product_bottom {
    border: 1px solid #cacaca;
    padding: 8px 0 8px 0;
    align-items: center;
    min-height: 50px;
    margin-top: -1px;
}

.advncd-ckoptn.mrg-top-20 {
    margin-top: 3px !important;
}

.configure-check {
    position: relative;
    right: 15px;
}

.product_bottom .ad-pro-slctbox.warehouse_filed .size-sm {
    min-width: 150px;
}

.advncd-ckoptn.mrg-top-20 .fancy-checkbox {
    margin-left: 0;
}

.product_bottom .custom-select-box.ad-pro-slctbox {
    margin-top: 0;
}

.custom-select-box.ad-pro-slctbox label {
    flex: none;
    margin-right: 10px;
}

.total-section p {
    width: 50%;
    float: left;
}

.total-section p.grand-total-row {
    background: #f7f8fb;
    font-family: 'CircularStd-Bold' !important;
}

.total-section .heading {
    text-align: left;
}

.add-pro-ttlbox {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.main-total-section {
    width: 230px;
}
.total-section .extra-discount-error{
    float: right !important;
    width: 100% !important;
    padding: 0px !important;
    position: relative;
    margin-top: -10px !important;
}

.bb-none {
    border-bottom:none !important;
}
.add-pro-ttlbox .custom-select-box .bootstrap-select {
    width: 220px !important;
}

.order-create-form .title-container {
    border-bottom: none;
    margin-bottom: 5px;
}

.order-create-form .create-order-page .form-group .custom-label {
    font-size: 15px;
    font-family: 'CircularStd-Book';
}

.row.send-rmnd-invc-box .custom-label {
    font-size: 15px;
    font-family: 'CircularStd-Book';
    margin-right: 7px;
    margin-top: 0;
    margin-bottom: 5px;
    flex: none;
}

.form-group.flex.brand-star label.custom-label {
    /* font-family: 'CircularStd-Book'; */
    align-items: center;
    /* display: flex; */
}

.row.send-rmnd-invc-box .flex.brand-star label.custom-label {
    display: flex;
}

.btn-primary.focus,
.btn-primary:focus {
    box-shadow: none !important;
}

.row.send-rmnd-invc-box .col-lg-5.p0 {
    width: auto;
    max-width: initial;
    flex: none;
}

.form-group.flex {
    display: flex;
}

.form-group.flex.brand-star .custom-select-box {
    width: 100%;
}

.row.send-rmnd-invc-box label.custom-label.small-label {
    text-align: right;
    margin-top: 0;
    margin-bottom: 5px;
}

.button-container.button-icns-grups {
    display: flex;
    margin: 40px 0;
    place-content: space-between;
}

.button-icns-grups .input-icn-btn input {
    font-family: 'CircularStd-Medium';
    font-size: 15px;
}

.add-customer-popup .select2-container--default .select2-selection--single,
.add-customer-popup .select2-container--default .select2-selection--single .select2-selection__rendered,
.add-customer-popup .select2-container--default .select2-selection--single .select2-selection__rendered {
    height: 40px;
    line-height: 40px;
    border-radius: 0;
}

.add-customer-popup .select2-dropdown span.select2-results {
    width: 100% !important;
    display: block !important;
    padding: 10px !important;
}

.add-customer-popup .select2-container--default .select2-selection--single .select2-selection__arrow {
    display: none;
}

/* COLOR CLASS DEFINE */
.green-bg {
    background: #44ae1f !important;
}

/* Lead "New" badge — dedicated class carrying only the left spacing, layered on
   top of the existing Bootstrap badge classes so the shared Lead badge look is
   left untouched. Unique to the Lead module. */
.lead-new-badge {
    margin-left: 2px;
}

/* AutoQuote "New" badge — dedicated class that mirrors the Lead badge look
   (Bootstrap .badge + .badge-success/.green-bg + .rounded) without sharing
   its classes, so the Lead badge is unaffected. Unique to the AutoQuote module. */
.auto-quote-new-badge {
    display: inline-block;
    margin: 0 0 0 2px;
    padding: 0.25em 0.4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background: #44ae1f;
    border-radius: 0.25rem;
}

.blue-bg {
    background: #56A8FE !important;
}

.purple-bg {
    background: #452e7e !important;
}

.input-icn-btn {
    overflow: hidden;
    cursor: pointer;
    border-radius: 4px;
}

.input-icn-btn i.fa {
    color: #fff;
    position: relative;
    top: 2px;
    left: 5px;
    margin: 0 5px 0 10px;
}

.button-icns-grups .btn-outline-info i.fa {
    margin: 0 5px 0 10px;
}

.input-icn-btn.blue-bg.border-btn i.fa {
    margin: 0 12px 0 8px;
}

.input-icn-btn .btn.add-new {
    background: none;
    font-size: 15px;
}

.row.send-rmnd-invc-box .blue-btn {
    width: 44px;
}

.button-icns-grups .btn.add-new span {
    margin-right: 3px;
    padding: 0 15px;
    font-size: 15px;
}

.button-icns-grups .btn-outline-info {
    border: none;
}

.button-icns-grups .pull-left {
    display: flex;
}

/* BORDER BUTTONS */

.create-new-order a {
    padding-left: 40px;
    position: relative;
    min-height: 40px;
}

.create-new-order.dropdown a.btn {
    padding-left: 40px;
}

.insights-page .create-new-order a {
    padding-left: 40px !important;
}

.add-btn {
    display: inline-flex;
    align-items: center;
    right: 115px;
    border-radius: 4px;
}

.gray-btn {
    background: #e8eaec;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    padding: 9px 10px;
}

.help-icon {
    font-size: 20px;
    color: grey;
    margin-right: 70px;
}

.custom-dropdown {
    opacity: 0;
    transition: all .15s ease-in-out;
}

.animate {
    animation-duration: 0.5s;
    -webkit-animation-duration: 0.5s;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;

    }

    to {
        opacity: 1;
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}

.border-btn {
    background: none !important;
    border: 2px solid #61A4FF;
}

.border-btn .btn.add-new,
.border-btn i.fa {
    color: #3fbff0 !important;
}

.border-btn .btn.add-new {
    border: 2px solid #61A4FF;
    font-family: 'CircularStd-Book';
    background: none !important;
}

.inter-his-box .ord-int-box .tab-hdr-ttl {
    justify-content: normal;
    align-items: center;
}

.tab-hdr-ttl p {
    margin-bottom: 0px;
}

.inter-his-box .ord-int-box .tab-hdr-ttl h5 {
    margin-right: 15px;
}

.tab-hdr-ttl {
    display: flex;
    justify-content: space-between;
}

.tab-hdr-ttl h5 {
    color: #12203E !important;
    font-size: 20px;
    line-height: 1;
    font-family: 'CircularStd-Book', sans-serif;
    display: inline-block;
    padding: 10px;
    border-bottom: solid 3px #56A8FE;
    min-width: 165px;
    text-align: center;
}

.nt-dtnm {
    font-size: 12px;
    color: #89898b;
    padding: 5px 10px 5px 0;
    position: relative;
}

.nt-dtnm .ip-add {
    position: absolute;
    right: 10px;
    top: 6px;
}

.note-list-box {
    padding: 10px;
    border-bottom: 1px solid #eee;
}

.nt-ttl {
    padding: 0;
    background: #fff;
    text-align: right;
    display: inline-block;
    width: 100%;
    position: relative;
}

.nt-ttl p {
    color: #3e4555;
    text-align: left;
    font-family: 'CircularStd-Medium';
    padding-right: 30px;
    padding: 6px 30px 5px 0 !important;
    word-wrap: break-word;
    white-space: normal;
}

.nt-ttl .delete-note {
    padding: 0;
    background: none;
    position: absolute;
    top: calc(50% - 12px);
    right: 15px;
}

.datepicker.datepicker-dropdown.dropdown-menu.datepicker-orient-left.datepicker-orient-top {
    margin-top: 0px;
    z-index: 3 !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 1) !important;
}

.datepicker.datepicker-dropdown.dropdown-menu.datepicker-orient-left.datepicker-orient-bottom {
    margin-top: 102px;
    z-index: 3 !important;
}

.month-title {
    background: white !important;
    height: 30px;
}

.table-condensed a i .fa .fa-clock {
    color: red;
}

.picker-switch {
    font-family: CircularStd-Bold;
    color: #4B576F;
}

.nt-ttl i.fa {
    color: #ea1d24;
}

.intrnl-notes {
    margin-top: 10px;
    border: 1px solid #c4c4c4;
    width: 100%;
    padding: 10px;
    font-size: 14px;
    height: 150px !important;
}

.ordad-note-box {
    display: flex;
    margin-top: 10px;
}

.inter-his-box {
    display: flex;
    justify-content: space-between;
    margin-bottom: 25px;
}

.ord-int-box {
    width: 50%;
}

.ord-int-box-inr {
    margin-bottom: 10px;
    overflow: auto;
    max-height: 150px;
    margin-top: 10px;
}

.co-ntf-persnal {
    display: flex;
    margin: 0;
    flex-direction: column;
}

.co-ntf-persnal h3 {
    font-family: 'CircularStd-Book';
    margin-right: 15px;
    font-size: 18px;
}

.co-eml-multy {
    position: relative;
    margin-top: 10px;
}

.co-eml-multy input {
    border: 1px solid #c3c3c3;
    padding: 11px 50px 10px 10px;
    color: #000;
    font-size: 14px;
    width: 100%;
}

.co-eml-multy i.fa {
    color: #56A8FE;
    right: 15px;
    position: absolute;
    top: 10px;
}

.mn-co-ntf-persnal p {
    font-size: 13px;
    font-family: 'CircularStd-Book';
    line-height: 17px;
    color: #989898;
}

.flex.brand-star .custom-select-box:before {
    content: "\f005";
    width: 40px;
    color: #fff;
    height: 40px;
    background: #56A8FE;
    padding: 12px 13px;
    top: 0;
    right: 0;
}

.tab-hdr-ttl .input-icn-btn {
    height: 37px;
    margin-right: 0;
    cursor: pointer;
}

.tab-hdr-ttl .btn.add-new {
    height: 100%;
}

.tab-hdr-ttl .btn.add-new:focus {
    box-shadow: none;
}

td span.paid-column {
    display: block;
}

td span.paid-column i {
    font-size: 17px !important;
}

.ttl-drdwn .dropdown-item {
    color: #56A8FE;
    font-size: 14px;
    border-bottom: 1px solid #f4f4f4;
    padding: 5px 5px;
}

.ttl-drdwn .dropdown-menu {
    min-width: 128px !important;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3) !important;
    right: 0 !important;
    left: auto !important;
    min-width: auto;
    top: 8px !important;
    float: none !important;
    transform: translate3d(0px, 34px, 0px) !important;
}

.user-detail .name {
    font-size: 16px;
    font-family: 'CircularStd-Medium';
}

.name a img {
    vertical-align: middle;
}

.user-detail p {
    margin: 4px 0;
}

.user-detail .email-btn {
    font-size: 14px;
}

.upload-txt {
    font-size: 14px
}

.drag-drop-txt {
    opacity: 1;
    background-image: none;
    text-align: center;
    font-size: 22px;
    line-height: 35px
}

.custom-table tbody td:last-child {
    background: #fff;
}

.custom-table tbody td:last-child a.view-column,
.custom-table tbody td:last-child a.text-primary,
.custom-table tbody td:last-child a.del-btn.text-danger,
.custom-table tbody td:last-child a.text-success {
    position: relative;
    border: 2px solid #56A8FE;
    padding: 8px 15px 0px 10px;
    border-radius: 25px;
    background: #fff;
    margin: 0 3px;
    height: 30px;
    width: 30px;
}

.custom-table tbody td:last-child a.view-column i,
.custom-table tbody td:last-child a.text-primary i,
.custom-table tbody td:last-child a.del-btn.text-danger i,
.custom-table tbody td:last-child a.text-success i {
    top: 50%;
    left: 50%;
    padding: 0;
    color: #56A8FE;
    transform: translate(-50%, -50%);
    position: absolute;
}

span.paid-column {
    color: #44ae1f;
    font-family: 'CircularStd-Book';
}

.order-status-box {
    display: flex;
    min-width: 150px;
    padding-left: 5px;
}

.order-status-box i.fa {
    margin-right: 5px;
}

span.small-text-custom {
    font-size: 12px;
    font-family: 'CircularStd-Book';
    display: inline-block;
    margin-top: 4px;
}

.order-status-box .fa.fa-envelope {
    color: #5BA6FF;
}

.order-status-box i.fa.fa-check-square-o.blue-icon {
    color: #56A8FE;
}

#all-products-container .custom-table tbody td:last-child a.cancel-qty.text-danger {
    position: relative;
    border: 2px solid #ff7979;
    padding: 18px 15px 0px 10px;
    border-radius: 25px;
    background: #fff;
    margin: 0 3px;
    height: 30px;
    width: 30px;
}

#all-products-container .custom-table tbody td a.cancel-qty i {
    top: 50%;
    left: 50%;
    padding: 0;
    color: #ff7979;
    transform: translate(-50%, -50%);
    position: absolute;
}

/* PAGINATION */

.paginate_button.previous,
.paginate_button.next {
    background: #5c636d !important;
    color: #fff !important;
    padding: 5px 8px;
    min-width: 30px;
}

.dataTables_paginate .paginate_button {
    background: none;
    cursor: pointer;
    padding: 5px 5px;
    font-size: 15px;
    height: 35px;
    line-height: 25px;
}

.dataTables_paginate {
    padding: 5px 15px 10px 0px;
}

.paginate_button.current {
    color: #56A8FE !important;
}

.paginate_button.current:hover {
    color: #fff !important;
}

div.dataTables_wrapper div.dataTables_info {
    font-size: 14px;
    line-height: 33px;
}

.popover {
    border: none !important;
    border: 2px solid rgba(0, 0, 0, 0, 0.3);
    box-shadow: 4px 4px 10px -5px rgba(0, 0, 0, 0.84) !important;
}

/* ORDER VIEW PAGE */

.product-list-table {
    background: #fff;
    padding: 10px;
}

.product-list-table .your-order{
    font-size: 24px;
    border-bottom: 1px solid #DEDEDF;
    padding-bottom: 10px;
}

.product-list-table .opt-remove-btn {
    background-color: white;
    color: #ee2327;
    border: 2px solid #ee2327;
    padding: 5px 12px;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
    font-size: 13px;
}

.product-list-table .opt-remove-btn:hover {
    background-color: #ee2327;
    color: white;
}

/**/
.product-list-table .opt-btn-default {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #ccc;
  padding: 5px 12px;
  background-color: #fff;
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
}

.product-list-table .opt-btn-default .text {
  color: #ff0000;
  font-size: 13px;
}

.product-list-table .opt-btn-default .remove {
  color: gray;
  font-size: 13px;
  margin-left: 5px;
}

.product-list-table .opt-btn-default:hover {
  background-color: #f9f9f9;
}

/**/

.product-list-table .opt-btn-success {
    background-color: #22a449;
    color: white;
    padding: 5px 12px;
    cursor: pointer;
    border: 2px solid #22a449;
    transition: background-color 0.3s, color 0.3s;
    font-size: 13px;
}

.product-list-table .opt-btn-success:hover {
    background-color: darkgreen;
    border-color: darkgreen;
}


.product-list-table .opt-order-addon{
    font-size: 24px;
    border-bottom: 1px solid #DEDEDF;
    padding-bottom: 10px;
    margin-top: 30px;
}

.product-list-table .product-row.view-page {
    padding: 10px;
}

.product-list-table .product-row.view-page .opt-view-txt {
    color: #179a22;
    font-weight: 600;
    font-size: medium;
}

.product-row.view-page p b {
    font-family: 'CircularStd-Bold';
    color: #000;
}

.product-row.view-page.sell-stock-text p {
    color: #555;
}

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

.mrg-top-13 {
    margin-top: 13px !important;
}

.mrg-top-20 {
    margin-top: 20px !important;
}

.mrg-top-30 {
    margin-top: 30px !important;
}

.mrg-btm-30 {
    margin-bottom: 30px !important;
}

.mrg-btm-20 {
    margin-bottom: 20px !important;
}

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

.mrg-btm-10 {
    margin-bottom: 10px !important;
}

.product-list-table .product-row:last-child {
    border-bottom: none;
}
.popover {
    font-family: 'CircularStd-Book', sans-serif;
}
.tag-badge{
     padding: 6px;
    margin: 0 2px 5px 0;
    font-size:12px;
    font-weight: unset;
}
.tag-badge-edit{
    padding: 6px;
    margin: 0 2px 5px 0;
    font-size:12px;
    font-weight: unset;
}
.tag-badge-list{
    padding: 6px;
    margin: 2px 2px 3px 2px;
    font-size:12px;
    font-weight: unset;
}
.tag-badge-customer-view{
    padding: 6px;
    margin: 0 2px 5px 0;
    font-size:12px !important;
    font-weight: unset;
}
/* ARTWORK */

.artwork-b {
    display: table-row;
}

.artwork-b .art-work-infor .c-dwnlod,
.artwork-b .art-work-infor a.btn {
    background: #56A8FE;
    border-radius: 4px;
    border: none;
    height: 40px;
    vertical-align: top;
    font-size: 14px;
    font-family: 'CircularStd-Book';
    line-height: 40px;
    min-width: 116px;
    text-align: center;
    padding: 0 10px;
}

.artwork-b .art-work-infor a i.fa {
    margin-right: 5px;
    font-size: 20px;
    position: relative;
    top: 2px;
}

.artwork-b .art-work-infor a i.fa-download {
    position: relative;
    top: 4px;
}

.artwork-b .art-work-inner {
    border: none;
    padding: 0;
}

.artwork-b .art-work-infor .c-preview {
    margin-right: 7px;
}

.title-container.flex-none-hdr {
    display: block !important;
}

.ordr-actndw {
    width: 128px;
    float: right;
    position: absolute;
    right: 0;
    top: -9px;
    z-index: 2;
}

.ordr-actndw .input-icn-btn {
    background: #44ae1f;
    margin-right: 0;
    padding-right: 0;
    cursor: pointer;
    margin-top: -5px;
}

.dropdown.ttl-drdwn.ordr-actndw .input-icn-btn {
    margin-top: 0;
}

.custom-tab.vworder-nav-tabs {
    position: relative;
    top: 6px;
}

.ordr-hdr-rltv {
    position: relative;
}

.ttl-drdwn .dropdown-item button {
    color: #56A8FE;
    font-size: 14px;
    border-bottom: 1px solid #f4f4f4;
    padding: 5px 5px;
    background: none;
    border: none;
    text-align: left;
    padding: 0;
    cursor: pointer;
}

.ttl-drdwn .dropdown-item a {
    text-decoration: none;
    width: 100%;
    height: 100%;
}

.od-draft-order-table .actn-btn {
    width: 100px !important;
}

.container {
    position: relative;
}

.input-icn-btn.blue-bg.border-btn {
    background: #FFFFFF;
    border: 2px solid #61A4FF;
    border-radius: 4px;
    height: 40px;
    color: #61A4FF;
}

.dataTables_processing {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    color: #56A8FE;
    font-size: 15px;
    border-radius: 4px;
    padding: 7px 0 !important;
    font-family: 'CircularStd-Book';
    border: none !important;
    background: #fff;
    top: 28px !important;
}

.order-status-box i.fa {
    padding-left: 0;
}

.card-header.img-icn img {
    position: relative;
    top: 3px;
}

.toast {
    opacity: 1 !important;
}

/* APPROVAL PAGE */
.aprv-ordr-dtls-box {
    width: 50%;
    display: inline-block;
}

.aprv-ur-artwork {
    width: 100%;
    display: inline-block;
    border-top: 1px solid #dededf;
    padding-top: 20px;
}

.aprv-ur-artwork .artwork-b {
    padding: 23px 35px;
}

.artwork-b .art-work-inner {
    display: inline-block;
    border-radius: 15px;
    overflow: hidden;
}

.artwork-b .img-fluid {
    vertical-align: middle;
    max-height: 100px;
    min-height: 90px;
}

.approval-btn-box {
    background: #fff;
    width: 100%;
    margin-bottom: 30px;
}

.approval-btn-box .approval-btn {
    width: 300px;
    padding: 0 25px;
    margin: 0 auto;
    display: inherit;
    background-color: #00A551 !important;
}

.vwd-aprvl-box {
    text-align: center;
    margin: 20px 0;
}

.product-list-table {
    padding: 0;
    margin-top: 40px;
}

.artwork-b .art-work-infor {
    padding-left: 0;
}

.artwork-b-inr {
    width: 257px;
    display: inline-block;
}

.btn-btwn-space {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}

.aprv-ordr-dtls-box .total-section p {
    width: 100%;
    float: right;
    text-align: right;
}

.aprv-ordr-dtls-box .total-section {
    width: 100%;
    padding-right: 0;
}

.aprv-ordr-dtls-box .product-row:first-child {
    border-top: 1px solid #DEDEDF;
    padding-top: 5px;
}

.product-row .heading {
    font-size: 15px
}

.aprv-ordr-dtls-box .product-list-table .product-row,
.aprv-ordr-dtls-box .product-list-table .product-row:last-child {
    border-bottom: 1px solid #DEDEDF;
}

.aprv-ordr-dtls-box .product-row .product-img {
    padding-right: 12px;
}

.aprv-ordr-dtls-box .product-row .product-img p {
    white-space: normal;
    word-break: break-all
}

.aprv-ordr-dtls-box .product-row .product-img figure {
    width: 120px;
    height: 120px;
    border: 1px solid #dadada;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.aprv-ordr-dtls-box .product-row .product-img figure img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: center;
}

/* Order summary / quote / order view – larger square thumb, image fits inside */
.product-list-table .product-row .product-img figure,
.view-order-page .product-row .product-img figure,
.product-thumb-square {
    width: 120px;
    height: 120px;
    min-width: 120px;
    min-height: 120px;
    border: 1px solid #dadada;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-list-table .product-row .product-img figure img,
.view-order-page .product-row .product-img figure img,
.product-thumb-square img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: center;
}

.ord-cnfrm-bg {
    background: #F7F7F7;
    padding-top: 5px;
    position: relative;
}

.ord-cnfrm-bg:before {
    content: "";
    position: absolute;
    width: 100%;
    left: -100%;
    top: 0;
    height: 100%;
    background: #F7F7F7;
}

.ord-cnfrm-bg:after {
    content: "";
    position: absolute;
    width: 100%;
    right: -100%;
    top: 0;
    height: 100%;
    background: #F7F7F7;
}

.cnfrm-dtls-form .form-group b {
    font-size: 15px;
    color: #231F20;
    font-family: 'CircularStd-Bold';
    margin-bottom: 20px;
    display: block;
}

.cnfrm-dtls-form .form-group .form-control {
    height: 35px;
}

.cnfrm-dtls-form .form-control[readonly] {
    background: #E6E7E8;
}

.slct-blng-adrs .form-group .custom-label,
.cnfrm-dtls-form .form-group .custom-label {
    margin-bottom: 5px;
}

.m-signature-pad--body canvas {
    width: 100%;
    height: 110px;
    background: #fff;
}

.m-signature-pad--footer {
    text-align: right;
    margin-top: 2px;
    display: flex;
}

.m-signature-pad--footer button {
    background: #22222E;
    font-size: 14px;
    font-family: 'CircularStd-Bold';
    width: 93px;
    height: auto;
    border: none;
    border-radius: 16px;
}

.m-signature-pad--footer button:hover {
    border-radius: 16px;
}

.m-signature-pad--footer .btn+.btn {
    margin-left: 5px;
}

.ordr-sgn-aprv-box {
    display: flex;
    justify-content: space-between;
}

.slct-blng-adrs label.fancy-radio {
    margin-right: 15px;
}

.artwork-total .dropzone .dz-preview {
    background: rgba(255, 255, 255, 1);
}

/* APPROVAL PAGE */
.approval-main-page .title-container .title {
    font-size: 25px;
    font-family: 'Nunito', sans-serif;
    display: block !important;
    padding: 0;
    color: #212529;
}

.supplier-page .title-container .title {
    font-size: 25px;
    font-family: 'Nunito', sans-serif;
    display: block !important;
    padding: 0;
    color: #212529;
}

.approval-btn {
    width: 200px;
    font-size: 15px;
    height: 40px;
    background: #00A551 !important;
    font-family: 'CircularStd-Bold';
    border-radius: 20px;
    border: none;
    color: #fff;
    cursor: pointer;
    font-weight: initial !important;
}

.aproval-conbox {
    min-height: calc(100vh - 300px);
}

#aproval-artwork .aprv-ur-artwork {
    min-height: calc(100vh - 330px);
}

.app-rq-btnbox {
    padding-bottom: 20px;
}

.border-btn-lg {
    font-size: 15px;
    height: 40px;
    border: 1px solid #221F20;
    border-radius: 20px;
    color: #221F20;
    display: inline-block;
    vertical-align: top;
    line-height: 40px;
    padding: 0 20px;
}

.border-btn-lg:hover {
    text-decoration: none;
    color: #221F20;
}

.aprval-logo img {
    max-height: 70px;
}

.aprvl-btn .border-btn-lg {
    margin-left: 10px;
}

.container.aproval-conbox {
    padding-top: 15px;
    padding-bottom: 25px;
}

.approval-header {
    background: #fff;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
    padding: 10px;
    height: 86px;
    display: flex;
    position: fixed;
    width: 100%;
    z-index: 9;
    top: 0;
}

.approval-header+main.py-4 {
    margin-top: 85px !important;
    height: auto;
    padding-bottom: 20px !important;
    padding-top: 0 !important;
    overflow-x: hidden;
}

.approval-main-page {
    width: 1120px;
    margin: 0 auto;
}

.aproval-conbox-head {
    text-align: center;
    margin-bottom: 20px;
    margin-top: 5px;
}

.aproval-conbox-head h2 {
    font-size: 40px;
    line-height: 50px;
    font-family: 'Nunito', sans-serif;
    font-weight: normal;
}

.show-quote-page .aproval-conbox-head h2 {
    font-family: Nunito !important;
}

.show-quote-page .apprvl-step-con p {
    font-family: Roboto !important;
    font-size: 16px !important;
    line-height: 20px;
}

.apprvl-step-con p {
    font-size: 13px;
    font-family: 'Roboto', sans-serif;
}

.approval-main-page .title-container {
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid #C2C2C2;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.approval-main-page .form-group .form-control,
.approval-main-page .form-group .custom-label {
    font-family: 'Roboto', sans-serif;

}

.approval-main-page .form-group .custom-label {
    color: #231f20;
}

.approval-main-page .billing-note {
    font-family: 'Roboto', sans-serif;
}

.artwork-b .art-work-infor .c-dwnlod,
.artwork-b .art-work-infor a.btn {
    background: #22212f;
    border-radius: 20px;
}

.approval-main-page button.approve-btn {
    background: #00a651;
    border-radius: 20px;
    color: #fff;
    font-size: 15px;
    font-family: 'CircularStd-Bold';
    border: 0;
    padding: 0 50px 0 50px;
    line-height: 40px;
    margin: 0 10px;
    position: relative;
}

.approval-main-page button.change-btn {
    background: #ee1c25;
    border-radius: 20px;
    color: #fff;
    font-size: 15px;
    font-family: 'CircularStd-Bold';
    border: 0;
    padding: 0 50px 0 50px;
    line-height: 40px;
    margin: 0 10px;
    position: relative;
}

.approval-main-page .button-outer ul li span,
.approval-main-page .fancy-checkbox input[type="checkbox"]+span {
    font-family: 'Roboto', sans-serif;
}

.approval-main-page .btn-primary:hover,
.approval-main-page button.approve-btn:hover,
.art-work-infor .btn-primary:hover {
    opacity: 1;
}

.approval-main-page .download-quote-btn {
    background: #ee1c25;
    border-radius: 20px;
    color: #fff;
    font-size: 13px;
    font-family: 'CircularStd-Bold';
    border: 0;
    padding: 2px 40px 2px 30px;
    line-height: 30px;
    position: relative;
    cursor: pointer;
}

.full-row .aprv-ordr-dtls-box {
    width: 100% !important;
    max-width: 100% !important;
    flex: auto;
}

.approval-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.aprval-footer {
    margin-top: 80px;
    background: #22222E;
    padding: 20px 0;
    min-height: 120px;
    position: relative;
    bottom: 0;
    width: 100%;
    z-index: 9;
}

.aprval-footer p {
    color: #fff;
    line-height: 20px;
}

.aprval-footer .container {
    display: flex;
    justify-content: space-between;
}

.dtof-aprvl {
    position: relative;
}

.dtof-aprvl i.fa {
    position: absolute;
    right: 12px;
    bottom: 10px;
}

.ins-date-box {
    display: flex;
    align-items: center;
}

#orders.custom-table.data-table-btn .btn {
    font-size: 12px;
    min-width: 100px;
}

#orders.custom-table tbody td {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.filter-panel-box {
    padding: 17px 0;
}

.filter-panel-box .toggle-switch {
    text-align: center;
}

.filter-panel-box .toggle-switch .switch-container {
    display: flex;
    align-items: center;
    justify-content: center;
}

.filter-panel-box .toggle-switch .switch-container>span {
    font-size: 14px;
}

.filter-panel-box .toggle-switch .switch {
    margin: 0px 5px;
}

.filter-panel-box .toggle-switch>label {
    margin-right: 0px;
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
}

.ins-date-box {
    display: flex;
    align-items: center;
    margin-right: 20px;
}

.ins-date-box label {
    margin-bottom: 0;
    margin-right: 7px;
    font-family: 'CircularStd-Bold';
    white-space: nowrap;
    font-size: 14px;
}

.ins-dtrng-box {
    border: 1px solid #ced4da;
    padding: 11px;
    background: #fff;
    font-size: 15px;
    color: #333;
    height: 38px;
    border-radius: 0px;
}

.ins-date-box .custom-select-box .form-control {
    padding-right: 38px;
}

.ins-date-box i.fa {
    color: #02abec;
    float: right;
}

.order-aprvl-confpage .title-container.cus-title {
    height: 43px;
    padding-bottom: 0px;
    margin-bottom: 10px;
    border-bottom: 1px solid #C2C2C2;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* ==== THANKS PAGE ==== */
.app-thanks {
    padding: 10px 0 25px 0;
    text-align: center;
    width: 360px;
    margin: 0 auto;
    max-width: 100%;
}

.app-thanks-inr {
    display: inline-flex;
    text-align: center;
    align-items: center;
    margin-bottom: 12px;
}

.app-thanks i.fa {
    color: #00a551;
    font-size: 80px !important;
    margin-right: 10px;
}

.app-thanks h4 {
    color: #00a551;
    font-size: 32px;
    font-family: 'Nunito', sans-serif;
    text-transform: capitalize;
    margin: 0;
    font-weight: 600;
}

.app-thanks h6 {
    font-family: 'CircularStd-Bold';
    margin: 10px 0;
    font-size: 18px;
}

.app-thanks {
    padding: 10px 0 25px 0;
    text-align: center;
}

.app-thanks h4 {
    color: #00a551;
    font-size: 38px;
    font-family: 'Nunito', sans-serif;
    text-transform: capitalize;
    margin: 5px 0 17px 0;
}

.app-thanks h6 {
    font-family: 'CircularStd-Bold';
    margin: 10px 0;
    font-size: 18px;
}

.thanks-page {
    padding: 10px 0 25px 0;
    text-align: center;
}

.thanks-page i.fa {
    color: #00a551;
    font-size: 150px;
}

.thanks-page h4 {
    color: #00a551;
    font-size: 38px;
    font-family: 'Nunito', sans-serif;
    text-transform: capitalize;
    margin: 5px 0 17px 0;
}

.thanks-page h6 {
    font-family: 'CircularStd-Bold';
    margin: 10px 0;
    font-size: 18px;
}

.acknowledge-list-table .product-name {
    flex: 0 0 16% !important;
}

.acknowledge-list-table .pro-note-box {
    flex: 0 0 9%;
}

.acknowledge-list-table .product-qty {
    flex: 0 0 8% !important;
}

.acknowledge-list-table .akg-trkng-no {
    flex: 0 0 12%
}



.acknowledge-list-table .akg-no-trkng {
    flex: 0 0 8%;
}

.acknowledge-list-table .akg-carrier {
    flex: 0 0 10%;
}

.acknowledge-list-table .akg-trkng-no .desc,
.acknowledge-list-table .akg-carrier .desc {
    flex-direction: column;
    display: flex;
}


.acknowledge-list-table .select2-container {
    width: 100% !important;
}

.acknowledge-list-table input {
    height: 27px;
    padding: 0 5px;
    border: 1px solid #bbbdbf;
}

.acknowledge-list-table .select2-container--default .select2-selection--single {
    background-color: #fff;
    border: 1px solid #bbbdbf;
    border-radius: 0;
}

.acknowledge-list-table input:focus {
    outline: 2px solid #29ABE2 !important;
}

.acknowledge-list-table .select2-container--default .select2-selection--single:focus {
    outline: 2px solid #29ABE2 !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    outline: 2px solid #29ABE2 !important;
}

.btn-rnd-box {
    border-radius: 4px !important;
    height: 40px;
    line-height: 0;
    font-family: 'CircularStd-Medium';
    font-size: 13px;
}

a.btn.paynow-btn {
    background: #00adee;
    color: #fff;
    width: 200px;
    border-radius: 50px;
    font-weight: 600;
    margin-top: 20px;
    margin-bottom: 15px;
}

button.btn.dwnload-inv {
    background: none;
    color: #00adee;
    font-weight: 600;
    margin-top: 20px;
    margin-bottom: 15px;
}

button.btn.dwnload-inv:hover {
    text-decoration: underline
}

.mo-view-thanks i.fa {
    font-size: 135px;
}

.mo-view-thanks h4 {
    font-size: 43px;
    font-family: 'CircularStd-Bold';
    font-family: 'Roboto', sans-serif;
}

.mo-view-thanks h6 {
    font-size: 24px;
    font-weight: normal;
    color: #666;
}

.design-block {
    margin: 0
}

/* Accounting App Integration */

.acc-app-logo-box {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    padding: 15px;
    text-align: center;
    min-height: 138px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.acc-app-logo-box h6 {
    font-size: 20px;
    font-family: 'CircularStd-Book', sans-serif;
}

.cc-app-logo-info p {
    text-align: center;
    margin: 12px 0 10px 0;
    font-size: 14px;
    font-family: 'CircularStd-Medium';
    color: #231F20;
    white-space: initial;
    line-height: initial;
}

.link-box {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    font-family: 'CircularStd-Medium';
    color: #231F20;
    padding: 0 10px;
}

.lnk-lft i.fa {
    color: #00A550;
}

.lnk-rgt {
    color: #FF7979;
}

.acc-app-mn-row {
    text-align: center;
    padding: 0 15px;
}

.acc-app-mn-box {
    margin: 0px;
    flex: 0 0 25%;
    max-width: 25%;
    padding: 0px 15px;
    margin-bottom: 20px;
}

.acc-app-mn-row-inner {
    width: 50%;
    display: flex;
}

.acc-app-mn-row-inner .acc-app-mn-box p {
    text-align: left;
    margin-bottom: 10px;
    font-size: 14px;
    font-family: 'CircularStd-Medium';
}

.acc-app-mn-box.acc-app-info {
    margin: 0;
    width: 333px;
}

.custom-acc-app-row .acc-app-mn-row-inner .acc-app-info {
    flex: 0 0 75%;
    max-width: 75%;
    width: 75%;
    white-space: initial;
}

.cm-blok {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
}

.cm-blok p {
    color: #060709;
    font-size: 15px;
    background: #fff;
    padding: 7px 25px;
    border-radius: 4px;
    line-height: 25px;
    width: 100%;
    background: #f7f8fa;
}

.dlrsign-box {
    position: relative;
}

.dlrsign-box:after {
    content: var(--currency-sym, "$");
    position: absolute;
    top: 13px;
    left: 10px;
    font-size: 14px;
    font-family: 'CircularStd-Medium';
    color: #495057;
}

.pricing-form-base .dlrsign-box:after {
    top: 12px;
}

.dlrsign-box input {
    padding-left: 20px !important;
}

.insights-chart-table tbody tr td span {
    display: flex;
}

.brng-lgimg {
    width: 200px;
}

/* Quote Email Images upload fields (Company Information and Branding Themes).
   Each field lays the 200px preview (.brng-lgimg) beside its help text and
   upload controls in a flex row.

   The row must never reflow because of its contents. It used to carry Bootstrap's
   .flex-wrap, and a flex item's automatic minimum size is its min-content width,
   so selecting a file with a long name — dynamic-gift-email-signature-promo-july-2026.png —
   widened the controls column past the space left beside the preview and dropped
   the whole block underneath it, while the untouched fields either side stayed
   alongside theirs. Two things feed that minimum: the filename, and the Upload /
   Remove buttons, which form.css pins at width:170px !important. Breaking the
   filename alone still leaves the 170px buttons, so the wrap is prevented at the
   row instead — nowrap keeps the preview left and the controls right whatever the
   filename length, and break-all stops a long name widening the column on its way
   there.

   Below the md breakpoint the column is full-viewport-width and 200 + 16 + 170px
   no longer fits, so wrapping is handed back and the field stacks as before. */
.quote-email-img-field {
    flex-wrap: nowrap;
}

.quote-email-img-name {
    word-break: break-all;
}

@media (max-width: 767.98px) {
    .quote-email-img-field {
        flex-wrap: wrap;
    }
}

.brng-lgimg .dark-logo-show {
    width: 150px;
    display: none;
}

.dark-theme .brng-lgimg .white-logo-show {
    display: none;
}

.dark-theme .brng-lgimg .dark-logo-show {
    display: block;
}

.ci-ftr-btn.brng-lgimg {
    text-align: center;
}

.ci-ftr-btn.brng-lgimg .btn.add-new {
    margin: 0 auto;
}

.ci-ftr-btn.brng-lgimg .input-icn-btn {
    margin: 0 auto;
    padding-right: 0;
}

.custom-select-box.custom-multi-select {
    height: 40px;
}

.row.send-rmnd-invc-box .col-lg-5.d-flex {
    flex: 0 0 48.666667%;
    max-width: 48.666667%;
    align-items: baseline;
}

.row.send-rmnd-invc-box .col-lg-3 .brand-star .custom-label {
    margin-top: 0;
    margin-bottom: 5px;
}

.row.send-rmnd-invc-box .col-lg-5.d-flex .form-group .custom-label {
    margin-right: 0;
    /* font-family: 'CircularStd-Book'; */
    margin-top: 0;
    margin-bottom: 16px;
}

.row.send-rmnd-invc-box .col-lg-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16%;
    flex: 0 0 16%;
    max-width: 16%;
    padding: 0;
}

.input-icn-btn {
    overflow: hidden;
    cursor: pointer;
    border-radius: 4px;
    margin-right: 10px;
    padding-right: 20px;
    padding-top: 4px;
}

.custom-file-control+span {
    font-size: 15px;
    color: #555;
    display: block;
    margin-top: 15px;
}

/* PAGE STICKY */
.menu-area {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 999;
    /*  padding-right: 17px; */
}

main.py-4 {
    padding-top: 110px !important;
    /* height: calc(100vh - 145px); */
    /* overflow: auto; */
    /* padding: 0 !important; */
    padding-bottom: 70px !important;
}

.product-list-table .product-row .form-control {
    padding: 6px;
}

.cus-row.product-row .supplier-qty input.form-control.size-sm.qty {
    /*margin-bottom: 13px;*/
}

.supplier-qty .custom-select-box:before {
    top: calc(50% - 9px);
}

.product-list-table .product-row .form-control.dropdown.bootstrap-select {
    padding: 0;
}

.custom-table tbody td span i.round-icon {
    margin-right: 3px;
}

.insights-page .custom-table tbody td:last-child {
    background: #fff !important;
}

button.close {
    margin-top: -5px;
}

.btn {
    border-radius: 4px !important;
    line-height: inherit;
}

.btn-primary {
    background-color: #56A8FE;
    border: none !important;
}

.btn-primary:hover {
    background-color: #56A8FE;
    opacity: 0.9;
    border: none !important;
}

.btn-outline-primary {
    color: #56A8FE;
    border-color: #56A8FE;
    border-radius: 4px !important;
}

.btn-outline-primary * {
    color: #56A8FE;
    fill: #56A8FE;
}

.btn-secondary {
    background-color: #5a6268;
    border: none !important;
    border-radius: 4px;
}

.btn-secondary:hover {
    background-color: #3d3d3d;
    border: none !important;
    border-radius: 4px;
}

.btn-danger {
    background-color: #FF5B5B;
    border-color: #FF5B5B;
}

.btn-danger:hover {
    background-color: #FF5B5B;
    opacity: 0.9;
}

.btn-success {
    color: #fff;
    background-color: #44AE1F;
    border-color: #44AE1F;
}

.btn-success:hover {
    background-color: #44AE1F;
    opacity: 0.9;
    border-color: #44AE1F;
}

.btn-gray {
    color: #717C88;
    background-color: #E8EAEC;
    border-color: #E8EAEC;
}

.btn-gray:hover {
    background-color: #E8EAEC;
    opacity: 0.9;
    border-color: #E8EAEC;
}

.btn-warning {
    color: #ffffff;
    background-color: #E8AD14;
    border-color: #E8AD14;
}

.btn-warning:hover {
    background-color: #E8AD14;
    opacity: 0.9;
    border-color: #E8AD14;
    color: #ffffff;
}

.crt-cusmr-form .title-container {
    justify-content: initial;
    margin-bottom: 0;
    padding: 10px 0;
}

.addon-accordian-box .title-container {
    padding: 15px 0;
}

.crt-cusmr-form .title-container:before {
    content: "\f067";
    font: normal normal normal 17px/1 FontAwesome;
    margin-right: 10px;
    color: #56A8FE;
}

.crt-cusmr-form .title-container[aria-expanded="true"]:before {
    content: "\f068";
}

.crt-cusmr-form .title-container[aria-expanded="true"] h4 {
    color: #56A8FE;
}

.intnal-notes {
    width: 500px;
    max-width: 100%;
    min-height: 100px !important;
    max-height: 150px !important;
    padding: 10px !important;
    border: 1px solid #D0D2D3;
}

.intnal-notes:focus {
    border: 1px solid #56A8FE !important;
}

.crt-customer-form .form-group .form-control {
    height: 41px;
}

.pro-sm-box {
    display: inline-flex;
    width: 46%;
    justify-content: space-between;
    margin: 5px 15px 10px 0;
    align-items: center;
}

.pro-sm-box figure {
    margin-right: 8px;


}

.custom-card.insights-table {
    box-shadow: none;
}

/* ==== Insights Tabs ==== */

.custom-card.insights-table .custom-table tbody td {
    border-bottom: 4px solid #f5f5f5;
}

.custom-card.insights-table .custom-table tbody td:last-child {
    background: #fff !important;
}

.custom-table tbody td span i.round-icon {
    margin-right: 3px;
}

.login-bg {
    background: url(../images/bg.jpg) top center no-repeat;
    background-size: 100% 100%;
}

/* ===== REGISTER PAGE ===== */

.register-form {
    width: 600px;
}

.form-grps-box {
    display: flex;
    flex-flow: wrap;
    justify-content: space-between;
}

.form-grps-box .form-group {
    width: 48%;

}

.custom-card.insights-table {
    box-shadow: none;
}

.table-responsive .dataTables_filter input {
    min-width: 280px;
}

.product-list-table .product-row .form-control {
    padding: 6px 8px;
    border-radius: 4px;
}

.product-list-table .product-row .form-control.dropdown.bootstrap-select {
    padding: 0;
}

.custom-table tbody td span i.round-icon {
    margin-right: 3px;
}

.insights-page .custom-table tbody td:last-child {
    background: #fff !important;
    text-align: left;
}

form .form-group .form-control {
    height: 40px;
    background: #ffffff;
    border: 1px solid rgba(57, 73, 107, 0.3);
    border-radius: 0px;
    border-width: 1px !important;
    color: #3E4555;
    font-family: 'CircularStd-Book';
}

form .form-group .feature-list {
    min-height: 250px;
    max-height: 250px;
}

.order-create-form .mt-2.new-row .f-40 span.sub-total {
    padding: 6px 6px;
    white-space: nowrap;
}

/* SETTING ON/OFF CHECKBOX */

/*.theme-setting-box {
    position: fixed;
    background: #353439;
    padding: 10px;
    z-index: 9;
     top: calc(90% - 20px);
    bottom: 70px;
    left: -82px;
    width: 82px;
    transition: all 0.5s ease;
    height: 46px;
}*/

.theme-setting-box {
    padding: 10px
}

body.theme-open .theme-setting-box {
    left: 0;
}

.setting-theme-btn {
    position: absolute;
    right: -37px;
    padding: 10px;
    z-index: 9;
    background: #353439;
    cursor: pointer;
    height: 46px;
    top: 0;
}

.setting-theme-btn i.fa {
    color: #fff;
    font-size: 20px;
    line-height: 27px;
}

.switch {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 30px;
}

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

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #e2e2e2;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 24px;
    width: 24px;
    left: 4px;
    bottom: 3px;
    background-color: #ffffff;
    -webkit-transition: .4s;
    transition: .4s;
}

.edorder-swhbox .slider:before {
    background-color: #56A8FE;
}

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

.edorder-swhbox input:checked+.slider {
    background-color: #e1d5d5;
}

input:focus+.slider {
    box-shadow: none;
}

input:checked+.slider:before {
    -webkit-transform: translateX(16px);
    -ms-transform: translateX(16px);
    transform: translateX(16px);
    background: #56A8FE;
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

/* warning page */
.warning-msg-box {
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.1);
    align-items: center;
    margin: 0 auto;
    background: #fff;
    padding: 20px;
    display: inline-flex;
    font-family: 'CircularStd-Book', sans-serif;
    letter-spacing: 0.5px;
    border-left: 5px solid #ffc021;
    padding-right: 50px;
}

.warning-inr-box {
    text-align: left;
    margin-left: 15px;
}

.warning-msg-box i.fa {
    font-size: 30px;
    color: #ffc021;
}

.warning-inr-box h5 {
    font-size: 17px;
    margin-bottom: 6px;
    font-family: 'CircularStd-Book';
}

.warning-inr-box b {
    color: #777;
}

/* ==== SIGNUP LOADER ==== */
.sigup-loader {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sigup-loader-inr {
    align-items: center;
    margin: 0 auto;
    background: #fff;
    padding: 20px;
    font-family: 'CircularStd-Book', sans-serif;
    letter-spacing: 0.5px;
    padding-right: 50px;
    max-width: 90%;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

.sigup-loader-inr h5 {
    color: #56A8FE;
    font-family: 'CircularStd-Book';
    margin-bottom: 5px;
}

.sigup-loader-inr p {
    color: #777;
}

/* REPORT PAGE */
.cnvs-rprt-box {
    background: #fff;
}

.cnvs-rprt-box canvas {
    height: 70% !important;
    min-height: 500px;
    max-height: 600px;
    max-width: 75%;
    padding: 15px;
    margin: 0 auto;
    padding-top: 25px;
}

.insights-page .btn.add-new {
    position: absolute;
    right: 15px;
    height: 30px;
}

.insights-page .custom-card {
    box-shadow: none;
}

.insights-page .dataTables_wrapper {
    position: inherit;
}

.insights-page .dataTables_filter {
    position: absolute;
    right: 15px;
    padding: 0;
    top: -55px;
}

.insights-page .custom-search-top .dataTables_filter {
    right: -20px;
    top: -70px;
}

.insights-page .dataTables_filter input {
    border: 1px solid #c5c5c5;
    height: 38px;
}

.ins-date-box .custom-select-box:before {
    content: "\f0d7";
    font-size: 18px;
    top: calc(50% - 8px);
}

.report-tab-box .custom-tab.nav-tabs {
    margin-top: 0 !important;
    flex-wrap: nowrap;
}

/* System Preferences */

.d-flex.txt-prcntg-box input {
    width: 80px;
    margin-right: 5px;
}

.pro-sm-box .form-control {
    border-radius: 0;
}

.failed-orders {
    background-color: rgba(255, 112, 112, 0.2) !important;
}

.failed-orders .dots img {
    filter: brightness(60%);
}

.bootbox .bootbox-body {
    text-align: center;
}

.bootbox .modal-footer {
    justify-content: center;
}

.bootbox .modal-footer .btn {
    width: 70px;
}

.bootstrap-datetimepicker-widget {
    background: #FFFFFF;
    border: 1px solid #E1E4E8;
    border-radius: 4px;
}

.dow {
    vertical-align: middle;
    height: 20px;
    font-family: CircularStd-Book;
    color: #A0A8B1;
    background: white;
}

.bootstrap-datetimepicker-widget {
    font-family: CircularStd-Book;
    font-size: 15px;
}

.bootstrap-datetimepicker-widget table td.disabled,
.bootstrap-datetimepicker-widget table td.disabled:hover {
    cursor: not-allowed;
    background-color: #fff !important;
    border-color: transparent;
    color: #999 !important;
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
    background-color: #56A8FE !important;
    color: #fff !important;
    text-shadow: none !important;
}

.bootstrap-datetimepicker-widget table td.today {
    background-color: #7fa1c5 !important;
    color: #fff !important;
}

.bootstrap-datetimepicker-widget table td.today:before {
    border: 0 !important;
}

.bootstrap-datetimepicker-widget table td.day:hover,
.bootstrap-datetimepicker-widget table td.hour:hover,
.bootstrap-datetimepicker-widget table td.minute:hover,
.bootstrap-datetimepicker-widget table td.second:hover {
    background-color: #56A8FE !important;
    color: #fff !important;
}

.custom-company-save {
    position: relative !important;
    width: 100%;
    float: left;
    padding: 6px 10px;
    overflow: hidden;
    border-radius: 0 0 5px 5px;
}

.custom-company-save:hover {
    background: #eee;
    text-decoration: none;
}

.optcal-inv-box .com-info-txt {
    margin-top: 0;
}

.optcal-inv-box textarea {
    min-height: 60px;
    max-height: 120px;
}

.edorder-mn-swhbox {
    display: flex;
    align-items: center;
}

.edorder-swhbox {
    align-items: center;
    display: flex;
}

.edorder-swhbox span {
    color: #fff;
    font-size: 14px;
}

.edorder-mn-swhbox .custom-label {
    font-family: 'CircularStd-Book';
    margin-right: 12px;
}

.edorder-swhbox .switch {
    margin: 0 7px;
}

.edorder-swhbox .switch .slider {
    background-color: #e2e2e2;
}

.edt-ordr-hdrbox {
    justify-content: normal;
}

.edt-ordr-hdrbox h5 {
    margin-right: 50px;
}

.edt-ordr-hdrbox .ordr-hdr-rltv {
    position: absolute;
    right: 15px;
}

.input-group.date i.fa-clock {
    font-size: 24px !important;
}

/* Edit Supplier TABLE */

.supplier-product-table table thead th:last-child {
    width: 50px !important;
    max-width: 50px !important;
}

.edit-icon img {
    top: 20px;
    transform: translate(-50%, -50%);
    right: -3px;
}

/* MODEL MIDDLE */

.container.create-order-page .order-create-form {
    margin-top: 0;
}

.container.create-order-page .order-create-form .edt-ordr-hdrbox {
    margin-bottom: 40px;
}

.btn.focus,
.btn:focus {
    box-shadow: none;
}

/* live changes css */
p.desc.tracking-box {
    display: flex;
    position: relative;
}

p.desc.tracking-box .btn {
    margin-left: 10px;
}

p.desc.tracking-box span.tracking-err {
    position: absolute;
    top: 37px;
    font-size: 12px;
    color: #ec1c24;
}

/* ORDER TABLE DESIGN */

/* quotes tab
.order-quote-tab table tr th:nth-child(8)  {
    min-width: 350px !important;
    max-width: 350px !important;
    width: 350px !important;
}

active-orders
.order-actv-order-tab:nth-child(8)   {
    min-width: 350px !important;
    max-width: 350px !important;
    width: 350px !important;
}
 */

.customer-tag-view{
    color: white;
    padding: 2px;
    text-align: center;
    border-radius: 5px;
}

.production-stage-th {
    min-width: 360px !important;
    max-width: 360px !important;
    width: 360px !important;
    padding-left: 10px !important;
}

/* Search results used to be narrowed to 240px here, on the basis that quote rows only
   carried the "Send follow up" button and the three follow-up dots. They now also carry
   Send / Re-Send ahead of it, matching the Quotes tab (_actions_new.blade.php), which
   needs the full shared width — so the override is gone and Search inherits the 360px
   above, like every other listing with this column. */

/* Completed Orders */
.completd-orders-tab .production-stage-th {
    min-width: 375px !important;
}

/* .draft-order-tab tab */

.draft-order-tab table tr th:first-child {
    min-width: 20% !important;
    max-width: 20% !important;
    width: 20% !important;
}

.draft-order-tab table tr th:nth-child(2) {
    min-width: 25% !important;
    max-width: 25% !important;
    width: 25% !important;
}

.draft-order-tab table tr th:nth-child(3) {
    min-width: 25% !important;
    max-width: 25% !important;
    width: 25% !important;
}

.draft-order-tab table tr th:nth-child(4) {
    min-width: 20% !important;
    max-width: 20% !important;
    width: 20% !important;
}

.draft-order-tab .actn-btn {
    min-width: 90px !important;
    max-width: 90px !important;
    width: 90px !important;
}

.cmnt-box-hgt {
    min-height: 100px;
    max-height: 120px;
}

.btm-divider {
    border-bottom: 1px solid #eee;
    margin-bottom: 20px;
}

.csb-outline-set .select2-container {
    border: none !important;
    outline: none !important;
}

.csb-outline-set .select2-container span:focus {
    border: 1px solid #56A8FE !important;
}

/* CUSTOME SELECT BOX */
button.btn.dropdown-toggle.btn-light.bs-placeholder {
    background: #F8F9FC;
    border: 1px solid #CECFD0;
    border-radius: 4px;
    padding: 9px 12px;
}

.custom-ecom-dropdown button.btn.dropdown-toggle.btn-light.bs-placeholder {
    padding: 14px 12px;
}

.spng-no-box button.btn.dropdown-toggle {
    height: 40px;
    outline: none !important;
}

.input-group>.custom-select:not(:last-child),
.input-group>.form-control:not(:last-child) {
    background: #ffffff;
    border: 1px solid rgba(57, 73, 107, 0.3);
    ;
    border-radius: 4px;
}

.bootstrap-select .dropdown-menu {
    background: #fff;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5) !important;
}

.bootstrap-select .no-results {
    font-size: 14px;
}

.bootstrap-select>.dropdown-toggle:after {
    margin-top: -3px;
    content: "\f002";
    font-family: "FontAwesome" !important;
    position: absolute;
    right: 15px;
    top: calc(50% - 8px);
    color: #56A8FE;
    z-index: 1;
    pointer-events: none;
    left: auto;
    border: none;
    right: 23px;
}

.bootstrap-select button.btn.dropdown-toggle.btn-light.bs-placeholder:focus {
    border: 1px solid #56A8FE !important;
}

.spng-crr-trno-box {
    display: flex;
}

.png-crr-trno-inr {
    display: flex;
    margin-top: 10px;
    align-items: center;
    gap: 5px;
}

.png-crr-trno-inr .fancy-checkbox {
    margin: 7px 20px 0 0 !important;
    position: relative;
}

.spng-crr-trno-box .bootstrap-select {
    margin-right: 10px;
}

.spng-crr-trno-box {
    border-bottom: 2px solid #eeeff0;
    margin-top: -2px;
    position: relative;
    /*  z-index: 1;*/
}

.png-crr-trno-inr .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    line-height: initial;
}

.bootstrap-select.shippingCarriers .dropdown-toggle .filter-option {
    height: initial;
}

.spng-crr-trno-box.product-row.view-page {
    /* background: #fff;*/
    padding-top: 0;
    padding-bottom: 15px;
}

.spng-crr-trno-box .png-crr-trno-inr .fancy-checkbox input[type="checkbox"]+span {
    white-space: nowrap;
}

.png-crr-trno-inr p.desc.tracking-box .btn {
    height: 40px;
}

.custom-table thead th.acvt-ord-lblstatus {
    padding-left: 18px !important;
    width: 152px !important;
}

th.ordr-actnbtn {
    width: 35px !important;
}

/* Sticky Action column (right-pinned). Scoped per-table via #table-id to avoid
   activating on listings that haven't opted in yet. */
#global-search-table th.sticky-action-col,
#global-search-table td.sticky-action-col {
    position: sticky;
    right: 0;
    background-color: #eef0f3;
    z-index: 2;
    box-shadow: -4px 0 6px -4px rgba(0, 0, 0, 0.12);
}

#global-search-table thead th.sticky-action-col {
    z-index: 3;
}

/* Lift the sticky cell whose dropdown is open above neighboring sticky cells,
   otherwise their right-pinned 3-dot icons paint on top of the open menu. */
#global-search-table td.sticky-action-col:has(.dropdown.show) {
    z-index: 1001;
}

/* Failed-order rows use rgba(255,112,112,0.2)!important on every <td>, which
   would make the sticky cell semi-transparent and let scrolled cells bleed
   through. Override with the opaque equivalent on the sticky cell only. */
#global-search-table td.sticky-action-col.failed-orders {
    background-color: rgb(248, 210, 210) !important;
}

/* Dark-theme variant of the sticky Action column. Body cells sit on #353439,
   thead sits on #1b1c1e — pick slightly offset opaque shades so the column
   reads as pinned, and override the failed-orders rgba (rgba(255,255,255,0.38)
   over #353439) with its opaque equivalent. */
body.dark-theme #global-search-table th.sticky-action-col,
body.dark-theme #global-search-table td.sticky-action-col {
    background-color: #2a2b2e;
    box-shadow: -4px 0 6px -4px rgba(0, 0, 0, 0.5);
}

body.dark-theme #global-search-table thead th.sticky-action-col {
    background-color: #131416;
}

body.dark-theme #global-search-table td.sticky-action-col.failed-orders {
    background-color: rgb(130, 129, 132) !important;
}

.bootbox .modal-footer .btn {
    width: auto !important;
    border-radius: 4px;
    border: none;
}

.ttl-drdwn .dropdown-menu .dropdown-item:active a,
.ttl-drdwn .dropdown-item:active button {
    color: #fff !important;
}

/* INVENTORY PAGE */
.fl-box {
    width: 100% !important;
}

.invt-con-box {
    margin-top: 50px;
}

.pro-inv-right {
    padding: 0 50px;
}

.pro-inv-append-row {
    width: 100%;
    display: flex;
}

/* INVENTORY PAGE */
.max-width176 {
    max-width: 176px;
}

.fl-box {
    width: 100% !important;
}

.invt-con-box {
    margin-top: 50px;
}

.pro-inv-right {
    padding: 0 50px;
}

.pro-inv-right1 {
    padding-left: 0;
}

.pro-inv-append-row {
    width: 100%;
    display: flex;
}

.addon-swich-box {
    height: 40px;
}

.small-btn span {
    padding-right: 10px !important;
    font-size: 13px !important;
    padding-left: 0 !important;
    line-height: 23px !important;
}

.small-btn i.fa {
    font-size: 12px !important;
    font-weight: normal !important;
}

.btn:focus {
    outline: none !important;
    box-shadow: none !important;
}

p.desc.tracking-box {
    display: flex;
    position: relative;
}

p.desc.tracking-box .btn {
    margin-left: 10px;
}

p.desc.tracking-box span.tracking-err {
    position: absolute;
    top: 37px;
    font-size: 12px;
}

.aly-clr-btn {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.aly-clr-btn .btn-save {
    margin-right: 15px;
}

/* EDIT ORDER PAGE SCROLL SET */

body.ce-order-body main.py-4 {
    height: auto !important;
    overflow: auto !important;
}

body.ce-order-body .footer {
    position: fixed;
    bottom: 0;
    z-index: 8;
}

body.order-details-box {
    font-size: 15px;
    font-family: 'CircularStd-Bold';
    position: relative;
    color: #9999;
}

/*delivery priority*/
.dp-icon-box {
      width: 32px;
      height: 32px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 8px;
}
.dp-green-box {
    background-color: #44ae1f; /* green */
}
.dp-yellow-box {
    background-color: #efaa30; /* yellow */
}
.dp-red-box {
    background-color: #ff0000; /* red */
}
.dp-icon {
      font-size: 24px;
      color: white;
}
.dp-icon-box .fa{
    margin: 0 0 0 5px;
    color: #fff;
}
.sp-dp-critical
{
    background-color: #ff0000;
    padding: 6px;
    width: 80px;
    height: 25px;
    margin-left: 10px;
    font-weight: 300;
    font-size: 13px;
}

.tagify--outside {
    border: 0;
}

.tagify--outside .tagify__input {
    order: -1;
    flex: 100%;
    border: 1px solid var(--tags-border-color);
    margin-bottom: 1em;
    transition: .1s;
    /* padding-top: 10px !important;
    line-height: 16px; */
}

.tagify--outside .tagify__input:hover {
    border-color: var(--tags-hover-border-color);
}

.tagify--outside.tagify--focus .tagify__input {
    transition: 0s;
    border-color: var(--tags-focus-border-color);
    padding-top: 11px;
}

.tagify__input[data-suggest]::after {
    content: attr(data-suggest);
    top: 0 !important;
}

.bootstrap-select .no-results {
    background: none !important;
}

.vw-artwrk-btn {
    width: 400px !important;
}

.view-rtwork-box {
    width: auto;
    text-align: center;
    margin-top: 15px;
}

.view-rtwork-box b {
    margin-bottom: 10px;
    font-family: 'CircularStd-Book';
    display: block;
}

.small-btn span {
    padding-right: 10px !important;
    font-size: 13px !important;
    padding-left: 0 !important;
    line-height: 23px !important;
}

.small-btn i.fa {
    font-size: 12px !important;
    font-weight: normal !important;
}

.btn:focus {
    outline: none !important;
    box-shadow: none !important;
}

body.dark-theme .osbf-fltr-box label {
    color: #dadada !important;
}

body.dark-theme .custom-table .failed-orders span {
    color: #444444;
}

body.dark-theme .custom-table tbody td:last-child a.view-column,
body.dark-theme .custom-table tbody td:last-child a.text-primary,
body.dark-theme .custom-table tbody td:last-child a.del-btn.text-danger,
body.dark-theme .custom-table tbody td:last-child a.text-success {
    background: transparent;
}

body.dark-theme .custom-tab.nav-tabs .nav-link {
    color: #e5e6e8;
}

body.dark-theme .custom-tab.nav-tabs .nav-item .nav-link.active {
    /* background: #353439; */
}

body.dark-theme .table-filter-box {
    color: #babbbd;
}

body.dark-theme .title-container .title {
    color: #fff !important;
}

body.dark-theme .title-container {
    /* border-bottom: 1px solid #3a3a3a */
}

body.dark-theme .custom-tab.nav-tabs {
    /* border-bottom: 1px solid #242527; */
}

body.dark-theme .orderfilter-box {
    background: #1b1c1e;
    /*border-bottom: 1px solid #444;*/
}

body.dark-theme label.fancy-checkbox {
    color: #e5e6e8;
}

body.dark-theme .user-detail {
    background: none;
    color: #e5e6e8;
}

body.dark-theme .user-detail p {
    color: #e5e6e8;
}

body.dark-theme .product-list-table,
body.dark-theme .cm-blok p {
    background: #1b1c1e
}

body.dark-theme .panel-body {
    background: #1b1c1e;
    border: 1px solid #3a3a3a;
}

body.dark-theme .addon-accordian-inr {
    border-color: #555555;
}

.dark-theme p,
body.dark-theme .product-row .heading,
body.dark-theme .product-row b,
body.dark-theme .form-group .custom-label {
    color: #e5e6e8 !important;
}

body.dark-theme tr>th {
    color: #e5e5e7;
    background: #1b1c1e;
    border-radius: 0 !important;
}

body.dark-theme .bootstrap-datetimepicker-widget table td.day {
    background-color: #353439 !important;
    color: #fff !important;
    border-radius: 0 !important;

}

body.dark-theme .bootstrap-datetimepicker-widget table td.today {
    background: #56A8FE !important;
}

body.dark-theme .bootstrap-datetimepicker-widget {
    border: 1px solid #555;
}

body.dark-theme .product-row {
    border-bottom: 2px solid #1b1c1e;
}

body.dark-theme .tab-hdr-ttl h5 {
    background: #353439;
    color: #e5e6e8;
}

.dark-theme body.dark-theme .nt-ttl {
    background: none;
}

body.dark-theme .note-list-box {
    border-bottom: 1px solid #3a3a3a;
}

body.dark-theme .total-section p.grand-total-row {
    background: none;
}

body.dark-theme .total-section p {
    border-bottom: 1px solid #313131;
}

body.dark-theme .dropzone-section .dropzone.dz-clickable {
    background: #1b1c1e;
}

body.dark-theme .co-ntf-persnal h3 {
    color: #fff !important;
}

body.dark-them .inter-his-box .ord-int-box .tab-hdr-ttl h5 {
    color: #ffffff !important;
    background: none;
}

body.dark-theme .ord-int-box .tab-hdr-ttl {
    border-bottom: none;
}

body.dark-theme .inter-his-box {
    border-top: 1px solid #313131;
}

body.dark-theme .inter-his-box .ord-int-box .tab-hdr-ttl h5 {
    /* border-top: 1px solid #313131; */
    background: none;
    color: #fff !important;
}

body.dark-theme .button-container.button-icns-grups {
    border-top: 1px solid #313131;
}

body.dark-theme .button-icns-grups .input-icn-btn input {
    background: #1b1c1e;
}

p.desc.tracking-box {
    display: flex;
    position: relative;
}

p.desc.tracking-box .btn {
    margin-left: 10px;
}

p.desc.tracking-box span.tracking-err {
    position: absolute;
    top: 37px;
    font-size: 12px;
}

.aly-clr-btn {
    display: flex;
    align-items: center;
}

.aly-clr-btn .btn-save {
    margin-right: 15px;
}

body.dark-theme .daterangepicker .ranges li:hover {
    background-color: #1b1c1e;
}

body.dark-theme .daterangepicker .calendar-table {
    background-color: #353439;
}

body.dark-theme .daterangepicker td.off,
body.dark-theme .daterangepicker td.off.in-range,
body.dark-theme .daterangepicker td.off.start-date,
body.dark-theme .daterangepicker td.off.end-date {
    background-color: #353439;
    cursor: not-allowed;
}

body.dark-theme .daterangepicker td.in-range {
    background-color: #a9cff7;
    border-color: transparent;
    border-radius: 0;
}

body.dark-theme .daterangepicker .calendar-table .next span,
body.dark-theme .daterangepicker .calendar-table .prev span {
    color: #fff;
}

body.dark-theme .daterangepicker td.available:hover,
body.dark-theme .daterangepicker th.available:hover {
    background-color: #cbcbcb !important;
}

body.dark-theme .bootstrap-datetimepicker-widget table td.disabled,
.bootstrap-datetimepicker-widget table td.disabled:hover {
    background-color: #353439;
    color: #555 !important;
    border-radius: 0;
}

body.dark-theme .modal-content {
    background-color: #1b1c1e;
    border: 1px solid rgb(118, 118, 119);
}

body.dark-theme .modal-header {
    border-bottom: 1px solid #353439;
}

body.dark-theme .modal-confirm .modal-content {
    box-shadow: 0 0 3px rgba(255, 255, 255, 0.8);
}

body.dark-theme .close,
body.dark-theme .close:focus,
body.dark-theme .close:hover {
    color: #fff;
}

body.dark-theme .acc-app-logo-box {
    background: #fff;
}

body.dark-theme .acc-app-logo-box h6 {
    color: #222;
}

body.dark-theme .popover {
    box-shadow: 0px 0px 7px 9px rgba(0, 0, 0, 0.3) !important;
}

body.dark-theme .card {
    background: #353439;
}

body.dark-theme .setting-page .card-header {
    border-bottom: 1px solid #545454;
}

body.dark-theme .title-container .view-order-title {
    color: #fff !important;
}

body.dark-theme td.optcal-inv-box-orders span {
    color: #231f20;
}

body.dark-theme td.failed-orders h6 {
    color: #231f20;
}

.order-search-box {
    margin: 30px 0;
}

.osbf-src-box {
    display: inline-flex;
    align-items: center;
}

.osbf-src-box label {
    flex: none;
    margin-right: 15px;
}

.osbf-src-box input {
    width: 300px;
    height: 40px;
}

.osbf-fltr-box {
    margin-top: 0;
    display: flex;
    align-items: center;
    width: 40px;
    justify-content: center;
    cursor: pointer;
}

.osbf-fltr-box label {
    margin-right: 10px;
    margin-left: 15px;
    display: inline-block;
    color: #12203E !important;

    cursor: pointer;
}

.osbf-fltr-box label:hover {
    color: #56A8FE !important;
}

/*.osbf-fltr-box i.fa {
    font-size: 25px;
}*/

/* EDIT ORDER PAGE SCROLL SET */

body.ce-order-body main.py-4 {
    height: auto !important;
    overflow: auto !important;
}

body.ce-order-body .footer {
    position: fixed;
    bottom: 0;
    z-index: 8;
}

body.order-details-box {
    font-size: 15px;
    font-family: 'CircularStd-Bold';
    position: relative;
    color: #9999;
}

.tagify--outside {
    border: 0;
}

.filter-icon:hover {
    cursor: pointer;
}

.tagify--outside .tagify__input {
    order: -1;
    flex: 100%;
    border: 1px solid #c5c4c4;
    margin-bottom: 1em;
    transition: .1s;
    height: 40px;
    padding: 0 10px;
    border-radius: 0px;
}

.tagify--outside .tagify__input:hover {
    border-color: var(--tags-hover-border-color);
}

.bootstrap-select .no-results {
    background: none !important;
}

.vw-artwrk-btn {
    width: 400px !important;
}

.view-rtwork-box {
    width: auto;
    text-align: center;
    margin-top: 15px;
}

.view-rtwork-box b {
    margin-bottom: 10px;
    font-family: 'CircularStd-Book';
    display: block;
}

.edit-profile-box {
    width: 225px !important;
    max-width: initial;
    padding: 0 15px;
    padding-top: 12px;
}

/* LOADER */
.ldr-inr,
.ldr-text {
    text-align: center;
}

.ldr-text p {
    color: #3e4555;
    font-weight: 300;
}

p.srng-bld {
    line-height: 23px;
    font-family: 'CircularStd-Medium';
}

.form-group p {
    white-space: initial;
}

.ldr-inr {
    margin: 15px 0 0 0;
}

button.ldr-btn {
    font-size: 14px;
    width: 140px;
    line-height: 30px;
    border-radius: 4px;
    border: none;
    color: #15aee7;
    font-family: 'CircularStd-Medium';
    margin-top: 17px;
    cursor: pointer;
}

.asgn-clt-ppl-chk-grp.myact-tp-lft-bar .chk-grp .input-field [type="checkbox"]+label {
    max-width: 250px;
}

.ldr-text {
    display: inline-block;
    padding: 2px 10px;
}

.ordr-hdr-rltv .ttl-drdwn .dropdown-menu .dropdown-item:active a,
.ordr-hdr-rltv .ttl-drdwn .dropdown-item:active button {
    color: #56A8FE !important;
}

/* =================================== BLACK THEME =================================== */

body.dark-theme .spng-crr-trno-box.product-row.view-page {
    background: transparent;
}

body.dark-theme .order-create-form .supplier-qty.modify-row .form-control,
body.dark-theme .product-row .supplier-qty .custom-select-box .dropdown-toggle {
    border: 1px solid #555555;
    height: 35px;
}

body.dark-theme .product-list-table .product-row .supplier-qty .mt-2 .form-control {
    border: none !important;
}

body.dark-theme .order-create-form .mt-2.new-row .f-40 span.sub-total {
    border: 1px solid #555555;
}

body.dark-theme {
    background: #1b1c1e !important;
    color: #e5e5e7;
}

body.dark-theme .custom-table tbody td {
    background: #353439;
    color: #ffffff;
}

body.dark-theme .failed-orders {
    background-color: rgba(255, 255, 255, 0.38) !important;
}

body.dark-theme thead>tr {
    border: 1px solid #242527;
    background: #1b1c1e !important;
}

body.dark-theme tbody>tr {
    border: 1px solid #242527;
}

body.dark-theme .custom-table {
    color: #e5e5e7;
}

body.dark-theme .custom-table .failed-orders span {
    color: #444444;
}

body.dark-theme .custom-table tbody td:last-child a.view-column,
body.dark-theme .custom-table tbody td:last-child a.text-primary,
body.dark-theme .custom-table tbody td:last-child a.del-btn.text-danger,
body.dark-theme .custom-table tbody td:last-child a.text-success {
    background: transparent;
}

body.dark-theme .custom-tab.nav-tabs .nav-link {
    color: #e5e6e8 !important;
}

body.dark-theme .table-filter-box {
    color: #babbbd;
}

body.dark-theme .title-container .title {
    color: #fff !important;
}

body.dark-theme .addon-accordian.crt-cusmr-form .title-container {
    border-top: 1px solid #555555;
    border-bottom: 1px solid #555555;
}

body.dark-theme .addon-accordian-inr .custom-label {
    color: #ffffff;
}

body.dark-theme label.fancy-checkbox {
    color: #e5e6e8;
}

body.dark-theme .user-detail {
    background: none;
    color: #e5e6e8;
}

body.dark-theme .user-detail p {
    color: #e5e6e8;
}

body.dark-theme .product-list-table,
body.dark-theme .cm-blok p {
    background: #1b1c1e
}

.dark-theme p,
body.dark-theme .product-row .heading,
body.dark-theme .form-group .custom-label {
    color: #e5e6e8 !important;
}

.ck-editor__main .ck-content p {
    color: #333333 !important;
}

body.dark-theme .text-danger {
    color: #FF7979 !important;
}

body.dark-theme .product-row {
    border-bottom: 2px solid #1b1c1e;
}

body.dark-theme .tab-hdr-ttl h5 {
    background: #353439;
    color: #e5e6e8 !important;
}

body.dark-theme .nt-ttl {
    background: none;
}

body.dark-theme .nt-ttl p {
    padding: 5px 30px 5px 2px !important;
}

body.dark-theme .nt-ttl .delete-note {
    top: calc(50% - 12px);
}

body.dark-theme .new-customer:focus,
body.dark-theme .new-customer:hover,
body.dark-theme .new-customer:active {
    color: #e5e6e8;
}

body.dark-theme .dataTables_paginate .paginate_button {
    color: #e5e6e8;
}

body.dark-theme .popover {
    background: #353439 !important;
}

body.dark-theme .popover-header {
    background-color: #353439 !important;
    border-bottom: 1px solid #242527;
}

body.dark-theme .popover-body {
    color: #e5e6e8;
}

body.dark-theme .bs-popover-auto[x-placement^=right] .arrow::after,
body.dark-theme .bs-popover-right .arrow::after {
    border-right-color: #383434;
}

body.dark-theme .bs-popover-auto[x-placement^=right] .arrow::before,
body.dark-theme .bs-popover-right .arrow::before {
    left: 0;
    border-right-color: #524f4f;
}

body.dark-theme .insights-page .custom-table tbody td:last-child {
    background: #353439 !important
}

body.dark-theme .img-thumbnail {
    background-color: #22232f;
    border: 1px solid #3a3a3a;
}

body.dark-theme .custom-file-control+span {
    color: #d8d8d8;
}

body.dark-theme .find-txt-stng a,
body.dark-theme .card-block-section,
body.dark-theme .order-create-form .product-row.cus-row {
    background: #252629;
    border: none !important;
    box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.75);
    margin-bottom: 15px;
}

.card-block-section.bg-transperant {
    background: transparent !important;
    box-shadow: none !important;
}

body.dark-theme .card-block-section.bg-transperant {
    border: 1px solid #555555 !important;
}

body.dark-theme .card-block-section.bg-transperant.border-0 {
    border: 0px !important;
}

body.dark-theme .form-con-box .title-container {
    border-bottom: 1px solid #555555;
}

body.dark-theme .chk-ttl-inline {
    color: #231F20;
}

body.dark-theme .chk-ttl-inline,
body.dark-theme .sendto-box span {
    color: #e5e5e7;
}

body.dark-theme .accntg-app-int-page .form-con-box {
    background: #1b1c1e;
}

body.dark-theme .artwork-b .art-work-infor .a-name {
    color: #fff;
}

body.dark-theme .daterangepicker,
body.dark-theme #logs-daterange {
    background: #353439 !important;
}

body.dark-theme #logs-daterange {
    padding: 8px 10px !important;
    background: none !important;
}

body.dark-theme .daterangepicker .ranges li:hover {
    background-color: #1b1c1e;
}

body.dark-theme .daterangepicker .calendar-table {
    background-color: #353439;
}

body.dark-theme .daterangepicker td.off,
body.dark-theme .daterangepicker td.off.in-range,
body.dark-theme .daterangepicker td.off.start-date,
body.dark-theme .daterangepicker td.off.end-date :hover {
    background-color: #353439 !important;
    color: #555;
}

body.dark-theme .start-date {
    border-radius: 4px 0px 0px 3px !important;
}

body.dark-theme .daterangepicker .calendar-table .next span,
body.dark-theme .daterangepicker .calendar-table .prev span {
    color: #fff;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    border-radius: 0;
    display: inline-block;
    padding: 3px;
}

body.dark-theme .daterangepicker td.available:hover,
body.dark-theme .daterangepicker th.available:hover {
    background: #56A8FE !important;
}

body.dark-theme .daterangepicker {
    border: 1px solid #555555 !important;
}

body.dark-theme .daterangepicker:after {
    border-right: 6px solid transparent !important;
    border-bottom: 6px solid #555555 !important;
    border-left: 6px solid transparent !important;
}

body.dark-theme .daterangepicker .drp-buttons {
    border: 1px solid #555555 !important;
}

body.dark-theme .daterangepicker.show-ranges.ltr .drp-calendar.left {
    border-right: 1px solid #555555 !important;
}

body.dark-theme .daterangepicker .calendar-table .next span,
.daterangepicker .calendar-table .prev span {
    color: #fff !important;
}

body.dark-theme .daterangepicker th.month {
    color: #fff !important;
}

body.dark-theme .daterangepicker td.active,
.daterangepicker td.active:hover {
    color: #fff !important;
    background-color: #56A8FE;
    border-radius: 0px 3px 3px 0px;
}

body.dark-theme .modal-content {
    background-color: #1b1c1e;
    border: 1px solid rgb(118, 118, 119);
}

body.dark-theme .modal-header {
    border-bottom: 1px solid #353439;
}

body.dark-theme .modal-confirm .modal-content {
    box-shadow: 0 0 3px rgba(255, 255, 255, 0.8);
}

body.dark-theme .close,
body.dark-theme .close:focus,
body.dark-theme .close:hover {
    color: #fff;
}

body.dark-theme .acc-app-logo-box {
    background: #fff;
}

body.dark-theme .acc-app-logo-box h6 {
    color: #222;
}

body.dark-theme .popover {
    box-shadow: 0px 0px 7px 9px rgba(0, 0, 0, 0.3) !important;
}

body.dark-theme .card {
    background: #353439;
}

body.dark-theme .setting-page .card-header {
    border-bottom: 1px solid #545454;
}

body.dark-theme .title-container .view-order-title {
    color: #fff !important;
}

body.dark-theme td.optcal-inv-box-orders span {
    color: #231f20;
}

body.dark-theme td.failed-orders h6 {
    color: #231f20;
}

/* APPROVAL PAGE BLACK THEME */
body.dark-theme .approval-header {
    background: #22232F;
}

body.dark-theme .border-btn-lg {
    border: 1px solid #ffffff;
    color: #fff;
}

body.dark-theme .border-btn-lg:hover {
    color: #fff;
}

body.dark-theme .approval-header+main.py-4 {
    background: #1b1c1e;
}

body.dark-theme .ord-cnfrm-bg {
    background: #1b1c1e;
}

body.dark-theme .aprv-ordr-dtls-box .product-row:first-child {
    border-bottom: 1px solid #636363 !important;
}

body.dark-theme .aprv-ordr-dtls-box .product-row:first-child,
body.dark-theme .aprv-ordr-dtls-box .product-list-table .product-row:last-child {
    border-top: 1px solid #636363;
    border-bottom: 1px solid #636363;
}

body.dark-theme .ins-dtrng-box,
body.dark-theme .custom-select-box select {
    border: solid 1px #555555;
    background: #353439;
    color: #fff;
}

body.dark-theme .tab-hdr-ttl {
    border-bottom: 1px solid #3a3a3a;
}

body.dark-theme .cnvs-rprt-box {
    background: none;
}

body.dark-theme option {
    background-color: #353439 !important;
}

/* FORM BG COLOR SET */
body.dark-theme .create-order-page .custom-select-box .dropdown-toggle {
    background: none;
    border: 1px solid #555555;
}

body.dark-theme .form-control {
    background: #1b1c1e !important;
    color: #fff;
    border-color: #555555 !important;
}

body.dark-theme .btn-light,
body.dark-theme .btn-light:hover {
    color: #fff;
}

body.dark-theme .form-control:disabled,
body.dark-theme .form-control[readonly] {
    background-color: #222222;
    color: #cbcbcb;
}

body.dark-theme .form-control:focus {
    background: none;
    color: #fff;
}

body.dark-theme .custom-select-box .dropdown-menu {
    background: #353439 !important;
    border: none !important;
    -webkit-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.75);
}

body.dark-theme .dropdown-item {
    color: #fff;
}

body.dark-theme .dropdown-item:focus,
body.dark-theme .dropdown-item:hover {
    color: #fff;
    text-decoration: none;
    background: #353439 !important;
}

body.dark-theme .ins-dtrng-box,
body.dark-theme .custom-select-box select {
    background: none;
}

body.dark-theme .co-eml-multy input {
    background: none;
}

body.dark-theme .intrnl-notes {
    background: none;
    color: #fff;
}

body.dark-theme .dlrsign-box:after {
    color: #e2e2e2
}

body.dark-theme .insights-page .dataTables_filter input {
    background: none;
}

body.dark-theme .bootstrap-select .no-results {
    background: none;
    color: #fff;
}

body.dark-theme .select2-container--default .select2-selection--single {
    background: none !important;
    border: 1px solid #555555 !important;
}

body.dark-theme .select2-container--default.select2-container--disabled .select2-selection--single {
    background: #424242 !important;
}

body.dark-theme .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fff;
}

body.dark-theme .select2-dropdown {
    background: #353439;
}

body.dark-theme .select2-search--dropdown .select2-search__field {
    background: none;
    color: #fff;
}

body.dark-theme .select2-container--default .select2-results__option[aria-selected=true] {
    color: #56A8FE;
    background: none;
}

body.dark-theme .intrnl-notes {
    border: solid 1px #555555 !important;
}

body.dark-theme .text-muted {
    color: #777777;
}

body.dark-theme .custom-company-save:hover {
    background: #1e1e1f;
    text-decoration: none;
}

body.dark-theme .fancy-checkbox input[type="checkbox"]+span i {
    background: none;
}

body.dark-theme .bootstrap-datetimepicker-widget {
    background: none;
}

body.dark-theme .input-group.date i.fa-clock {
    color: #fff;
}

body.dark-theme .co-eml-multy input {
    color: #fff;
}

body.dark-theme .search-all-box input,
body.dark-theme .table-responsive .dataTables_filter input {
    background: none;
    color: #fff;
    border: 1px solid #555555 !important;
}

body.dark-theme  .switch .slider {
    background: none !important;
    border: 1px solid #555555;
}

body.dark-theme .fancy-checkbox input[type="checkbox"]+span i {
    border: 2px solid #555555 !important;
}

body.dark-theme  .with_dl .dl-sign {
    background: #383838;
}

/* BORDER TABLE DESIGN */

/*
body.dark-theme .custom-table {
    color: #e5e5e7;
    background: #1b1c1e;
    border: 1px solid #5a5a5a;
    box-shadow: 0 0 4px rgba(255,255,255,0.3);
}

body.dark-theme .custom-table tbody td {
    background: none;
    border-bottom: none;
    border-top: 1px solid #3a3a3a;
} */

/* DROUPDOWN */
body.dark-theme .btn-light {
    background: #1b1c1e !important;
}

body.dark-theme .bootstrap-select button.btn.dropdown-toggle.btn-light.bs-placeholder:focus,
body.dark-theme .bootstrap-select .dropdown-toggle:focus,
body.dark-theme .bootstrap-select>select.mobile-device:focus+.dropdown-toggle,
body.dark-theme .search-all-box input:focus,
body.dark-theme .dataTables_filter input:focus {

    box-shadow: none;
    border: 1px solid #56A8FE !important;
}

body.dark-theme button.btn.dropdown-toggle.btn-light.bs-placeholder {
    border: 1px solid #555555 !important;
}

body.dark-theme .acknow-mdl-body {
    background: #1b1c1e !important;
}

body.dark-theme .tagify__dropdown__wrapper {
    background: #1b1c1e !important;
}

body.dark-theme .tagify__dropdown__item {
    color: #fff !important;
    font-size: 12px !important;
}

body.dark-theme .tagify__input::after {
    color: #fff !important;
}

body.dark-theme .filtrbox.fltr-value input,
body.dark-theme .orderfilter-box .tagify__input,
body.dark-theme .filtrbox.fltr-date .ins-date-box {
    border-color: #555 !important;
}

/*filter*/
body.dark-theme .orderfilter-box .tagify__input,
body.dark-theme .filtrbox.fltr-date .ins-date-box {
    background: none !important;
}

.removeVariant {
    padding-top: 35px;
    color: red;
}

body.dark-theme .ordr-actndw .dropdown-menu {
    background-color: #353439;
}

body.dark-theme .ordr-actndw.ttl-drdwn .dropdown-item {
    border-bottom: 1px solid #464646;
    padding: 0;
}

body.dark-theme .ordr-actndw.ttl-drdwn .dropdown-item:last-child {
    border-bottom: none !important;
}

body.dark-theme .dropdown-content form {
    border-bottom: 1px solid #464646;
}

.ordr-actndw.ttl-drdwn .dropdown-item {
    padding: 0;
    display: inline-flex;
}

.ordr-actndw.ttl-drdwn .dropdown-item>a,
.ordr-actndw.ttl-drdwn .dropdown-item>button {
    padding: 10px;
    width: 100%;
}

.ordr-actndw.ttl-drdwn .dropdown-item:last-child {
    border-bottom: none !important;
}

body.dark-theme .dropdown-content form {
    border-bottom: 1px solid #464646;
}

body.dark-theme .ordr-hdr-rltv .dropdown-item:focus,
body.dark-theme .ordr-hdr-rltv .dropdown-item:hover {
    color: #16181b;
    text-decoration: none;
    background-color: #28282b;
    transition: 0.4s;
}

.ordr-hdr-rltv .dropdown-item:focus,
.ordr-hdr-rltv .dropdown-item:hover {
    transition: 0.4s;
}

body.dark-theme .link-box {
    color: #fff;
}

body.dark-theme .intnal-notes {
    background: none;
    color: #fff;
    border: 1px solid #555555 !important;
}

body.dark-theme textarea:focus,
body.dark-theme .form-control:focus {
    box-shadow: none;
    border: 1px solid #56A8FE !important;
}

body.dark-theme .dataTables_processing {
    background: #353439;
    border: 1px solid #5a5a5a !important;
}

body.dark-theme .dropzone {
    background-color: #252629;
}

body.dark-theme .co-eml-multy input {
    border: solid #555555 1px !important;
}

/* DATEPICKER */
body.dark-theme .datepicker {
    background: #1b1c1e !important;
    border: 0;
}

body.dark-theme .datepicker-dropdown {
    background: #1b1c1e !important;
}

body.dark-theme .dropdown-menu {
    color: #dadada !important;
    background: #22232f !important;
}

body.dark-theme .datepicker table tr td.day:hover,
body.dark-theme .datepicker table tr td.day.focused {
    background: #56A8FE !important;
    cursor: pointer;
}

body.dark-theme .datepicker table tr td span:hover,
body.dark-theme .datepicker table tr td span.focused {
    background: #3d3d44 !important;
}

body.dark-theme .datepicker .datepicker-switch:hover,
body.dark-theme .datepicker .prev:hover,
body.dark-theme .datepicker .next:hover,
body.dark-theme .datepicker tfoot tr th:hover {
    background: #3d3d44 !important;
}

body.dark-theme .bootstrap-datetimepicker-widget table td>div:hover {
    background: #3d3d44 !important;
}

body.dark-theme .sign-img {
    background-color: #fff;
}

body.dark-theme .bootstrap-datetimepicker-widget .picker-switch {
    background: #1b1c1e !important;
}

body.dark-theme .bootstrap-datetimepicker-widget .picker-switch:hover {
    background: #3d3d44 !important;
}

body.dark-theme .custom-tab.nav-tabs.vworder-nav-tabs {
    border-bottom: 1px solid #3a3a3a;
}

body.dark-theme .view-order-page .nav-tabs.vworder-nav-tabs {
    border: none;
}

body.dark-theme .m-signature-pad--body canvas {
    background: none;
}

body.dark-theme .production-popup .custom-table tbody td:last-child {
    background: #353439 !important;
}

body.dark-theme .dataTables_filter input {
    background: none;
    border: 1px solid #555555 !important;
    color: #fff;
}

body.dark-theme table.dataTable thead .sorting:after,
body.dark-theme table.dataTable thead .sorting_asc:after,
body.dark-theme table.dataTable thead .sorting_desc:after,
body.dark-theme table.dataTable thead .sorting_asc_disabled:after,
body.dark-theme table.dataTable thead .sorting_desc_disabled:after {
    color: #e5e5e7;
    border-top-color: #ffffff;
}

body.dark-theme .tagify__input::before {
    color: #fff;
}

body.dark-theme .filtrbox.fltr-value input {
    background: transparent !important;
    color: #fff;
}

body.dark-theme .mainmenu .collapse ul.nav.mr-auto ul,
body.dark-theme .mainmenu .collapse ul.nav.mr-auto ul.dropdown-menu {
    box-shadow: 0px 1px 2px rgba(181, 181, 181, 1) !important;
}

body.dark-theme .artwork-total .dropzone .dz-preview {
    background: rgb(37, 38, 41);
}

body.dark-theme .dropzone .dz-preview .dz-details .dz-filename span {
    color: #ffffff;
}

body.dark-theme .dropzone .dz-preview .dz-details .dz-size,
body.dark-theme .dropzone-previews .dz-preview .dz-details .dz-size {
    color: #ffffff;
}

body.dark-theme .dropzone .dz-preview .dz-details .dz-size {
    color: #333333;
}

body.dark-theme .dlrsign-box.disable-field:after {
    color: #555555 !important;
}

body.dark-theme .bootstrap-datetimepicker-widget .picker-switch:hover,
body.dark-theme .bootstrap-datetimepicker-widget .picker-switch a.btn:hover {
    background: rgb(37, 38, 41) !important;
}

body.dark-theme .bootstrap-datetimepicker-widget table tr td span:hover,
body.dark-theme .bootstrap-datetimepicker-widget table tr td i:hover {
    background: rgb(37, 38, 41) !important
}

body.dark-theme .btn-light {
    background: #1b1c1e !important;
    border: solid 1px #555555 !important;
}

body.dark-theme .bootstrap-select button.btn.dropdown-toggle.btn-light.bs-placeholder:focus,
body.dark-theme .bootstrap-select .dropdown-toggle:focus,
body.dark-theme .bootstrap-select>select.mobile-device:focus+.dropdown-toggle,
body.dark-theme .search-all-box input:focus,
body.dark-theme .dataTables_filter input:focus {
    box-shadow: none;
    border: 1px solid #56A8FE !important;
}

body.dark-theme button.btn.dropdown-toggle.btn-light.bs-placeholder {
    border: 1px solid #555555 !important;
}

body.dark-theme .acknow-mdl-body {
    background: #1b1c1e !important;
}

body.dark-theme .tagify__dropdown__wrapper {
    background: #1b1c1e !important;
}

body.dark-theme .tagify__dropdown__item {
    color: #fff !important;
    font-size: 12px !important;
}

body.dark-theme .tagify__input::after {
    color: #fff !important;
}

body.dark-theme .filtrbox.fltr-value input,
body.dark-theme .orderfilter-box .tagify__input,
body.dark-theme .filtrbox.fltr-date .ins-date-box {
    border-color: #555 !important;
}

/*filter*/
body.dark-theme .orderfilter-box .tagify__input,
body.dark-theme .filtrbox.fltr-date .ins-date-box {
    background: none !important;
}

/* loader */
body.dark-theme .ldr-text {
    background: #131415;
}

body.dark-theme .dataTables_length select {
    background: #1b1c1e !important;
    border-color: #555555 !important;
    color: #fff;
}

body.dark-theme .datepicker-dropdown.datepicker-orient-top:after {
    border-top: 6px solid #22232f !important;
}

body.dark-theme .addon-swich-box .edorder-swhbox span {
    color: #fff !important;
}

/* STEP START */
ul.steps {
    position: fixed;
    width: 630px;
    top: 0;
    background: none;
    z-index: 9;
    padding-bottom: 5px;
    left: calc(50% - 315px);
    padding: 10px 0;
}

.steps {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    overflow-x: auto
}

.steps .step:first-child {
    margin-left: auto
}

.steps .step:last-child {
    margin-right: auto
}

.step:first-of-type .step-circle::before {
    display: none
}

.step:last-of-type .step-content {
    padding-right: 0
}

.step-content {
    box-sizing: content-box;
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 9rem;
    min-width: 9rem;
    max-width: 5rem;
    padding-top: 0;
    padding-right: 1rem
}

.step-circle {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    color: #adb5bd;
    border-radius: 100%;
    background-color: #d0d2d3;
}

.step-circle::before {
    content: '---------------';
    display: block;
    position: absolute;
    top: 50%;
    left: -8px;
    width: calc(4.5rem + 2rem - 0rem);
    transform: translate(-100%, -50%);
    color: #adb5bd;
    font-size: 22px;
    letter-spacing: 1px;
    font-weight: 100;
    white-space: nowrap;
    margin: 0 5px;
    overflow: hidden;
}

.step-text {
    color: #000;
    word-break: break-all;
    margin-top: .28em;
    font-size: 0.8em;
    line-height: initial;
}

.step-active .step-circle {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff
}

.step-active .step-circle::before {
    color: #00a551;
}

.step-success .step-circle {
    background-color: #00a551;
}

.step-success .step-circle::before {
    color: #28a745
}

.step-circle i.fa {
    font-size: 20px;
    color: #fff;
}

/* STEP CLOSE */

.actn-btn-dw a.actn-btn-link {
    width: 30px;
    height: 30px;
    border: 1px solid #56a8fe;
    border-radius: 50%;
    position: relative;
    display: flex;
    align-items: center;
    padding: 0;
    justify-content: center;
    cursor: pointer;
}

.dots:hover {
    cursor: pointer;
}

.actn-btn-dw span {
    width: 0px;
    height: 0px;
    border-left: 7px solid transparent;
    border-right: 6px solid transparent;
    border-top: 10px solid #56a8fe;
    display: inline-block;
    left: 0.5px;
    position: relative;
    top: 6%;
}

.dropdown.actn-btn-dw {
    position: relative;
    right: 0px;
}

.dropdown.actn-btn-dw>a.dots {
    padding-right: 0px;
}

.dropdown.actn-btn-dw ul.dropdown-menu {
    /* transform: none !important;
    right: -1px !important;
    left: auto !important;
    top: 100% !important;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2) !important; */
}

.dropdown.actn-btn-dw ul.dropdown-menu a,
.dropdown.actn-btn-dw ul.dropdown-menu button {
    display: block;
    width: 100%;
    float: left;
    padding-left: 0;
    padding: 10px 15px;
    border: none;
    text-align: center;
    background: none;
    border-bottom: 1px solid #dadada;
    font-size: 14px !important;
    color: #56A8FE !important;
    cursor: pointer;
}

.dark-theme .dropdown.actn-btn-dw ul.dropdown-menu a,
.dark-theme .dropdown.actn-btn-dw ul.dropdown-menu button {
    border-bottom: 1px solid #333333;
}

.dark-theme .dropdown.actn-btn-dw ul.dropdown-menu a,
.dark-theme .dropdown.actn-btn-dw ul.dropdown-menu button {
    color: #ffffff !important;
}

.dark-theme .dropdown.actn-btn-dw ul.dropdown-menu a:hover,
.dark-theme .dropdown.actn-btn-dw ul.dropdown-menu button:hover {
    background: #353439;
    transition: all 0.5s ease;
}

.dropdown.actn-btn-dw ul.dropdown-menu a:hover,
.dropdown.actn-btn-dw ul.dropdown-menu button:hover {
    background: #f5f5f5;
    transition: all 0.5s ease;
    color: #3e4555 !important;
}

.dark-theme .dropdown.actn-btn-dw ul.dropdown-menu a:hover,
.dark-theme .dropdown.actn-btn-dw ul.dropdown-menu button:hover {
    color: #dadada !important;
}

.dropdown.actn-btn-dw ul.dropdown-menu a:last-child,
.dropdown.actn-btn-dw ul.dropdown-menu button:last-child {
    border-bottom: none;
    cursor: pointer;
}

.dropdown.actn-btn-dw ul.dropdown-menu {
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.45) !important;
}

/* Order Tags Dropdown Styles */
.order-tags-dropdown {
    display: inline-block;
}

.order-tags-menu {
    min-width: 200px;
    max-width: 300px;
    padding: 0;
    border: 1px solid rgba(0, 0, 0, 0.15) !important;
    border-radius: 0.25rem;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.45) !important;
    max-height: 223px;
    overflow: auto;
}

.order-tags-search-container {
    padding: 7px 10px;
    border-bottom: 1px solid #dadada;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
}

.order-tags-search-container .input-group {
    margin-bottom: 0;
}

.order-tags-search-container .form-control {
    font-size: 14px;
    padding: 6px 10px;
    height: auto;
    line-height: 20px;
}

.order-tags-search-container .input-group-text {
    background: #f5f5f5;
    border-left: none;
    padding: 6px 10px;
    display: none;
}

.order-tag-item {
    border-bottom: 1px solid #dadada;
}

.order-tag-item:last-child {
    border-bottom: none;
}

.order-tag-link {
    display: flex;
    align-items: center;
    padding: 7px 15px !important;
    text-align: left !important;
    position: relative;
    gap: 10px;
}

.order-tag-name {
    flex: 1;
    color: #22232F !important;
    font-size: 14px;
    min-width: 0;
}

.order-tag-color-indicator {
    width: 4px;
    height: 20px;
    border-radius: 2px;
    margin-right: 10px;
    flex-shrink: 0;
    order: 2;
}

.order-tag-link .orderTagRemove {
    flex-shrink: 0;
    cursor: pointer;
    padding: 0 5px;
    opacity: 0.7;
    transition: opacity 0.2s ease;
}

.order-tag-link:hover .orderTagRemove {
    opacity: 1;
}

.order-tag-link .orderTagRemove:hover {
    opacity: 1;
}

.order-tag-link .orderTagRemove i {
    font-size: 14px;
}

.dark-theme .order-tags-search-container {
    border-bottom: 1px solid #333333;
}

.dark-theme .order-tag-item {
    border-bottom: 1px solid #333333;
}

.dark-theme .order-tag-name {
    color: #ffffff !important;
}

/* Protected tag tooltip styles */
.order-tag-protected-tooltip {
    color: #dc3545 !important;
}

.order-tag-removable-tooltip {
    color: #00adec !important;
}

.dark-theme .order-tags-search-container .input-group-text {
    background: #353439;
    border-color: #333333;
    color: #ffffff;
}

.custom-table tbody td:last-child {
    text-align: right;
}

.action-align-left tbody td:last-child {
    text-align: left !important;
}

.custom-table .dataTables_empty {
    text-align: center !important;
}

/* ==== SUBHAM CSS:START==== */

.bingApproval-btn {
    width: 150px;
    font-size: 13px;
    height: 30px;
    background: #44ae1f !important;
    font-family: 'CircularStd-Bold';
    border-radius: 20px;
    border: none;
    color: #fff;
    cursor: pointer;
}

p.tagLine {
    font-size: 12px;
    margin-top: 10px;
}

/* ==== SUBHAM CSS:CLOSE ==== */
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: searchfield-cancel-button;
}

.check-radio-box {
    width: 110px;
    border: 1px solid #d5d5d5;
    padding: 8px 10px;
    border-radius: 4px;
    position: relative;
    display: flex;
    align-items: center;
}

.check-radio-box i.fa {
    font-size: 20px;
    margin-right: 6px;
}

.check-radio-box label {
    font-size: 14px;
    font-family: 'CircularStd-Medium';
}

.check-radio-box.on-hold-icn i.fa {
    color: #f6921e;
}

.check-radio-box.cancel-icn i.fa {
    color: #ec1c24;
}

.check-radio-box.fail-icn i.fa {
    color: #ec1c24;
}

.check-radio-box.cmplt-icn i.fa {
    color: #44ae1f;
}

.check-radio-box input[type="radio"] {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
}

.check-radio-box input[type="radio"]:checked+.check-selectbox {
    border: 1px solid #56A8FE;
    border-radius: 4px;
}

.check-selectbox {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.chgststus-model .cs-addnote p {
    font-size: 16px;
    margin-bottom: 10px;
}

.chgststus-model .cs-addnote textarea {
    width: 100%;
    height: 80px;
    max-height: 80px;
    border: 1px solid #e5e5e5;
    padding: 8px;
    font-size: 14px;
}

.chgststus-model .ecom-change-status-error-div {
    margin-bottom: 10px;
    margin-top: -5px;
}

.chgststus-model .modal-footer {
    border: none;
    padding-top: 0;
    justify-content: space-between;
}

.chgststus-model .modal-body {
    padding-bottom: 0;
}

.chgststus-model .modal-footer .btn {
    background: #44ae1f;
    width: 110px;
}

.chgststus-model .text-primary {
    color: #56A8FE !important;
}

.supplier-btnbox {
    padding-bottom: 20px;
    margin-top: 40px
}

.supplier-btnbox ul li span {
    padding: 10px;
    font-size: 14px
}

.supplier-btnbox ul li {
    padding: 20px;
}

.acceptBtn {
    background: #00aeef;
    font-size: 16px;
    padding: 0 8px;
    height: 40px;
    border-radius: 20px;
    color: #fff;
    position: relative;
    width: 250px;
}

.rejectBtn {
    background: red;
    font-size: 16px;
    padding: 0 8px;
    height: 40px;
    border-radius: 20px;
    color: #fff;
    position: relative;
    width: 250px;
}

.download-po-btn {
    background: red;
    font-size: 16px;
    padding: 0 8px;
    height: 40px;
    border-radius: 20px;
    color: #fff;
    position: relative;
    width: 250px;
}

body>div.datepicker.datepicker-dropdown.dropdown-menu.datepicker-orient-left.datepicker-orient-top>div.datepicker-days>table>thead>tr {
    height: 10px;
}

body>div.datepicker.datepicker-dropdown.dropdown-menu.datepicker-orient-left.datepicker-orient-bottom>div.datepicker-days>table>thead>tr {
    height: 10px;
}

/* NEW CSS ADDED */

.btn-with-icon i.fa {
    position: relative;
    left: 40px;
    top: 0;
    color: #61a4ff;
}

.btn-with-icon .btn-blue-outline {
    padding-left: 36px;
}

/* LARGE MODAL DESIGN */
.modal-xl {
    width: 95% !important;
    max-width: 95% !important;
}

div#canvas_container {
    text-align: center;
    max-height: calc(100vh - 160px);
    overflow: auto;
}

.view-controler .btn i.fa {
    font-size: 20px;
}

.view-controler .form-control {
    border-color: #00aeef;
    border-radius: .25rem !important;
    height: 35px;
    width: 70px;
}

/* ==== REVIEW ORDER PAGE ==== */

.apprvl-step-con {
    padding-top: 15px;
}

.apprvl-step-con .aprv-ur-artwork {
    padding-top: 0;
/*    border-top: none;*/
}

.apprvl-step-con .product-row.approval-row.con-row .product-name {
    flex: 0 0 26%;
}

.artwork-b {
    width: 50% !important;
    padding: 0 !important;
}

.full-one-row {
    flex: 0 0 100% !important;
    max-width: 100% !important;
}

.aprv-ftrinfo-box {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

.aprv-ftrinfo-box .fancy-radio input[type="radio"]+span {
    padding-right: 2px;
}

.green-bg a i.fa {
    color: #fff;
}

.fl-box .bootstrap-select>.dropdown-toggle {
    height: 40px !important;
}

.bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    line-height: 20px;
}

.aprv-ftrinfo-box .d-flex .fancy-radio:last-child span {
    margin-right: 0;
}

.card-block-section .chk-ttl-inline {
    padding-right: 5px;
}

.aprv-ftrinfo-box .ins-date-box {
    margin-right: 0;
    flex: 0 0 100%;
    max-width: 100%;
}

.ins-date-box .custom-select-box select {
    font-size: 13px;
}

.edt-splr-tbl .view-column i.far {
    position: absolute;
}

.table-responsive.order-quote-tab.action-btn2 {
    min-height: 270px;
}

/*EMAIL LOGS*/
.email-logs-mn-table tr td:last-child {
    text-align: left;
}

.no-enf-msg {
    padding: 0 13px !important;
    height: 44px !important;
    line-height: 45px !important;
    position: relative;
    top: -1px;
}

ul.navbar-nav.mr-auto>li>a span {
    position: relative;
    top: -2px;
}

.email-logs-mn-table tr th:first-child {
    min-width: 15% !important;
    max-width: 15% !important;
    width: 15% !important;
}

.email-logs-mn-table tr th:nth-child(2) {
    min-width: 25% !important;
    max-width: 25% !important;
    width: 25% !important;
}

.email-logs-mn-table tr th:nth-child(3) {
    min-width: 25% !important;
    max-width: 25% !important;
    width: 25% !important;
}

.email-logs-mn-table tr th:nth-child(4) {
    min-width: 20% !important;
    max-width: 20% !important;
    width: 20% !important;
}

.email-logs-mn-table tr th:last-child {
    min-width: 15% !important;
    max-width: 15% !important;
    width: 15% !important;
}

.row.product_bottom .custom-select-box.ad-pro-slctbox:before {
    display: none;
}

.gp-dwn-bn .form-control {
    border: none !important;
}

.cw-slct-splr-error .parsley-errors-list {
    position: absolute;
    top: 40px;
}

.custom-select-box .dropdown.bootstrap-select.form-control.supplier_select {
    border: none;
}

span.small-text-custom.email-statuses-common {
    font-size: 12px;
    padding: 3px 4px 3px 3px;
    border-radius: 2px
}

.email-sent {
    background: #e8eaec;
    color: #717c88
}

.email-delivered {
    background: #E6F2FF;
    color: #56A8FE
}

.email-opened {
    background: #E6F2FF;
    color: #56A8FE
}

.email-clicked {
    background: #dff8ec;
    color: #44ae1f
}

.email-not-delivered {
    background: #ffc5cc;
    color: #ec1c24
}

.partial-prod {
    background: #FFE6B9;
    color: #E8AD14
}

.carrier-err {
    color: #ec1c24;
    font-size: 12px
}

.tracking-err {
    color: #ec1c24;
    font-size: 12px
}

.copy-aprvl-link .add-new.purple-bg {
    border-radius: 4px;
}

.copy-aprvl-link {
    margin-right: 0;
    padding-right: 8px;
}

.send-remider-btn a {
    line-height: initial;
    position: relative;
    top: 2px;
}

.send-remider-btn a {
    top: 0px;
}

/*custom select for page length change*/
.dataTables_length select {
    border: 1px solid rgba(62, 69, 85, 0.1);
    border-radius: 4px;
    padding: 6px 10px;
    margin: 0 5px;
    font-family: 'CircularStd-Book', sans-serif;
    background: #ffffff;
}

.dataTables_length {
    font-family: 'CircularStd-Book', sans-serif;
}

.dataTables_length select:focus {
    outline: none;
}

.table-responsive {
    min-height: 260px !important;
}

.table-responsive.height_auto {
    min-height: auto !important;
}


.table-responsive.h-auto {
    min-height: initial !important;
}


.table-height-auto {
    min-height: initial !important;
}

.edit-icon-box {
    display: flex;
    position: relative;
    align-items: center;
}

.edit-icon-box .edit-icon {
    position: relative;
    display: flex;
}

.edit-icon-box .edit-icon img {
    top: 0 !important;
    transform: none !important;
    right: 0 !important;
}

.select2-container *:focus {
    outline-color: #56A8FE;
}

.no-cursor {
    cursor: default !important;
}

.company-blue {
    color: #5BA6FF;
}

/*remind-options*/
.send-rmnd-invc-box .remind-option-box .custom-label {
    margin: 0;
    font-family: CircularStd-Medium;
    color: #000;
    font-size: 15px;
    margin-top: 0;
    margin-bottom: 5px;
}

.ins-date-box {
    margin-right: 10px;
}

.ins-date-box .input-group.date .form-control {
    font-size: 13px;
}

.ins-date-box .ins-date-box .custom-select-box select {
    font-size: 14px;
    padding-right: 25px !important;
}

.create-order-page .aprval-ddln-box .form-group {
    margin-bottom: 0;
}

.create-order-page .aprval-ddln-box .form-group .form-control {
    height: 45px;
    width: 130px;
    line-height: 46px;
    border-radius: 4px 0 0 3px !important;
}

.mainmenu .navbar-nav li>a {
    display: inline !important;
}

.mainmenu .collapse ul ul li>a {
    display: block !important;
}

.btn-danger {
    padding: 8px 20px;
    border-radius: 4px;
    transition: all 0.15s ease;
    border: 0;
    height: 40px;
    line-height: 1.9;
}

.btn-danger:hover {
    opacity: 0.9;
    background-color: #FF7979;
    border-color: #FF7979;
}

.subscribe-box .panel-title {
    color: #fff;
    background-color: #22232f;
    border-color: #22232f;
    padding: 15px;
    font-size: 20px;
    text-align: center;
}

.dark-theme .subscribe-box .panel-title {
    background-color: #56A8FE;
}

.plans-list {
    display: flex;
}

.subscribe-box .panel {
    margin-bottom: 20px;
    background-color: #fff;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 1px 5px rgba(130, 130, 130, 0.2);
    border: 1px solid transparent;
}

.subscribe-box .panel:hover {
    border: 1px solid #56A8FE;
    border-radius: 4px;
}

.subscribe-box .panel-body {
    padding: 0px;
    text-align: center;
}

.subscribe-box .panel-body table {
    margin-bottom: 0;
}

.the-price {
    background-color: rgba(220, 220, 220, .17);
    border-bottom: solid 1px #e7e8e9;
    padding: 20px;
    margin: 0;
}

body.dark-theme .the-price {
    border-bottom: solid 1px #555555;
}

.dark-theme .the-price {
    background: none;
}

.the-price h1 {
    line-height: 1em;
    padding: 0;
    margin: 0;
    font-size: 36px;
}

.subscript {
    font-size: 25px;
}

.subscribe-box small {
    white-space: normal;
    word-break: break-word
}

.subscription-feature-list {
    line-height: 1.8;
    white-space: normal;
    word-break: break-word
}

.subscription-feature-list .subscribe-link {
    border-radius: 30px;
    background: #272732;
    color: white;
    padding: 10px 30px;
    margin-top: 15px;
    text-decoration: none
}

.subscription-feature-list .disabled-subscribe {
    border-radius: 30px;
    background: #e8eaec;
    color: grey;
    padding: 10px 30px;
    margin-top: 15px;
    text-decoration: none;
    cursor: default
}

.dark-theme .subscription-feature-list .subscribe-link {
    border-radius: 30px;
    background: #56A8FE;
    color: white;
    padding: 10px 30px;
    margin-top: 15px;
    text-decoration: none
}

/* CSS-only ribbon styles    */
.cnrflash {
    position: absolute;
    top: -9px;
    right: 4px;
    z-index: 1;
    overflow: hidden;
    width: 100px;
    height: 100px;
    border-radius: 4px 5px 3px 0;
}

.cnrflash-inner {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 145px;
    height: 145px;
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    -o-transform-origin: 100% 100%;
    -moz-transform-origin: 100% 100%;
    background-image: linear-gradient(90deg, transparent 50%, rgba(255, 255, 255, .1) 50%), linear-gradient(0deg, transparent 0%, rgba(1, 1, 1, .2) 50%);
    background-size: 4px, auto, auto, auto;
    background-color: #aa0101;
    box-shadow: 0 3px 3px 0 rgba(1, 1, 1, .5), 0 1px 0 0 rgba(1, 1, 1, .5), inset 0 -1px 8px 0 rgba(255, 255, 255, .3), inset 0 -1px 0 0 rgba(255, 255, 255, .2);
}

.cnrflash-inner:before,
.cnrflash-inner:after {
    content: " ";
    display: block;
    position: absolute;
    bottom: -16px;
    width: 0;
    height: 0;
    border: 8px solid #800000;
}

.cnrflash-inner:before {
    left: 1px;
    border-bottom-color: transparent;
    border-right-color: transparent;
}

.cnrflash-inner:after {
    right: 0;
    border-bottom-color: transparent;
    border-left-color: transparent;
}

.cnrflash-label {
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    padding-bottom: 5px;
    color: #fff;
    text-shadow: 0 1px 1px rgba(1, 1, 1, .8);
    font-size: 0.95em;
    font-family: 'CircularStd-Bold';
    text-align: center;
}

.login .form-group label {
    color: #fff;
    margin-bottom: 5px;
    font-size: 13px;
}

.navbar-brand .navbar-brand {
    font-size: 18px;
}

.sml-ttl {
    color: #fff;
    font-size: 12px;
}

.introjs-showElement {
    visibility: visible;
}

.introjs-bullets {
    text-align: center;
    display: none;
}

.intojs-helper-class {
    opacity: 0.5;
    border-radius: 0.5em;
    cursor: default !important;
    pointer-events: none !important;
}

.introjs-prevbutton {
    display: none !important
}

.introjs-showElement {
    pointer-events: none !important;
}

.introjs-nextbutton {
    background: #5BA6FF !important;
    color: #E6F2FF !important;
    font-family: CircularStd-Book;
    font-size: 12px;
    letter-spacing: 0;
}

.introjs-skipbutton {
    background: none !important;
    color: #ff6347 !important;
    font-family: CircularStd-Book;
    font-size: 12px;
    letter-spacing: 0;
}

#welcome-tutorial .modal-body {
    line-height: 2
}

#img_container {
    position: relative;
    display: inline-block;
    text-align: center;
}

#img_container img {
    opacity: 0.3;
    margin-top: 5px
}

#start-tutorial {
    position: absolute;
    bottom: 150px;
    right: 180px;
    width: 100px;
    height: 30px;
}

.no-records {
    font-size: 25px;
    color: #6c757d;
    margin-top: 10px;
    margin-bottom: 10px
}

.subscribe-box:nth-child(3n +1) {
    clear: both;
}

.video-wrapper iframe {
    width: 100% !important;
    height: 600px;
    padding: 0px;
}

.help-icon {
    font-size: 20px;
    color: grey;
    margin-right: 70px;
}

.save-draft-btn {
    position: relative;
}

.save-draft-btn i.fa {
    position: absolute;
    pointer-events: none;
    right: 0;
    z-index: 0;
    left: 5px;
    top: 14px;
}

.input-icn-btn input.btn-blue {
    height: auto;
    padding: 6px 20px;
}

.dark-theme .introjs-tooltiptext {
    color: #212529
}

/*INVOICE TABLE*/
.invoice-table table tbody tr {
    background: none !important;
    border: none !important;
}

.invoice-table table tbody tr td,
.invoice-table table tbody tr th {
    font-size: 14px;
}

.invoice-table table tbody tr:nth-child(even)>td {
    background: #eceef3;
}

.invoice-table table tbody tr:nth-child(2)>td {
    margin-top: 10px
}

.invoice-table table tbody tr th {
    border-bottom: 1px solid #888;
    border-top: none !important;
}

.dark-theme .invoice-table table tbody tr td {
    background: #353439;
}

.info-card p {
    margin-bottom: 10px
}

.info-card a {
    margin-top: 20px;
    display: inline-block;
}

.change-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.change-card-images {
    display: flex;
}

.change-card-images img {
    width: 30px;
}

.change-card-section a {
    margin-top: 20px;
    display: inline-block;
}

.subscription-usage .percentage {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.current-plan-title p {
    font-size: 16px;
}

.progress {
    border-radius: 0;
    margin-top: 5px;
    margin-bottom: 5px;
    background: #272732;
    height: 0.5rem
}

.dark-theme .progress {
    border-radius: 0;
    margin-top: 5px;
    margin-bottom: 5px;
    background: #e5e6e8;
    height: 0.5rem
}

.usage-buttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.usage-buttons a {
    padding: 7px 12px;
    text-decoration: none;
    border-radius: 20px;
    background: #272732;
    color: #fff;
}

.dark-theme .usage-buttons a {
    padding: 7px 12px;
    text-decoration: none;
    border-radius: 20px;
    background: #56A8FE;
    color: #fff;
}

.cancel-sub-button {
    background: none;
    border: none;
    cursor: pointer
}

.dark-theme .cancel-sub-button {
    color: #56A8FE;
    border: none;
    cursor: pointer
}

.cancel-sub-button:focus {
    outline: none;
    box-shadow: none;
    border: none;
}

body.dark-theme .alert-warning {
    color: #ffeeba;
    background-color: #353439;
    border-color: #3a3a3a;
}

.order-notice {
    display: block;
    font-size: 14px;
    background-color: #ffc5cc;
    color: #ec1c24;
    padding: 10px;
    margin-bottom: 20px;
}

.ecom-picking-shipping-notice{
    color: #ec1c24;
    line-height: 1.3;
    font-size: 13px;
    border: 2px solid #ec1c24;
    padding: 10px;
    border-radius: 10px;
}

.product_detail_page {
    border-bottom: 0px;
    padding-bottom: 0px;
    margin-bottom: 30px;
}

.product-row {
    border-bottom: 0px solid #eeeff0;
}

.dark-theme .product_detail_page {
    border-bottom: 0px;
    padding-bottom: 0px;
}

.dark-theme .product-row {
    border-bottom: 0px solid #343434;
}

.text-red {
    color: #ee1c25
}

/*SUMMARY SIDEBAR*/
.summary-sidebar {
    width: 360px;
    height: 100%;
    border-left: 1px solid #f7f5f6;
    background: #fff;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1111;
    box-shadow: 0 5px 12px 0 rgb(0 0 0 / 10%);
    right: 0;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    visibility: visible;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
}

.summary-sidebar .total-sales-right * {
    color: #ffffff;
}

body.sidebar-open {
    overflow: hidden;
}

body.sidebar-open:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9;
}

body.sidebar-open .summary-sidebar {
    visibility: visible;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    right: 0;
}

.sidebar-header {
    padding: 15px 15px;
    background: #252b3b;
    color: #fff;
}

.sidebar-header h2 {
    font-size: 18px;
}

.sidebar-body {
    padding: 15px;
    max-height: calc(100vh - 50px);
    overflow-x: hidden;
}

.sidebar-footer {
    padding: 15px;
}

.total-sales-card {
    background: #3a2172;
    border-radius: 4px;
}

.total-sales-box {
    padding: 12px;
    position: relative;
}

.chart-box {
    display: flex;
}

.chart-box img {
    width: 100%;
}

a.sidebar-link {
    font-size: 12px;
    color: #a785f3;
    position: absolute;
    right: 15px;
}

.total-sales-box h5 {
    color: #fff;
    font-size: 12px;
    margin-bottom: 10px;
}

.total-sales-box h2 {
    font-size: 24px;
    color: #fff;
}

.total-sales-box p {
    color: #d7c0ff;
    font-size: 11px;
    margin-top: 8px;
}

.order-box .total-sales-box>p {
    color: #555;
    font-size: 13px;
}

.total-sales-left>h6 {
    color: #fff;
    font-size: 12px;
    margin-bottom: 10px;
}

.total-sales-box.this-week-box {
    display: flex;
    justify-content: space-between;
}

.total-sales-right .up {
    color: #4bc1b5;
    text-align: right;
    margin-top: 5px;
}

.total-sales-right .down {
    color: #ec1c24;
    text-align: right;
    margin-top: 5px;
}

.total-sales-right h6 i.fa {
    margin-right: 3px;
    font-size: 14px;
    position: relative;
    top: -1px;
}

.order-box {
    border: 1px solid #dedede;
    border-radius: 4px;
    margin-top: 20px;
}

.order-box .total-sales-right p {
    margin-top: 5px;
    color: #84878e;
}

.order-box .total-sales-box h5 {
    color: #364155;
}

.order-box .total-sales-left h6 {
    color: #3d434f;
}

.order-box .total-sales-left h2 {
    font-size: 24px;
    color: #424854;
}

.order-box .total-sales-box {
    padding: 12px;
    display: flex;
    justify-content: space-between;
}

.total-sales-right {
    margin-top: 10px;
}

.close-btn {
    position: absolute;
    right: 10px;
    top: 8px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0.6;
}

.close-btn:hover {
    background: rgba(0, 0, 0, 0.7);
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    opacity: 1;
}

/*========================= CREATE ORDER NEW DESIGN UI =========================*/
.create-order-page .form-control {
    border-radius: 0 !important;
}

.create-order-page .edt-ordr-hdrbox {
    margin-bottom: 0 !important;
    background: #22232F;
    padding: 20px 30px;
    justify-content: space-between;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
}

.create-order-page .edt-ordr-hdrbox h5 {
    background: transparent !important;
}

.create-order-page .tab-hdr-ttl h5 {
    border-bottom: 0;
    color: #ffffff !important;
    margin: 0;
    padding: 0;
    min-width: auto;
    font-size: 20px;
    line-height: 26px;
}

.edt-ordr-hdrbox .btn-outline-dark {
    border-color: #ffffff;
    color: #ffffff;
}

.create-order-page .edorder-mn-swhbox {
    display: flex;
    align-items: center;
    color: #fff;
}

.text-label {
    color: #22232F;
}


.create-order-page .panel-body {
    padding: 20px 30px;
}

.create-order-page .order-create-form .title-container.product-select.d-flex {
    margin: 20px 0 10px 0;
    border: none;
}

.create-order-page .title-container .title {
    font-size: 20px;
    color: #12203E;
    letter-spacing: 0;
    padding: 0;
}

.title-container .title {
    font-size: 20px;
    color: #12203E;
    letter-spacing: 0;
    padding: 0;
}

.orders-page-title {
    font-size: 36px !important;
}

.create-order-page .product-list-table {
    padding: 0;
    margin-top: 0;
}

.create-order-page .main-total-section {
    width: 460px;
}

.create-order-page .total-section {
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.create-order-page .attech-ref-section {
    display: flex;
}

.create-order-page .artwork-total {
    width: 50%;
}

.create-order-page .send-rmnd-invc-box {
    width: 50%;
    padding-left: 20px;
    margin-top: 45px;
}

.create-order-page .dropzone-section .dropzone {
    background: #f7f8fb;
    min-height: 360px;
}

.create-order-page .dropzone-section .upload-txt {
    font-size: 16px;
    font-family: 'CircularStd-Book';
    color: #989898;
}

.create-order-page .dropzone-section .dropzone.dz-clickable {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 355px;
    border: 1px dashed #cacaca;
    background: #f7f8fb;
    margin-bottom: 30px;
    transition: all 0.5s ease;
    overflow: auto;
}

.create-order-page .dropzone-section .dropzone.dz-clickable:hover {
    border: 1px dashed #56A8FE !important;
    background: rgba(86, 168, 254, 0.05);
}

.create-order-page .dropzone-section .dropzone .dz-default.dz-message {
    position: absolute;
    top: auto;
    left: 50%;
    margin: 0;
    width: auto;
    height: auto;
    transform: translate(-50%);
}

.create-order-page .dropzone-section .dropzone .dz-default.dz-message span {
    font-weight: 600;
}

.create-order-page .total-section .heading {
    text-align: left;
    font-family: 'CircularStd-Book' !important;
}

.create-order-page .total-section p {
    width: 50%;
    float: left;
    padding: 14px 5px;
    border-bottom: 1px solid #eee;
    margin: 0;
}

.create-order-page .setup_price_block p.desc {
    border-bottom: 0px;
}

.create-order-page .total-section .heading.grand-total-row {
    color: #231f20;
    font-size: 16px;
    font-family: 'CircularStd-Bold' !important;
}

/*Customer Reminders*/

.create-order-page .remind-option-box .form-group {
    width: calc(50% - 7px)
}

.create-order-page .ins-date-box .custom-select-box {
    width: 100%;
}

.create-order-page .remind-option-box .input-group.date input {
    width: 100px;
    font-size: 14px;
}

.create-order-page .form-group .form-control {
    height: 40px !important;
    font-size: 14px !important;
}

.create-order-page .input-group.date .blue-btn {
    width: 40px;
    line-height: 40px;
}

.create-order-page .aprval-ddln-box .span {
    font-size: 14px;
    margin-bottom: 5px !important;
    display: inline-block;
    margin-top: 0px !important;
}

.create-order-page .brand-star {
    margin-top: 20px;
}

.create-order-page .custom-select-box .dropdown-toggle {
    height: 40px;
}

.create-order-page .custom-ecom-dropdown .dropdown-toggle{
    height: 48px !important;
    background: #ffffff;
    border: 1px solid #dcdcdc;
    border-radius: 5px !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 14px 16px;
    font-family: 'CircularStd-Book';
}

.custom-select-box.custom-ecom-dropdown .dropdown-menu .inner.show {
    max-height: 175px !important;
}

.create-order-page .inter-his-box {
    display: flex;
    justify-content: space-between;
    margin-bottom: 25px;
    border-top: 1px solid #eaeaea;
    margin-top: 0 !important;
    padding-top: 30px;
}

.create-order-page .inter-his-box .ord-int-box .tab-hdr-ttl h5 {
    margin-right: 8px;
    color: #000000 !important;
    font-size: 16px;
    font-weight: 600;
}

.create-order-page .tab-hdr-ttl p {
    color: #989898;
}

.create-order-page .tab-hdr-ttl p:before {
    content: "-";
    margin-right: 7px;
}

.create-order-page .intrnl-notes:focus,
.create-order-page .co-eml-multy input:focus {
    outline: none !important;
}

.create-order-page .co-eml-multy input:focus,
.create-order-page .intrnl-notes:focus {
    border: 2px solid #56A8FE !important;
}

.create-order-page .custom-select-box select.form-control:focus {
    border: 2px solid #56A8FE !important;
}

.create-order-page .co-eml-multy input::placeholder,
.create-order-page textarea.intrnl-notes::placeholder {
    color: #989898;
    opacity: 1;
}

.create-order-page .co-eml-multy input::placeholder,
.create-order-page textarea.intrnl-notes:-ms-input-placeholder {
    color: #989898;
}

.create-order-page .co-eml-multy input::placeholder,
.create-order-page textarea.intrnl-notes::-ms-input-placeholder {
    color: #989898;
}

.create-order-page .mn-co-ntf-persnal {
    width: 50%;
    padding-left: 20px;
}

.create-order-page .co-ntf-persnal h3 {
    margin-right: 15px;
    color: #000000 !important;
    font-size: 16px;
    font-weight: 600;
}

.create-order-page .input-icn-btn {
    margin-right: 0;
    padding-right: 0;
    padding-top: 4px;
    margin-left: 10px;
}

.create-order-page .custom-select-box .select2-container--default .select2-selection--single span {
    height: 40px !important;
    line-height: 40px !important;
}

.create-order-page .quote-email-area .title-container {
    display: inline-table;
    width: 100%;
}

.create-order-page.quote-email-area .com-info-txt {
    margin: 0;
}

.create-order-page .card-block-section .title-container {
    display: inline-table;
    width: 100%;
}

.create-order-page .card-block-section .com-info-txt {
    margin: 0;
}

.create-order-page .card-block-section.m-t-10 .title-container p {
    margin-left: 0;
    margin-bottom: 10px;
}

.create-order-page .custom-select-box.splr-wh-clr i.fa {
    top: 12px;
}

.create-order-page .dropzone .dz-preview .dz-details img,
.create-order-page .dropzone-previews .dz-preview .dz-details img {
    position: absolute;
    top: 0px;
    left: 50%;
    width: 60px;
    height: auto;
    transform: translate(-50%);
    max-height: 100%;
}

.dropzone .dz-preview.dz-image-preview:hover {
    opacity: 0.8;
}

.create-order-page-new-ui .bootstrap-select .dropdown-menu li small {
    padding-left: 0;
    padding-top: 5px;
}

/*PROFILE NAVIGATION*/
.profile-nav {
    position: absolute;
    width: 150px;
    right: 0;
    left: auto;
    top: 100%;
}

.profile-nav ul {
    display: flex;
    flex-wrap: wrap;
}

.profile-nav ul li {
    margin-right: 0;
    width: 100%;
    display: flex;
}

.profile-nav ul li a {
    font-size: 12px;
    color: #fff;
    margin-right: 0;
    padding: 10px 10px;
    width: 100%;
}

.profile-menu.avtar-name {
    padding: 10px 0;
}

/*.profile-menu:hover .profile-nav.dropdown-menu { display: block !important; }*/

/*product-list-table-new-ui*/

.create-order-page-new-ui .order-create-form .product-row>div {
    padding: 0;
}

.sameforall-tracking-div .tracking-sameforall {
    font-size: 13px;
    white-space: nowrap;
}

.order-create-form .product-row .heading {
    background: #eff2f7;
    padding: 10px;
    border-bottom: 1px solid #cacaca;
}

.order-create-form .product-row.cus-row {
    background: #fff;
    padding: 0;
    border: 1px solid #cacaca;
    position: relative;
}

.create-order-page-new-ui .order-create-form .product-row .heading {
    font-size: 16px;
    font-weight: 600;

}

.create-order-page-new-ui .order-create-form .product-row .heading a {
    max-width: 190px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.create-order-page-new-ui .product-data {
    padding: 10px;
    white-space: initial;
}

.create-order-page-new-ui .product-data.sp-div {
    margin-bottom: 0px;
}

.create-order-page-new-ui .product-drag {
    position: absolute;
    top: 0;
    padding: 5px !important;
}

.create-order-page-new-ui .product_detail_page {
    border: none;
    padding-right: 0;
}

/*TABLE COLUMN DATA*/
.create-order-page-new-ui .product-row .product-img {
    flex: none !important;
    text-align: center;
    flex: 0 0 7% !important;
}

.create-order-page-new-ui .product-row .product-img .heading {
    text-align: right;
}

.create-order-page-new-ui .product-row .product-name {
    flex: 0 0 16% !important;
}

.create-order-page-new-ui .product-row .product-qa {
    flex: 0 0 8% !important;
    overflow: hidden;
}

.create-order-page-new-ui .product-row .product-qa .fancy-checkbox {
    font-size: 12px !important;
}

.create-order-page-new-ui .product-row .product-qa .fancy-checkbox input[type="checkbox"]+span i {
    width: 16px;
    height: 16px;
}

.create-order-page-new-ui .product-row .product-qa .fancy-checkbox input[type="checkbox"]:checked+span i:after {
    width: 4px;
    height: 8px;
    top: 2px;
    left: 4px;
}

.create-order-page-new-ui .product-row .product-price-each {
    flex: 0 0 8% !important;
}

.create-order-page-new-ui .product-row .product-discount-div {
    flex: 0 0 8% !important;
}

.create-order-page-new-ui .product-row .product-supplier {
    flex: 0 0 23% !important;
    max-width: 23% !important;
}

.create-order-page-new-ui .product-row .product-subtotal {
    flex: 0 0 11% !important;
}

.create-order-page-new-ui .product-row .add-more {
    flex: 0 0 7% !important;
    text-align: center;
    min-width: 100px;
}

.create-order-page-new-ui .product-row.product-discount-added .product-supplier {
    flex: 0 0 13% !important;
    max-width: 13% !important;
}

.create-order-page-new-ui .product-row.product-discount-added .product-subtotal {
    flex: 0 0 10% !important;
}

.create-order-page-new-ui .product-row.product-discount-added .add-more {
    flex: 0 0 6% !important;
}

.create-order-page-new-ui .product-list-table .product-row .product-subtotal .size-sm {
    border: none;
    padding: 7px 0 !important;
    word-break: break-all;
    white-space: pre-wrap;
}

.create-order-page-new-ui .product-row textarea.form-control {
    line-height: 18px !important;
}

.create-order-page-new-ui .dlr-box {
    position: relative;
}

.create-order-page-new-ui .dlrsign-box:after {
    top: 22px;
    left: 19px;
}

.create-order-page-new-ui .product-list-table .product-row .dlr-box .form-control {
    padding-left: 20px !important;
}

.create-order-page-new-ui .product-list-table .product-row .form-control {
    padding: 7px 8px !important;
    line-height: 24px !important;
}

.create-order-page-new-ui .product-row .form-control.dropdown.bootstrap-select {
    padding: 0 !important;
}

.create-order-page-new-ui .product-row .add-more .product-data {
    line-height: 40px !important;
    display: flex;
    justify-content: center;
    padding-right: 10px;
    padding-left: 5px;
    gap: 20px;
}

/*CONFIGURE SETTING SHOW HIDE*/

.configure-setting-box {
    margin-top: -1px;
    border: 1px solid #cacaca;
    display: flex;
    align-items: flex-start;
}

.cs-left-section {
    display: flex;
    flex: 1;
    padding: 20px 10px;
    flex-wrap: wrap;
}

.cs-left-section .filtrbox {
    width: 33% !important;
    padding: 0 10px !important;
}

.configure-setting-box .form-group .form-control {
    height: auto !important;
}

.create-order-page .configure-setting-box .main-total-section {
    width: 460px;
}

/*ORDER PAGE : NEW UI*/

.py-4 .title-container .title {
    padding: 0px 0px;
}

.date-box-tooltip {
    border: 1px solid transparent;
    padding: 8px 4px;
    line-height: 18px;
    display: inline-block !important;
}

.global-search-list .date-box-tooltip {
    border: 0px !important;
    padding: 0px 1px;
}

.customer-list .date-box-tooltip {
    border: 0px !important;
    padding: 0px 1px;
}

.order-actv-order-tab .date-box-tooltip {
    border: 0px !important;
    padding: 0px 1px;
}

.order-quote-tab .date-box-tooltip {
    border: 0px !important;
    padding: 0px 1px;
}

.order-cancelled-order-tab .date-box-tooltip {
    border: 0px !important;
    padding: 0px 1px;
}

.completd-orders-tab .date-box-tooltip {
    border: 0px !important;
    padding: 0px 1px;
}

.rush-icon {
    color: red !important;
}

.inventory-text {
    color: #ff0000
}

.date-box-tooltip.cutomer-box-tooltip {
    display: flex;
    border: 1px solid transparent;
    padding: 3px 4px;
    line-height: 14px;
    flex-wrap: wrap;
}

.date-box-tooltip:hover {
    border-color: #44ae1f !important;
}

.popover-body .js-copy-customer-value {
    vertical-align: middle;
    font-size: 12px;
}

/*top filter tools*/

.py-4 .tab-filter-grps {
    top: 121px;
    z-index: 2;
    right: 40px;
}

.py-4 .tab-filter-grps .btn-blue {
    display: flex;
    align-items: center;
    border-radius: 4px !important;
}

.help-icon {
    margin-right: 0;
}

.create-new-order {
    margin-right: 5px;
}

.bulk-actn-grpsbox .dropdown {
    margin-right: 5px;
    vertical-align: middle;
}

.create-new-order a {
    padding-left: 20px !important;
}

.create-new-order .dropdown-toggle::after {
    position: relative;
    color: #ffffff;
    top: auto;
    border-top: 0.65em solid;
    border-right: 0.4em solid transparent;
    border-left: 0.4em solid transparent;
    right: 0;
}

.create-new-order .dropdown-menu a.dropdown-item {
    text-align: left;
    border: none;
    background: #fff;
    padding: 5px;
    color: #56A8FE;
    padding: 10px 15px;
    text-decoration: none;
    display: block;
    font-size: 14px;
    margin: 0;
    width: 100%;
    cursor: pointer;
    border-bottom: 1px solid #d7d7d7;
    min-height: auto !important;
}

.create-new-order .dropdown-menu {
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.45) !important;

    min-width: 128px !important;

}

.create-order-page .button-container.button-icns-grups {
    display: flex;
    border-top: 1px solid #eaeaea;
    padding-top: 20px;
    justify-content: flex-end;
    margin-bottom: 0;
}

.create-order-page .tab-filter-grps .btn-blue {
    padding: 6px 12px !important;
}

.order-tab-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.order-search-box {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

p.order-details-name {
    margin-bottom: 10px;
    font-size: 17px;
}

.custom-tab.nav-tabs {
    margin: 0
}

.osbf-fltr-box {
    margin-top: 0;
    display: flex;
    align-items: center;
    width: auto;
    justify-content: center;
    cursor: pointer;
}

/*.osbf-fltr-box i.fa {
    color: #56A8FE;
}*/

.opt-product{
    margin: 0 25px 18px 10px;
}

.create-order-page .sales-sammary-btn {
    padding: 10px 10px !important;
}

.create-order-page .parsley-errors-list li.parsley-required,
.create-order-page-new-ui .dlr-box .parsley-discount {
    white-space: pre-wrap;
    line-height: 14px;
}

/*EDIT APPROVAL ORDER PAGE*/
.edit-approval-page .mn-co-ntf-persnal {
    padding-left: 0 !important;
}

.edit-approval-page .button-icns-grups .input-icn-btn {
    padding-top: 0;
}

.edit-approval-page .button-icns-grups .input-icn-btn.blue-bg,
.edit-approval-page .button-icns-grups .input-icn-btn.green-bg {
    padding-top: 0;
    padding: 2px 20px;
    padding-right: 20px;
}

.edit-approval-page .button-icns-grups .input-icn-btn.blue-bg,
.edit-approval-page .button-icns-grups .input-icn-btn.white-bg {
    padding-top: 0;
    padding: 2px 20px;
    padding-right: 20px;
    position: relative
}

.edit-approval-page .button-icns-grups .input-icn-btn .btn.btn-blue,
.edit-approval-page .button-icns-grups .input-icn-btn .btn.btn-green {
    height: 100%;
    padding: 6px 0px !important;
}

.edit-approval-page .artwork-total {
    width: 100%;
}

.edit-approval-page.create-order-page .button-container.button-icns-grups {
    padding-bottom: 20px;
}

.edit-approval-page .dropzone.dz-clickable {
    overflow: auto;
}

/*EDIT ORDER PAGE*/
.edit-main-page.create-order-page .button-container.button-icns-grups {
    border-top: none;
    padding-top: 0;
    padding-bottom: 20px;
}

.edit-main-page.create-order-page .mn-co-ntf-persnal {
    padding-left: 0;
}

.edit-main-page .ordr-actndw {
    position: relative;
    top: 0;
    right: 0;
}

.edit-main-page .edt-ordr-hdrbox .ordr-hdr-rltv {
    position: relative;
    right: 0;
}

.edit-main-page.create-order-page .edt-ordr-hdrbox {
    padding: 10px 30px;
}

/*VIEW ORDER PAGE*/
.view-order-page .edt-ordr-hdrbox .nav-tabs {
    top: 0 !important;
    justify-content: space-between;
    display: flex;
    align-items: center;
    width: calc(100% - 140px);
}

.view-order-page .edt-ordr-hdrbox .nav-tabs li.nav-item a.nav-link {
    padding: 0;
    color: #fff !important;
    font-size: 22px;
}

.view-order-page .edt-ordr-hdrbox .nav-item .nav-link.active:before {
    display: none !important;
}

.view-order-page .nav-item.download-pdf-box .nav-link {
    font-size: 14px !important;
    opacity: 1;
    border: 1px solid #fff;
    padding: 10px 15px !important;
    border-radius: 4px;
}

.view-order-page .nav-item.download-pdf-box {
    background: none;
}

.view-order-page .download-pdf-box .btn-blue-outline {
    background: none;
}

.view-order-page .edt-ordr-hdrbox {
    padding: 12px 30px;
    flex-wrap: nowrap;
}

.view-order-page .download-pdf-box a.btn {
    padding-left: 40px;
    position: relative;
}

.view-order-page .download-pdf-box i.fa {
    font-size: 18px;
    position: absolute;
    left: 15px;
    top: 48%;
    transform: translateY(-50%);
}

.view-order-page .product-data .sub-total {
    word-break: break-all;
    max-width: 140px;
    white-space: pre-wrap;
}

.view-order-page .title-container .view-order-title {
    padding: 0;
}

.view-order-page .user-detail {
    margin-top: 0;
    color: #231f20;
    text-align: right;
}

.view-order-page .customer-file {
    margin-top: 15px;
    color: #231f20;
    text-align: right;
}

.view-order-page .order-create-form .product-row.cus-row {
    border: none;
    border-bottom: 2px solid #e3e4e8;
}

.view-order-page .order-create-form .product-row .heading {
    background: #f7f8fc;
    text-align: left;
    text-transform: uppercase;
    color: #000;
    font-weight: 300 !important;
    font-size: 14px !important;
    border-bottom: 2px solid #e3e4e8;
}

.view-order-page .product-row .desc {
    font-size: 15px;
}

.view-order-page .product-row .desc.tracking-box {
    margin-bottom: 0px;
}

.view-order-page .product-list-table .product-row:not(:first-child) .heading {
    display: none;
}

.view-order-page.create-order-page .total-section {
    padding: 0;
}

.view-order-page .ordr-actndw {
    position: relative;
    top: 0;
    right: 0;
    height: 40px;
    display: inline;
}

.view-order-page .edt-ordr-hdrbox .ordr-hdr-rltv {
    position: relative;
    right: 0;
    display: inline;
}

.view-order-page .view-ref-section {
    background: #f7f8fc;
    margin-top: 30px;
}

.view-ref-section {
    background: #f7f8fc;
    margin-top: 30px;
    padding: 20px;
}

.view-order-page .artwork-outer {
    overflow-x: auto;
    overflow-y: hidden;
    text-align: center;
    display: flex;
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
}

.view-order-page .flex-container {
    align-items: center;
    height: 110px;
    flex-direction: column;
}

.view-order-page .view-save-group {
    position: absolute;
    top: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    width: 91px;
    left: 50%;
    transform: translate(-50%);
    background: rgba(0, 0, 0, 0.5);
    height: 90px;
    border-radius: 14px;
    display: none;
}

.view-order-page .artwork-b:hover .view-save-group {
    display: flex;
}

.view-ref-section .artwork-b .art-work-infor {
    padding-left: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.view-ref-section .artwork-b .art-work-infor .a-name {
    font-size: 13px;
    margin-top: 5px;
}

.view-ref-section .artwork-outer .artwork-b {
    position: relative;
    width: auto !important;
    margin-bottom: 0;
    margin: 0 10px;
}

.view-ref-section .artwork-b .art-work-infor .c-dwnlod,
.view-ref-section .artwork-b .art-work-infor a.btn {
    background: none;
    border-radius: 20px;
    min-width: auto;
    height: auto;
    margin: 0;
    width: 30px;
    height: 30px;
    padding: 0;
    display: flex;
    justify-content: center;
    margin: 0 5px;
}

.view-ref-section .artwork-b .art-work-infor a i.fa {
    top: 0;
    margin-right: 0;
}

.dispatch-form .form-group>b {
    font-family: 'CircularStd-Bold';
    font-size: 20px;
    font-family: CircularStd-Bold;
}

.view-order-page .dispatch-form .form-group .custom-label {
    font-weight: 300;
    margin-bottom: 0px;
}

.dispatch-form .form-group p {
    color: #959597;
    margin-top: 4px;
}

.view-ref-details-form .title-container .title {
    padding-top: 0;
}

.view-order-page.create-order-page-new-ui .product-row .product-name {
    flex: 0 0 19% !important;
}

.view-order-page.create-order-page-new-ui .product-row .product-supplier {
    flex: 0 0 18% !important;
    max-width: 16% !important;
}

.view-order-page.create-order-page-new-ui .product-row .product-qa {
    flex: 0 0 10% !important;
}

.view-order-page.create-order-page-new-ui .product-row .product-price-each {
    flex: 0 0 10% !important;
}

.vo-ref-details p {
    text-transform: uppercase;
    font-size: 14px;
    margin-bottom: 5px;
}

.vo-ref-details h3 {
    text-transform: uppercase;
    font-size: 20px;
}

/*HISTORY TIMELINE*/
.progress-step {
    position: relative;
    display: flex;
}

.progress-step .progress-track {
    position: absolute;
    top: 5px;
    width: 100%;
    height: 5px;
    z-index: -1;
}

.progress-step .progress-step {
    position: relative;
    width: 100%;
    text-align: center;
    min-width: 150px;
    justify-content: center;
}

.progress-step .progress-step:last-child:after {
    display: none;
}

.progress-step .progress-step:before {
    content: "";
    display: flex;
    margin: 0 auto;
    margin-bottom: 10px;
    width: 24px;
    height: 24px;
    background: #e5e5e5;
    border-radius: 100%;
    color: transparent;
    position: absolute;
    left: calc(50% - 14px);
}

.progress-step .progress-step:after {
    content: "";
    position: absolute;
    top: 9px;
    left: 75px;
    width: 100px;
    transition: width 1s ease-in;
    height: 5px;
    background: #dfe3e4;
    z-index: 0;
    width: 100%;
}

.progress-step .progress-step.is-complete:before {
    font-family: FontAwesome;
    font-size: 15px;
    color: #fff;
    background: #66a8f5;
    border: 4px solid transparent;
    left: calc(50% - 14px);
    position: absolute;
    z-index: 2;
}

.progress-step .progress-step.is-complete:after {
    background: #2183dd;
    animation: nextStep 1s;
    animation-fill-mode: forwards;
}

.search-result {
    position: absolute;
    left: 15px;
    z-index: 2;
    border: 1px solid #d8dadb;
    border-bottom: 2px solid #56a8fe;
    padding: 5px 10px;
    top: -10px;
    background: #fff;
}

.sb-btm-info {
    position: absolute;
    top: 45px;
    max-width: 160px;
    white-space: initial;
}

.sb-top-info {
    position: absolute;
    bottom: 25px;
}

.sb-nm {
    font-size: 13px;
    color: #999999;
    flex-direction: column;
    display: flex;
    line-height: 16px;
}

.sb-btm-info h5 {
    margin-top: 10px;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 15px;
}

.history-section {
    padding: 60px 0 130px;
    overflow: auto;
    margin: 0 auto;
    text-align: center;
}

.history-section-inr {
    display: inline-block;
    margin: 0 auto;
}

/*NO RECORD*/
td.dataTables_empty {
    padding: 100px 10px;
}

td.dataTables_empty .btn {
    line-height: 31px;
    padding: 5px 20px !important;
}

/*PO BUTTONS GROUP*/
.input-btn-group .input-icn-btn {
    padding-top: 0;
}

.input-btn-group .input-icn-btn input {
    padding: 8px 20px;
    height: 100%;
}

/*DARK THEME*/
body.dark-theme .order-create-form .product-row .heading {
    background: #252629;
    border-bottom: 1px solid #343434;
}

body.dark-theme .btn-blue-outline {
    background: none;
}

body.dark-theme .custom-select-box.custom-select-box-arrow,
body.dark-theme .orderfilter-box {
    border-color: #555 !important;
}

body.dark-theme .search-result {
    border: 1px solid #353439;
    border-bottom: 2px solid #56a8fe;
    background: #353439;
}

body.dark-theme .create-new-order .dropdown-menu a.dropdown-item {
    background: #22232f;
    border-bottom: 1px solid #464646;
}

body.dark-theme .order-create-form .product-row.cus-row {
    margin-bottom: 0;
}

body.dark-theme .product_bottom {
    background: #252629;
    border: none;
}

body.dark-theme .dropzone .dz-preview .dz-details {
    background: #1b1c1e;
}

body.dark-theme .sidebar-body {
    background: #1b1c1e;
}

body.dark-theme .sidebar-body .order-box {
    background: #fff;
}

body.dark-theme .orderfilter-box .filter-group-box .form-group .form-control {
    border-color: #555 !important;
}

body.dark-theme .view-order-page .view-ref-section {
    background: #22232f;
}

body.dark-theme .sidebar-open .summary-sidebar {
    border-left: 1px solid #464444;
}

body.dark-theme .summary-sidebar {
    border-left: 1px solid #464444;
    background: #1b1c1e;
}

body.dark-theme .view-order-page .artwork-outer {
    border-bottom: 1px solid #22232f;
}

body.dark-theme .d-text {
    color: #ffffff;
}

body.list-group-item {
    background-color: #353439;
}

body.dark-theme .card {
    border: solid 1px #555555;
}

body.dark-theme .list-group-item {
    background-color: #1b1c1e;
}

body.dark-theme .card-head-with-line {
    border-bottom: 1px solid #555555;
}

body.dark-theme .border-top {
    border-top: 1px solid #555555 !important;
}

body.dark-theme .custom-table tbody td {
    border-top: 1px solid #555555 !important;
}

body.dark-theme .custom-tab-with-border {
    border-top: 1px solid #555555 !important;
    border-bottom: 1px solid #555555;
}

body.dark-theme .custom-table thead th {
    border-bottom: 2px solid #555555;
    border-top: 1px solid #555555 !important;

}

body.dark-theme .custom-table thead tr {
    background: none !important;
}

.nav-profile-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.nav-profile-box .navbar-nav {
    align-items: center;
    flex: auto;
}

input[type=reset],
input[type=submit],
button,
html [type=button] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    border-radius: 4px !important;
}

.bootstrap-select .dropdown-toggle {
    border-radius: 0px !important;
}

/*PRROVAL PAGE STYLE*/
.approval-main-page .approval-row.product-row.product-discount-added .product-discount {
    flex: 0 0 6%;
}

.approval-row.product-row .product-qty {
    flex: 10 0 13%;
}

.category-dropdown .select2-container {
    width: 100% !important;
}

.supplier-dropdown .select2-container {
    width: 100% !important;
}

.product-btns-group {
    display: flex;
    justify-content: flex-end;
}

.product-btns-group .add-new {
    margin-left: 10px !important;
}

.bulk-actn-grpsbox .btn-blue {
    border-radius: 4px !important;
}

.product-btns-group .bulk-actn-grpsbox .dropdown {
    margin-right: 0 !important;
}

.btn>img {
    max-height: 18px;
    object-fit: contain;
}

.product-table td>img {
    object-fit: contain;
}

/*Create Group*/
.form-group.inline-field {
    display: flex;
    align-items: center;
    margin-bottom: 0;
    position: relative;
}

.edigroup-optionname {
    position: relative;
    z-index: 1;
}

.form-group.inline-field label {
    flex: none;
    margin-right: 10px;
    margin-bottom: 0;
}

.addon-accordian-inr {
    padding: 20px;
    display: flex;
    border-bottom: 1px solid #e0e0e1;
}

.addon-accordian.crt-cusmr-form .title-container {
    border-top: 1px solid #e0e0e1;
    border-bottom: 1px solid #e0e0e1;
    padding-right: 80px;
}

.crt-cusmr-form.addon-accordian .title-container:before {
    display: none;
}

.addonaccrdn:before {
    right: 0;
    position: absolute;
    top: 50%;
    content: "\f067";
    font: normal normal normal 20px/1 FontAwesome;
    margin-right: 10px;
    color: #56A8FE;
    transform: translateY(-50%);
}

.addonaccrdn[aria-expanded="true"]:before {
    content: "\f068";
}

.quty-group {
    display: flex;
    flex-direction: column;
    width: 307px;
}

.addon-accordian-box .title-container {
    position: relative;
}

.qutinputmainbox span {
    font-size: 14px;
    margin: 0 10px;
    position: relative;
    top: 12px;
}

.qutinputmainbox .fa {
    font-size: 20px;
    color: #FF7979 !important;
    top: 13px;
    position: relative;
    cursor: pointer;
}

.qutinputbox input {
    width: 90px;
}

.qutinputmainbox {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    justify-content: space-between;
}

.addon-upload {
    display: flex;
    flex-direction: column;
    width: 150px;
    margin: 0 100px;
}

.addon-upload .custom-file-control {
    width: 150px !important;
    margin-bottom: 10px;
}

.addon-upload .img-thumbnail {
    padding: 0;
    width: 150px;
    height: 150px;
    background: rgba(57, 73, 107, 0.1);
    position: relative;
    border: 1px dashed rgba(57, 73, 107, 0.3);
    border-style: dashed !important;
}

.addon-upload .img-thumbnail img {
    max-width: 100%;
    max-height: 100%;
}

.addon-accordian-inr .edorder-swhbox span {
    color: #212529;
}

.addon-accordian-inr .custom-label {
    display: block;
    font-size: 14px;
    margin-bottom: 10px;
    font-family: CircularStd-Medium;
    color: #575F76;
}

.addonaccrdn {
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    cursor: pointer;
}

.dlrinput {
    position: relative;
}

.dlrinput:before {
    content: var(--currency-sym, "$");
    position: absolute;
    top: 12px;
    left: 12px;
}

.dlrinput input {
    padding-left: 30px !important;
}

.br-3 {
    border-radius: 4px !important;
}

.remove-buttonbox {
    font-size: 22px;
    position: absolute;
    right: 47px;
    color: #FF7979 !important;
    cursor: pointer;
}

.add-tier-btn {
    width: 120px;
}

.form-group.grpname-box {
    display: flex;
    align-items: flex-start;
}

.group-inr-box {
    min-width: 250px;
}

.group-inr-btn-box {
    display: flex;
    flex-direction: column;
}

.form-group.grpname-box .btn {
    margin-left: 10px;
}

/*===== summary page ======*/

.summary-page .invoice-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.invoice-status i.fa {
    font-size: 20px;
}

.invoice-status span {
    font-size: 14px;
}

.invoice-info .btn {
    height: auto;
    padding: 5px 15px 5px 15px;
}

/*not paid*/
.invoice-not-paid i.fa,
.invoice-not-paid span {
    color: #FF7979;
}

/*invoice on account*/
.invoice-on-account i.fa,
.invoice-on-account span {
    color: #E8AD14;
}

/*invoice paid*/
.invoice-paid i.fa,
.invoice-paid span {
    color: #44ae1f
}

.btn-black {
    background: #22212f;
    color: #fff;
}

.summary-page .approval-main-page .approval-row.product-row .product-name {
    flex: 0 0 20%;
}

.summary-page .approval-main-page .approval-row.product-row .product-qty {
    flex: 0 0 8%;
}

.summary-page .approval-main-page .approval-row.product-row .product-unit {
    flex: 0 0 10%;
}

.summary-page .approval-main-page .approval-row.product-row.product-discount-added .product-discount {
    flex: 0 0 5%;
}

.summary-page .approval-main-page .approval-row.product-row .product-subtotal {
    flex: 0 0 12%;
    padding-right: 20px;
}

.summary-page .approval-main-page .approval-row.product-row .check-approve {
    flex: 0 0 12%;
}

.summary-page .approval-main-page .approval-row.product-row .product-sp {
    flex: 0 0 10%;
}

.summary-page .approval-main-page .approval-row.product-row .product-sp-empty {
    flex: 0 0 35%;
}

.summary-page .product-mn-table {
    border-top: 1px solid #DEDEDF;
    border-bottom: 1px solid #DEDEDF;
}

.summary-page .aprv-ordr-dtls-box .product-row {
    border: none !important;
    padding-bottom: 5px;
}

.summary-page .product-sp .btn {
    min-width: 110px;
    border-radius: 4px;
}

.summary-page .product-sp p {
    font-size: 13px;
    text-align: center;
}

.summary-page .tracking-box {
    display: flex;
    justify-content: flex-end;
    padding-bottom: 10px;
    margin-top: -10px;
}

.summary-page .tracking-box p {
    margin: 0 5px;
}

.summary-page .tracking-box a {
    font-size: 12px;
    line-height: 17px;
    margin: 0 15px;
}

.summary-page .aprv-ur-artwork {
    border-top: none;
}

.summary-page .aprv-ur-artwork {
    padding-top: 0;
}

.summary-page .aproval-conbox-head h2 {
    border-bottom: 1px solid #DEDEDF;
    text-align: left;
}

.summary-page .artwork-b {
    width: 33% !important;
    padding: 0 0 30px 0 !important;
}

.summary-page .aproval-conbox {
    min-height: inherit;
}

.summary-page .aproval-conbox-head h2 {
    font-size: 25px;
}

.summary-page .btn.disabled,
.summary-page .btn:disabled {
    background: #e8eaec;
    color: #717c88 !important;
}

.summary-page .aprval-footer {
    margin-top: 0;
}

.dispatch-date {
    position: relative;
}

.dispatch-date .input-group-addon {
    position: absolute;
    right: 9px;
    top: 6px;
    z-index: 8;
}

.product-form .title-container[aria-expanded="true"]:before {
    content: "\f068";
}

.product-form .title-container:before {
    content: "\f067";
    font: normal normal normal 17px/1 FontAwesome;
    margin-right: 10px;
}

.pricing-plusbox {
    width: 100%;
}

.pricing-tab-section .title-container {
    justify-content: flex-start;
    display: inline-flex;
    cursor: pointer;
}

.textbox-group {
    display: flex;
    flex-wrap: wrap;
}

.price-input {
    width: 70px;
}

.textbox-group .price-input {
    width: 70px;
    margin: 5px 10px;
}

.quick-product .title-container .title {
    font-size: 16px;
}

.quick-product .textbox-group .price-input {
    width: 66px;
    margin: 5px 5px;
}

.quick-product .price,
.quick-product .qty {
    width: 66px;
}

.pricing-tab-section .form-control:focus {
    border: 1px solid #56A8FE !important;
    box-shadow: none;
    outline: 0;
    box-shadow: none;
}

.tier-group-box {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.tier-group-box label {
    min-width: 75px;
    margin: 10px 0;
}

.price-input.dlrsign-box:after {
    top: 13px;
    left: 10px;
    color: #999;
}

.base-label-input {
    margin: 5px 0;
}

/*====== Dashboard Page ======*/
.dashboard-page .card {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.dashboard-page .ins-dtrng-box {
    border: none;
    padding: 9px 15px;
    background: #fff;
    font-size: 15px;
    color: #333;
    height: 34px;
    border-radius: 4px;
}

.dashboard-page .ins-dtrng-box .fa {
    font-size: 17px;
    position: relative;
    top: -2px;
}

.bg-green-light {
    background: rgb(212 247 212);
    color: #6ecd70;
}

.bg-primary-light {
    background: rgba(46, 101, 252, 0.15);
    color: #2962FF;
}

.bg-success-light {
    background: rgba(1, 197, 164, 0.15);
    color: #00C9A7;
}

.bg-warning-light {
    background: rgba(252, 191, 9, 0.15);
    color: #FFC107;
}

.bg-secondary-light {
    background: rgba(136, 109, 252, 0.15);
    color: #886CFF;
}

.icon-box {
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
}

.icon-box .iconinfo {
    font-size: 26px;
}

.count-head {
    font-size: 24px;
    font-weight: 600;

}

.d-text {
    color: #323A46;
}

.last-date {
    font-size: 14px;
}

.last-date .iconbox {
    font-size: 17px;
    position: relative;
    top: -2px
}

.card-head-with-line {
    font-size: 18px;
    font-family: 'CircularStd-Medium';
    border-bottom: 1px solid #E1E1E1;
    padding-bottom: 10px;
    position: relative;
}

.card-head-with-line:after {
    content: "";
    width: 40px;
    height: 1px;
    background-color: #56A8FE;
    position: absolute;
    left: 0;
    bottom: -1px;
}

.custom-tab-with-border {
    border-bottom: 1px solid #E1E1E1;
}

.card-head.pb-0 {
    padding-bottom: 0 !important;
}

.custom-tab-with-border .nav-link.active:before {
    bottom: -1.5px !important;
}

.text-decoration-none:hover {
    text-decoration: none;
}

.drop-btn {
    width: 35px;
    text-align: center;
    cursor: pointer;
}

/*Status Style*/
.status-info {
    padding: 5px 7px;
    min-width: 90px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
}

.status-info a:hover {
    text-decoration: none;
}

.status-success {
    color: #00C9A7;
    background: rgba(0, 201, 167, 0.15);
}

.status-danger {
    color: #FF5C75;
    background: rgba(255, 92, 117, 0.15);
}

.status-warning {
    color: #FFBE0B;
    background: rgba(255, 190, 11, 0.15);
}

.custom-icon-tab {
    position: absolute;
    right: 16px;
    top: 9px;
}

.notify-date {
    font-size: 11px;
    color: #666;
}

.btn.notice-btn {
    position: absolute;
    right: 0;
    height: 28px;
    padding: 0px 12px;
    line-height: 28px;
}

.drop-tgl {
    position: absolute;
    top: 37px;
    right: 0px;
    z-index: 2;
    min-width: 350px;
    display: none;
    box-shadow: 0 0 4px rgb(0 0 0 / 25%);
}

.textarea-custom {
    min-height: 80px;
}

.dt-icn-cldr span {
    position: absolute;
    top: calc(50% - 10px);
    right: 10px;
    font-size: 18px;
}

.settingbox {
    position: fixed !important;
    right: 0;
    z-index: 9;
    top: 75px;
}

.lead-accordian {
    position: absolute;
    width: 370px;
    z-index: 1;
    right: 15px;
    padding: 0;
}

.lead-title {
    padding: 10px;
    background: #252b3b;
}

.lead-title a {
    color: white !important;
    text-decoration: none;
}

.lead-body {
    padding-left: 5px !important;
    padding-top: 5px !important;
    white-space: normal;
    word-break: break-all;
    line-height: 1.5;
    background: #f3f3f3;
    max-height: 400px;
    overflow-y: auto;
}

.lead-body .lead-artwork-download-btn {
    padding: 2px 2px;
    font-size: 15px;
}

.lead-body .lead-artwork-download-link {
    color: #007bff;
    border: 1px solid #FF7979;
    border-radius: 2px;
    padding: 2px 6px;
    text-decoration: none;
}

.lead-body .lead-artwork-download-link:hover {
    color: #0056b3;
    text-decoration: underline;
}

.sticky-lead {
    position: fixed;
    width: 370px
}

.lead-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.lead-artwork-icon {
    font-size: 20px !important;
}

.lead-send-email-icon,
.lead-send-email-icon:hover,
.lead-send-email-icon:focus {
    color: #56A8FE;
    font-size: 18px;
    text-decoration: none;
}

/* Status column on the Lead Listing shrinks to its content. width:1% is the
   shrink-to-fit idiom for an auto-layout table (see .lead-id-col below): the
   browser cannot honour 1%, so it falls back to the column's minimum content
   width — the widest label, "Not Assigned" — and hands the leftover space to the
   other columns. A min-width would keep reserving space this column never uses. */
#leads-table th.lead-status-col,
#leads-table td.lead-status-col {
    width: 1%;
    white-space: nowrap;
}

/* .order-status-box carries min-width:150px for the order listings, which is
   wider than this column needs and is what produced the gap. */
#leads-table td.lead-status-col .order-status-box {
    min-width: 0;
}

/* Action column (three-dot menu): only ever holds one dropdown trigger. */
#leads-table th.lead-actions-menu-col,
#leads-table td.lead-actions-menu-col {
    min-width: 56px;
    max-width: 72px;
    white-space: nowrap;
}

/* ID column holds a numeric id and a sort arrow, nothing else. width:1% is the
   shrink-to-fit idiom for an auto-layout table: the browser cannot honour 1%, so
   it falls back to the column's minimum content width and hands the leftover
   space to the other columns instead of padding this one out. A fixed px width
   would not do it — under table-layout:auto that is only a hint, and the column
   still absorbs a share of the spare width. */
#leads-table th.lead-id-col,
#leads-table td.lead-id-col {
    width: 1%;
    white-space: nowrap;
}

.lead-product-col {
    max-width: 200px;
    word-wrap: break-word;
    white-space: normal;
}

/* The Leads table was overflowing its container and pushing the Action column
   off-screen. These three columns were the ones reserving width they did not
   need. max-width on the cell is what actually forces the wrap — the table is
   auto-layout, so without it each column takes its full max-content width and
   the table just grows. Same idiom as .lead-product-col above.

   The headers keep their nowrap from `.custom-table thead th`, which outranks
   these rules, so only the cells wrap. That means each header's own width is the
   floor here — shrinking the cells past it gains nothing. */

/* "Email Campaign" onto two lines. No word-wrap:break-word here — these values
   are short phrases, and breaking mid-word gives "Campai / gn". The cap only has
   to sit under the phrase and above its longest word. */
.lead-source-col {
    max-width: 80px;
    white-space: normal;
}

/* "The Pin Factory" onto two lines. The cap cannot go below the "Store Name"
   header, which is nowrap — squeeze the column past it and the header spills over
   the Status column instead of the row getting any narrower. */
.lead-store-col {
    max-width: 95px;
    white-space: normal;
}

/* Notes holds a single 25px icon; the header is now the only thing that needs
   room. Centred so it does not sit against the Product column. */
#leads-table th.lead-notes-col,
#leads-table td.lead-notes-col {
    width: 1%;
    white-space: nowrap;
    text-align: center;
}

.lead-completion-col {
    width: 80px;
    white-space: nowrap;
}

.lead-completion-col .lead-completion-details {
    font-size: 100%;
    font-weight: 400;
}

.max-h-400 {
    overflow: auto;
    max-height: 400px;
}

/*===== Create Notice =====*/

.cn-sd-box {
    display: flex;
    position: relative;
    width: 100%;
}

.datepicker-days .table-condensed {
    width: 100% !important;
}

.sd-input-box input {
    width: 100%;
}

.sd-input-box .input-group-addon {
    position: absolute;
    right: 14px;
    top: 12px;
}

#start-date-container .datepicker,
#end-date-container .datepicker {
    margin-top: 20px !important;
}

#notice-form .datepicker .datepicker table {
    width: 100% !important;
}

.dashboard-col-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

/*====ORDER PAGE : DROPDOWN====*/
.productSearchDropdown.select2-container--open .select2-dropdown {
    width: 500px !important;
    max-height: 400px !important;
    overflow-y: auto;
}

.right-info-dd {
    border-left: 1px solid #eee;
    padding-left: 10px;
    margin-left: 10px;
    width: 202px;
}

.right-info-dd ul li {
    margin: 5px 0;
    font-size: 13px;
    display: flex;
    align-items: baseline;
}

.right-info-dd ul li label {
    min-width: 67px;
}

.right-info-dd ul li span {
    margin-left: 5px;
    max-width: 100px;
    word-break: break-word;
}

.right-info-dd ul li:before {
    content: "\f111";
    font: normal normal normal 8px/1 FontAwesome;
    margin-right: 5px;
    position: relative;
    top: -2px;
}

.text-green {
    color: #58a651;
}

.ddheading {
    font-size: 16px;
    display: block;
    margin-bottom: 5px;
}

.right-info-dd {
    border-left: 1px solid #929497;
    padding-left: 10px;
    margin-left: 10px;
}

.productSearchDropdown .select2-results__option {
    background: #f1f1f2;
    margin-bottom: 1px;
}

.productSearchDropdown .select2-results__option--highlighted .right-info-dd {
    border-left: 1px solid #fff;
}

.productSearchDropdown .select2-results__option--highlighted .text-green {
    color: #8fe38f;
}

.productSearchDropdown .select2-results__option--highlighted .right-info-dd ul li {
    color: #f2f2f2;
}

.right-info-dd ul li {
    margin: 5px 0;
    font-size: 13px;
    color: #58595f;
}

.right-info-dd ul a {
    /* color: #56A8FE !important; */
    text-decoration: underline !important;
    margin-left: 10px;
}

.right-info-dd ul li span {
    margin-left: 5px;
}

.left-info-dd-inr {
    flex: 1;
    word-break: break-word;
}

.srh-with-filter {
    position: absolute;
    right: 344px;
    z-index: 1;
    top: 32px;
}

.dark-theme .productSearchDropdown .select2-results__option {
    background: #353439;
    margin-bottom: 0;
    border-bottom: 1px solid #575757;
    border-bottom: 1px solid #575757;
}

.dark-theme .right-info-dd ul li {
    color: #c5c5c5;
}

.dark-theme .productSearchDropdown .select2-results__option--highlighted .right-info-dd ul li {
    color: #f3f3f3;
}

.productSearchDropdown.select2-container--open .select2-dropdown .select2-results__options {
    max-height: 335px;
}

.co-eml-multy .tagify {
    min-height: 35px
}

/*====== BRANDING METHOD ======*/
.brnding-box .form-control {
    text-align: center;
}

.has-dollar-sign:before {
    content: var(--currency-sym, "$");
    position: absolute;
    top: 11px;
    left: 13px;
}

.has-dollar-sign .form-control {
    padding-left: 30px;
    padding-right: 30px;
}

.disabled-show-field {
    padding: 0.375rem 0.75rem;
    min-height: 38px;
    line-height: 26px;
}

.overflow-auto {
    overflow: auto;
}

.bg-light-blue {
    background: #D7EAFF;
}

.bg-light-gray {
    background: #EEEEEE;
}

.w-100px {
    width: 100px;
}

.w-150px {
    width: 150px;
    min-width: 150px;
}

.w-250px {
    width: 250px;
    min-width: 250px;
}

.btn-blue-h40 {
    height: 40px;
    line-height: 25px;
}

.add-print {
    width: 100%;
    height: 100%;
    font-size: 18px;
    font-weight: 600;
    color: #CCCCCC;
    border: 2px dashed #d1cdcd;
}

.parsley-errors-list .parsley-required {
    white-space: pre-wrap !important;
    word-break: keep-all !important;
}

.setup_price_block {
    background-color: #f9c3c3
}

.setup_price_block p {
    color: red !important;
}

.w-31 {
    width: 31px
}

.product-row .sku {
    word-break: break-all
}

/*27-7-2022 inventory page*/
.avaiability-sec {
    margin-bottom: 35px;
}

.avaiability-sec .lable-text {
    text-transform: uppercase;
}

.avaiability-sec .lable-text #available {
    font-family: 'CircularStd-Bold';
}

.avaiability-sec .badge {
    border-radius: 15px;
    color: #fff;
    min-width: 110px;
    padding: 4px 5px;
    font-weight: normal;
}

.inventory_status,
.badget_status {
    border-radius: 15px;
    color: #fff;
    min-width: 80px;
    padding: 4px 5px;
    font-size: 11px;
    font-weight: normal;
}

/*23-8-2022 order status*/
.status-select option:nth-child(2) {
    color: #198754;
}

.status-select option:nth-child(3) {
    color: #ffc107;
}

.status-select option:nth-child(4) {
    color: #dc3545;
}

.status-select option:nth-child(5) {
    color: #0dcaf0;
}

.custom-file-control.big-file-control {
    width: 100% !important;
    height: 70px;
    line-height: 70px;
    background: rgba(57, 73, 107, 0.1);
    position: relative;
    border: 1px dashed rgba(57, 73, 107, 0.3);
    color: #56A8FE;
    min-height: 150px;
    max-width: 550px;
    margin: 0px auto !important;
    display: block;
}

.custom-file-control.big-file-control label {
    color: #56A8FE !important;
    font-size: 18px;
    height: 100%;
    margin: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-file-control.big-file-control .form-control {
    cursor: pointer;
}

.font14 {
    font-size: 14px;
}

/*view order*/
.view-order-table .name-col {
    flex: 0 0 50%;
}

.sub-total-col,
.view-order-page .order-create-form .product-row .sub-total-col p.heading {
    text-align: right;
}

.view-order-table div {
    flex: 1;
}

.view-order-table div p {
    margin-bottom: 0;
}

.bill-otr p {
    display: inline-block;
}

.dark-theme .brnding-box .bg-light-blue {
    background: none !important;
}

.dark-theme .brnding-box .bg-light-gray {
    background: none !important;
}

.dark-theme .brnding-box .tier-column .bg-white {
    background: none !important;
}

.dark-theme .brnding-box .disabled-show-field {
    color: black !important;
    background: #353439 !important;
}

.dark-theme .setting_sidebar .setting-item .item-body {
    background: #22232f;
}


.showQuote-attachFile {
    margin-top: 10px;
}

.approval-main-page #uploaded_files_error {
    color: red;
    font-size: 12px;
}

#btn-bulk-submit {
    text-align: left;
    border: none;
    background: #fff;
    padding: 5px;
    color: #56A8FE;
    padding: 10px 15px;
    text-decoration: none;
    display: block;
    font-size: 14px;
    margin: 0;
    width: 100%;
    cursor: pointer;
}

#submit-markCompleted {
    text-align: left;
    border: none;
    background: #fff;
    padding: 5px;
    color: #56A8FE;
    padding: 10px 15px;
    text-decoration: none;
    display: block;
    font-size: 14px;
    margin: 0;
    width: 100%;
    cursor: pointer;
}

body.dark-theme #submit-markCompleted {
    background: #22232f !important;
    color: #56A8FE !important;
}

body.dark-theme #submit-markCompleted:hover {
    background: #353439 !important;
    color: #dadada !important;
}

#submit-restore {
    text-align: left;
    border: none;
    background: #fff;
    padding: 5px;
    color: #56A8FE;
    padding: 10px 15px;
    text-decoration: none;
    display: block;
    font-size: 14px;
    margin: 0;
    width: 100%;
    cursor: pointer;
}

body.dark-theme #submit-restore {
    background: #22232f !important;
    color: #56A8FE !important;
}

body.dark-theme #submit-restore:hover {
    background: #353439 !important;
    color: #dadada !important;
}

#btn-picklist-submit {
    text-align: left;
    border: none;
    background: #fff;
    padding: 5px;
    color: #56A8FE;
    padding: 10px 15px;
    text-decoration: none;
    display: block;
    font-size: 14px;
    margin: 0;
    width: 100%;
    cursor: pointer;
}

body.dark-theme #btn-picklist-submit {
    background: #22232f !important;
    color: #56A8FE !important;
}

body.dark-theme #btn-picklist-submit:hover {
    background: #353439 !important;
    color: #dadada !important;
}

#btn-bulk-order-tag-submit {
    text-align: left;
    border: none;
    background: #fff;
    padding: 5px;
    color: #56A8FE;
    padding: 10px 15px;
    text-decoration: none;
    display: block;
    font-size: 14px;
    margin: 0;
    width: 100%;
    cursor: pointer;
}

body.dark-theme #btn-bulk-order-tag-submit {
    background: #22232f !important;
    color: #56A8FE !important;
}

body.dark-theme #btn-bulk-order-tag-submit:hover {
    background: #353439 !important;
    color: #dadada !important;
}


body.dark-theme .tagging_table tr th,
body.dark-theme .tagging_table tr td {
    border-color: #555555 !important;
}


#markFulfilledModel p {
    font-size: 12px;
}

#markFulfilledModel .title {
    text-align: center;
    text-align: center;
    font-size: 25px;
    font-weight: 600;
    margin: 10px;

}

.quote-header-text,
.quote-footer-text {
    margin: 10px 5px 10px 5px;
}

.quote-header-text p,
.quote-header-text ul li,
.quote-footer-text p,
.quote-footer-text ul li {
    padding: 5px;
    list-style: disc;
}

.quote-header-text ol li,
.quote-footer-text ol li {
    list-style: auto;
}

.quote-header-text strong,
.quote-footer-text strong {
    font-family: 'CircularStd-Bold';
}

.quote-header-text h1,
.quote-footer-text h1 {
    font-size: 50px;
    line-height: 50px;
    font-weight: normal;
}

.quote-header-text h2,
.quote-footer-text h2 {
    font-size: 40px;
    line-height: 50px;
    font-weight: normal;
}

.quote-header-text h3,
.quote-footer-text h3 {
    font-size: 30px;
    line-height: 50px;
    font-weight: normal;
}

.drag-option-td {
    padding-left: 18px;
}

.view-order-page .product-row .desc {
    padding: 10px 0px;
}

.view-order-page .order-create-form .product-row.cus-row {
    border: 1px solid #cacaca;
}

.with_dl {
    position: relative;
}

.with_dl .dl-sign {
    display: inline-block;
    margin-right: 4px;
    font-size: 20px;
    background: #f1f1f1;
    padding: 10px;
}

.view-ref--form .view-ref-details-form {
    position: relative;
}

.order-create-form .view-order-table .name-col {
    flex: 0 0 35%;
}

.order-create-form .date-box-tooltip {
    margin-bottom: 10px;
}

#tagsList.color-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
}


/*table .color-square {*/
/*    width: 10px;*/
/*    height: 25px;*/
/*    display: inline-block;*/
/*    margin-right: 5px;*/
/*}*/

.order-actv-order-tab table .drop-color-square {
    width: 10px;
    height: 20px;
    display: inline-block;
    border-radius: 10px;
    flex-shrink: 0;
    margin-left: auto;
    order: 2;
}

.order-tags-menu .drop-color-square {
    width: 10px;
    height: 20px;
    display: inline-block;
    border-radius: 10px;
    flex-shrink: 0;
    margin-left: auto;
}


.order-actv-order-tab table .color-square {
    width: 10px;
    height: 32px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 10px;
}

.order-quote-tab table .color-square {
    width: 10px;
    height: 32px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 10px;
}

.customer-list table .color-square {
    width: 10px;
    height: 32px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 10px;
}

.order-cancelled-order-tab table .color-square {
    width: 10px;
    height: 32px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 10px;
}

.completd-orders-tab table .color-square {
    width: 10px;
    height: 32px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 10px;
}


.tagging_table .colored-tag span {
    display: inline-block;
    font-size: 12px;
}

.tagging_table th,
.tagging_table td {
    vertical-align: middle !important;
    padding: 10px !important;
}

.tagging_table thead>tr {
    height: auto;
}

.flex-full {
    flex: 0 0 100%
}

.view-ref--form {
    padding: 25px
}

.view-ref--form .view-ref-details-form .form-group {
    position: relative;
    margin-bottom: 20px;
}

.view-ref--form .view-ref-details-form .form-group .custom-label {
    font-size: 14px;
    color: #000;
    margin-bottom: 5px;
}

.view-ref--form .view-ref-details-form .form-group .form-control {
    height: 48px !important;
    background: #ffffff;
    border: 1px solid #dcdcdc;
    border-radius: 5px !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 5px 16px;
}

@media (max-width: 767px) {
    .view-order-page .order-create-form .product-row .heading {
        text-align: left !important;
        padding: 10px !important;
        border-bottom: 1px solid #cacaca !important;
    }

    .view-order-page.create-order-page-new-ui .product-data {
        padding: 10px !important;
    }

    .view-order-page.create-order-page-new-ui .product-data figure {
        text-align: center !important;
    }

    .create-order-page-new-ui .product-row .add-more,
    .create-order-page-new-ui .product-row .add-more {
        width: 100% !important;
        flex: 0 0 100% !important;
    }

    .create-order-page-new-ui .product-row .add-more .product-data {
        justify-content: center;
    }

    .create-order-page-new-ui .product-row .add-more .heading,
    .create-order-page-new-ui .product-row .add-more .heading {
        text-align: center !important;
    }

    .custom-acc-app-row .acc-app-mn-row-inner .acc-app-info {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
    }
}

.create-customer .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: #56A8FE !important;
    border-color: #56A8FE !important;
    color: #fff !important;
    border-radius: 20px;
    margin-top: 10px;
    font-size: 14px;
}

.create-customer .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    background: #56A8FE !important;
    color: #fff !important;
    float: right;
    padding-left: 5px;
}

.dark-theme .create-customer .select2-container--default .select2-selection--multiple {
    background: #1b1c1e !important;
    border-color: #555555 !important;
    height: 40px;
}

.dark-theme .create-customer .select2-search__field {
    color: white;
}

.create-customer .select2-container--default .select2-selection--multiple {
    background: #F8F9FC;
    border: 1px solid rgba(57, 73, 107, 0.3);
    border-radius: 0px;
    height: 40px;
}

.user-company-select button {
    border: none !important;
    height: auto !important;
}

.custom-selectbox select.form-control {
    min-width: 250px;
    border: 1px solid #ECEEF3;
    border-radius: 4px;
    color: #999999;
    font-size: 14px;
}

/* Rfq new css */

.rfq-row {
    border: 1px solid #cacaca;
    border-radius: 0px;
    overflow: hidden;
    position: relative;
}

.rfq-row .rfq-header {
    background: #F5F7FC;
    color: #231f20;
    font-size: 16px;
    font-weight: 600;
    border-bottom: 1px solid #cacaca;
}

.rfq-row .rfq-header .inn-col,
.rfq-row .rfq-header .head-note .inn-col {
    color: #39496B;
    font-size: 14px;
}

.rfq-row .rfq-th-all .inn-col {
    padding: 10px 0px;
}

.rfq-row .rfq-th-all>div {
    padding: 10px 10px;
    line-height: initial;
}

.rfq-row .rfq-th-all .inn-col strong {
    font-weight: 600;
}

.rfq-row .rfq-header .up-img {
    flex: 0 0 120px;
    max-width: 120px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 0px;
}

.rfq-row .rfq-header .rfq-th-all {
    flex: 0 0 calc(100% - 120px);
    max-width: calc(100% - 120px);
    height: 40px;
    border-left: 0px;
}

.rfq-row .rfq-header .rfq-th-all .pro-n {
    flex: 0 0 14%;
    max-width: 14%;
}

.rfq-row .rfq-header .rfq-th-all .note {
    flex: 0 0 calc(32% - 60px);
    max-width: calc(32% - 60px);
}

.rfq-row .rfq-header .rfq-th-all .method {
    flex: 0 0 54%;
    max-width: 54%;
}

.rfq-row .rfq-header .rfq-th-all .action {
    flex: 0 0 60px;
    max-width: 60px;
    white-space: normal;
}

.rfq-row .rfq-content {
    background: #ffffff;
    border-top: 0px;
    align-items: inherit;
}

.rfq-row .content-right {
    flex: 0 0 calc(100% - 120px);
    max-width: calc(100% - 120px);
    /* justify-content: space-between; */
    align-items: flex-start;
    font-size: 12px;
    border-left: 0px;
}

.rfq-row .rfq-content .rfq-col {
    padding: 15px 10px;
    height: 100%;
}

.rfq-row .rfq-content .rfq-col h3 {
    padding-right: 5px;
    color: #39496B;
}

body.dark-theme .rfq-row .rfq-header .inn-col,
body.dark-theme .rfq-row .rfq-header .head-note .inn-col {
    color: #ffffff;
}

body.dark-theme .rfq-content .rfq-col h3 {
    color: #ffffff;
}

.rfq-row .rfq-content .rfq-col a {
    color: #56A8FE;
    font-family: 'CircularStd-Medium';
    text-decoration: none;
}

.rfq-row .rfq-content .rfq-col a.changed {
    color: #EC1C24;
}

.rfq-row .rfq-content .up-img {
    flex: 0 0 120px;
    max-width: 120px;
    border-right: 0px;
    height: 184px;
    display: flex;
    align-items: center;
    justify-content: start;
}

.rfq-row .rfq-content .up-img p {
    white-space: normal;
    word-break: break-all;
}

.rfq-row .rfq-content .up-img img {
    max-width: 90px;
    margin: 0px auto;
    width: 100%;
}

.rfq-row .rfq-content .pro-n {
    flex: 0 0 14%;
    max-width: 14%;
}

.rfq-row .rfq-content .pro-n .pro_name {
    margin-top: 15px;
}

.rfq-row .rfq-content .pro-n .pro_name,
.rfq-row .rfq-content .pro-n .pro_name a {
    white-space: break-spaces;
    font-size: 14px;
    line-height: 18px;
    text-decoration: underline;
    color: #56A8FE;
}

.rfq-row .rfq-content .note {
    flex: 0 0 calc(32% - 60px);
    max-width: calc(32% - 60px);
}

.rfq-row .rfq-content .note textarea {
    height: 115px !important;
    padding: 16px;
    color: #3E4555;
    font-size: 12px;
    resize: none;
    border-radius: 0px;
    font-family: 'CircularStd-Book';
}

.rfq-row .rfq-content .method {
    flex: 0 0 18%;
    max-width: 18%;
}

.rfq-row .rfq-content .quantity {
    flex: 0 0 18%;
    max-width: 18%;
}

.rfq-row .rfq-content .media-col {
    flex: 0 0 18%;
    max-width: 18%;
}

.rfq-row .rfq-content .action-col {
    flex: 0 0 60px;
    max-width: 60px;
    text-align: center;
    padding: 5px;
    height: 175px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.rfq-content .action-col .dlt-icn {
    font-size: 18px;
    color: #D52027 !important;
}

.rfq-row .rfq-content .media-col .mediside-col {
    max-width: 100%;
    width: 100%;
}

.rfq-row .rfq-content .media-col .delete-action a {
    color: #FF7979 !important;
    font-size: 16px;
}

.rfq-row .content-box .form-group label {
    font-family: 'CircularStd-Medium';
    color: #231f20;
}

.freight-method-div>h3 {
    color: #231f20;
}

.tagify-static-view {
    height: auto !important;
    border: 0px !important;
}

.rfq-row .content-box .form-group .form-control.tagify-static-view {
    border: 0px !important;
}

form .tagify__input::before,
form .tagify__input:empty::before {
    opacity: 0.5;
    color: #3E4555;
}

body.dark-theme .tagify__input::before,
body.dark-theme form .tagify__input:empty::before {
    opacity: 1;
    color: #ffffff;
}

body.dark-theme .tagify__input:focus::before {
    opacity: 0;
}

body.dark-theme .tagify__input:focus:empty::before {
    opacity: 1;
}

.formControlTagify {
    height: auto !important;
    overflow: auto !important;
    border: 0px !important;
}

.rfq-row .content-box .form-group .form-control::-webkit-input-placeholder {
    color: #495057;
}

.rfq-row .content-box .form-group .form-control::-moz-placeholder {
    color: #495057;
}

.rfq-row .content-box .form-group .form-control:-ms-input-placeholder {
    color: #495057;
}

.rfq-row .content-box .form-group .form-control:-moz-placeholder {
    color: #495057;
}

.content-box .badge span {
    display: inline-block;
    text-align: center;
    background: #26ACE2;
    border-radius: 4px;
    padding: 3px 10px;
    color: #ffffff;
    font-size: 13px;
    margin-right: 8px;
    font-weight: 300;
    margin-bottom: 8px;
}

.content-box .badge span:last-child {
    margin-right: 0px;
}

.rfq-row .rfq-content .media-col .media-box {
    background: #FFFFFF;
    border: 1px solid #ECEEF3;
    border-radius: 4px;
    overflow: hidden;
    padding: 10px;
    text-align: center;
    height: 124px;
}

.media-col .media-box .image-row {
    margin: 0px -5px;
}

.media-col .media-box .image-row li {
    flex: 0 0 33.33%;
    max-width: 33.33%;
    padding: 0px 5px;
    position: relative;
}

.media-col .media-box .image-row li .image {
    position: relative;
}

.media-col .media-box .image-row li .ac-icon {
    position: absolute;
    z-index: 1;
    top: 5px;
    width: 16px;
    height: 16px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: #ffffff;
    background: rgba(38, 172, 226, 0.4);
}

.media-col .media-box .image-row li .ac-icon.download {
    left: 5px;
}

.media-col .media-box .image-row li .ac-icon.delete {
    right: 5px;
    background: rgba(241, 37, 30, 0.4);
}

.media-col .media-box .image-row li label {
    color: #999999;
    font-size: 14px;
    display: block;
    margin-top: 5px;
}

.media-col .media-box .image-row li img {
    vertical-align: top;
    max-width: 100%;
}

.media-box .upload-button img {
    opacity: 0.5;
    vertical-align: top;
}

.media-box .upload-button label {
    color: #999999;
    font-size: 12px;
}

.media-box .upload-button {
    position: relative;
    cursor: pointer;
}

.media-box .upload-button input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 2;
    bottom: 0px;
}

.media-box input[type="file"] {
    position: fixed;
    right: 100%;
    bottom: 100%;
}

.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;
}

.quantity .load-quantity.changed .default {
    display: none;
}

.quantity .load-quantity.changed .d-none {
    display: inline-block !important;
}

.dt-box {
    background: #ffffff;
    border-radius: 4px;
    border: 1px solid #CECFD0;
    padding: 20px;
    overflow: hidden;
}

.dt-box .form--row {
    flex-wrap: nowrap;
}

.dt-box .form--row label {
    color: #39496B;
    font-size: 16px;
    padding-right: 10px;
    white-space: nowrap;
}

.dt-box .form--row .form-group {
    color: #999999;
    font-size: 14px;
}

.dt-box .badge span {
    display: inline-block;
    text-align: center;
    background: #26ACE2;
    border-radius: 4px;
    padding: 4px 12px;
    color: #ffffff;
    font-size: 14px;
    margin-right: 15px;
    font-weight: 300;
    margin-bottom: 15px;
}

.dt-box.badge span:last-child {
    margin-right: 0px;
}

.dt-box .form-control {
    outline: none !important;
    box-shadow: none !important;
    border: 1px solid #ced4da !important;
}

.no-data-box {
    position: relative;
    border: 1px solid rgba(57, 73, 107, 0.3);
    border-radius: 0px;
    padding: 10px 15px;
    min-height: 200px;
    flex-direction: column;
}

body.dark-theme .no-data-box {
    border-color: #555555;
}

.no-data-box .img-box {
    margin-bottom: 20px;
}

.no-data-box .img-box img {
    max-width: 150px;
    margin: 0px auto;
}

.no-data-box p {
    color: #999999;
    font-size: 24px;
    font-family: 'CircularStd-Medium';
}

.btn-site {
    display: inline-block;
    text-align: center;
    color: #ffffff;
    font-size: 16px;
    background: #2CA549;
    padding: 12px 20px;
    line-height: normal;
    border-radius: 4px !important;
    font-weight: normal;
}

.btn-site.btn-danger {
    background: #D52027;
    border-color: #D52027;
}

.requestModal .modal-dialog {
    width: 100%;
    max-width: 1100px;
    border-radius: 16px;
    overflow: hidden;
    border: 0px;
}

.requestModal .modal-header {
    padding: 20px 30px;
    align-items: center;
}

.requestModal .modal-header .modal-title {
    font-size: 26px;
    line-height: normal;
}

.requestModal .modal-body {
    padding: 20px 30px;
}

.requestModal .modal-header .right-head figure {
    border: 1px solid #dcdcdc;
    border-radius: 4px;
    overflow: hidden;
    padding: 2px;
    flex: 80px;
    height: 80px;
    max-width: 80px;
}

.requestModal .modal-header .right-head figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.requestModal .modal-header .right-head .detail .sku {
    color: #12203E;
    font-size: 18px;
}

.requestModal .rfq-create-form label {
    display: block;
    color: #575F76;
    font-family: 'CircularStd-Medium';
    margin-bottom: 10px;
}

.requestModal .rfq-create-form .form-group {
    margin-bottom: 25px;
}

.requestModal .form-group .media-box {
    border: 1px solid #ECEEF3;
    border-radius: 4px;
    background: #FFFFFF;
    height: 124px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    position: relative;
}

.requestModal .modal-header p a {
    white-space: nowrap;
}

.requestModal .form-group .media-box input[type="file"] {
    position: absolute;
    right: 0px;
    left: 0px;
    cursor: initial;
    height: 100%;
}

.requestModal .form-group .media-box .upload-button {
    background: #dfdfdf;
    cursor: pointer;
    color: #ffffff;
    padding: 15px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.requestModal .rfq-create-form .form-control {
    background: #FFFFFF;
    border: 1px solid #ECEEF3 !important;
    border-radius: 4px;
    font-size: 14px;
    color: #495057;
}

.requestModal .rfq-create-form .form-control.tagify--outside {
    height: auto;
}

.requestModal .tagify--outside .tagify__input {
    border: 0px !important;
}

.requestModal .rfq-create-form .form-group a {
    font-weight: normal;
    text-decoration: none;
    font-size: 13px;
}

.requestModal .parsley-errors-list .parsley-required {
    position: relative;
    background: #f6f6f6;
    padding: 5px 10px;
    border-radius: 4px;
    font-family: 'CircularStd-Book';
}

.requestModal .tagify .tagify__tag__removeBtn {
    right: 3px;
}

.requestModal .rfq-create-form .custom-select-box .dropdown-toggle {
    border: 1px solid #ECEEF3;
    border-radius: 4px;
}

.requestModal .modal-header .right-head .detail .heading a {
    color: #12203E;
    font-size: 14px;
    font-weight: normal;
}

.requestModal .rfq-create-form textarea.form-control {
    height: 124px;
    resize: none;
}

.requestModal .modal-footer {
    border-top: 0px;
    padding-bottom: 40px;
}

.requestModal .modal-footer .btn {
    padding: 14px 20px;
    border-radius: 4px;
    min-width: 200px;
    height: auto;
    text-align: center;
    color: #ffffff;
    font-size: 16px;
    line-height: normal;
}

.requestModal .modal-footer .btn.btn-success {
    background: #2CA549;
}

.requestModal .modal-footer .btn.btn-danger {
    background: #D52027;
}

.requestModal .tagify .tagify__tag {
    display: inline-block;
    text-align: center;
    background: #26ACE2;
    border-radius: 4px;
    padding: 6px 12px;
    color: #ffffff;
    font-size: 14px;
    margin-left: 10px;
    font-weight: 300;
    margin-bottom: 15px;
    padding-right: 25px;
    line-height: normal;
}

.requestModal .tagify .tagify__tag>div {
    background: transparent !important;
    color: #fff !important;
    padding: 0px !important;
    line-height: normal !important;
}

.rfq-table .filter-row {
    position: absolute;
    top: 32px;
    right: 352px;
    text-align: center;
    z-index: 1;
}

.filter-row .filter-ico {
    font-size: 15px;
    color: #ffffff;
}

.foldable-table .parent-table {
    width: 100%;
    overflow: hidden;
}

.foldable-table .thead-main {
    background: #e0e6f6;
    flex: 0 0 100%;
    width: 100%;
}

.foldable-table .thead-main>tr {
    background: transparent;
}

.foldable-table .thead-main>tr.tr-flex {
    border: 0px;
    background: transparent;
    display: flex;
    align-items: center;
    height: auto;
    overflow: auto;
}

.foldable-table .thead-main th {
    border: 0px;
    border-bottom: 0px;
    color: #39496B;
    font-size: 16px;
    padding: 24px 18px;
    background: transparent;
}

.foldable-table th,
.foldable-table td {
    vertical-align: middle;
    color: #39496B;
    padding: 0.75rem;
}

.foldable-table .status-icon svg {
    width: 18px;
    height: 14px;
}

.foldable-table .status-icon svg path {
    fill: #C0C4D0;
}

.inprogress-status svg path {
    fill: #ffa500 !important;
}

.accepted-status svg path {
    fill: #00a65a;
}

.reject-status svg path {
    fill: #d52027;
}

.foldable-table thead .clickable-col {
    width: 35px;
}

.foldable-table .status-detail-col {
    width: 400px;
}

.foldable-table tbody>tr {
    border: 0px !important;
}

.foldable-table .btn-group .btn {
    margin-right: 10px;
    cursor: pointer;
    padding: 6px 12px;
    border-radius: 4px !important;
    font-size: 16px;
    line-height: normal;
    color: #ffffff;
    background: #56A8FE;
    border: 0px !important;
    box-shadow: none !important;
    outline: none !important;
}

.foldable-table .btn-group .btn i {
    font-size: 16px;
}

.foldable-table .btn-group .btn.btn-success {
    background: #2CA549;
}

.foldable-table .btn-group .btn.btn-danger {
    background: #D52027;
}

.foldable-table .btn-group .btn:last-child {
    margin-right: 0px;
}

.mes-info {
    background: #26A0FC;
    color: #ffffff;
    border-radius: 9999px;
    padding: 12px 20px;
    font-size: 14px;
    line-height: normal;
    display: inline-block;
    text-decoration: none !important;
    min-width: 100px;
}

.mes-info:hover {
    background: #007bff;
    color: #ffffff;
}

.mes-info i {
    display: inline-block;
    margin-right: 8px;
}

.child-table .filter-th>span {
    position: relative;
    display: inline-block;
    padding-right: 20px;
}

.child-table .filter-th>span::after {
    position: absolute;
    content: "\f0d7";
    top: 50%;
    transform: translateY(-50%);
    right: 0px;
    font-family: FontAwesome;
    color: #000000;
    font-size: 15px;
}

.delete-row {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    border: 1px solid #FF7979;
}

.delete-row svg {
    height: 15px;
}

.toggle-btn svg {
    height: 16px;
}

.table.child-table thead th {
    border-top: 0px;
}

.table.child-table thead th,
.table.child-table tr td {
    vertical-align: middle;
    border-bottom: 1px solid #ECEEF3;
}

.table.child-table thead th {
    color: #39496B;
    font-weight: 600;
}

.table.child-table thead>tr {
    border: 0px;
}

thead>tr {
    /* position: relative; */
}

table thead>tr th {
    position: relative;
}

.foldable-table th.btn-group {
    position: absolute !important;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
}

.foldable-table .thead--row {
    background: #F5F7FC;
}

.foldable-table .thead--row th {
    color: #39496B;
    font-weight: 600;
}

.foldable-table #current_list_wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.foldable-table #current_list_wrapper #current_list_filter {
    margin-left: auto;
}

.foldable-table #current_list_wrapper .dataTable {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.title-section {
    max-width: 850px;
    margin: 0px auto;
    margin-bottom: 20px;
}

.title-section h1 {
    font-size: 48px;
    margin-bottom: 10px;
}

.title-section p {
    font-size: 16px;
}

.quotation-row {
    position: relative;
    border: 1px solid #CECFD0;
    border-radius: 4px;
    overflow: hidden;
}

.quotation-row .quotation-head {
    background: #F5F7FC;
    border-bottom: 1px solid #CECFD0;
    padding: 15px 20px;
}

.quotation-head * {
    color: #575F76;
}

.quotation-head strong {
    font-family: 'CircularStd-Bold';
}

.quotation-row .quotation-content {
    background: #ffffff;
}

.quotation-row .quotation-content .img-box {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 180px;
    flex: 0 0 180px;
    max-width: 180px;
    padding: 10px;
}

.quotation-row .quotation-content .img-box img {
    height: 60px;
    object-fit: contain;
}

.quotation-row .quotation-content .content-box {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(100% - 180px);
    flex: 0 0 calc(100% - 180px);
    max-width: calc(100% - 180px);
    border-left: 1px solid #CECFD0;
}

.quotation-content .cur-edit {
    background: #FFFFFF;
    border: 1px solid #ECEEF3;
    border-radius: 4px;
    padding: 8px 12px;
}

.quotation-content .cur-edit .form-control {
    border: 0px !important;
    padding: 0px !important;
    font-size: 14px;
}

.quotation-row .quotation-footer {
    background: #ffffff;
    border-top: 1px solid #CECFD0;
    padding: 15px 20px;
}

.quotation-row .form-control {
    border: 1px solid #ECEEF3 !important;
    outline: none;
    box-shadow: none;
    font-size: 12px;
    color: #999999;
}

.quotation-row textarea.form-control {
    height: 103px;
    padding-top: 15px;
    resize: none;
    border-width: 1px !important;
}

.quotation-row .form-group label {
    color: #575F76;
    font-size: 14px;
}

.quotation-row textarea.form-control.highlighted {
    color: #FF7979;
}

.content-box .table {
    table-layout: fixed;
}

.content-box .table tr {
    border: 0px;
    background: #ffffff;
}

.content-box .table th,
.content-box .table td {
    vertical-align: middle;
    font-size: 14px;
    color: #575F76;
    border-width: 0px !important;
    padding: 10px;
}

.content-box .table th {
    font-family: 'CircularStd-Bold';
    width: 100px;
}

.content-box .table tr>*:first-child {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    width: 135px;
    z-index: 1;
}

.content-box .table tr>*:first-child::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #ffffff;
    z-index: -1;
}

.content-box .table .btn-info {
    background: #999999;
    border-radius: 4px;
    color: #ffffff;
    padding: 10px;
    text-align: center;
    font-size: 12px;
    line-height: normal;
    border: 0px !important;
}

.content-box .table .btn-info:hover,
.content-box .table .btn-info:focus {
    background: #575F76;
}

.quote-header-text img,
.quote-footer-text img {
    width: 100%
}

.quote-page-script {
    margin-top: 60px;
    margin-bottom: 60px
}

.ck.ck-editor__main {
    font-family: sans-serif;
}

.ck.ck-editor__main strong {
    font-weight: bolder
}

.ck.ck-editor__main i {
    font-style: italic
}

.ck.ck-editor__main ul li {
    list-style: auto;
}

.ck.ck-editor__main ol li {
    list-style: decimal inside;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    background: transparent !important;
}

table.dataTable.no-footer {
    border-bottom: 1px solid #dee2e6 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

.table-responsive .no-border {
    border: 0px;
}

.select2-container.right-open {
    direction: rtl;
    left: auto !important;
    right: 0;
    width: 100%;
}

.select2-container.right-open .select2-dropdown {
    margin-right: 15px !important;
}

.product-supplier-detail .product-accordian {
    margin-top: -1px;
}

.product-accordian #product-details--list .card {
    margin-bottom: 0px;
    margin-top: -1px;
    border: 1px solid rgba(57, 73, 107, 0.3);
    border-radius: 0px;
    overflow: hidden;
}

.product-accordian #product-details--list .card .card-header .btn-header-link.collapsed:after {
    opacity: 0;
}

.product-accordian #product-details--list .card .card-header.active {
    margin: 0;
    border-radius: 0px;
    padding: 10px 0px 10px 0px;
    background: #ffffff;
}

.product-accordian .accordion .card-body {
    padding: 15px;
    background: #ececee;
    border-top: 1px solid rgba(57, 73, 107, 0.3);
}

.product-accordian #product-details--list .card .card-header.active .btn-header-link.collapsed:after {
    opacity: 1;
}

.product-accordian #product-details--list .card .card-header {
    border: 0;
    -webkit-box-shadow: 0 0 20px 0 rgba(213, 213, 213, 0.5);
    box-shadow: 0 0 20px 0 rgba(213, 213, 213, 0.5);
    border-radius: 2px;
    padding: 0;
}

.product-accordian #product-details--list .card-header-dark {
    background: #a3a3a3;
}

.product-accordian #product-details--list .card-header-dark .btn-header-link:after {
    top: 17px !important;
    left: 15px;

    right: initial !important;
    color: #3E4555;
}

.product-accordian #product-details--list .card .card-header .btn-header-link {
    display: block;
    text-align: left;
    background: #ffffff;
    color: #222;
    padding: 10px 15px 10px 60px;
    position: relative;
    border-radius: 0px !important;
}

.product-accordian #product-details--list .card .card-header .btn-header-link:after {
    content: "-";
    float: none;
    position: absolute;
    top: -20px;
    transform: initial;
    right: 20px;
    font-size: 24px;
}

.product-accordian #product-details--list .card .card-header .btn-header-link.collapsed {
    background: #ffffff;
    color: #333333;
}

.product-accordian #product-details--list .card .card-header .btn-header-link.collapsed:after {
    content: "+";
}

.accordion .card-body {
    padding: 20px;
}

.product-accordian #product-details--list .card .collapse {
    border: 0;
}

.product-accordian #product-details--list .card .collapse.show {
    color: #333333;
}

.product-supplier-detail .product-supplier--head {
    border: 1px solid rgba(57, 73, 107, 0.3);
    background: transparent;
    color: #231f20;
    border-bottom: 0px;
}

.product-supplier-detail .product-supplier--head * {
    color: #231f20;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    line-height: 24px;
}

.product-supplier-detail .product-supplier--head .imag_tag_link {
    max-height: 80px;
    overflow: auto;
    width: 240px;
    margin: 0px auto;
}

.brand_ref h4 {
    font-weight: normal;
    font-size: 14px;
    margin-bottom: 10px;
    color: rgba(34, 35, 47, 0.9);
}

.brand_ref h5 {
    font-weight: normal;
    font-size: 14px;
    margin-bottom: 20px;
    color: rgba(34, 35, 47, 0.9);
}

.brand_ref h6 {
    font-weight: normal;
    font-size: 20px;
    margin-bottom: 10px;
    color: rgba(34, 35, 47, 0.9);
}

.brand_ref h6 strong {
    font-family: 'CircularStd-Bold';
}

.brand_ref h6:last-child {
    margin-bottom: 0px;
}

.product-supplier-detail .product-supplier--head h3 {
    font-size: 14px;
}

.product-supplier--head>.d-flex {
    align-items: inherit;
}

.product-supplier-detail .product-supplier--head h3 strong {
    font-weight: 600;
    font-size: 16px;
}

.product-supplier-detail .product-supplier--head .inn {
    padding-left: 2px;
    padding-right: 2px;
    flex: auto;
    position: relative;
    padding-top: 60px;
    padding-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3E4555;
    min-width: 200px;
}

.product-supplier--head .p-name a {
    color: #56A8FE !important;
    text-decoration: underline;
    font-size: 15px;
    font-family: 'CircularStd-Book';
    font-weight: normal;
}

.product-supplier-detail .product-supplier--head .inn h3 {
    font-size: 16px;
    color: #39496B;
    font-family: 'CircularStd-Medium';
    flex: 0 0 100%;
    width: 100%;
    position: absolute;
    top: 0px;
    height: 50px;
    background: #F5F7FC;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-supplier-detail .product-supplier--head .inn span {
    display: block;
    font-family: 'CircularStd-Book';
    font-size: 14px;
    line-height: initial;
    color: #3E4555;
}

.product-supplier-detail .product-supplier--head .imag_tag_link li {
    line-height: initial;
}

.product-supplier-detail .product-supplier--head .imag_tag_link li a {
    font-family: 'CircularStd-Book';
    font-size: 13px;
    color: #3E4555;
    text-decoration: none;
}

.imag_tag_link li a:hover {
    color: #56A8FE !important;
}

.product-supplier-detail .product-supplier--head .inn .note-fixed {
    max-width: 200px;
    margin: 0px auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.product-supplier-detail .product-supplier--head .img {
    max-width: 150px;
    flex: 0 0 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.product-supplier-detail .product-supplier--head .img img {
    max-width: 100%;
    height: 60px;
    object-fit: contain;
}

.product-accordian table th,
.product-accordian table td {
    vertical-align: middle;
}

.form--row .tagify .tagify__tag {
    display: inline-block;
    text-align: center;
    background: #26ACE2;
    border-radius: 4px;
    padding: 6px 12px;
    color: #ffffff;
    font-size: 14px;
    margin-left: 10px;
    font-weight: 300;
    margin-bottom: 15px;
    padding-right: 25px;
    line-height: normal;
}

.form--row .tagify .tagify__tag>div {
    background: transparent !important;
    color: #fff !important;
    padding: 0px !important;
    line-height: normal !important;
}

.form--row .tagify .tagify__tag__removeBtn {
    right: 3px;
}

.form--row .tagify--outside .tagify__input {
    border: 0px !important;
}

.form--row .bootstrap-select .dropdown-toggle {
    border: 1px solid #ECEEF3 !important;
    border-radius: 4px !important;
    background: #ffffff;
    outline: none !important;
    box-shadow: none;
}

.form--row .bootstrap-select .dropdown-toggle:focus {
    border: 1px solid #ECEEF3 !important;
    outline: none !important;
}

.dt-box .dropdown {
    width: 100% !important;
}

.overflow-int {
    overflow: initial !important;
}

.product-accordian #product-details--list .card-header .content-data {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    flex-wrap: wrap;
    margin: 0px -15px;
}

.product-accordian #product-details--list .card-header .content-data .column {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(100% - 300px);
    flex: 0 0 calc(100% - 300px);
    max-width: calc(100% - 300px);
    border-right: 0px;
    padding: 5px 15px;
}

.product-accordian #product-details--list .card-header .content-data .column>.d-flex {
    margin: 0px -10px;
    flex-wrap: wrap;
}

.product-accordian #product-details--list .card-header .content-data .column>.d-flex>div {
    padding: 0px 10px;
    /* flex: 0 0 20%;
    max-width: 20%; */
}

.product-accordian #product-details--list .card-header .content-data .column:last-child {
    -ms-flex: 0 0 300px;
    flex: 0 0 300px;
    max-width: 300px;
    border-right: 0px;
}

.content-data .note-area {
    display: block;
    white-space: initial;
}

.card-header .content-data .column label {
    font-family: 'CircularStd-Medium';
    color: #39496B;
    font-size: 15px;
    margin-bottom: 15px;
}

.card-header .content-data .column div {
    margin-bottom: 0px;
    font-size: 14px;
    color: #3E4555;
    line-height: 18px;
    white-space: initial;
}

.card-header .content-data .column p:last-child {
    border-bottom: 0px;
    padding-bottom: 0px
}

body.dark-theme .rfq-row .rfq-header {
    background: #252b3b;
    color: #ffffff;
}

body.dark-theme .rfq-row,
body.dark-theme .rfq-row .rfq-header .up-img,
body.dark-theme .rfq-row .rfq-content .up-img,
body.dark-theme .rfq-row .rfq-header,
body.dark-theme .product-supplier-detail .product-supplier--head,
body.dark-theme .product-accordian #product-details--list .card {
    border-color: #3a3a3a;
}

body.dark-theme .product-accordian #product-details--list .card .card-header {
    -webkit-box-shadow: 0 0 6px 0 rgba(213, 213, 213, 0.4);
    box-shadow: 0 0 6px 0 rgba(213, 213, 213, 0.4);
}

body.dark-theme .rfq-row .content-box .form-group label {
    color: #ffffff;
}

body.dark-theme .rfq-row .rfq-content {
    background: #1b1c1e;
    border-top: 1px solid #3a3a3a;
}

body.dark-theme .dt-box {
    background: #252629;
    border: 1px solid #343434;
}

body.dark-theme .dt-box .form--row label {
    color: #ffffff;
}

body.dark-theme .form--row .bootstrap-select .dropdown-toggle {
    border-color: #555555 !important;
}

body.dark-theme textarea:focus,
body.dark-theme .form-control:focus {
    border: 1px solid #555555 !important;
}

body.dark-theme .rfq-row .content-box .form-group .form-control {
    border-color: #555555 !important;
    color: #ffffff;
}

body.dark-theme .rfq-row .content-box .form-group select option {
    color: #ffffff;
}

body.dark-theme .tagify--outside .tagify__input {
    border-color: #555555 !important;
}

body.dark-theme .rfq-row .rfq-content .media-col .media-box {
    background: #1b1c1e;
    border: 1px solid #555555;
    color: #ffffff;
}

body.dark-theme .media-box .upload-button label {
    color: #ffffff;
}

body.dark-theme .requestModal .rfq-create-form label {
    color: #ffffff;
}

body.dark-theme .requestModal .form-group .media-box {
    border: 1px solid #555555;
    background: #1b1c1e;
}

body.dark-theme .requestModal .rfq-create-form .form-control {
    border-color: #555555 !important;
}

body.dark-theme .requestModal .form-group .media-box .upload-button {
    background: #666161;
}

body.dark-theme .supplier-details tbody>tr {
    border: 1px solid #555555;
}

.production-popup .supplier-row-heading tr.shown td {
    background-color: #56A8FE !important;
}

body.dark-theme .production-popup .custom-table tbody tr.shown td {
    background-color: #4e4e4e !important;
    color: #ffffff !important;
}

body.dark-theme .btn-outline-dark {
    color: #ffffff;
    border-color: #ffffff;
}

div.dataTables_wrapper div.dataTables_filter input:focus {
    border-width: 1px !important;
}

#rfq-products-table .supplier-details tr.supplier-row td,
#rfq-products-table .supplier-details tr.supplier-row td:last-child {
    background: #ffffff !important;
    padding-top: 25px !important;
    padding-bottom: 25px !important;
}

#rfq-products-table .supplier-details tr.pricing-row,
body.dark-theme #rfq-products-table .supplier-details tr.pricing-row td,
#rfq-products-table .supplier-details tr.pricing-row td:last-child {
    background: #F5F7FC !important;
}

#rfq-products-table .supplier-details tr.pricing-row.th_bg {
    background: #22232F !important;
    color: #ffffff !important;
}

#rfq-products-table .supplier-details tr.pricing-row.th_bg td {
    color: #ffffff !important;
    background: #22232F !important;
    white-space: nowrap;
}

.dropzone_custom .dropzone {
    min-height: 110px !important;
    position: relative;
    padding: 10px;
    border-width: 1px;
    display: flex;
    overflow: auto;
}

.dropzone_custom .dropzone .dz-preview,
.dropzone_custom .dropzone-previews .dz-preview {
    background: rgba(255, 255, 255, 0.8);
    position: relative;
    display: inline-block;
    margin: 5px;
    vertical-align: top;
    border: 1px solid #acacac;
    padding: 2px;
}

.dropzone_custom .dropzone .remove-custom {
    margin-top: 2px;
}

.dropzone_custom .dropzone .dz-preview .dz-details,
.dropzone_custom .dropzone-previews .dz-preview .dz-details {
    width: 80px;
    height: 80px;
}

.dropzone_custom .dropzone .dz-preview .dz-details img,
.dropzone_custom .dropzone-previews .dz-preview .dz-details img {
    width: 80px;
    height: 80px;
}

.dropzone_custom .dropzone .dz-default.dz-message {
    position: absolute;
    width: 100%;
    height: 100%;
    margin-left: 0;
    margin-top: 0;
    top: 0;
    left: 0px;
    background-size: contain;
    right: 0px;
    margin: 0px auto 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: none !important;
    opacity: 1;
}

.dropzone_custom .dropzone .dz-default.dz-message span {
    font-size: 12px;
    text-align: center;
    line-height: 18px;
    white-space: initial;
}

.editable_dropzone .dropzone .dz-default.dz-message {
    background-image: none !important;
}

body.dark-theme #rfq-products-table .supplier-details tr.supplier-row td,
body.dark-theme #rfq-products-table .supplier-details tr.supplier-row td:last-child {
    background: #4e4e4e !important;
}

body.dark-theme #rfq-products-table .supplier-details tr.pricing-row,
body.dark-theme #rfq-products-table .supplier-details tr.pricing-row td,
body.dark-theme #rfq-products-table .supplier-details tr.pricing-row td:last-child {
    background: #6c6c6c !important;
    border: 1px solid #555555 !important;
}

body.dark-theme #rfq-products-table .supplier-details tr.pricing-row.th_bg td {
    background: #22232F !important;
}

.th_dark_bg,
body.dark-theme .th_dark_bg {
    background: #22232F !important;
    color: #ffffff !important;
}

body.dark-theme .product-supplier-detail .product-supplier--head {
    background: #1b1c1e;
    color: #ffffff;
}

body.dark-theme .product-supplier-detail .product-supplier--head * {
    color: #ffffff;
}

body.dark-theme .product-accordian #product-details--list .card .card-header .btn-header-link {
    background: #353439;
    color: #ffffff;
}

body.dark-theme .product-accordian #product-details--list .card .card-header.active {
    background: #353439;
}

body.dark-theme .product-accordian #product-details--list .card-header-dark .btn-header-link:after {
    color: #ffffff;
}

body.dark-theme .product-accordian #product-details--list .card .card-header .btn-header-link * {
    color: #ffffff;
}

body.dark-theme .product-accordian #product-details--list .card .collapse.show {
    color: #ffffff;
}

body.dark-theme .card-body .table tr th,
body.dark-theme .card-body .table tr td {
    color: #ffffff;
}

body.dark-theme .product-accordian .accordion .card .table tbody tr,
body.dark-theme .product-accordian .accordion .card .table tbody td,
body.dark-theme .product-accordian .accordion .card .table th {
    border-color: #555555;

}

body.dark-theme .table tr td {
    background: #343434 !important;
    border: 1px solid #898989 !important;
    color: #ffffff;
}

body.dark-theme .rfq-row .rfq-header .rfq-th-all,
body.dark-theme .rfq-row .content-right {
    border-left: 1px solid #3a3a3a;
}

body.dark-theme .product-supplier-detail .product-supplier--head .imag_tag_link li a {
    color: #ffffff;
}

body.dark-theme .product-accordian .accordion .card-body {
    background: #1b1c1e;
}

/* Common theme css */

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

tbody>tr,
thead>tr {
    border-color: rgba(57, 73, 107, 0.3) !important;
}

.table td,
.table th {
    border-top: 1px solid rgba(57, 73, 107, 0.3);
}

.table-bordered td,
.table-bordered th {
    border: 1px solid rgba(57, 73, 107, 0.3);
}

.modal .modal-dialog .modal-header {
    background: #22232F;
    color: #ffffff;
    border-radius: 0px;
    padding: 15px 30px;
}

.modal .modal-dialog .modal-header p {
    color: #ffffff;
}

.modal .modal-header .modal-title {
    color: #ffffff;
    font-family: 'CircularStd-Book';
    font-size: 20px;
}

.modal .modal-header .close {
    color: #ffffff;
    opacity: 1;
}

.modal .modal-dialog .modal-body {
    padding: 20px 30px 15px;
}

.modal .modal-dialog .modal-footer {
    padding-left: 30px;
    padding-right: 30px;
}

.dataTables_filter {
    position: relative;
}

.filter_date {
    position: relative;
    border: 1px solid rgba(57, 73, 107, 0.3);
    padding: 10px;
    font-size: 13px;
    top: -5px;
}

.dataTables_filter>label {
    display: block;
    position: relative;
}

.dataTables_filter>label .search-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 12px;
    pointer-events: none;
    z-index: 1;
    font-size: 14px;
    color: #56A8FE;
}

.dataTables_filter>label .form-control {
    padding-right: 30px;
    background: #ffffff;
}

.custom-hover:hover {
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.20);
    transform: translateY(-1px);
}

.custom-select-box .bs-searchbox .form-control {
    box-shadow: none;
    outline: none;
}

.form-check-label {
    font-family: 'CircularStd-Book';
    color: #39496B;
    font-size: 12px;
}

.form-check-input {
    margin-top: 2px;
}

.production-popup table tbody tr.odd.shown,
.production-popup table tbody tr.even.shown {
    border-bottom-color: transparent !important;
}

.production-popup table tr.shown td {
    background-color: #ffffff !important;
    color: #3E4555 !important;
}

.production-popup table tbody>tr {
    border-top-color: transparent !important;
}

.production-popup table tbody tr.odd,
.production-popup table tbody tr.even,
.production-popup table tbody tr td tr {
    border-color: rgba(57, 73, 107, 0.3) !important;
}

.production-popup table .supplier-row-heading,
.production-popup table .supplier-row-heading td {
    background: #F5F7FC;
}

.details-control>.fa {
    font-size: 12px !important;
    font-weight: normal !important;
    line-height: inherit !important;
    color: #3E4555 !important;
}

.details-control .fa.orange-color,
.details-control .orange-color {
    color: #E8AD14 !important;
}

.form-group .select2-container {
    width: 100% !important;
}

.form-group .select2-container--default .select2-selection--single {
    background-color: #fff;
    border: 1px solid rgba(57, 73, 107, 0.3);
    border-radius: 0;
    height: 40px;
}

.form-group .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #3E4555;
    line-height: 40px;
    font-size: 14px;
}

.select2-results__option {
    padding: 10px 15px !important;
    font-size: 13px !important;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: #56A8FE !important;
}

.form-group .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
    position: absolute;
    top: 1px;
    right: 5px;
    width: 20px;
}

.media-col .dropzone .dz-preview .dz-details .dz-filename {
    display: none;
}

.ref_ov {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    max-width: 280px;
}

.space-nowrap {
    white-space: nowrap;
}

.right-abs-buttons {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 5;
}

.tab-pane.overall_tab .right-abs-buttons {
    position: relative;
    top: 0px;
    right: 0px;
    z-index: 200;
    margin-left: auto;
}

.accordian_body .title-container .title {
    font-size: 22px;
}

.titleBar {
    margin-bottom: 0 !important;
    background: #22232F;
    padding: 20px 30px;
    justify-content: space-between;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
}

.titleBar h5,
.titleBar .title {
    border-bottom: 0;
    color: #ffffff !important;
    margin: 0;
    padding: 0;
    min-width: auto;
    font-size: 20px;
    line-height: 26px;
}

.custom_dropzone {
    background: rgba(57, 73, 107, 0.1);
    position: relative;
    border: 1px dashed rgba(57, 73, 107, 0.3);
}

.accordian_body {
    padding: 15px 10px;
    background: #F5F7FC;
    width: 100%;
    flex: 0 0 100%;
}

.accordian_body .title-container {
    margin-bottom: 0px;
}

.accordian_bgwhite {
    background: #ffffff;
}

.w-auto {
    width: auto !important;
}

div.dataTables_wrapper div.dataTables_filter input {
    background: #ffffff;
}

body.dark-theme tbody>tr,
body.dark-theme thead>tr {
    border-color: #555555 !important;
}

body.dark-theme .details-control>.fa {
    color: #ffffff !important;
}

body.dark-theme .production-popup table tbody tr.odd,
body.dark-theme .production-popup table tbody tr.even,
body.dark-theme .production-popup table tbody tr td tr {
    border-color: #555555 !important;
}

body.dark-theme .modal-footer {
    border-color: #555555;
}

body.dark-theme hr {
    border-color: #555555;
}

body.dark-theme .pricing-tab-section .accordian_bgwhite {
    background: #1b1c1e !important;
}

body.dark-theme .accordian_body {
    background: #353439;
}


.overflow-hidden {
    overflow: hidden !important;
}

.setting_sidebar {
    position: fixed;
    top: 0px;
    right: -460px;
    width: 100%;
    max-width: 460px;
    z-index: 99999;
    background: #F5F7FC;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}

body.open_setting_sidebar {
    overflow: hidden !important;
}

.open_setting_sidebar::before {
    position: fixed;
    content: "";
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    right: 0px;
    background: #22232F;
    opacity: 0.5;
    z-index: 9999;
    min-height: 100vh;
}

body.open_setting_sidebar .setting_sidebar {
    right: 0px;
}

.setting_sidebar .title-head {
    background: #22232F;
    padding: 14px 15px;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.setting_sidebar .title-head span {
    color: #ffffff;
    font-size: 16px;
    opacity: 1;
}

.setting_sidebar .content-body {
    position: relative;
    padding: 15px 15px 48px;
    overflow: auto;
    height: calc(100vh - 44px);
}

.setting_sidebar .content-body .setting-item {
    position: relative;
    margin-bottom: 15px;
    border: 1px solid rgba(62, 69, 85, 0.30);
}

.setting_sidebar .setting-item .item-top {
    padding: 12px 15px;
    background: #F5F7FC;
    border-bottom: 1px solid rgba(62, 69, 85, 0.30);
}

.setting_sidebar .setting-item .item-top a {
    display: flex;
    align-items: center;
    text-decoration: none;
    gap: 10px;
}

.setting_sidebar .bt-title {
    font-size: 20px;
    margin-bottom: 20px;
    color: #39496B;
}

.setting_sidebar .setting-item a {
    text-decoration: none;
}

.setting_sidebar .setting-item .item-top a .fa-angle-right {
    margin-left: auto;
    opacity: 1;
    color: #56A8FE;
    font-size: 20px;
}

.setting_sidebar .setting-item .item-body {
    padding: 12px 15px;
    background: #ffffff;
}

.setting_sidebar .setting-item .item-body p {
    font-size: 14px;
    color: #3E4555;
    margin-bottom: 15px;
}

.setting_sidebar .setting-item .item-body p:last-child {
    margin-bottom: 0px;
}

.setting_sidebar .setting-item .item-body .links {
    display: flex;
    align-items: center;
}

.setting_sidebar .setting-item .item-body .links a {
    color: #56A8FE;
    font-size: 14px;
}

.setting_sidebar .setting-item .item-body .links a {
    border-right: 1px solid #56A8FE;
    padding-right: 5px;
    padding-left: 5px;
}

.setting_sidebar .setting-item .item-body .links a:first-child {
    padding-left: 0px;
}

.setting_sidebar .setting-item .item-body .links a:last-child {
    border-right: 0px;
    padding-right: 0px;
}


.btn-flex-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 10px;
    margin: 15px 0px 15px 0px;
}

.btn-flex-row .btn-box {
    position: relative;
    text-align: center;
}

.btn-flex-row .btn-box .btn {
    min-width: 180px;
    border-radius: 6px;
    padding: 15px 20px;
    margin-bottom: 5px;
    background: #d1d2d4;
    color: #939598;
}

.btn-flex-row .btn-box .btn.btn-orange {
    background: #f15929;
    color: #ffffff;
}

.btn-flex-row .btn-box .btn.btn-green {
    background: #44ae1f;
    color: #ffffff;
}

.btn-flex-row .btn-box .btn.btn-blue {
    background: #68a1d6;
    color: #ffffff;
}

.btn-flex-row .btn-box .btn.btn-gray {
    background: #d1d2d4;
    color: #939598;
}

.btn-flex-row .btn-box p {
    color: gray;
    text-transform: capitalize;
    font-size: 14px;
}

.orderTopSection {
    position: relative;
    flex-wrap: wrap;
    align-items: flex-start;
    margin: 0px -15px;
}

.orderTopSection .inter-his-box {
    flex: 0 0 50%;
    max-width: 50%;
    margin-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    border-top: 0px;
}

.orderTopSection .user-detail {
    flex: 0 0 50%;
    max-width: 50%;
    margin-bottom: 15px;
    padding-top: 40px;
    padding-left: 15px;
    padding-right: 15px;
}

.orderTopSection .ord-int-box {
    width: 100% !important;
}


@media only screen and (max-width: 1365px) {
    .product-supplier-detail .product-supplier--head .imag_tag_link {
        width: 170px;
    }
}

@media only screen and (max-width: 1200px) {
    .requestModal .modal-dialog {
        max-width: 97%;
        margin: 15px auto;
    }
}

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

    .rfq-row .rfq-content .action-col {
        position: absolute;
        top: 3px;
        right: 3px;
        height: auto;
        z-index: 1;
    }

    .rfq-row .rfq-header .rfq-th-all .action {
        flex: 0 0 calc(100% - 60px);
        max-width: calc(100% - 60px);
    }

    .rfq-row .rfq-header .up-img,
    .rfq-row .rfq-header .head-note,
    .rfq-row .rfq-header .head-quote {
        display: none;
    }

    .rfq-row .rfq-header .head-detail {
        text-align: left !important;
    }

    .rfq-row .rfq-header .rfq-th-all {
        flex: 0 0 100%;
        max-width: 100%;
        justify-content: flex-start;
        height: auto;
        border-left: 0px;
    }

    .rfq-row .rfq-content {
        align-items: flex-start;
    }

    .rfq-row .content-right {
        flex-wrap: wrap;
    }

    .rfq-row .rfq-content .note {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .rfq-row .rfq-content .pro-n {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .rfq-row .rfq-content .method,
    .rfq-row .rfq-content .quantity,
    .rfq-row .rfq-content .media-col {
        flex: 0 0 33.33%;
        max-width: 33.33%;
    }

    .rfq-row .rfq-content .up-img {
        border-bottom: 0px;
        height: 185px;
        flex-direction: column;
    }

    .rfq-row .rfq-content .note textarea {
        height: 150px !important;
    }

    .product-accordian #product-details--list .card-header .content-data .column {
        -ms-flex: 0 0 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
        border-right: 0px;
    }

    .no-data-box {
        padding: 30px 15px;
    }

    .no-data-box .img-box img {
        max-width: 200px;
    }

    .no-data-box p {
        font-size: 20px;
    }

    .requestModal .modal-header .modal-title {
        font-size: 20px;
    }

    .requestModal .modal-header {
        padding: 15px;
    }

    .requestModal .modal-body {
        padding: 15px 15px;
    }

    .requestModal .modal-footer {
        padding-left: 15px;
        padding-right: 15px;
    }

    .view-order-page .order-create-form .product-row .heading {
        font-size: 12px !important;
    }
}

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

    .create-order-page-new-ui .ecom-order-view-page {
        flex-wrap: wrap;
    }

    .create-order-page-new-ui .ecom-order-view-page .product-img figure {
        margin: 0 auto;
    }

    .create-order-page-new-ui .ecom-order-view-page .product-img {
        flex: 0 0 100% !important;
    }

    .create-order-page-new-ui .ecom-order-view-page.product-row>div {
        padding: 0;
        flex: 0 0 25%;
    }

    .create-order-page-new-ui .ecom-order-view-page.product-row .sub-total-col {
        flex: 0 0 100% !important;
    }


    .view-order-page .ecom-order-view-page.product-row .sub-total-col,
    .view-order-page .ecom-order-view-page.product-row .sub-total-col .heading {
        text-align: center !important;
    }

    .create-order-page-new-ui .ecom-order-view-page .product-img .heading {
        text-align: center !important;
    }

    .view-order-page .order-create-form .product-row .heading {
        font-size: 12px !important;
    }

    .view-order-page .ecom-order-view-page.product-row .desc {
        margin-bottom: 0px;
    }

    .spng-crr-trno-box.product-row.view-page {
        padding-bottom: 15px !important;
        margin-bottom: 15px !important;
    }

    /* .create-order-page-new-ui .png-crr-trno-inr .spng-no-box .shippingCarriers {
        width: 100% !important;
    } */

    .create-order-page-new-ui .png-crr-trno-inr .trk-no-box .form-control.tracking_num {
        max-width: 100% !important;
    }
}

@media only screen and (max-width: 767px) {
    .rfq-row .rfq-content {
        flex-wrap: wrap;
    }

    .rfq-row .content-right {
        flex: 0 0 100%;
        max-width: 100%;
        border-left: 0px;
    }

    .rfq-row .rfq-content .up-img {
        flex: 0 0 100%;
        max-width: 100%;
        border-right: 0px;
        height: auto;
    }

    .rfq-row .rfq-content .up-img img {
        max-width: 150px;
        margin: 0px auto;
    }

    .quotation-row .quotation-head .left,
    .quotation-row .quotation-head .right {
        flex: 0 0 100%;
        width: 100%;
        text-align: center !important;
    }

    .quotation-row .quotation-head .left {
        margin-bottom: 15px;
    }

    .quotation-row .quotation-content .img-box,
    .quotation-row .quotation-content .content-box {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 20px;
    }

    .quotation-row .quotation-content .content-box {
        border-top: 1px solid #CECFD0;
        border-left: 0px;
    }

    .title-section h1 {
        font-size: 36px;
    }

    .title-section p {
        font-size: 14px;
    }

    .product-supplier-detail .product-supplier--head h3 {
        font-size: 12px;
    }

    .product-supplier-detail .product-supplier--head .inn>h3 {
        flex: 0 0 100%;
    }

    .product-supplier-detail .product-supplier--head h3 strong {
        line-height: 20px;
        font-size: 14px;
    }

    .product-accordian #product-details--list .card-header .content-data .column>.d-flex>div {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .card-header .content-data .column label {
        margin-bottom: 5px;
    }

    .card-header .content-data .column div {
        margin-bottom: 20px;
    }

    .right-abs-buttons {
        position: relative;
        margin: 0 auto 15px;
        text-align: center;
        justify-content: center;
    }

    .tab-pane.overall_tab .right-abs-buttons {
        margin-top: 20px;
    }

    .btn-flex-row .btn-box .btn {
        min-width: 150px;
        padding: 15px 15px;
        font-size: 13px;
    }

    .btn-flex-row .btn-box p {
        font-size: 13px;
    }



}



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

    .rfq-row .rfq-content .method,
    .rfq-row .rfq-content .quantity,
    .rfq-row .rfq-content .media-col {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .requestModal .modal-header {
        flex-direction: column;
    }

    .requestModal .modal-header .left-head,
    .requestModal .modal-header .right-head {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 10px;
        width: 100%;
        text-align: center;
    }

    .requestModal .modal-header .right-head>.d-flex {
        justify-content: center;
    }

    .requestModal .modal-footer .btn {
        min-width: 130px;
    }

    .requestModal .modal-header .right-head .detail .sku {
        font-size: 15px;
    }

    .filter-row .search-filter .form-control {
        min-width: 180px;
    }

    .product-accordian #product-details--list .card-header .content-data .column {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        border-right: 0px;
    }

    .product-accordian #product-details--list .card-header .content-data .column>.d-flex {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .product-accordian #product-details--list .card-header .content-data .column>.responsive-full-width {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

}

@media only screen and (max-width: 575px) {
    .product-accordian #product-details--list .card-header .content-data .column>.d-flex>div {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .create-order-page-new-ui .ecom-order-view-page.product-row>div {
        flex: 0 0 50%;
    }


    .orderTopSection .inter-his-box {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .orderTopSection .user-detail {
        flex: 0 0 100%;
        max-width: 100%;
        padding-top: 10px;
    }


}


.navbar-nav .currency-rate-box {
    text-align: center;
    padding: 5px 10px;
    background-color: #120f13;
    border-radius: 10px;
    text-transform: none;
    color: #ffffff;
    overflow: hidden;
    font-size: 11px;
    line-height: 18px;
    font-weight: normal;
    min-width: 130px;
}

.navbar-nav .currency-rate-box .hit {
    color: #9fc54d;
}

.rfq-listing-page table td:nth-last-child(2) {
    text-align: center;
}

td.details-control,
td.details-controller .supplier-row td {
    cursor: pointer;
}

tr.shown td {
    background-color: #56A8FE !important;
    color: #fff !important;
}

#sales-person-volume-table tr td:nth-child(7),
#sales-person-volume-table tr th:nth-child(7) {
    border-right: 1px solid #dee2e6;
}

#product-volume-table_wrapper tr td:nth-child(5),#product-volume-table_wrapper td:nth-child(8),
#product-volume-table_wrapper tr th:nth-child(5),#product-volume-table_wrapper th:nth-child(8) {
    border-right: 1px solid #dee2e6;
}

#category-volume-table tr td:nth-child(4),
#category-volume-table tr th:nth-child(4) {
    border-right: 1px solid #dee2e6;
}

#customer-volume-table tr td:nth-child(4),
#customer-volume-table tr th:nth-child(4) {
    border-right: 1px solid #dee2e6;
}

tr.supplier-row {
    cursor: pointer;
}

.supplier-details .product-suppliers tr td {
    vertical-align: top;
    text-align: left
}

.product-rfq-suppliers table.product-suppliers .supplier-row-heading td {
    background: #e9e9e9 !important;
}

.child-product-dropdown .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: #56A8FE !important;
    border-color: #56A8FE !important;
    color: #fff !important;
    border-radius: 20px;
    margin-top: 10px;
    font-size: 14px;
    padding: 2px;
}

.child-product-dropdown .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    background: #56A8FE !important;
    color: #fff !important;
    float: right;
    padding-left: 5px;
}

.dark-theme .child-product-dropdown .select2-container--default .select2-selection--multiple {
    background: #1b1c1e !important;
    border-color: #555555 !important;
    height: 40px;
}

.dark-theme .elasticsearch-dropdown .fa {
    color: #ffffff !important
}

.child-product-dropdown .select2-selection--multiple .select2-search__field {
    padding-top: 0px !important;
    font-size: 14px !important;
    color: #3E4555;
}

.custom-select-box .select2-search__field {
    margin-top: 10px !important;
    font-size: 14px !important;
    padding-top: 0px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    padding: 0 10px !important;
}

.dark-theme .child-product-dropdown .select2-selection--multiple .select2-search__field {
    color: white;
    padding-top: 5px !important;
    font-size: 15px !important;
    color: #3E4555;
}

.child-product-dropdown .select2-container--default .select2-selection--multiple {
    background: #ffffff;
    border: 1px solid rgba(57, 73, 107, 0.3);
    border-radius: 0px;
    min-height: 40px;
    max-height: 100%;
}

.bootbox .modal-footer .btn.bookbox-yes-custom {
    /*    padding: 10px 28px 8px 20px;*/
}

.cs-checkbox .styled-checkbox {
    position: absolute;
    opacity: 0;
}

.cs-checkbox .styled-checkbox+label {
    position: relative;
    cursor: pointer;
    padding: 0;
}

.cs-checkbox .styled-checkbox+label:before {
    content: "";
    margin-right: 10px;
    display: inline-block;
    vertical-align: text-top;
    width: 20px;
    height: 20px;
    background: white;
    border: 1px solid rgba(62, 69, 85, 0.5);
    border-radius: 4px;
}

.cs-checkbox .styled-checkbox:hover+label:before {
    background: #56A8FE;
}

.cs-checkbox .styled-checkbox:focus+label:before {
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);
}

.cs-checkbox .styled-checkbox:checked+label:before {
    background: #56A8FE;
}

.cs-checkbox .styled-checkbox:disabled+label {
    color: #b8b8b8;
    cursor: auto;
}

.cs-checkbox .styled-checkbox:disabled+label:before {
    box-shadow: none;
    background: #ddd;
}

.cs-checkbox .styled-checkbox:checked+label:after {
    content: "";
    position: absolute;
    left: 5px;
    top: 9px;
    background: white;
    width: 2px;
    height: 2px;
    box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
    transform: rotate(45deg);
}

.rfq-table {
    position: relative;
}

.align-right_float-btn {
    position: absolute;
    top: 5px;
    height: auto;
    right: 0px;
    z-index: 1;
}

.no-search-table .float-right .dataTables_filter,
.no-search-table .float-left .dataTables_filter {
    display: none;
}

.spng-no-box p {
    margin-bottom: 0px;
}

.z-220 {
    z-index: 220 !important;
}

.fileUploadBox {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px;
    min-height: 250px;
    width: 100%;
    max-width: 500px;
    background: #f7f8fb;
    margin-bottom: 30px;
    transition: all 0.5s ease;
    overflow: auto;
    margin: 50px 0px;
    border: 1px dashed #56A8FE !important;
    background: rgba(86, 168, 254, 0.05);
    border-radius: 8px;
    overflow: hidden;
    text-align: center;
}

.fileUploadBox .uploaded_image {
    padding: 2px;
    border: 1px solid #dcdcdc;
    width: 100px;
    margin: 0px auto;
    margin-bottom: 15px;
}

.fileUploadBox .uploaded_image img {
    vertical-align: top;
    width: 100%;
}

.filelabel {
    width: 144px;
    overflow: hidden;
    margin: 0px auto;
    margin-bottom: 15px;
}

.filelabel [type="file"] {
    color: #878787;
}

.filelabel [type="file"]::-webkit-file-upload-button {
    background: #56A8FE;
    border: 1px solid #56A8FE;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    outline: none;
    padding: 12px 25px;
    text-transform: uppercase;
    transition: all 1s ease;
}

.elasticsearch-dropdown {
    position: relative;
    min-width: 200px;
    width: 100%;
}

.elasticsearch-dropdown .form-control {
    width: 100%;
    border-radius: 0px;
}

.elasticsearch-dropdown #elasticsearch-item-list {
    min-width: 420px;
    width: 100%;
    position: absolute;
    top: 100%;
    padding: 0px;
    z-index: 2;
    max-height: 260px;
    overflow: auto;
    height: auto;
    border-radius: 0px;
}

.elasticsearch-dropdown .fa-search {
    position: absolute;
    right: 10px;
    top: 10px;
    pointer-events: none;
    z-index: 1;
    color: #111111;
}

.elasticsearch-dropdown .fa-spinner {
    position: absolute;
    right: 10px;
    top: 10px;
    pointer-events: none;
    z-index: 1;
    color: #111111;
}

.elasticsearch-dropdown .form-control:focus~.fa-search {
    display: none;
}

.elasticsearch-dropdown #elasticsearch-item-list li {
    margin: 0px;
}

.elasticsearch-dropdown #elasticsearch-item-list li a {
    display: block;
    margin: 0px;
    padding: 10px 10px;
    font-size: 13px;
    line-height: initial;
}

/* New search Dropdown css */

.elasticsearch-dropdown .searchDropdown {
    width: 575px;
    position: absolute;
    background: #FFFFFE;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    padding: 0px;
    left: 0px;
    z-index: 2;
    top: 100%;
}

.searchDropdown .itemsBox .conRow {
    display: flex;
    margin: 0px -5px;
    justify-content: space-between;
    margin-bottom: 7px;
}

.searchDropdown .itemsBox {
    padding: 5px 15px 15px;
    position: relative;
    max-height: 405px;
    overflow: auto;
}

.searchDropdown .itemsBox .item .tag {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 2px;
    font-size: 14px;
    color: #797979;
    margin-bottom: 0px;
}

.searchDropdown .itemsBox .item {
    padding: 8px 0px;
    border-bottom: 1px solid #D3D3D3;
}

.searchDropdown .itemsBox .item:last-child {
    border-bottom: 0px;
}

.searchDropdown .itemsBox .conRow>div {
    padding: 0px 5px;
}

.searchDropdown .itemsBox .conRow * {
    font-size: 16px;
    color: #000000;
}

.searchDropdown .itemsBox .conRow .ref {
    flex: auto;
    line-height: initial;
}

.searchDropdown .itemsBox .conRow .dt-ref {
    flex: 0 0 270px;
    max-width: 270px;
}

.searchDropdown .itemsBox .conRow .price-ref {
    flex: 0 0 100px;
    max-width: 100px;
    margin-left: auto;
    text-align: right;
}

.searchDropdown .itemsBox .conRow p {
    margin-bottom: 0px;
    font-size: 13px;
    font-weight: 500;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    white-space: pre-wrap;
}

.conRow .price-ref h3 {
    color: #0A9531 !important;
}

.searchDropdown .itemsBox .conRow .ref a {
    color: #56A8FE !important;
    font-weight: 400;
    padding: 0px !important;
    height: auto !important;
}

.searchDropdown .itemsBox .conRow .ref h3 {
    font-size: 15px;
    font-weight: 700;
}

.elasticsearch-dropdown .searchDropdown .result-btn {
    text-align: center;
    display: block;
    padding: 18px 10px;
    color: #ffffff;
    font-weight: 600;
    background: #56A8FE !important;
}


.elasticsearch-dropdown .searchDropdown .result-btn:hover,
.elasticsearch-dropdown .searchDropdown .result-btn:active {
    color: #ffffff;
    background: #233d5a;
}

body.dark-theme .elasticsearch-dropdown .searchDropdown {
    background: #353439;
}

body.dark-theme .searchDropdown .itemsBox .conRow * {
    color: #ffffff;
}

/* Black theme */
body.dark-theme .product-accordian .accordion .card-body {
    background: #1b1c1e;
}

body.dark-theme .setting_sidebar {
    background: #393a3d;
}

body.dark-theme .setting_sidebar .setting-item .item-top {
    background: #2b2c34;
}

body.dark-theme .loader-out {
    background: #393945;
}

body.dark-theme .btn-cancel {
    background: #1b1c1e !important;
}

body.dark-theme .swal2-popup {
    background-color: #393945 !important;
}

body.dark-theme .in-status {
    background: #353439 !important;
}

body.dark-theme .text-label {
    color: #fff;
}



#vieworder span.span-success {
    display: inline-block;
    text-align: center;
    background: #44ae1f;
    color: #ffffff;
    padding: 6px 10px;
    font-size: 12px;
    border-radius: 7px;
    margin-top: 3px;
}

#vieworder span.span-blue {
    display: inline-block;
    text-align: center;
    background: #56A8FE;
    color: #ffffff;
    padding: 6px 10px;
    font-size: 12px;
    border-radius: 7px;
    margin-top: 3px;
}

#vieworder span.span-danger {
    display: inline-block;
    text-align: center;
    background: #f3b7bb;
    color: #ef2239;
    padding: 6px 10px;
    font-size: 12px;
    border-radius: 7px;
    margin-top: 3px;
}

#approval-form .warning-delivery-priorty{
    background: #fad1dc;
    border:none;
    border-left: 15px solid #ee1d2a !important;
    margin-left: 15px;
    padding: 5px;
    margin-bottom: 10px;
}

#markAsReceivedModal #submitAddStock{
    margin-left: -20px;
}

.invoicestatusRow {
    justify-content: space-between;
    flex-wrap: nowrap;
    flex: 0 0 100%;
    max-width: 100%;
}

.in-status {
    font-size: 13px;
    background: #f5f5f5;
    padding: 10px;
    border-radius: 5px;
}

.in-status label {
    display: inline-block;
    text-align: center;
    background: #44ae1f;
    color: #ffffff;
    padding: 6px 10px;
    font-size: 12px;
    border-radius: 7px;
    margin-top: 3px;
}

.in-status label.label-danger {
    background: #f3b7bb;
    color: #ef2239;
}

.in-status label.label-warning {
    background: #E8AD14;
    color: #FFE6B9;
}

.tagsForm .form-group label {
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 500;
}

.tagsForm .form-group input#tagColor {
    width: 40px;
    padding: 5px;
    flex: 0 0 40px;
    max-width: 40px;
}

.flex-1 {
    flex: 1;
}

.tag-list-modal .modal-body {
    overflow: auto;
    max-height: calc(100vh - 190px);
}

#customerTagsModal.tag-list-modal .modal-body {
    overflow: auto;
    max-height: calc(100vh - 190px);
}

.tagify__input::after {
    top: -15px !important;
    position: relative;

}

.tagify--loading .tagify__input:after {
    margin-left: 0;
    top: 4px !important;
}


.fs-24px {
    font-size: 24px;
}

.fs-18px {
    font-size: 18px;
}

.min-w-100px {
    min-width: 100px;
}

/* last child sticky */
.last-child-sticky .dropdown-menu .inner li:last-child {
    position: sticky;
    bottom: 0;
}

.last-child-sticky .dropdown-menu .inner li:last-child .dropdown-item,
.last-child-sticky .dropdown-menu .inner li:last-child .dropdown-item:hover {
    background: #56A8FE !important;
    color: #fff !important;
    text-align: center;
}


/* ========================= editor customization : Start  =========================*/
.ck-editor__main h1 {
    font-size: 2em !important;
}

.ck-editor__main h1 {
    font-size: 2em;
    line-height: 1.2;
}

.ck-editor__main h2 {
    font-size: 1.5em;
    line-height: 1.3;
}

.ck-editor__main h3 {
    font-size: 1.17em;
    line-height: 1.4;
}

.ck-editor__main h4 {
    font-size: 1em;
    line-height: 1.5;
}

.ck-editor__main h5 {
    font-size: 0.83em;
    line-height: 1.6;
}

.ck-editor__main h6 {
    font-size: 0.67em;
    line-height: 1.7;
}

/* List style */

.ck-editor__main .ck-content ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
    unicode-bidi: isolate;
    list-style-type: disc;
}

.ck-editor__main .ck-content ul li {
    display: list-item;
    text-align: -webkit-match-parent;
    unicode-bidi: isolate;
    list-style-type: disc;
}

.ck-editor__main .ck-content ul li::marker {
    unicode-bidi: isolate;
    font-variant-numeric: tabular-nums;
    text-transform: none;
    text-indent: 0px !important;
    text-align: start !important;
    text-align-last: start !important;
}

.ck-editor__main .ck-content ol {
    display: block;
    list-style-type: decimal !important;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
    unicode-bidi: isolate;
}

.ck.ck-editor__main .ck-content ol li {
    list-style: decimal !important;
}


/* DL DD list */

.ck.ck-editor__main .ck-content dl {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
}

.ck.ck-editor__main .ck-content dd {
    display: block;
    margin-inline-start: 40px;
    unicode-bidi: isolate;
}

.filter-active,
.button-filter-active {
    position: absolute;
    width: 12px;
    height: 12px;
    background: #F44336;
    border-radius: 50%;
    top: -2px;
    right: -5px;
    border: 2px solid #fff;
}

.button-filter-active {
    top: 7px;
    right: 13px;
}

/*.select2-container .select2-dropdown {
    z-index: 998 !important;
}*/

.min-w-190px {
    min-width: 190px !important;
}

.min-w-150px {
    min-width: 150px !important;
}

.min-max-w-100px {
    min-width: 100px;
    max-width: 100px;
    min-height: 100px;
    max-height: 100px;
}


.split-order-modal .modal-dialog {
    width: 1000px !important;
}

.split-order-modal input.form-control.qty {
    height: 38px;

}
.split-order-modal .table-responsive {
    min-height: auto !important;
    overflow-y: auto !important;
}

.split-order-modal .custom-table tbody td,
.split-order-modal .custom-table1 tbody td {
    vertical-align: top;
}
/*.split-order-modal .split-qty {
    margin-top: 13px;
}*/

.split-order-modal .custom-table .error-qty {
    margin-top: 2px;
}

.sp-product-name,
.sp-sku-name
 {
    max-width: 220px;
    display: block;
    word-wrap: break-word;
}

.optinal-product-check {
    margin-left: 8px;
}
.switch-box-sm,
.optinal-product-check .switch {
    zoom: 68%;
}

.opt-main{
    display: flex; align-items: center;
}

/* ========================= editor customization : End  =========================*/

@media (min-width: 1280px) {
    .elasticsearch-dropdown #elasticsearch-item-list {
        min-width: 200px;
        width: 100%;
    }
}

@media (max-width: 1575px) {
    .elasticsearch-dropdown .searchDropdown {
        left: initial;
        right: 0px;
    }
}

@media (max-width: 991px) {
    .elasticsearch-dropdown .searchDropdown {
        width: 100%;
    }

    .searchDropdown .itemsBox {
        max-height: 220px;
        width: 100%;
    }

    .searchDropdown .itemsBox .conRow {
        flex-wrap: wrap;
        gap: 5px
    }
}

@media (max-height: 430px) {
    .elasticsearch-dropdown .searchDropdown {
        top: initial;
        bottom: 100%;
    }
}
/* Order page Addon  radio box styling */
.configure-setting-box .addon-radio-filter {
    border: 1px solid rgba(57, 73, 107, 0.3);
    padding: 10px;
}
.configure-setting-box .addon-radio-filter > div {
    max-height: 85px;
    overflow-y: auto;
}
.configure-setting-box .addon-radio_box {
    gap: 8px;
    align-items: flex-start;
}
.configure-setting-box .addon-radio_box input[type=radio] {
    margin-top: 4px;
}
.configure-setting-box .addon-radio-filter > div >* + * {
    margin-top: 4px;
}
.configure-setting-box .addon-radio-filter label {
    width: 15ch;
    word-wrap: break-word;
}
.configure-setting-box .addon_selecter .dropdown-menu > .inner {
    max-height: 160px !important;
}
.configure-setting-box .addon_selecter.addon_new .dropdown-toggle {
        height: 40px;
        padding: 10px 10px;
}
select.pe-none {
    pointer-events: none;
}
.configure-setting-box .option-pricing {
    display:flex;
    align-items: stretch;
}
.configure-setting-box .option-pricing .heading{
    word-break: break-word;
}

/* Option addon group CSS 13/12/24 */
.option-group_container .panel-body{
    border-radius: 10px;
}
.option-group_container {
    /* min-height: calc(100vh - 110px);
    min-height: calc(100dvh - 110px); */
}
.option-group_title .title{
    font-size: 20px;
    padding: 0px 8px 8px 0px;
    border-bottom: 1px solid #57A8FE;
    width: fit-content;
}
.option-group_header .option-group_input input,select {
    width: 210px;
    max-width: 100%;
    min-width: 180px;
}
.option-group_header > div:first-child {
    gap: 16px 24px;
    flex-wrap: wrap;
}
.option-group_table {
    background-color: #F5F7FD;
    border-radius: 10px;
}
.option-group_table .table :is(thead th, tbody td) {
    vertical-align: middle;
}
.option-group_table tbody td {
    padding-block: 20px;
}
.option-group_table td:has(.option-group_input) {
    width: 180px;
}
.option-group_input input,
.option-group_block .option-group_input input{
    border-radius: 5px !important;
    min-width: 150px;
}

.option-group_block .option-group_input select{
    border-radius: 5px !important;
    min-width: 210px;
    padding: 6px 12px;
    min-height: 40px;
}

.option-action_btn,
.option-action_btn:active,
.option-action_btn:focus,
.btn-unset,
.btn-unset:active,
.btn-unset:focus {
    all: unset;
    outline: none;
    cursor: pointer;
}
.option-group_table :is(thead, tbody) :is(tr, th, td) {
    border: none;
    background-color: #F5F7FD;
}
.option-group_table :is(thead, tbody) :where(thead tr,tbody tr:not(:last-child)) {
    border-bottom: 1px solid #EBEEF9 !important;
}
.option-add-btn_group button {
    max-width: 135px;
    width: 100%;
}
/* radio button styling */
.custom-check_btn input[type=checkbox]:checked+.slider {
    background-color: #7AA22E;
}
.custom-check_btn input[type=checkbox]:checked+.slider:before {
   background-color: #fff   ;
}
/* side panel styling */
.option-group_container #accordion >* + * {
    margin-top: 20px;
}
main:has(.option-group_container) {
    position: relative;
}
.option-group_block .accordian-btn {
    all: unset;
    cursor: pointer;
}
.accordian-btn img {
    transition: 0.3s ease;
}
.accordian-btn img{
    transform: rotateX(0deg);
}
.accordian-btn.collapsed img{
    transform: rotateX(180deg);
}


/* --- Side panel styling --- */
/* Price modal styling */
body:has(.option-group_modal) {
    --menu-height: 70px;
}
body:has(.dark-theme) html{
    color-scheme: dark;
}
.option-group_modal,
.modal-backdrop.show,
.option-group_modal .modal-dialog  {
    top: var(--menu-height);
}
.option-group_modal .modal-dialog{
    position: fixed;
    top: var(--menu-height);
    right: 0;
    max-width: 585px;
    width: 100%;
    bottom: 0;
    transform: translateX(100%);
    transition: 0.3s linear;
    margin-block: 0px;
}
.option-group_modal .modal.show .modal-dialog{
    transform: translateX(0%);
}
.option-group_modal .modal-content {
    padding: 30px clamp(1.5rem, -0.5769rem + 4.3269vw, 3.75rem);
}
.option-group_modal .modal-add_btn {
    padding: 16px 0 24px 36px;
    border-top: 1px solid #EBEEF9;
}
.option-group_table div:has(>table) {
    max-height: calc(100vh - 380px);
    overflow: auto;
    min-height: 140px;
}
/* image modal styling */
.image-upload_box {
    max-width: 150px;
    width: 100%;
    aspect-ratio: 1;
    display: grid;
    place-content: center;
    grid-template-areas: 'stack-image';
    border-radius: 5px;
    background-color: #F5F7FD;
    cursor: pointer;
    transition: 0.45s ease;
    font-size: 12px;
    text-wrap: balance;
    overflow: hidden;
}
.image-upload_box :is(img.uploaded-img),
.img-placeholder_box {
    grid-area: stack-image;
    place-self: center;
}
.image-upload_box:has(.uploaded-img:not(.d-none)) .img-placeholder_box {
    display: none;
}
.image-upload_box.drag-over,
.image-upload_box:hover {
    box-shadow: 0 0 8px 1px #eaeaea;
}

@media (max-width:767px) {
    body:has(.option-group_modal) {
        --menu-height: 55px;
    }
}
/* === Dark theme styling 16/12/24 === */
html:has(body.dark-theme) {
    color-scheme: dark;
}
body.dark-theme .option-group_table .table tr td {
    border: none !important;
}
body.dark-theme .option-group_block :not(.btn):is(button,a ) > img,
body.dark-theme .delete-table_row img,
body.dark-theme .btn-unset[data-dismiss] img {
    filter: invert(1);
}
body.dark-theme :is(.modal-backdrop, .image-upload_box) {
    background-color: #3a3a3a;
}
body.dark-theme .option-group_table .slider{
   background-color: transparent;
   border: 1px solid #555555;
}
body.dark-theme .option-group_table .slider:before {
    background-color: #56A8FE;
}
body.dark-theme .option-group_table,
body.dark-theme .option-group_table :is(thead, tbody) :is(tr, th, td){
    background-color: #343434 !important;
}
body.dark-theme .option-group_table :is(thead, tbody)>tr {
    border: none;
}
body.dark-theme .option-group_modal .modal-add_btn {
    border-color: #555555;
}
ab.test{
    display: none;
}
/* Lead tab assignment badges (All / Assigned / Not Assigned) */
.lead-assignment-badge {
    font-weight: 500;
}

.lead-assignment-badge .lead-badge-count {
    font-weight: 500;
}

/* Lead tab badges – round count (circle with number) */
.lead-badge-count {
    background: #fff;
    border: 1px solid #adb5bd;
    border-radius: 50%;
    box-sizing: border-box;
    height: 20px;
    padding: 0 4px;
    font-size: 12px;
    font-weight: 600;
    display: inline-flex;
    min-width: 20px;
    align-items: center;
    justify-content: center;
    color: #495057;
}

/* AutoQuote sub-tab assignment badges (Unassigned / Assigned / Deleted) —
   dedicated classes that mirror the Lead badge design without sharing or
   modifying the Lead classes, so the Lead badges stay unaffected. */
.auto-quote-assignment-badge {
    font-weight: 500;
}

.auto-quote-assignment-badge .auto-quote-badge-count {
    font-weight: 500;
}

/* AutoQuote sub-tab badges – round count (circle with number) */
.auto-quote-badge-count {
    background: #fff;
    border: 1px solid #adb5bd;
    border-radius: 50%;
    box-sizing: border-box;
    height: 20px;
    padding: 0 4px;
    font-size: 12px;
    font-weight: 600;
    display: inline-flex;
    min-width: 20px;
    align-items: center;
    justify-content: center;
    color: #495057;
}

/* CSS for DO not REORDER badge */
.do_not_reorder{
    border-radius: 15px;
    color: #fff;
    min-width: 80px;
    padding: 4px 8px;
    font-size: 11px;
    font-weight: normal;
    background-color: #ff0000;
}

.do_not_reorder_block {
    padding: 15px 8px;
}
.create-order-page-new-ui .product-row.product-discount-added :is(.product-subtotal,.add-more),
.product-row.cus-row > :is(.product-subtotal,.add-more){
    flex: 1 !important;
}
@media (min-width: 768px) {
    .product-list-table:has(.do_not_reorder_block) .product-price-each {
        min-width: 106px;
    }

    .product-list-table:has(.do_not_reorder_block) .product-img {
        min-width: 86px;
    }
    .product-supplier .opt-main {
        flex-wrap: wrap;
    }
    .add-more .configure-check {
        right:0;
    }
}
@media (min-width: 1025px) and (max-width: 1200px){
    .product_detail_page .add-more {
        flex: 1 !important;
    }
    .product_detail_page .product-row .product-img {
        flex: 0 0 9% !important;
    }
    .product_detail_page .product-row .product-supplier {
        flex: 0 0 27% !important;
        max-width: 27% !important;
    }
    .product_detail_page .product-name{
        max-width: 170px;
    }
    .product-row.product-discount-added .product-name  {
        max-width: 143px;
    }
}
@media (min-width: 768px) and (max-width: 1200px){
    .product_detail_page .product-qa  {
        min-width: 90px;
    }
    .add-more .configure-check {
        text-align: center;
    }
}
.product_volume_block tr td:first-child img {
    aspect-ratio: 1;
    width: 50px
}
.product_volume_block.custom-table tbody td a {
    min-width: 25ch;
    white-space: normal;
    line-height: 1.5;
}
.product_volume_block thead tr th {
   font-size: 14px;
}
.product-volume-btn-gp {
    position: absolute;
    gap:1rem;
    right: 0;
}
.product-volume-btn-gp .right-abs-buttons  {
    position: unset;
    margin: 0;
}
@media (max-width: 650px) {
    .product-volume-btn-gp {
        position: unset;
    }
}
.product_volume_block:has(.sbp-table-datestamp-block) {
    border: none;
}
.sbp-table-datestamp-block {
    background-color: transparent;
    border: none;
    text-align: center;
}

#customer-tag-volume-table tr td:nth-child(4),
#customer-tag-volume-table tr th:nth-child(4) {
    border-right: 1px solid #dee2e6;
}

#reporting-manager-volume-table tr td:nth-child(4),
#reporting-manager-volume-table tr th:nth-child(4) {
    border-right: 1px solid #dee2e6;
}

/* Overall report page CSS */
:is(.overall_tab, .sales-graph-header) .ins-dtrng-box {
    display: flex;
    align-items: center;
    white-space: nowrap;
    gap: 0.125rem;
}
#sale-by-user-draw-graph #user-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-block: 12px;
}
#sale-by-user-draw-graph .sales-graph-header {
    gap: 10px;
}
#sale-by-user-draw-graph .user-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
}
#sale-by-user-draw-graph .color-circle {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    display: inline-block;
}
.graph-compare-line {
    max-width: 500px;
    column-gap: 20px;
}
.graph-compare-line .graph-line  {
    column-gap: 20px;
}
.graph-compare-line .line-element {
    width: 100px;
    border: 2px solid #24197F;
}
.graph-compare-line .compare-line .line-element {
    border: 2px dashed #24197F;
   font-size: 28px;
}
.order-failed-order-tab .date-box-tooltip {
    border: 0px !important;
    padding: 0px 1px;
}

.order-failed-order-tab table .color-square {
    width: 10px;
    height: 32px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 10px;
}

.failed-list-icon {
    color: #ec1c24 !important;
}
.bulk-actn-grpsbox .dropdown-content.dropdown-menu {
    max-height: calc((100svh / 2.25) - 2rem);
    overflow-y: auto;
    scrollbar-width: thin;
}

#submit-restore-failed-orders {
    text-align: left;
    border: none;
    background: #fff;
    color: #56A8FE;
    padding: 10px 15px;
    text-decoration: none;
    display: block;
    font-size: 14px;
    margin: 0;
    width: 100%;
    cursor: pointer;
}

body.dark-theme #submit-restore-failed-orders {
    background: #22232f !important;
    color: #56A8FE !important;
}

body.dark-theme #submit-restore-failed-orders:hover {
    background: #353439 !important;
    color: #dadada !important;
}
/* When open Modal, set blur to background */
.modal-open .modal {
    background-color: rgba(0, 0, 0, 0.5);
}

/* Bulk Change Status Modal Styles */
.ecom-bulk-status-options {
    display: none;
}

.ecom-bulk-status-options.show {
    display: block;
}

.ecom-bulk-hold-until-date {
    display: none;
}

.ecom-bulk-hold-until-date.show {
    display: block;
}

.custom-dropzone.min-h-165 {
    min-height: 165px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed #cacaca;

}

.create-order-page .packaging-information-dd p.title {
    font-size: 16px;
    margin-bottom: 0;
}

.packaging-information-dd {
    padding-left: 7.8%;
}
.text-red-title {
    color: #FF0707 !important;
}

.w-135 {
    width: 135px;
    flex: none !important;
}
.min-w-100 {
    min-width: 100%;
}
.akg-trkng-no.dlrsign-box.w-135 .currency {
    padding-left: 20px !important;
}

.addon-swich-box.optinal-product-check {
    height: 20px;
}
.label-barcode-links a {
    font-size: 14px;
}
.packaging-information-dd .custom-dropzone {
    min-height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed #cacaca;
}
.product-price-each .heading,
.product-subtotal .heading,
.product-name .heading {
    white-space: nowrap;
}
.product-img .heading {
    min-width: 90px;
}
.create-order-page-new-ui .product-row .action-add-more {
    flex: 1 !important;
}

.pdf-download-box {
    width: 65px;
    text-align: center;
}
.pdf-download-box .img-fluid {
    height: 28px;
}

.pdf-download-box p {
    font-size: 11px;
    line-height: 100%;
    white-space: pre-line;
    width: 100%;
    min-height: 22px;
    display: block;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pdf-grpup-box {
    min-width: 233px;
     max-width: 233px;
    overflow: auto;
    padding: 0 10px;

}
.pdf-grpup-box-inner {
    overflow: auto;
    scrollbar-width: thin;
}
.product-name.order-requrst-title-box .heading {
    width: 220px;
    white-space: normal;
}
.brn-link-blue,
.brn-link-blue:hover {
    color: #00ADEE;
    font-size: 13px !important;
}
.fs-14 {
    font-size: 14px;
}
.create-order-page-new-ui .dlr-box {
    min-width: 110px;
}
.lable-checkbox-set .fancy-checkbox span {
    max-width: 110px;
}

.lable-checkbox-set .fancy-checkbox {
    position: absolute;
    margin-top: -3px;
}
.total-price-p {
    width: 230px;
}
.packaging-information-dd .upload-txt,
.dropzone-box-packaging .upload-txt {
    margin-top: 10px;
    line-height: 18px;
}
.packaging-information-dd .dropzone.custom-dropzone {
    margin-bottom: 0;
}

.custom-dropzone .dz-preview {
    margin: 0 !important;
}

.inventoryStatus-div .date-box-tooltip {
    margin-bottom: 3px;
}

.pkg-req-section {
    min-width: 200px;
    max-width: 200px;
}
.ship-details-box {
    width: 274px;
}

.product-row.cus-row .product-row.cus-row {
    overflow: visible;
}


.create-order-page-new-ui .product-row.product-discount-added :is(.product-subtotal,.add-more),
.create-order-page-new-ui .product-row1>:is(.product-subtotal,.add-more) {
    flex: 1 !important;
}


.acknowledge-list-table .product-row.approval-row {
    align-items: flex-start;
    padding: 10px;
}
.mt-64px {
    margin-top: 64px;
}

.ml-40px {
    margin-left: 40px;
}

/* .supplier-to-fill-left-col-hide condition 1 */

.acknowledge-list-table .product-row.supplier-to-fill-left-col-hide .pro-note-box {
    flex: 0 0 20%;
}
.acknowledge-list-table .product-row.supplier-to-fill-left-col-hide .akg-mark-shiped  {
      flex: 0 0 11%;
      justify-content: center;
}

.acknowledge-list-table .product-row.supplier-to-fill-left-col-hide .product-qty {
    flex: 0 0 18% !important;
}


/* in-production-left-col-hide condition 2 */
.acknowledge-list-table .product-row.in-production-left-col-hide .product-qty {
    flex: 0 0 22% !important;
}


/* traking-no-left-col-hide condition 3 */

.acknowledge-list-table .product-row.traking-no-left-col-hide .product-name {
    flex: 0 0 28% !important;
}

.acknowledge-list-table .product-row.traking-no-left-col-hide .pro-note-box {
    flex: 0 0 20%;
}

.acknowledge-list-table .product-row.traking-no-left-col-hide .product-qty {
    flex: 0 0 20% !important;
}

.product_detail_page .parsley-required {
    font-size: 13px;
}

.create-order-page-new-ui .product-discount-added .dlr-box {
    width: 100%;
    min-width: 70px;
}

.acknowledge-list-table .product-row.approval-row.con-row:after {
    content: "";
    width: 100%;
    position: absolute;
    width: calc(100% - 30px);
    height: 1px;
    background: #DEDEDF;
    margin-top: -11px;
    left: 15px;
    right: 0;
}
.packaging-information-view {
    max-height: 160px;
    overflow-y: auto;
}
.pdf-grpup-box-view .pdf-download-box p {
    font-size: 13px;
    min-height: 27px;
}

.pdf-grpup-box-view .pdf-download-box .img-fluid {
    height: 70px;
    width: 70px;
}
.pdf-grpup-box-view  .pdf-download-box {
    width: 89px;
    text-align: center;
}
.pdf-grpup-box-view .btn-link  {
    font-size: 15px !important;

}
.save-send-btn img.position-absolute {
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    vertical-align: middle;
}
.save-send-btn #save-order {
    padding: 10px 22px 10px 45px;
}

.order-quote-table-content .table-responsive {
    min-height: 500px !important;
}

/* YOUR FINAL ORDER APPROVAL */

.final-order-approval.aproval-conbox {
    padding: 25px 50px 0 50px;
}

.aprval-footer .container, .approval-header .container {
    max-width: 1660px !important;
    margin: 0 auto;
    padding: 0 40px;
}


.table-responsive.min-h-auto {
    min-height: auto !important;
    margin-bottom: 30px;
}

.container-fluid.ord-cnfrm-bg.aproval-form.py-4 {
    padding: 0 40px;
}
.product-name.w-100.mw-100 {
    min-width: 270px;
}

.green-light-btn {
    background-color: #00A551;
}

.btn-rounded-fill {
    color: #fff;
    font-size: 15px !important;
    font-weight: 500;
    border-radius: 30px;
    box-sizing: border-box;
    height: 41px !important;
    display: inline-block;
    line-height: 41px !important;
    padding: 0 24px !important;
    font-family: 'Poppins', sans-serif !important;
}

.blue-light-btn {
    background-color: #56A8FE;
}

/* select2 customize */
body .select2-container--default .select2-selection--single {
    border-radius: 0;
}
body .select2-container--default .select2-selection--single
.select2-selection__placeholder {
    color: #000;
}
body.dark-theme .select2-container--default .select2-selection--single
.select2-selection__placeholder {
    color: #fff;
}
.product-subtotal .select2-container--default
.select2-selection--single .select2-selection__rendered {
    font-size: 12px;
}
.product-subtotal .select2-container {
    width: 122px !important;
}

body .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #56a8fe;
    border: 1px solid #56a8fe;
    color: #ffffff;
}
.btn-h-40px {
    height: 40px;
}
.gap-20px{
    gap: 20px;
}
.product-subtotal .select2-results__option {
    padding: 7px 10px !important;
    font-size: 11px !important;
}
.product-sea-freight-toggle {
    min-width: 140px;
    display: flex;
    flex-direction: column;
    padding-left: 10px;
}


.sea-freight-container-select  {
    margin-bottom: 10px;
    zoom: 80%;
    max-width: 170px;
    padding-left: 10px;
}


body .bootstrap-select>select {
    left: 0 ;
}

.select2-error {
    display: flex;
    flex-direction: column;
}
.parsley-errors-list {
    order: 3;
}

.sea-freight-container-select .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 25px;
    color: #3E4555;
    font-size: 14px;
}

/* Style subtext in red for sea freight container dropdown */
.sea-freight-container-select .bootstrap-select .dropdown-menu li small {
    color: #dc3545 !important;
    font-size: 12px;
    display: block;
    margin-top: 2px;
}

.sea-freight-container-select .bootstrap-select>.dropdown-toggle:after {
    margin-top: -1px;
    top: 7px;
}

/* Sea Freight Badge on Order View Page */
.sea-freight-badge {
    display: inline-flex;
    background-color: #56a8fe;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    margin-top: 5px;
    white-space: nowrap;
    gap: 5px;
    flex-direction: column;
}

.sea-freight-container-select.custom-select-box:before
{
    top : 11px;
}

.select2-error {
    display: flex;
    flex-direction: column;
}
.select2-error .parsley-errors-list {
    margin: 0;
}

/* input-group-date-with-error  */
.input-group-date-with-error {
    width: 100%;
    flex-wrap: wrap;
}
.input-group-date-with-error .parsley-errors-list {
    width: 100%;
    order: 3;
}

.input-group-date-with-error .parsley-errors-list .parsley-required {
    margin-top: 0;
}

.btn-h-40px {
    height: 40px !important;
}



@media only screen and (min-width: 1200px) {
    .h-md-100 {
        height: 100% !important;
    }
}


@media only screen and (min-width: 1600px) {
    .acknowledge-list-table .product-name {
        flex: 0 0 20% !important;
    }
    .acknowledge-list-table .pro-note-box {
        flex: 0 0 14%;
    }
    .acknowledge-list-table .product-qty {
        flex: 0 0 11% !important;
    }
    .acknowledge-list-table .product-row.traking-no-left-col-hide .pro-note-box {
        flex: 0 0 20%;
    }
}


@media only screen and (max-width: 1600px) and (min-width: 767px) {
    .product-list-table.acknowledge-list-table {
        margin-top: 20px;
        overflow: auto;
    }
}

@media (max-width: 767px) {
    .packaging-information-dd {
       padding: 0 15px;
    }
    .pdf-grpup-box {
        min-width: 100%;
        max-width: 100%;
    }
    .product-row  .ship-details-box .heading {
        min-width: 100px;
    }
    .total-price-p {
        width: 100%;
        text-align: left !important;
    }
    .acknowledge-list-table .product-qty {
        margin-top: 0 !important;
    }
    .aprv-ordr-dtls-box .product-list-table.acknowledge-list-table .product-row,
    .aprv-ordr-dtls-box .product-list-table.acknowledge-list-table .product-row:last-child{
        flex-direction: column;
        padding: 15px !important;
    }
    .acknowledge-list-table .product-row.supplier-to-fill-left-col-hide .akg-mark-shiped {
        justify-content: flex-start;
        margin-top: 10px;
        align-items: flex-start;
    }
    .ship-details-box {
        width: 100%;
    }
    .product-name.order-requrst-title-box .heading {
        width: 100%;
        white-space: normal;
    }
    .pkg-req-section {
        min-width: 100%;
        max-width: 100%;
    }

    .packaging-information-box {
       width: 100%;
    }

     .packaging-information-box .col-md-4 > div:first-child {
        margin-bottom: 15px;
    }
    .packaging-dropzone-box .dz-message.custom-message,
    .packaging-information-box  .dz-message.custom-message {
        box-sizing: border-box !important;
        max-width: 100%;
        white-space: normal;
        transition: none;
        min-width: 100%;
    }
    .product-sea-freight-toggle {
        padding: 0 10px;
        margin-bottom: 10px;
    }


}

/* Order item image trigger: hover blur + "Click to update image" overlay */
.order-item-image-upload-trigger {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.order-item-image-upload-trigger img {
    transition: filter 0.2s ease;
    display: block;
    width: 100%;
}
.order-item-image-upload-trigger:hover img {
    filter: blur(4px);
}
.order-item-image-upload-trigger::after {
    content: "Click to update image";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.35);
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    text-align: center;
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
}
.order-item-image-upload-trigger:hover::after {
    opacity: 1;
}
.quote-add-note-icon {
    font-size: 20px;
    color: #007bff;
}

/* Quote Notes Popover Styles */
.quote-notes-wrapper {
    position: relative;
}

.quote-note-popover {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1050;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
    min-width: 320px;
    margin-top: 5px;
}

.quote-note-popover-header {
    background-color: #4a5568;
    color: #fff;
    padding: 8px 12px;
    border-radius: 8px 8px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.quote-note-popover-title {
    font-weight: 600;
    font-size: 14px;
}

.close-quote-popover {
    color: #fff;
    font-size: 13px;
    text-decoration: none;
}

.close-quote-popover:hover {
    color: #fff;
    text-decoration: none;
}

.quote-note-popover-body {
    padding: 12px;
}

.quote-note-input-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
}

.quote-note-input {
    flex: 1;
    min-width: 300px;
    border-radius: 4px;
    border: 1px solid #ced4da;
    padding: 8px 12px;
    font-size: 14px;
}

.quote-note-input-wrapper .submit-quote-note-inline {
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 13px;
    min-width: 50px !important;
    line-height : 26px !important;
}

.quote-note-footer {
    display: flex;
    justify-content: space-between;
    margin-top: 4px;
}

.quote-note-inline-error {
    font-size: 12px;
    min-width: 50px;
}

.quote-note-char-counter {
    font-size: 12px;
    color: #6c757d;
}


/* Quote follow-up status (traffic signal) indicators */
.follow-up-status-indicators {
    gap: 2px;
}
.follow-up-status-indicator {
    width: 25px;
    height: 25px;
    border: 1px solid #333;
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
    transition: opacity 0.15s ease;
}
.follow-up-status-indicator:hover {
    opacity: 0.9;
}
.follow-up-status-indicator.follow-up-green.active { background-color: #28a745; }
.follow-up-status-indicator.follow-up-green.off { background-color: #e8f5e9; }
.follow-up-status-indicator.follow-up-yellow.active { background-color: #ffc107; }
.follow-up-status-indicator.follow-up-yellow.off { background-color: #fffde7; }
.follow-up-status-indicator.follow-up-red.active { background-color: #dc3545; }
.follow-up-status-indicator.follow-up-red.off { background-color: #ffebee; }
/* When status is 3 (max) the indicators are read-only, but they must keep receiving
   hover so each dot still shows its own follow-up tooltip. Pointer events therefore
   stay enabled — the click itself is blocked in js/orders/follow_up_status.js. */
.follow-up-status-indicators.follow-up-status-disabled .follow-up-status-indicator {
    cursor: default;
}
.follow-up-status-indicators.follow-up-status-disabled .follow-up-status-indicator:hover {
    opacity: 1;
}

/* Order item image upload modal — dropzone (browse / drag / paste -> same frame turns into cropper) */
.order-item-image-dropzone {
    border: 2px dashed #c0c4cc;
    border-radius: 6px;
    background: #fafafa;
    padding: 28px 16px;
    text-align: center;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease;
}
.order-item-image-dropzone:hover,
.order-item-image-dropzone:focus {
    border-color: #2d8cf0;
    background: #f4f9ff;
    outline: none;
}
.order-item-image-dropzone.is-dragover {
    border-color: #2d8cf0;
    background: #eaf4ff;
}
.order-item-image-dropzone.has-image {
    cursor: default;
    padding: 12px;
    background: #fff;
    border-style: solid;
    border-color: #e5e7eb;
}
.order-item-image-dropzone.has-image:hover,
.order-item-image-dropzone.has-image:focus {
    border-color: #e5e7eb;
    background: #fff;
}
.order-item-image-dropzone-text {
    color: #6b7280;
    font-size: 14px;
}
.order-item-image-dropzone-filename {
    word-break: break-all;
}
.order-item-image-dropzone .order-item-crop-container {
    max-height: 360px;
    min-height: 280px;
    background: #f0f0f0;
    overflow: hidden;
}
.order-item-image-dropzone .order-item-crop-container img {
    display: block;
    max-width: 100%;
}

/* Global search record-type badge (header dropdown + full results) */
.gs-type-badge {
    font-size: 12px;
    font-weight: 500;
    padding: 4px 8px;
    line-height: 1.2;
    border-radius: 4px;
    white-space: nowrap;
    letter-spacing: 0.2px;
}

/* Header autocomplete: own line under the order number — consistent regardless of label length */
.gs-type-badge.gs-type-badge--inline {
    font-size: 10px;
    padding: 2px 6px;
    margin-top: 6px;
    margin-bottom: 6px;
    display: inline-block;
    width: max-content;
    max-width: 100%;
    color: #ffffff !important;
}

/* Purchase Order badge — purple background with white text. Helper returns `badge-dark` for the PO class slot; we restyle it here to keep it distinct from the green Order / blue Quote / yellow Auto-Quote / cyan E-commerce. !important needed because the header-dropdown variant sits inside an <a> in .ref that inherits a darker link color. */
.gs-type-badge.badge-dark,
.gs-type-badge.badge-dark.gs-type-badge--inline {
    background-color: #6f42c1 !important;
    color: #ffffff !important;
}

/* Quote approval "Please Note:" emphasis — red text to draw the customer's attention to the post-approval note. */
.opt-please-note {
    color: #FE5656 !important;
}

/* Branding theme column (quote & order-search listings): wrap long names onto multiple lines instead of truncating. */
.opt-branding-theme {
    display: inline-block;
    max-width: 140px;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    line-height: 1.2;
}

/* Quote approval "Wait A Moment!" close-tab / leave-page warning modal.
   Unique to resources/views/orders/quotation/quote_approval_warning_modal.blade.php;
   all rules are scoped under .quote-approval-warning-modal so they can't affect
   any other modal on the page. */
.quote-approval-warning-modal .qaw-card {
    position: relative;
    border: 0;
    border-radius: 36px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.16);
    font-family: 'Poppins', sans-serif;
    overflow: hidden;
}
.quote-approval-warning-modal .modal-dialog {
    max-width: 680px;
}
.quote-approval-warning-modal .qaw-body {
    text-align: center;
    padding: 50px 40px 50px 40px !important;
}
.quote-approval-warning-modal .qaw-title {
    color: #FF0000;
    font-size: 30px;
    font-weight: 400;
    margin: 0 0 15px;
}
.quote-approval-warning-modal .qaw-subtitle {
    color: #000000;
    font-size: 17px;
    font-weight: 400;
    margin: 0 0 26px;
}
.quote-approval-warning-modal .qaw-text {
    color: #000000;
    font-size: 16px;
    line-height: 1.55;
    margin: 0 auto 25px;
    max-width: 100%;
}
.quote-approval-warning-modal .qaw-text--last {
    margin-bottom: 25px;
}
.quote-approval-warning-modal .qaw-approve-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 150px;
    height: 48px;
    padding: 0 46px;
    border: 1px solid #19B35C;
    border-radius: 25px !important;
    background: #1BB55C;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    cursor: pointer;
    margin-bottom: 20px;
}
.quote-approval-warning-modal .qaw-approve-btn:hover {
    background: #16A552;
    border-color: #16A552;
}
.quote-approval-warning-modal .qaw-help {
    color: #1a1a1a;
    font-size: 16px;
    margin: 0;
}
.quote-approval-warning-modal .qaw-link {
    color: #0687F0;
    font-weight: 400;
    text-decoration: none;
}
.quote-approval-warning-modal .qaw-link:hover {
    color: #0687F0;
    text-decoration: underline;
}
@media (max-width: 767px) {
    .quote-approval-warning-modal .modal-dialog {
        max-width: 92%;
    }
    .quote-approval-warning-modal .qaw-card {
        border-radius: 28px;
    }
    .quote-approval-warning-modal .qaw-body {
        padding: 40px 28px 34px !important;
    }
    .quote-approval-warning-modal .qaw-title {
        font-size: 24px;
    }
    .quote-approval-warning-modal .qaw-subtitle,
    .quote-approval-warning-modal .qaw-text {
        font-size: 15px;
    }
    /* Let the body text reflow naturally on small screens. */
    .quote-approval-warning-modal .qaw-text br {
        display: none;
    }
}

/* ==========================================================================
   Sales by user - order breakdown child row (#volume-by-sales-person)
   Moved here from resources/views/dashboard/volume_sale_person.blade.php.
   Every rule stays scoped to #volume-by-sales-person so it cannot leak to
   other pages. The open-state class is .sales-breakdown-open, deliberately
   NOT the shared .shown used by rfq/list.js and the production popup, which
   carries a global `tr.shown td` blue highlight this table must not inherit.
   ========================================================================== */
#volume-by-sales-person .sales-breakdown-toggle {
    display: inline-block;
    margin-right: 8px;
    cursor: pointer;
    transition: transform 0.2s ease;
}

#volume-by-sales-person tr.sales-breakdown-open .sales-breakdown-toggle {
    transform: rotate(90deg);
}

#volume-by-sales-person .sales-order-breakdown-wrapper {
    display: grid;
    grid-template-columns: 58% 42%;
}

#volume-by-sales-person .sales-order-breakdown {
    padding: 10px 20px 10px 50px;
    border-right: 1px solid #dee2e6;
}

#volume-by-sales-person .sales-order-breakdown-compare {
    padding: 10px 20px 10px 20px;
    border-right: 0;
}

#volume-by-sales-person .sales-order-breakdown-row {
    display: flex;
    justify-content: space-between;
    max-width: 260px;
    padding: 4px 0;
}

#volume-by-sales-person .sales-order-bullet {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 6px;
}

#volume-by-sales-person .sales-order-bullet-green {
    background-color: #00A551;
}

#volume-by-sales-person .sales-order-bullet-blue {
    background-color: #4D9EF9;
}

#volume-by-sales-person .sales-order-bullet-amber {
    background-color: #F5A623;
}

/* Lead History (OPT-132) — the icon on the Leads listing and the history page. */
.lead-history-col {
    width: 40px;
}

/* The icon is an inline SVG stroked with currentColor, so `color` drives both
   the resting and the hover state. vertical-align keeps it centred against the
   row's text baseline. */
.lead-history-link {
    color: #4D9EF9;
}

.lead-history-link svg {
    vertical-align: middle;
}

.lead-history-link:hover,
.lead-history-link:focus {
    color: #1a1a1a;
}

#lead-history-table .lead-history-value {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 15px;
    background: #F8F8F8;
    color: #2A2A2A;
}

/* The timestamp is a single string now (21/08/2026 14:26:03) — keep it on one
   line. width:1% is the shrink-to-fit idiom for an auto-layout table. */
#lead-history-table th.lead-history-date-col,
#lead-history-table td.lead-history-date-col {
    width: 1%;
    white-space: nowrap;
}

/* From / To hold a short label or a person's name. Shrinking them hands the
   spare width to Details, which is the column that actually needs it, and keeps
   the two value columns next to each other where they can be compared. */
#lead-history-table th.lead-history-value-col,
#lead-history-table td.lead-history-value-col {
    width: 1%;
    white-space: nowrap;
}

#lead-history-table .lead-history-value-new {
    background: #D1F3CD;
    color: #00A551;
}
/* Salesperson listing avatar thumbnail */
.user-avatar-thumb {
    border-radius: 50%;
    object-fit: cover;
}
/* ==========================================================================
   Export Orders page (resources/views/orders/index_and_listings/export_orders.blade.php)
   Every rule is prefixed .export-orders- so nothing here reaches another page.
   The listing's own date-box styling lives under .filtrbox .fltr-date in the
   filter sidebar and does not apply on this page, hence the field rules below.
   ========================================================================== */
.export-orders-card {
    background: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 10px;
    padding: 32px 32px 28px;
    margin-top: 24px;
}

.export-orders-card .export-orders-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 8px;
}

.export-orders-card .export-orders-intro {
    font-size: 14px;
    margin-bottom: 24px;
}

.export-orders-date-field {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #cacaca;
    border-radius: 4px;
    background: #fff;
    height: 44px;
    padding: 6px 12px;
    font-size: 14px;
    cursor: pointer;
}

.export-orders-date-field:hover {
    border-color: #9a9a9a;
}

.export-orders-date-field .fa {
    color: #6b6b6b;
    margin-left: 10px;
}

/* Breathing room between the picker and the note under it — Bootstrap's
   .form-text leaves only 4px, which reads as one cramped block. */
.export-orders-hint {
    margin-top: 14px;
    line-height: 1.6;
}

.export-orders-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 28px;
}

body.dark-theme .export-orders-card,
body.dark-theme .export-orders-date-field {
    background: #2b303b;
    border-color: #3d4351;
    color: #e9ecef;
}

/* Export Orders entry in the orders-listing toolbar
   (resources/views/orders/index_and_listings/index.blade.php). It carries the
   same .btn-blue classes as the Bulk Actions button beside it, so only the
   spacing is set here. */
.tab-filter-grps .export-orders-toolbar-btn {
    margin-right: 10px;
    white-space: nowrap;
}