:root {
    --main-color: #719e4d;

    --backgrd-color: #f2f2f2;

    --text-color: #363636;

    --hover-text-color: #fff;

    --main-color-opacity: rgba(113, 158, 77, 0.15);

    --text-color-opacity-1: rgba(54, 54, 54, 0.15);

    --text-color-opacity-2: rgba(54, 54, 54, 0.05);
}

.user-footer .btn-default {
    font-size: 14px !important;
}

*,
body {
    font-family: 'Cairo', sans-serif;
}

body {
    background-color: #ffffff !important;
}

.skin-blue .content-wrapper .content-custom,
.skin-blue-light .content-wrapper .content-custom {
    background-color: #ffffff !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--text-color);
}

.main-color {
    color: var(--main-color) !important;
}

/* 

    end global

*/

/* Start Navbar section */

.skin-blue .main-header .navbar,
.skin-blue-light .main-header .navbar {
    background-color: var(--backgrd-color);

    background-image: none !important;

    height: 110px;

    display: flex;

    align-items: center;

    box-shadow: 0px 3px 6px #00000029;
}

.navbar-nav {
    font-size: 25px;
}

#dashboard_date_filter,
#payment_select {
    width: 250px;

    height: 51px;

    padding: 0 10px;

    display: flex;

    flex-direction: row;

    justify-content: space-between;

    align-items: center;

    font-size: 18px;

    font-weight: bold;

    background-color: var(--hover-text-color);

    margin: 10px 0 15px 0;

    color: var(--text-color);

    border: 1px solid var(--text-color);
}

.opensright .ranges ul {
    width: 250px;

    background-color: var(--hover-text-color);
}

.opensright .ranges ul li {
    border-bottom: 1px solid var(--text-color);

    color: var(--text-color);

    font-size: 18px;

    text-align: right;
}

.daterangepicker .ranges li.active {
    background-color: var(--main-color);

    color: var(--hover-text-color);
}

.daterangepicker .ranges li:hover {
    background-color: var(--main-color);

    color: var(--hover-text-color);
}

/* 

    End Navbar section

*/

/* 

    Start card section

*/

.scroll {
    background-color: var(--main-color) !important;

    color: var(--hover-text-color) !important;

    width: 50px;

    height: 50px;

    border-radius: 20px;

    padding: 15px 0;
}

.info-box-new-style {
    background-color: var(--backgrd-color) !important;

    color: var(--text-color);

    /* width: 390px; */

    height: 180px;

    border-radius: 17px;

    padding: 10px !important;
}

.info-box-text {
    color: var(--text-color);

    font-size: 18px;

    font-weight: bold;
}

.info-box-new-style:hover {
    transform: none;

    box-shadow: 3px 3px 11px -5px var(--text-color) !important;
}

.info-box-new-style .info-box-icon {
    color: var(--text-color) !important;

    background-color: var(--hover-text-color) !important;
}

.info-box-new-style .info-box-icon:hover {
    color: var(--main-color) !important;
}

.info-box-new-style .info-box-content {
    display: flex;

    flex-direction: column;

    justify-content: space-between;

    height: 100%;
}

.info-box-new-style .info-box-content p {
    font-size: 16px;

    font-weight: bold;

    color: var(--text-color);
}

.box.box-primary {
    border: none;
}

.box.box-warning {
    border: none;
}

/* 

    End card section

*/

/* 

    start Table  section

*/

table {
    width: 100% !important;
}

td {
    font-size: 18px;

    color: var(--text-color);
}

table thead {
    background-color: var(--main-color-opacity) !important;

    color: var(--text-color);
}

table tfoot tr {
    background-color: var(--backgrd-color) !important;

    color: var(--text-color);
}

.btn-info {
    background-color: var(--main-color) !important;

    color: var(--hover-text-color) !important;

    border: none !important;

    font-size: 13px !important;
}

.btn-group {
    width: 100%;

    display: flex;

    justify-content: center;

    column-gap: 10px;
}

.btn-group a {
    font-size: 14px !important;

    font-weight: bold !important;

    background-color: var(--hover-text-color) !important;

    border-radius: 10px !important;

    border-color: var(--text-color);
}

.btn-group a:hover {
    background-color: var(--main-color) !important;

    color: var(--hover-text-color) !important;
}

.dataTables_filter input {
    /* font-size: 14px !important;

    font-weight: bold !important;

    background-color: var(--hover-text-color) !important; */

    border-radius: 10px !important;

    border-color: var(--text-color);
}

.dataTables_filter input:focus {
    border-color: var(--main-color);
}

/* #collapseFilter .form-group */

/* end table section */

.btn-success {
    background-color: var(--backgrd-color);

    color: var(--text-color);

    border-color: #363636;
}

.btn-default {
    transition: 0.3s;

    border-radius: 5px !important;

    font-size: 24px;
}

.btn-primary {
    background-color: var(--backgrd-color);

    color: var(--text-color);

    border-color: var(--text-color);
}

#dashboard_date_filter:hover,
#payment_select:hover,
.btn-primary:hover,
.btn-success:hover {
    background-color: var(--main-color) !important;

    border-color: var(--main-color);

    color: var(--backgrd-color);
}

.btn_sale {
    border-radius: 13px !important;

    padding: 6px 36px !important;
}

.btn_sale:hover {
    color: var(--backgrd-color) !important;

    border-color: var(--main-color);
}

.skin-blue-light .main-header .navbar .nav > li > a {
    color: var(--text-color);
}

.skin-blue-light .main-header .navbar .nav > li > a:hover {
    color: var(--main-color);
}

.skin-blue-light .content-wrapper .content-header-custom {
    background-color: #fff !important;
}

/* 

    Sidebar start

*/

.main-sidebar {
    margin-top: 10px;
}

.skin-blue-light .sidebar-menu > li.active {
    border-left-color: var(--main-color);
}

.wrapper.thetop aside.main-sidebar {
    background: var(--backgrd-color) !important;

    box-shadow: -3px 3px 6px #00000029 !important;
}

.main-header .logo .logo-lg img {
    max-width: unset;

    max-height: unset;
}

.main-header .logo {
    height: unset;

    padding-top: 10px;
}

.main-sidebar .sidebar {
    background: var(--backgrd-color) !important;

    color: var(--text-color);

    font-size: 16px !important;

    margin-top: 38px !important;
}

.skin-blue-light .main-header .logo {
    background-color: var(--backgrd-color) !important;

    background: var(--backgrd-color) !important;
}

.main-sidebar .sidebar .treeview {
    transition: 0.3s;
}

.main-sidebar .sidebar .treeview-menu {
    padding-right: 0px !important;
}

.main-sidebar .sidebar .treeview > a {
    transition: 0.3s;

    border: none !important;

    height: 42px;
}

aside.main-sidebar section.sidebar li.treeview ul a:hover {
    background-color: var(--main-color) !important;

    color: white !important;
}

.main-sidebar .sidebar .treeview > a > {
    transition: 0.3s;
}

.sidebar-menu > li > a > span:first-of-type {
    position: relative;
}

.sidebar-menu > li > a > span:first-of-type::before {
    content: '';

    position: absolute;

    bottom: -5px;

    left: 0;

    width: 0%;

    height: 0px;

    background-color: var(--text-color);

    transform: translateX(50%);

    transition: width 0.2s ease, transform 0.4s ease;
}

.sidebar-menu > li > a:hover > span:first-of-type::before {
    height: 1px;

    opacity: 0.6;

    width: 100%;

    transform: translateX(0);
}

.main-sidebar .sidebar .treeview > a span {
    transition: 0.3s;
}

.main-sidebar .sidebar .treeview > a:hover span {
    font-size: 17px;
}

.sidebar-menu .treeview {
    transition: 0.3s;
}

.treeview-menu a::before {
    content: '' !important;
}

.treeview-menu a {
    padding-right: 39px !important;

    padding-left: 39px !important;

    display: block !important;
}

.sidebar-menu li > a > .pull-right-container > .fa-angle-left {
    margin-left: 0 !important;
}

.color-green {
    color: var(--main-color);
}

.sidebar-menu .treeview,
.sidebar-menu .active-tree {
    border-radius: 22px !important;

    overflow: hidden !important;
}

.skin-blue-light .sidebar-menu > li.active a {
    background-color: var(--main-color-opacity) !important;
}

aside.sidebar-menu li.treeview.active-tree * {
    background-color: transparent !important;

    background: transparent !important;
}

.sidebar-collapse .sidebar-menu > li > a {
    text-align: center;
}

/* 

    Sidebar end

*/

/* 

    start dropdown

*/

.select2-container--default .select2-selection--single,
.select2-selection .select2-selection--single {
    background-color: var(--hover-text-color) !important;

    border: 1px solid var(--text-color) !important;

    color: var(--text-color) !important;

    font-size: 15px;

    font-weight: bold;

    height: 40px;

    border-radius: 10px;

    padding: 10px 10px;
}

.form-group .form-control {
    background-color: var(--hover-text-color) !important;

    border: 1px solid var(--text-color) !important;

    color: var(--text-color) !important;

    font-size: 15px;

    font-weight: bold;

    height: 40px;

    border-radius: 10px;
}
/* select2 select2-container select2-container--default select2-container--below */

.select2-container--default .select2-search--dropdown .select2-search__field,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: var(--main-color) !important;
}

/* .form-group .form-control:hover option {

    

} */

/* .form-control:focus {

    border-color: var(--main-color);

} */

/* .form-group .form-control */

.select2-container--default .select2-selection--single:hover,
.select2-selection .select2-selection--single:hover {
    /* background-color: var(--main-color) !important; */

    /* color: var(--hover-text-color) !important; */

    border: 1px solid var(--main-color) !important;
}

.select2-container--open .select2-dropdown--below {
    background-color: var(--hover-text-color) !important;

    color: var(--text-color) !important;

    font-size: 15px !important;
}

.select2-results__option[aria-selected] {
    border-bottom: 1px solid var(--text-color) !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--main-color) !important;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    background-color: var(--hover-text-color) !important;

    color: var(--text-color) !important;

    font-size: 15px;

    font-weight: bold;

    height: 40px;

    border-radius: 10px;

    padding: 10px 10px;

    border: 1px solid var(--text-color) !important;
}

/* .form-control:focus, */

.form-control:hover {
    /* background-color: var(--main-color) !important; */

    border: 1px solid var(--main-color) !important;

    /* color: var(--hover-text-color) !important; */
}

.select2-container--default .select2-results__option[aria-selected='true'] {
    background-color: var(--backgrd-color) !important;
}

.user-menu .dropdown-menu {
    left: 0;
}

/* .icheckbox_square-blue,

.iradio_square-blue {

}

.icheckbox_square-blue:hover,

.iradio_square-blue:hover {

} */

/* 

    end dropdown

*/

/* inputs */

.box.box-primary {
    border: none !important;

    box-shadow: none !important;
}

.content-wrapper {
    background-color: white !important;

    background: white !important;
}

.content-header > h1 {
    color: var(--text-color) !important;

    margin-left: 22px;

    margin-right: 22px;
}

.form-group {
    position: relative;
}

.form-group > input,
.form-group .select2-selection,
.form-group .input-group {
    border: 1px solid var(--text-color);

    border-radius: 10px !important;
}

.form-group > input:hover,
.form-group .select2-selection:hover,
.form-group .input-group:hover,
.form-group > input:focus,
.form-group .select2-selection:focus,
.form-group .input-group:focus {
    border-color: var(--main-color) !important;
}

.form-group > input:not([type='file']) {
    border-radius: 50px !important;

    padding: 20px;
}

.form-group > input[type='file'] {
    padding: 10px;

    border-radius: 50px !important;
}

.form-group .select2-selection {
    font-weight: bold;

    padding-top: 0 !important;

    padding-bottom: 0 !important;
}

/* .form-group .input-group {

    padding-top: 5px !important;

    padding-bottom: 0px !important;

} */

.input-group .select2-container--default .select2-selection--single,
.file-caption-main .form-control_,
.input-group .form-control {
    border: none !important;
}

.input-group.file-caption-main {
    padding-bottom: 5px !important;

    padding-top: 5px !important;

    border-radius: 50px !important;
}

.input-group.file-caption-main .input-group-btn {
    padding-left: 5px;

    border-radius: 50px !important;
}

.input-group.file-caption-main .input-group-btn .btn-file {
    border-radius: 50px !important;

    /* transition: 0.3s; */

    cursor: pointer !important;
}

.input-group.file-caption-main .input-group-btn .btn-file:hover {
    border-color: var(--main-color) !important;

    background: white !important;

    background-color: white !important;

    color: var(--text-color);
}

.input-group .btn-default {
    border: none !important;

    background-color: var(--main-color) !important;

    padding-top: 18px;

    margin-top: -10px !important;
}

.input-group .text-primary {
    color: white !important;
}

.form-group .select2-selection:not(.select2-selection--multiple) {
    padding-top: 10px !important;

    padding-bottom: 31px !important;
}

.select2 {
    width: 100% !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    padding: 4px 16px !important;
    height: auto;
}
#select2-booking_customer_id-container {
    /* background-color: red !important; */
    max-width: 170px !important;
    width: unset !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--main-color);

    font-weight: normal;

    border-radius: 50px !important;
}

.select2-container--default .select2-selection--multiple {
    border-radius: 50px !important;
}

/* .box.box-primary .box-body .form-group .hover-q {

    position: absolute;

    left: 9px;

    top: 39px;

} */

.fa-info-circle::before {
    color: var(--main-color);
}

table input:not([type='file']) {
    padding: 20px 10px !important;

    border-radius: 50px;

    font-size: 1.2rem !important;
}

.input-group .input-group-addon {
    border: none;

    padding-bottom: 7px;
}

.file-drop-disabled {
    display: flex;

    align-items: center;

    justify-content: center;
}

.file-preview-frame {
    transform: translateX(-10px);
}

.fileinput-remove {
    border-radius: 50px !important;

    color: white;

    padding-top: 5px !important;

    padding-bottom: 5px !important;

    transform: translateY(5px);
}

.file-preview-image {
    width: 250px !important;

    height: 250px !important;
}

label[for='transaction_date'] + .input-group {
    overflow: unset !important;

    border-radius: 5px !important;
}

/* 

    Popup start section

*/

.swal-footer {
    text-align: right;

    padding-top: 13px;

    margin-top: 13px;

    padding: 13px 16px;

    border-radius: inherit;

    border-top-left-radius: 0;

    border-top-right-radius: 0;

    display: flex;

    flex-flow: row nowrap;

    align-items: center;

    justify-content: center;

    text-align: center;
}

.swal-icon {
    width: 80px;

    height: 80px;

    border-width: 4px;

    border-style: solid;

    border-radius: 50%;

    padding: 0;

    position: relative;

    box-sizing: content-box;

    margin: 20px auto;

    background-color: #f15e5e !important;

    border-color: #f15e5e !important;
}

.swal-icon--warning__body,
.swal-icon--warning__dot {
    position: absolute;

    left: 50%;

    background-color: #ffffff !important;
}

.swal-title {
    color: #719e4d !important;

    font-size: 29px !important;

    font-weight: bold !important;

    opacity: 1;
}

.swal-button {
    background-color: #7cd1f9;

    color: #fff;

    border: none;

    box-shadow: none;

    border-radius: 20px !important;

    font-size: 20px !important;

    padding: 11px 34px !important;

    margin: 0;

    cursor: pointer;

    font-weight: bold !important;
}

.swal-button--danger {
    background-color: #e64942 !important;

    transition: all 0.4s;
}

.swal-button--cancel {
    color: #ffffff !important;

    background-color: #719e4d !important;

    transition: all 0.4s;
}

.swal-icon--warning__body {
    width: 16px !important;

    height: 47px;

    top: 10px;

    border-radius: 2px;

    margin-left: -2px;
}

.swal-icon--warning__dot {
    width: 10px !important;

    height: 10px !important;

    border-radius: 50%;

    margin-left: -4px;

    bottom: -13px !important;
}

.swal-icon--warning__body,
.swal-icon--warning__dot {
    position: absolute;

    left: 43% !important;

    background-color: #fff !important;
}

.swal-button--danger:hover,
.swal-button--cancel:hover {
    background-color: transparent !important;

    color: #363636 !important ;

    border: 2px solid #363636 !important;
}

/* 

    Popup end section

*/
select.input-sm {
    height: 40px;
}

.add-bttn {
    background-color: var(--main-color) !important;

    color: var(--hover-text-color) !important;

    font-size: 20px !important;

    font-weight: bold;
}

.input-group .form-control:not(:first-child):not(:last-child),
.input-group-addon:not(:first-child):not(:last-child),
.input-group-btn:not(:first-child):not(:last-child),
.in-search::placeholder,
.in-search {
    background-color: var(--hover-text-color) !important;

    color: var(--text-color) !important;

    /* padding: 5px 0; */

    width: 300px !important;
}

.fa-info-circle::before {
    color: var(--main-color);
}

table input:not([type='file']) {
    padding: 20px 10px !important;

    border-radius: 50px;

    font-size: 1.2rem !important;
}

.input-group .input-group-addon {
    border: none;

    padding-bottom: 7px;
}

.file-drop-disabled {
    display: flex;

    align-items: center;

    justify-content: center;
}

.file-preview-frame {
    transform: translateX(-10px);
}

.fileinput-remove {
    border-radius: 50px !important;

    color: white;

    padding-top: 5px !important;

    padding-bottom: 5px !important;

    transform: translateY(5px);
}

.file-preview-image {
    width: 250px !important;

    height: 250px !important;
}

label[for='transaction_date'] + .input-group {
    overflow: unset !important;

    border-radius: 5px !important;
}

.btn-group .btn + .btn,
.pull-left,
.btn,
.btn-primary {
    transition: all 0.5s ease-in-out !important;
}

.box-title a {
    color: #719e4d !important;

    font-weight: bold !important;

    transition: all 0.4s ease-in;

    padding: 6px !important;
}

.box-title a:hover {
    border: 1px solid #719e4d !important;

    box-shadow: 0px 0px 3px 1px #709d4c !important;
}

.nav-tabs-custom > .nav-tabs > li.active {
    border-top-color: #719e4d !important;
}

.nav-tabs-custom > .nav-tabs > li:not(.active) > a {
    transition: all 0.3s ease-in-out;
}

.pagination > .active > a {
    background-color: #719e4d !important;

    border-color: #719e4d !important;
}

.box-header .box-title {
    padding: 0px 10px !important;
}

div.dataTables_wrapper div.dataTables_length select {
    margin: 0 10px !important;
}

strong {
    padding: 0 6px !important;
}

.dataTables_scrollHead {
    border-top-left-radius: 35px !important;

    border-top-right-radius: 35px !important;
}

.select2 {
    transition: all 0.4s !important;
}

.form-control {
    border-radius: 0;

    box-shadow: none;

    border-color: #d2d6de;

    background-color: var(--hover-text-color) !important;

    border: 1px solid var(--text-color) !important;

    color: var(--text-color) !important;

    font-size: 15px;

    font-weight: bold;

    height: 40px;

    border-radius: 10px;

    transition: all 0.6s;
}

div.dataTables_wrapper div.dataTables_length select {
    height: 40px !important;
}

#purchase_table_wrapper {
    width: 100% !important;
}

#purchase_table_wrapper table,
#purchase_table_wrapper table thead {
    width: 100% !important;
}

/* product details */

/* ----------- */

/* ----------- */

/* ----------- */

.modal-header {
    border: none !important;

    padding: 20px 30px 0px 20px !important;
}

.modal-header .modal-title {
    font-size: 23px;

    color: var(--text-color);

    display: flex;

    align-items: center;

    gap: 5px;
}

.product-details .modal-body .col-sm-9 {
    padding-left: 30px;

    padding-right: 30px;
}

.product-details .modal-body .row:first-child .invoice-col {
    color: var(--text-color);

    font-size: 20px;

    line-height: 50px;
}

.product-details .modal-body .row:first-child .invoice-col .thumbnail {
    border-radius: 20px;

    border-color: #707070;

    overflow: hidden;

    padding: 10px 8px !important;

    box-shadow: 2px 2px 6px #0000007d;
}

.icon-container {
    display: flex;

    width: fit-content;

    background-color: var(--main-color);

    color: white;

    border-radius: 50px;

    padding: 6px 5px 5px 5px;

    height: auto;
}

.modal-title .icon-container i {
    font-size: 12px;
}

.close {
    background-color: var(--text-color) !important;

    color: white !important;

    opacity: 1;

    display: flex;

    width: fit-content;

    border-radius: 50px;

    padding: 0px 6px 5px 7px !important;

    height: auto;

    font-size: 30px;

    transition: 0.3s;
}

.btn.btn-primary {
    color: white;

    background-color: var(--main-color);

    border: 1px solid var(--main-color);

    transition: 0.3s;

    border-radius: 5px;
}

.btn.btn-primary:hover {
    color: var(--main-color);

    background-color: white !important;
}

.product-details .btn.btn-primary,
.modal .btn.btn-primary {
    font-size: 24px;

    margin-left: 7px;

    margin-right: 7px;
}

.products-actions {
    display: flex;

    width: 800px;

    justify-content: space-between;

    margin: auto;
}

#product_table_wrapper .btn-primary {
    padding: 12px 16px !important;

    font-size: 16px !important;
}

#product_table_wrapper .dataTables_scrollFoot i {
    transform: translateY(10px);
}

#product_table_wrapper .fa-info-circle::before {
    color: var(--main-color);

    font-size: 25px;
}

.swal-modal {
    border-radius: 20px;

    width: 520px;

    padding: 10px 0px;
}

.swal-modal .swal-text {
    color: var(--main-color);

    font-size: 40px;

    word-spacing: -3px;

    font-weight: bold;
}

.swal-modal .swal-footer {
    /* background-color: var(--main-color); */

    justify-content: center;

    display: flex;

    align-items: center;
}

.swal-modal .swal-footer .swal-button--confirm {
    background-color: var(--main-color);

    padding: 2px 60px;

    font-size: 36px;

    box-shadow: none;
}

.new-modal-body .row:nth-child(2),
.modal-dialog.modal-xl.no-print .row:nth-child(2) {
    color: var(--text-color);

    font-size: 20px;

    line-height: 50px;
}

.modal-body:not(.new-modal-body) .col-sm-12.col-xs-12:not(.col-md-6:last-child) tr:first-child {
    background-color: transparent !important;
}

.modal-body .col-sm-12.col-xs-12:not(.col-md-6:last-child) th {
    background-color: var(--main-color-opacity);
}

.modal-body tbody .col-sm-12.col-xs-12.col-md-6:last-child tr:nth-child(even),
.modal-body tbody tr:nth-child(even) {
    background-color: var(--text-color-opacity-2);
}

.modal-body tbody .col-sm-12.col-xs-12.col-md-6:last-child tr:nth-child(odd),
.modal-body tbody tr:nth-child(odd) {
    background-color: var(--text-color-opacity-1);
}

.product-details tbody tr {
    background-color: var(--text-color-opacity-1) !important;
}

.box-tools {
    margin-left: 5px;

    margin-right: 5px;
}

.bg-info {
    background-color: var(--main-color) !important;

    color: white;
}

/* 

    Pos start section

*/

.customer-drop {
    /* height: 30px !important; */
}

.recent-table tbody td {
    font-size: 18px !important;

    font-weight: bold;
}

.pos-header-bttn {
    border-radius: 10px !important;

    background-color: var(--main-color) !important;

    padding: 3px 5px !important;

    color: var(--hover-text-color) !important;

    /* font-size: 20px; */

    font-weight: bold !important;
}

/* .prd-search div, */

.prd-search {
    width: 100%;

    display: flex;

    justify-content: center;
}

#product_category_div {
    border-bottom: 1px solid #00000047;

    box-shadow: 0px 5px 3px -3px #00000047;

    padding-bottom: 22px;
}

#product_category_div h2 {
    display: flex;

    gap: 5px;

    margin-right: 25px;
}

#product_category_div h2 i {
    font-size: 18px;
}

#product_category_div .bttn-wrapper {
    overflow-x: auto;

    overflow-y: hidden;

    white-space: nowrap;
}

#product_category_div .product_category_bttn {
    display: inline-block;

    font-size: 21px;

    border: 1px solid var(--text-color);

    width: 150px;

    margin-left: 20px;

    overflow: hidden;

    color: var(--text-color);

    transition: 0.3s;

    background-color: transparent;

    border-radius: 25px;

    padding: 2px;

    cursor: pointer;
}

#product_category_div .product_category_bttn:hover {
    background-color: var(--main-color);

    border-color: var(--main-color);
}

#product_category_div .product_category_bttn .img-div {
    padding: 5px;

    border-radius: 50%;

    background-color: white;

    width: 60px;

    height: 60px;
}

#product_category_div .product_category_bttn img {
    width: 50px;

    height: 50px;

    transition: 0.3s;

    background-color: transparent;

    border-radius: 50px;
}

#product_category_div .product_category_bttn:hover img {
    scale: 0.8;

    background-color: white;
}

#product_category_div .product_category_bttn h4 {
    font-size: 12px;
}

#product_category_div .product_category_bttn:hover h4 {
    color: white;
}

.product_box {
    border-radius: 25px;

    overflow: hidden;

    border: 1px solid var(--text-color);

    /* padding-bottom: 5px; */

    transition: 0.3s;
}

.product_box:hover {
    background-color: #f0f0f0 !important;

    box-shadow: 2px 3px 12px -8px var(--text-color);
}

.product_box .text-muted {
    font-size: 18px;

    color: var(--text-color);

    margin-top: 5px;

    margin-bottom: 5px;
}

.product_box .text {
    line-height: unset;

    padding-left: 15px;

    padding-right: 15px;

    max-height: none !important;
}

.close span {
    line-height: 23px;
}

.small-box-footer {
    padding: 5px 10px !important;

    border-radius: 540px;

    font-size: 13px;

    display: inline-block;

    transition: 0.3s;

    border: 1px solid transparent;

    cursor: pointer;
}

.small-box-footer:hover {
    background-color: transparent !important;

    color: var(--text-color) !important;

    border-color: var(--text-color);
}

/* 

    Pos end section

*/

/* 

    suspend orders start sections

*/

.table-product-row {
    border: 0 !important;
}

.fa-light,
.fa-window-minimize {
    font-family: 'Font Awesome 5 Free';

    padding-bottom: 10px;
}

.delet-product {
    width: 25px;

    height: 25px;

    background-color: #dc2d2d;

    border-radius: 50%;

    margin: auto;

    color: #fff;

    display: flex;

    align-items: center;

    justify-content: center;

    text-align: center;
}

.text-info {
    color: #363636 !important;

    font-size: 16px !important;

    line-height: 0 !important;

    font-weight: bold;
}

.text-link:hover {
    text-decoration: underline !important;
}

.display_currency {
    color: #363636;

    font-weight: bold;

    font-size: 22px;
}

.span-qyt-btn {
    padding: 0 5px !important;
}

.qyt-btn {
    width: 35px !important;

    height: 35px !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important ;

    border-radius: 50% !important;

    background-color: #363636 !important;

    color: #fff !important;
}

.qyt-btn i {
    color: #fff;
}

.qyt-input {
    border: 1px solid #000 !important;

    border-radius: 30px !important;
}

.form-control-select-box {
    width: 45%;

    border: 1px solid #719e4d;

    border-radius: 10px !important;

    padding: 0 10px !important;

    font-size: 16px;

    display: flex;

    align-items: center;

    justify-content: center;

    /* baseline-shift: inherit; */

    height: inherit !important;
}

.pos_product_div {
    overflow-y: auto !important;

    /* margin-top: 100px !important; */

    /* padding: 0 !important; */

    padding: 0 12px;
}

table td[class*='col-'],
table th[class*='col-'] {
    position: static;

    display: table-cell;

    float: right !important;
}

@media (max-width: 1409.9px) {
    .price-div {
        width: 130px !important;
    }

    .display_currency {
        font-size: 18px;
    }

    .qyt-btn {
        width: 25px !important;

        height: 25px !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important ;

        border-radius: 50% !important;

        background-color: #363636 !important;

        color: #fff !important;

        font-size: 13px !important;
    }

    .contant-box-price-qyt {
        margin-bottom: 10px;

        padding: 0 !important;

        width: 106% !important;

        position: relative !important;

        left: 10px !important;
    }

    .contant-box-price-qyt1 {
        padding: 0 30px !important;
    }

    .contant-box-price-qyt2 {
        padding: 0 50px !important;
    }
}

/* 

    Suspend order end section

*/

/*  */
#pro-felx {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%;
}

#product_list_body {
    width: 100%;
    /* background-color: #000 !important;  */
}

#product_list1 {
    /* width: 100% ; */
    max-width: 250px;
    /* min-width: 150px; */
    padding: 0;
    /* width: 100px !important; */
}

#product_list1 .img-propuct {
    width: 100% !important;
    height: 80px !important;
    background-size: contain !important;
}

#custom-row {
    width: 1000px;
}
#tab_final {
    overflow-x: auto;
}
#tab_quotation {
    overflow-x: auto;
}
#custom-draft {
    overflow-x: auto;
}
#custom-btns {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
/*  */

/* modle contact design */

.modal-body .form-group input {
    /* border: 1px solid #70707066 !important; */
}

.modal-body .row_discount_type {
    border: 1px solid #70707066 !important;
}

.modal-body textarea {
    border: 1px solid #70707066 !important;
}

.modal-header {
    border: 0 !important;
}

.modal-header h3 {
    position: relative;

    color: #363636 !important;

    font-size: 24px !important;

    font-weight: 700 !important;

    padding-right: 35px;
}

.modal-header h3::before {
    content: '\f02c';

    position: absolute;

    color: #719e4d;

    right: 0;

    top: 24%;

    font-family: 'Font Awesome 5 Free';

    font-size: 17px;
}

.modal-header .close {
    margin-top: 0px !important;

    display: flex;

    align-items: center;

    justify-content: center;
}

.close {
    width: 35px !important;

    height: 35px !important;

    border-radius: 50% !important;

    background-color: #363636 !important;

    color: #fff !important;

    opacity: 1 !important;
}

.close span {
    position: relative;

    top: -2px;

    font-size: 30px !important;

    line-height: 0 !important;
}

.modal-body .form-group:first-child {
    padding: 0px 120px !important;
}

.modal-body .form-group {
    padding: 0 35px !important;

    font-size: 15px !important;
}

.modal-body .form-group:last-child {
    padding: 0 20px !important;

    margin-top: 15px !important;
}

.modal-body .form-group:last-child label {
    font-size: 21px !important;

    font-weight: bold;
}

.modal-content .modal-footer {
    border: 0 !important;
}

.modal-content .modal-footer .btn-default {
    background-color: #719e4d !important;

    color: #fff !important;

    padding: 7px 25px !important;

    font-size: 20px !important;

    border-radius: 10px;
}

/* modle contact design ______________________________________________________*/

/* modle contact design ______________________________________________________*/

.design-hidden-table {
    max-width: 85% !important;

    margin: auto auto 20px !important;
}

hr {
    box-shadow: 0px 0px 3px 0px #00000061 !important;
}

.design-hidden-table tr th {
    padding: 10px 5px !important;
}

.design-hidden-table tr th:first-child {
    border-top-right-radius: 10px;

    border-bottom-right-radius: 10px;
}

.design-hidden-table tr th:last-child {
    border-top-left-radius: 10px;

    border-bottom-left-radius: 10px;
}

.design-hidden-table tr td {
    padding: 10px 5px !important;
}

.design-hidden-table tr td:first-child {
    border-top-right-radius: 10px;

    border-bottom-right-radius: 10px;
}

.design-hidden-table tr td:last-child {
    border-top-left-radius: 10px;

    border-bottom-left-radius: 10px;
}

b {
    font-size: 20px !important;

    font-weight: bold;

    color: #363636 !important;

    line-height: 38px;
}

.pos-form-actions button {
    font-size: 20px;

    padding: 10px 20px !important;

    border-radius: 10px !important;
}

#payment_select {
    width: 180px;
}

.payment-div-select {
    display: inline-block;
}

.payment-div-select .select2-selection.select2-selection--single {
    height: 50px;

    font-size: 16px;

    background-color: var(--main-color) !important;

    translate: 0.3s !important;

    border-color: var(--main-color) !important;
}

.payment-div-select .select2-selection.select2-selection--single:hover {
    background-color: white !important;
}

.payment-div-select .select2-selection--single > .select2-selection__rendered {
    margin-top: -2px;
    color: white !important;
}

.payment-div-select
    .select2-container--default
    .select2-selection--single
    .select2-selection__arrow
    b {
    border-width: 7px;

    margin-top: 7px;
}

.payment-div-select
    .select2-container--default
    .select2-selection--single
    .select2-selection__arrow
    b {
    border-width: 7px;
    margin-top: 7px;
}
.select2-selection__rendered {
    height: 40px;
}

/* modle contact design ______________________________________________________*/

.pos-form-actions button {
    font-size: 20px;

    padding: 10px 20px !important;

    border-radius: 10px !important;
}

#payment_select {
    width: 180px;
}

.payment-div-select {
    display: inline-block;
}

.payment-div-select .select2-selection.select2-selection--single {
    height: 50px;

    font-size: 16px;

    background-color: var(--main-color) !important;

    translate: 0.3s !important;

    border-color: var(--main-color) !important;
}

.payment-div-select .select2-selection.select2-selection--single:hover {
    background-color: white !important;
}

.payment-div-select .select2-selection--single > .select2-selection__rendered {
    margin-top: -2px;

    color: white !important;
}

.payment-div-select .select2-selection--single:hover > .select2-selection__rendered {
    color: var(--text-color) !important;
}

.payment-div-select
    .select2-container--default
    .select2-selection--single
    .select2-selection__arrow
    b {
    border-width: 7px;

    margin-top: 6px;

    border-top-color: white;

    border-bottom-color: transparent;
}

.payment-div-select
    .select2-container--default:hover
    .select2-selection--single
    .select2-selection__arrow
    b {
    border-top-color: var(--main-color);
}

.payment-div-select
    .select2-container--default.select2-container--open
    .select2-selection--single
    .select2-selection__arrow
    b {
    margin-top: 0px;

    border-top-color: transparent;

    border-bottom-color: white;
}

.payment-div-select
    .select2-container--default.select2-container--open:hover
    .select2-selection--single
    .select2-selection__arrow
    b {
    border-bottom-color: var(--main-color);
}

.btn-money {
    font-size: 31px !important;

    margin-top: 72px;

    padding-left: 60px;

    padding-right: 60px;
}

.pos_form_totals b {
    font-size: 15px !important;
}

.pos_form_totals table {
    margin-bottom: 10px;
}

.rounded-pill {
    border-radius: 200px !important;
}

.bg-red {
    background-color: #f15e5e !important;
}

html[dir='ltr'] .dropdown-menu {
    left: unset !important;
    right: 0 !important;
}

.sidebar-toggle {
    color: var(--main-color) !important;
    font-size: 24px !important;
    background-color: transparent !important;
    transition: 0.3s;
}

.sidebar-toggle:hover {
    background-color: var(--main-color) !important;
    color: white !important;
}

html[dir='ltr'] .dropdown-menu {
    left: unset !important;
    right: 0 !important;
}

html[dir='ltr'] .dropdown-menu {
    left: unset !important;
    right: 0 !important;
}

.notification .fa-bell {
    font-size: 15px;
    color: white;
}
.bootstrap-datetimepicker-widget {
    z-index: 999999 !important;
}