:root, [data-bs-theme=light] {
   --vz-primary: #FBF7F4;
   --vz-secondary: #A06A17;
   --vz-secondary-color: #503307;
   --vz-btn-color: #F3F2F2;
   --vz-outline-btn-color: #503307;
   --vz-btn-active-color: #F3F2F2;
   --vz-tertiary: #503307;
   --vz-saffron: #EEE1CE;
}
body{
    font-family: "Public Sans", sans-serif;
}
.text-primary {
    color: var(--vz-secondary-color) !important;
}
.form-check-input:checked {
    background-color: var(--vz-secondary-color);
    border-color: var(--vz-secondary-color);
}
.btn {
    font-size: 16px;
    --vz-btn-padding-y: .6rem;
    border-radius: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
}
.btn-primary {
    --vz-btn-bg: var(--vz-secondary);
    --vz-btn-border-color: var(--vz-secondary);
    --vz-btn-hover-bg: var(--vz-secondary-color);
    --vz-btn-hover-border-color: var(--vz-secondary-color);
    --vz-btn-focus-shadow-rgb: var(--vz-primary-rgb);
    --vz-btn-active-bg: var(--vz-secondary-color);
    --vz-btn-active-border-color: var(--vz-secondary-color);
    --vz-btn-color: #F3F2F2;
}
.btn-secondary {
    --vz-btn-bg: var(--vz-secondary-color);
    --vz-btn-border-color: var(--vz-secondary-color);
    --vz-btn-hover-bg: var(--vz-secondary);
    --vz-btn-hover-border-color: var(--vz-secondary);
    --vz-btn-focus-shadow-rgb: var(--vz-primary-rgb);
    --vz-btn-active-bg: var(--vz-secondary);
    --vz-btn-active-border-color: var(--vz-secondary);
    --vz-btn-color: #F3F2F2;
}
.btn:hover {
    color: var(--vz-btn-color);
}
.btn-outline-secondary{
    color: var(--vz-outline-btn-color);
}
.btn-outline-secondary{
    --vz-btn-bg:transparent;
    --vz-btn-border-color: var(--vz-secondary);
    --vz-btn-hover-bg: var(--vz-secondary);
    --vz-btn-hover-border-color: var(--vz-secondary);
    --vz-btn-focus-shadow-rgb: var(--vz-primary-rgb);
    --vz-btn-active-bg: var(--vz-secondary);
    --vz-btn-active-border-color: var(--vz-secondary);
    --vz-btn-color: #F3F2F2;
}
.form-control, .form-select {
    border: 1px solid #D0D5DD;
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
    border-radius: 0;
    height: 48px;
    font-size: 16px;
    color: #667085;
}
textarea.form-control {
    height: 100px;
}
.form-select {
    padding: 0.7rem 2.7rem .7rem .9rem;
    font-size: 16px;
    cursor: pointer;
}
.form-select:focus,.form-control:focus {
    border-color: var(--vz-secondary);
    outline: 0;
    box-shadow: none;
}
label[for="item-image"] {
    margin-bottom: .55rem;
}
/*** custom file input ***/
.upload-label {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    cursor: pointer;
    text-align: center;
    position: relative;
    overflow: hidden;
    border: 1px solid #D0D5DD;
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
    border-radius: 0;
    height: 100px;
    font-size: 16px;
    color: #667085;
}
.upload-text {
    color: #667085;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
  .file-input {
    display: none;
  }
  .image-preview {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures the image fits without distorting */
  }
/*** inventory css start ***/
.orders-inventory-box .card {
    background: transparent;
    box-shadow: none;
}
.orders-inventory-box .tab-content {
    background: #fff;
    padding: 20px 13px;
}
.inventory-column .card {
    background: #F3F2F2;
    border-radius: 0;
}
/* .inventory-img {
    height: 150px;
    overflow: hidden;
}
.inventory-img > img {
    height: 100%;
    object-fit: cover;
    border-radius: 0;
    width: 100%;
} */
.inventory-img-main span.badge {
    color: var(--vz-secondary-color);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    background: #F3F2F2;
    position: absolute;
    left: 10px;
    bottom: 10px;
    border-radius: 0;
}
h2.i-card-heading {
    color: var(--vz-secondary-color);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    margin-bottom: 0;
    line-height: normal;
}
.i-card-info h3.card-title {
    color: #000;
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    margin-bottom: 5px;
    text-align: left;
}
.i-card-info p.card-text {
    color: var(--vz-secondary-color);
    font-size: 14px;
    line-height: 22px;
}
.i-card-info h4{
    color: #000;
    font-size: 16px;
    font-weight: 600;
    line-height: 22px; /* 137.5% */
    margin-bottom: 0;
}
.inventory-infos .card-body {
    padding: 10px;
}
.inv-btn{
    gap: 20px;
}
.inv-btn button {
    width: 100%;
    border-radius: 0;
    font-weight: 600;
}
.inventory-column .col-lg-3 {
    padding: 0 7.5px;
}
.inventory-column{
    margin: 0 -15px;
}
.i-card-headings {
    margin: 0 -21px 20px;
}
.i-add-edit-btn {
    gap: 10px;
}
.i-add-edit-btn button{
    border-radius: 0;
}
.btn i {
    font-size: 20px;
}
.orders-inventory-box .nav-link {
    color: #7E7C7A;
    font-size: 16.288px;
    font-weight: 500;
    display: flex;
    gap: 10px;
    border: 0;
}
.orders-inventory-box .nav-tabs {
   border: 0;
}
.i-orders-heading {
    margin-bottom: 30px;
    border-bottom: 2px solid #E9EBEC;
    padding-bottom: 10px;
}
.orders-inventory-box .nav-tabs .nav-link.active,
.orders-inventory-box .nav-tabs .nav-item.show .nav-link {
    background: transparent;
    color: var(--vz-secondary-color);
    border: 0;
    border-bottom: 2px solid var(--vz-secondary);
}
.orders-inventory-box .nav-tabs .nav-link {
    padding-bottom: 20px;
    margin-bottom: -12px;
}
/*** cafe css start ***/
p#category-placeholder {
    border: 1px solid #CED4DA;
    padding: 30px;
}
.inventory-column.scroll-container {
    margin: 0 -8px;
}
/* .cafe-body-main{
    max-height: 400px;
    overflow-y: auto;
} */
/* .orders-inventory-box input#search-cafe {
    max-width: 367.5px;
} */
/* form#editItemForm .btn {
    width: 100%;
} */
/* button#add-edit-variation {
    margin-bottom: 10px;
} */
.modal-content {
    border-radius: 0;
    border: 0;
    box-shadow: none;
}
.i-add-edit-btn button.btn.btn-secondary i {
    font-size: 17px;
}
.navbar-menu .navbar-nav .nav-link.active {
    color: var(--vz-secondary-color);
    font-weight: 600;
}
.modal-header{
    justify-content: center;
}
.form-label {
   margin-bottom: 6px;
    color: #344054;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-transform: capitalize;
}
.form-control::placeholder {
    color: #667085;
}
.modal-backdrop {
    --vz-backdrop-bg: rgba(0, 0, 0, 0.30);
    --vz-backdrop-opacity: 1;
}
.modal-title {
    color: #101828;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    width: 100%;
    text-align: left;
}
    /* Hide the default scrollbars */
    .custom-scroll {
        /* width: 100%;
        height: 100%;
        overflow: scroll; */
        /*scrollbar-width: none;*/ /* For Firefox */
      }

      .custom-scroll::-webkit-scrollbar {
       /* display: none;*/ /* For Chrome, Safari, and Opera */
      }
      .scroll-container {
        /* position: relative; */
        /* width: 100%; */
        /* height: 400px;
        overflow: hidden; */
      }

      .custom-scroll {
        /* width: 100%;
        height: 100%; */
        /*  overflow: auto;*/ /* Enable native scrolling */
      }

      .scroll-content {
        /* width: 1000px; */
       /* height: 800px; */ /* More than container height to enable vertical scroll */
        /* padding: 10px; */
      }

      /* .scrollbar-vertical, .scrollbar-horizontal {
        position: absolute;
        background-color: #f1f1f1;
        border-radius: 5px;
      } */

      /* .scrollbar-vertical {
        width: 10px;
        right: 0;
        top: 0;
        bottom: 10px;
      }

      .scrollbar-horizontal {
        height: 10px;
        left: 0;
        bottom: 0;
        right: 10px;
      }

      .thumb-vertical, .thumb-horizontal {
        background-color: #888;
        position: absolute;
        border-radius: 5px;
        cursor: pointer;
      }

      .thumb-vertical {
        width: 100%;
        height: 50px;
      }

      .thumb-horizontal {
        height: 100%;
        width: 50px;
      }

      .thumb-vertical:hover, .thumb-horizontal:hover {
        background-color: #555;
      }
       */
      /* To prevent text selection while dragging */
      .no-select {
        user-select: none;
      }

.card-img, .card-img-top { border-radius: unset; }
.form-control[type=file] { line-height: 30px; }
.cafe-body-main h5 { font-size: 20px; font-style: normal; font-weight: 700; line-height: normal; color: var(--vz-tertiary); }
.inventory-img { position: relative; display: block; width: 100%; padding: 0; overflow: hidden; }
/* .inventory-img:before { display: block; content: ""; padding-top: 39.79%; box-sizing: border-box; }
.inventory-img > img { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; -o-object-fit: cover; object-fit: cover; } */
.inventory-img:before { display: block; content: ""; padding-top: 39.79%; box-sizing: border-box; }
.inventory-img > img { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; -o-object-fit: cover; object-fit: cover; }
.card-body .swiper-scrollbar { height: 12px !important; border-radius: unset !important; !important; padding: 0; }
.card-body .swiper-scrollbar .swiper-scrollbar-drag { width: 120px !important; background-color: #a06a17 !important; border-radius: unset !important; padding: 0; }
.inventory-img-main button.badge-btn { height: 30px; display: flex; justify-content: center; align-items: center; color: var(--vz-secondary-color); font-size: 14px; font-style: normal; font-weight: 400; line-height: 26px; background: #F3F2F2; border: unset; padding: 4.1px 6px; position: absolute; left: 10px; bottom: 10px; border-radius: 0; }
.inventory-img-main button.badge-btn:hover { background-color: var(--vz-secondary-color); color: #ffffff; }
.orders-inventory-box .card .title-text { width: calc(100% - 115px); display: flex; flex-direction: column; gap: 5px; max-width: 320px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; }
.orders-inventory-box .card .title-text button.card-title-btn { width: max-content; color: #000; font-size: 16px; font-weight: 600; line-height: 22px; text-align: left; border: unset; padding: 0; margin: 0; cursor: pointer; }
.orders-inventory-box .card .title-text button.card-title-btn:hover { color: #503307; background-color: transparent; }
.card-body.inventory-infos .i-card-info { gap: 20px; }
.card-body.inventory-infos .i-card-info h4 { font-size: 14px; line-height: 1; margin: 0; }
.card-body.inventory-infos .i-card-info p.card-text { width: 100%; max-width: 320px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; }
p.card-text-tooltip { position: absolute; visibility: hidden; opacity: 0; transition: opacity 1s ease; left: 0; bottom: 100%; padding: 10px; border-radius: 2px; background: #503307; color: rgb(255, 255, 255); box-shadow: 0px 0px 12px rgba(2, 2, 111, 0.4); margin: 0; }
p.card-text:hover + .card-text-tooltip { visibility: visible; opacity: 1; transition: opacity 0.5s ease-in-out; }
.card-body.inventory-infos .i-card-info .info-content { width: calc(100% - 115px); }
.card-body.inventory-infos .i-card-info h4.in-stock { color: #008000; }
.card-body.inventory-infos .i-card-info h4.out-of-stock { color: #ff0000; }
.orders-inventory-box .card h4.in-stock { color: #008000; background-color: transparent !important; }
.orders-inventory-box .card h4.out-of-stock  { color: #ff0000; background-color: transparent !important; }
#category-container .card.main-card  { background: #fbf7f4; padding: 20px 20px 0; }
#category-container .card-header { background-color: transparent; }
#category-container .card .card-header h2 { font-size: 25px; }
.orders-inventory-box .card.main-card .card-body .card { background-color: #ffffff; border: 1px solid #F3F2F2; }
.swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal { width: 100% !important; left: 0 !important; }
.modal-body .item-img img { max-height: 250px; }

.select2-container--default .select2-selection--single { height: 46px !important; display: flex !important; align-items: center; border: 1.163px solid #CED4DA !important; border-radius: unset !important; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 15.333px !important;  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8.03203 8.92759L11.1515 5.76511L12.0426 6.66849L8.03203 10.7344L4.02148 6.66849L4.91258 5.76511L8.03203 8.92759Z' fill='black'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; background-size: 24px; position: relative !important; margin-right: 15.32px; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { display: none; }
.select2-container--default .select2-selection--single .select2-selection__rendered { width: 100%; font-size: 16.288px; font-weight: 400; color: #212529 !important; padding-left: 14.4px !important; }
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: #212529 !important; }
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background-color: #A06A17 !important; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #A06A17 !important; }
/* .select2-container--open .select2-dropdown--below { width: 370px !important; } */
button#add-main-category-btn { height: 46px; position: relative; top: 0; }

/* .upload-container { width: 100%; border: 1px solid #D0D5DD; border-radius: 8px; text-align: center; box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); padding: 12px 16px; }
.upload-preview { display: none; margin-top: 0; }
.upload-preview img { max-width: 100%; border-radius: 4px; width: auto; height: 100px; object-fit: cover; object-position: center; }
.upload-btn { display: inline-flex; align-items: center; font-size: 16px; font-weight: 400; color: #667085; cursor: pointer; padding: 26px 0; margin: 0; }
.upload-btn svg { margin-left: 5px; } */

.upload-container { width: 100%; border: 1px solid #D0D5DD; border-radius: 8px; text-align: center; box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); position: relative; }
.upload-preview { display: none; margin-top: -25px; margin-bottom: 12px; }
.upload-preview img { max-width: 100%; border-radius: 4px; width: auto; height: 100px; object-fit: cover; object-position: center; }
.upload-btn { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: 400; color: #667085; cursor: pointer; padding: 38px 16px; margin: 0; }
.upload-btn svg { margin-left: 8px; }
.cancel-btn { width: 30px; height: 30px; position: absolute; top: 10px; right: 10px; background-color: #e7e4e4; border: none; border-radius: 50%; cursor: pointer; padding: 4px; display: none; }
.cancel-btn svg { width: 16px; height: 16px; color: #666; }
.btn-close { width: 24px; height: 24px; --vz-btn-close-bg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M1 1L15 15M1.00003 15L8.00003 8L15 1' stroke='%232D264B' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); opacity: 1; padding: 0 !important; position: relative; right: 5px; }
.modal-content { padding: 10px; }
.variation-row button { width: 48px; height: 48px; border-radius: 100%; --vz-btn-bg: var(--vz-secondary-color); --vz-btn-border-color: var(--vz-secondary-color); --vz-btn-hover-bg: var(--vz-secondary); --vz-btn-hover-border-color: var(--vz-secondary); --vz-btn-focus-shadow-rgb: var(--vz-primary-rgb); --vz-btn-active-bg: var(--vz-secondary); --vz-btn-active-border-color: var(--vz-secondary); --vz-btn-color: #F3F2F2; }
.variation-row button.btn-danger { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M1 1L15 15M1.00003 15L8.00003 8L15 1' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; background-size: auto; font-size: 0; }
button.remove-variation { width: 48px; height: 48px; border-radius: 100%; --vz-btn-bg: var(--vz-secondary-color); --vz-btn-border-color: var(--vz-secondary-color); --vz-btn-hover-bg: var(--vz-secondary); --vz-btn-hover-border-color: var(--vz-secondary); --vz-btn-focus-shadow-rgb: var(--vz-primary-rgb); --vz-btn-active-bg: var(--vz-secondary); --vz-btn-active-border-color: var(--vz-secondary); --vz-btn-color: #F3F2F2; }
button.remove-variation.btn-secondary { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M1 1L15 15M1.00003 15L8.00003 8L15 1' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; background-size: auto; font-size: 0; }
#viewItemVariations { max-height: 100px; overflow-y: auto; }
#viewItemVariations .row { background: #A06A17; border-bottom: 1px solid #ffffff; margin: 0; }
#viewItemVariations .row:last-child { border-bottom: unset; }
#viewItemVariations .row .col-md-4 { text-align: center; color: #ffffff; border-right: 1px solid #ffffff; padding: 5px; }
#viewItemVariations .row .col-md-4 strong { color: #ffffff; }
.action-buttons { display: flex; }
#viewItemVariations .row .col-md-4:last-child { border-right: unset; }

.navbar-header { padding: 0 0 0 .75rem }
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .logo span.logo-sm img { width: 50px !important; height: 50px !important; }
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu { position: fixed; padding-top: 110px; padding-bottom: 0; }
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .simplebar-content-wrapper { overflow: hidden scroll !important; }
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover .nav-link span { background-color: #ffffff; position: fixed; left: 80px; }
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>a.menu-link span { padding-left: 0; }
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .simplebar-mask { top: -15px; }
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>.menu-dropdown { position: fixed; margin-top: -15px; }
.navbar-menu .navbar-nav .nav-link:hover { color: var(--vz-secondary); }
.navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true] { color: var(--vz-secondary); }
.navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true]:after { color: var(--vz-secondary); }
.navbar-menu .navbar-nav .nav-sm .nav-link.active { color: var(--vz-secondary); }
.navbar-menu .navbar-nav .nav-sm .nav-link:hover { color: var(--vz-secondary); }
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-sm .nav-item:hover>.nav-link { color: var(--vz-secondary); }
.navbar-menu .navbar-nav .nav-sm .nav-link:hover:before { background-color: var(--vz-secondary) !important; }
table.dataTable { width: 100% !important; }
.selling-products-img img { width: 100%; height: 100%; display: flex; object-fit: cover; object-position: center; }
.generate-report-btn:hover { color: #ffffff; }
.generate-report-btn:hover i { color: #ffffff; }
.header-profile-user { object-fit: cover; object-position: center; }
body.modal-open { padding-right: 0 !important; }
button.cart-icon {  width: 50px; height: 50px; background-color: #F3F6F9; border-radius: 100% !important; padding: 11px; }
#loader { width: 100%; height: 100%; text-align: center; position: fixed; margin: 0px; transform: translate(-50%, -50%); left: 50%; top: 50%; display: block; z-index: 99999; display: flex; justify-content: center; align-items: center; background-color: #f8f8f8; }
.card-body.inventory-infos { background: #F3F2F2; border-radius: 0; position: relative; }
.dropdown-head { background-color: #A06A17 !important; }
.dropdown-head .nav-tabs-custom .nav-link.active { color: #A06A17 !important; }
#notificationItemsTabContent button.btn-soft-success { background-color: #EEE1CE; color: #495057; }
#notificationItemsTabContent button.btn-soft-success:hover { background-color: #A06A17; color: #ffffff !important; }
.page-link { color: var(--vz-btn-hover-bg); }
.active>.page-link { background-color: var(--vz-secondary); border-color: var(--vz-btn-hover-bg); }
.page-link.active { background-color: var(--vz-btn-hover-bg); }
.page-item.active { background-color: var(--vz-btn-hover-bg); }
.page-link:hover { color: var(--vz-btn-hover-bg); }
.card-body.inventory-infos .inv-btn .icon-btn  button { background-color: transparent; border: unset; padding: 0; }
.card-body.inventory-infos .inv-btn .icon-btn { display: flex; gap: 12px; }
.card-body.inventory-infos .inv-btn button.add-to-cart-btn { width: 120px; }
.card-body.inventory-infos .inv-btn .icon-btn button i.ri-eye-line:hover { color: #a06a17; }
.card-body.inventory-infos .inv-btn .icon-btn button i.ri-edit-2-line:hover { color: #503307; }
.card-body.inventory-infos .inv-btn button.delete-btn { width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; border-radius: 100%; border: unset; background-color: #f3f2f2; position: absolute; top: 16px; right: 16px; }
.card-body.inventory-infos .inv-btn button.delete-btn i { font-size: 16px; color: var(--vz-secondary-color); }
.card-body.inventory-infos .inv-btn button.delete-btn:hover { background-color: #a06a17; }
.card-body.inventory-infos .inv-btn button.delete-btn:hover i { color: #ffffff; }
.inventory-img-main button.delete-btn { width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; border-radius: 100%; border: unset; background-color: #f3f2f2; position: absolute; top: 16px; right: 16px; }
.inventory-img-main button.delete-btn i { font-size: 16px; color: var(--vz-secondary-color); }
.inventory-img-main button.delete-btn:hover { background-color: #a06a17; }
.inventory-img-main button.delete-btn:hover i { color: #ffffff; }
/* ===== shopping-cart-css-start ===== */
.shopping-cart.active { width: 100%; height: 100vh; display: flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.30); position: fixed; z-index: 99999999; }
.shopping-cart .cart-container { position: relative; }
.shopping-cart .cart-button { position: fixed; top: 20px; right: 20px; z-index: 10; }
.shopping-cart .cart-sidebar { position: fixed; top: 0; right: 0; height: 100%; width: 640px; background-color: #fff; box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2); display: flex; flex-direction: column; transform: translateX(100%); transition: transform 0.3s ease-in-out; z-index: 9999999; }
.shopping-cart .cart-sidebar.open { transform: translateX(0); }
.shopping-cart .cart-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 30px; background-color: #F2F2F2; }
.shopping-cart .cart-header h2 { font-size: 26px; font-style: normal; font-weight: 500; line-height: 40px; color: #503307; margin: 0; }
.shopping-cart .cart-header .close-cart { background: none; border: none; font-size: 24px; cursor: pointer; }
.shopping-cart .cart-items { display: flex; flex-direction: column; row-gap: 40px; flex: 1; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #a06a17 #f1f1f1; padding: 30px; }
.shopping-cart .cart-item { display: flex; align-items: center; gap: 26px; }
.shopping-cart .item-image { width: 25%; height: 100%; object-fit: contain; object-position: center; background-color: #f2f2f2; }
.shopping-cart .item-details { flex: 1; }
.shopping-cart .item-quantity {min-width: 40.38%; max-width: max-content;display: flex;justify-content: center;align-items: center;gap: 10px;background-color: #503307;padding: 10px;margin-bottom: 10px;}
.shopping-cart .item-quantity button {width: 27px;height: 27px;display: flex;justify-content: center;align-items: center;cursor: pointer;background-color: transparent;border: unset;padding: 0;}
.shopping-cart .item-quantity button img.quantity-icon { width: 27px; display: flex; object-fit: contain; object-position: center; }
.shopping-cart .delete-item { background-color: #b5651d; color: #fff; border: none; padding: 5px 10px; cursor: pointer; }
.shopping-cart .cart-footer { display: flex; flex-direction: column; gap: 20px; padding: 30px 30px 70px; }
.shopping-cart .cart-footer label { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.shopping-cart .cart-item button.delete-item { width: 130px; height: 50px; display: flex; justify-content: center; align-items: center; font-family: Poppins; font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; background-color: #503307; color: #fff; cursor: pointer; padding: 10px; }
.shopping-cart .cart-item button.delete-item:hover { background-color: #A06A17; }
.shopping-cart .cart-header .close-cart:hover svg path { fill: #A06A17; }
.shopping-cart .item-details p.item-name { font-family: Poppins; font-size: 18px; font-style: normal; font-weight: 400; line-height: 26px; color: #503307; margin-bottom: 2px; }
.shopping-cart .item-details p.item-price { font-family: Poppins; font-size: 26px; font-style: normal; font-weight: 600; line-height: 44px; color: #503307; margin-bottom: 10px; }
.shopping-cart .item-quantity span.quantity { font-size: 16px; font-style: normal; font-weight: 500; line-height: normal; color: #ffffff; }
.shopping-cart p.item-size { font-family: Poppins; font-size: 20px; font-style: normal; font-weight: 500; line-height: 24px; letter-spacing: -0.12px; color: #503307; margin: 0; }
.shopping-cart .cart-footer p { width: 100%; display: flex; justify-content: space-between; align-items: center; font-family: Poppins; font-size: 26px; font-style: normal; font-weight: 600; line-height: 36px; color: #503307; margin: 0; }
.shopping-cart .cart-footer a.proceed-button { width: 100%; height: 50px; display: flex; justify-content: center; align-items: center; font-family: Poppins; font-size: 14px; font-style: normal; font-weight: 600; line-height: 24px; letter-spacing: -0.084px; text-align: center; color: #ffffff; background-color: #503307; border: unset; padding: 8px 16px; }
.shopping-cart .cart-footer a.proceed-button:hover { background-color: #A06A17; }
.shopping-cart .cart-footer button.proceed-button svg { margin-left: 10px; }
.shopping-cart .cart-items::-webkit-scrollbar { width: 12px; }
.shopping-cart .cart-items::-webkit-scrollbar-track { background-color: #f1f1f1; }
.shopping-cart .cart-items::-webkit-scrollbar-thumb { background-color: #a06a17; border-radius: 10px; }
.shopping-cart .cart-items::-webkit-scrollbar-thumb:hover { background-color: #8d5713; }
#notificationItemsTabContent button.btn-soft-success { display: none; }
/* ===== shopping-cart-css-end ===== */

/* ===== shopping-cart-view-css-start ===== */
.shopping-cart-view { width: 100%; height: 100%; display: inline-block; vertical-align: top; background: #F2F2F2; padding: 20px; }
.shopping-cart-view .cart-container { position: relative; }
.shopping-cart-view .cart-sidebar { width: 100%; height: 100%; display: flex; flex-direction: column; overflow-y: auto; }
.shopping-cart-view .cart-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 30px; background-color: #F2F2F2; }
.shopping-cart-view .cart-header h2 { font-size: 26px; font-style: normal; font-weight: 500; line-height: 40px; color: #503307; margin: 0; }
.shopping-cart-view .cart-header .close-cart { background: none; border: none; font-size: 24px; cursor: pointer; }
.shopping-cart-view .cart-items { max-height: 332px; display: flex; flex-direction: column; row-gap: 40px; flex: 1; scrollbar-width: thin; scrollbar-color: #a06a17 #f1f1f1; padding: 0; overflow-y: auto; }
.shopping-cart-view .cart-item { display: flex; align-items: center; gap: 26px; }
.shopping-cart-view .item-image { /*width: 28.13%;*/width: 100px; min-height: 100px; object-fit: contain; object-position: center; background-color: #eee1ce; }
.shopping-cart-view .item-details { flex: 1; }
.shopping-cart-view .item-quantity {min-width: 40.38%; max-width: max-content;display: flex;justify-content: center;align-items: center;gap: 10px;background-color: #503307;padding: 10px;margin-bottom: 10px;}
.shopping-cart-view .item-quantity button {width: 27px;height: 27px;display: flex;justify-content: center;align-items: center;cursor: pointer;background-color: transparent;border: unset;padding: 0;}
.shopping-cart-view .item-quantity button img.quantity-icon { width: 27px; display: flex; object-fit: contain; object-position: center; }
.shopping-cart-view .delete-item { background-color: #b5651d; color: #fff; border: none; padding: 5px 10px; cursor: pointer; }
.shopping-cart-view .cart-footer { display: flex; flex-direction: column; gap: 20px; padding: 30px 18px 0; }
.shopping-cart-view .cart-footer label { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.shopping-cart-view .cart-item button.delete-item { width: 130px; height: 50px; display: flex; justify-content: center; align-items: center; font-family: Poppins; font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; background-color: #503307; color: #fff; cursor: pointer; padding: 10px; }
.shopping-cart-view .cart-item button.delete-item:hover { background-color: #A06A17; }
.shopping-cart-view .cart-header .close-cart:hover svg path { fill: #A06A17; }
.shopping-cart-view .item-details p.item-name { font-family: Poppins; font-size: 18px; font-style: normal; font-weight: 400; line-height: 26px; color: #503307; margin-bottom: 2px; }
.shopping-cart-view .item-details p.item-price { font-family: Poppins; font-size: 26px; font-style: normal; font-weight: 600; line-height: 44px; color: #503307; /*margin-bottom: 10px;*/ margin-bottom: 0; }
.shopping-cart-view .item-quantity span.quantity { font-size: 16px; font-style: normal; font-weight: 500; line-height: normal; color: #ffffff; }
.shopping-cart-view p.item-size { font-family: Poppins; font-size: 20px; font-style: normal; font-weight: 500; line-height: 24px; letter-spacing: -0.12px; color: #503307; margin: 0; }
.shopping-cart-view .cart-footer .price-list .label-price { width: 100%; display: flex; justify-content: space-between; align-items: center; font-family: "Public Sans"; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; color: #212529; margin: 0; }
.shopping-cart-view .cart-footer a.proceed-button { width: 100%; height: 50px; display: flex; justify-content: center; align-items: center; font-family: Poppins; font-size: 14px; font-style: normal; font-weight: 600; line-height: 24px; letter-spacing: -0.084px; text-align: center; color: #ffffff; background-color: #503307; border: unset; padding: 8px 16px; }
.shopping-cart-view .cart-footer a.proceed-button:hover { background-color: #A06A17; }
.shopping-cart-view .cart-footer button.proceed-button svg { margin-left: 10px; }
.shopping-cart-view .cart-footer .price-list { gap: 29px; }
.shopping-cart-view .cart-footer .price-list .label-price .label span { color: #9599AD; }
.shopping-cart-view .cart-sidebar .total { font-family: "Public Sans"; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; color: #ffffff; background-color: #A06A17; border-radius: 0px 0px 4px 4px; padding: 14.5px 20px; margin: 20px 0 0; }
.shopping-cart-view .cart-items::-webkit-scrollbar { width: 12px; }
.shopping-cart-view .cart-items::-webkit-scrollbar-track { background-color: #f1f1f1; }
.shopping-cart-view .cart-items::-webkit-scrollbar-thumb { background-color: #a06a17; border-radius: 10px; }
.shopping-cart-view .cart-items::-webkit-scrollbar-thumb:hover { background-color: #8d5713; }
.no-scroll { overflow: hidden; }
/* ===== shopping-cart-view-css-end ===== */

/* ===== payment-css-start ===== */
.payment-wrap .payment-header { width: 100%; display: flex; flex-direction: column; gap: 10px; padding: 20px 20px 0; }
.payment-wrap .payment-body { gap: 20px; padding: 20px 20px 18px; }
.payment-container { width: 100%; display: flex; gap: 20px; background-color: #F2F2F2; padding: 20px; }
.payment-methods, .payment-details { background-color: #FDFDFD;; padding: 20px; border-radius: 0; }
.payment-wrap .icon-wrapper { background-color: #D4B271; border-radius: 50%; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; margin: 0 0 12px; }
.payment-wrap .icon-wrapper img.icon { width: 100%; display: flex; object-fit: cover; object-position: center; }
.payment-wrap .card-option { display: flex; justify-content: space-between; align-items: center; padding: 16px; border: 1px solid #EAECF0; border-radius: 8px; margin: 12px 0 0; }
.payment-wrap .card-option.selected { background-color: #EADAC3; border-color: #503307; }
.payment-wrap .card-icon { width: 46px; margin-right: 12px; }
.payment-wrap .card-info p { margin: 0; }
.payment-wrap .payment-details form {  width: 100%; display: flex; flex-wrap: wrap; gap: 16px; margin: 20px 0 0; }
.payment-wrap form label { flex: 1 0 100%; font-size: 0.85em; }
.payment-wrap form input { padding: 10px; border: 1px solid #ddd; border-radius: 4px; width: 100%; }
.payment-wrap form button { padding: 10px; margin-top: 20px; border: none; border-radius: 4px; cursor: pointer; }
.payment-wrap form button[type="button"] { background: #ddd; }
.payment-wrap form button[type="submit"] { background: #D4B271; color: #fff; }
.payment-wrap .payment-body .listing-view { width: 35%; }
.payment-wrap .payment-body .payment-info { width: 65%; display: flex; }
.payment-methods { width: 37%; display: flex; flex-direction: column; gap: 8px; }
.payment-methods h2 { font-size: 18px; font-style: normal; font-weight: 500; line-height: 28px; color: #101828; margin: 0; }
.payment-methods p { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; color: #503307; margin: 0; }
.payment-wrap .card-option .card-info { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; background-color: transparent; color: #503307; }
.payment-wrap .card-option .check-icon { width: 16px; height: 16px; display: flex; margin-left: 4px; }
.payment-wrap .card-option .check-icon img { width: 100%; display: flex; object-fit: contain; object-position: center; }
.payment-wrap .card-info p.label { font-weight: 500; }
.payment-details { width: 63%; display: flex; flex-direction: column; gap: 10px; background-color: #F2F2F2; padding: 0; }
.payment-details .contact-info { width: 100%; display: flex; flex-direction: column; gap: 8px; background-color: #ffffff; padding: 20px; }
.payment-details .contact-info h2 { font-size: 18px; font-style: normal; font-weight: 500; line-height: 28px; color: #101828; margin: 0; }
.payment-details .contact-info p { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; color: #503307; margin: 0; }
.payment-details .contact-info .mail-wrap { width: 100%; display: flex; flex-direction: column; gap: 6px; margin: 12px 0 0; }
.payment-details .contact-info .mail-wrap label { font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; color: #344054; }
.payment-details .contact-info .mail-wrap input[type="email"] { display: flex; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; border-radius: 8px; color: #101828; border: 1px solid #D0D5DD; box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); padding: 10px 14px; }
.payment-details .payment-info-card { width: 100%; display: flex; flex-direction: column; gap: 0; background-color: #ffffff; padding: 20px; }
.payment-details .payment-info-card h2 { font-size: 18px; font-style: normal; font-weight: 500; line-height: 28px; color: #101828; margin: 0; }
.payment-details .payment-info-card span.label { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; color: #667085; margin: 8px 0 0; }
.payment-wrap .payment-details form .form-group { width: 100%; display: flex; gap: 16px; }
.payment-wrap .payment-details form .form-group .label-input { width: 100%; display: flex; flex-direction: column; gap: 6px; }
.payment-wrap .payment-details form .form-group .label-input label { flex: 1; font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; color: #344054; margin: 0; }
.payment-wrap .payment-details form .form-group .label-input input { font-size: 14px; font-style: normal; font-weight: 400; line-height: 24px; border-radius: 8px; border: 1px solid  #D0D5DD; box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); }
.payment-wrap .payment-details form .form-group .small-field { width: 112px; }
.payment-wrap .payment-details form  .form-btn-group { width: 100%; display: flex; gap: 12px; justify-content: space-between; align-items: center; margin: 16px auto 0; }
.payment-wrap .payment-details form .form-btn-group button { width: 50%; height: 44px; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; margin: 0; }
.payment-wrap .payment-details form .form-btn-group button.cancel { color: #344054; background-color: #ffffff; border: 1px solid #D0D5DD; border-radius: 8px; box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); }
.payment-wrap .payment-details form .form-btn-group button.pay-now { color: #ffffff; background-color: #503307; border: 1px solid #503307; border-radius: unset; box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); }
.payment-wrap .payment-details form .form-group .label-input .card-no-wrap { position: relative; z-index: 1; }
.payment-wrap .payment-details form .form-group .label-input .card-no-wrap:before { content: ""; width: 34px; height: 24px; display: flex; background-image: url('http://emari.local/build/images/stripe-icon.png'); background-repeat: no-repeat; background-size: contain; background-position: center; position: absolute; top: 12px; left: 10px; }
.payment-wrap .payment-details form .form-group .label-input .card-no-wrap input#card-number { padding-left: 50px; }
.payment-wrap .payment-header .heading-kicker { font-size: 14px; font-style: normal; font-weight: 500; line-height: normal; color: #000; }
.payment-wrap .payment-header .heading-kicker span { color: rgba(73, 80, 87, 0.60); }
.payment-wrap .payment-header h5 { font-size: 20px; font-style: normal; font-weight: 500; line-height: normal; color: #100; }
.payment-wrap .payment-details form .form-btn-group button.cancel:hover { color: #A06A17; border: 1px solid #A06A17; }
.payment-wrap .payment-details form .form-btn-group button.pay-now:hover { background-color: #A06A17; border: 1px solid #A06A17; }
.payment-body .shopping-cart-view .item-quantity { display: none; }
.payment-body button.delete-item { display: none !important; }
/* ===== payment-css-end ===== */

/* ===== shipment-details-css-start ===== */
.payment-container .shipment-details { width: 100%;  }
.timeline-container { width: 100%; margin: auto; display: block; position: relative; }
.timeline-container ul.tl { width: 100%; display: inline-block; vertical-align: top; padding: 0; margin: 40px 0;  }
.timeline-container ul.tl li { align-items: center; list-style: none; margin: auto; min-height: 60px; padding: 0 0 30px 0; position: relative; z-index: 1; display: flex; flex-direction: row; }
.timeline-container ul.tl li:last-child { border-left: 0; padding-bottom: 0; }
.timeline-container ul.tl li .item-icon { display: flex; justify-content: center; align-items: center; left: 0; top: 0; content: " "; border-radius: 100%; background: #ffffff; height: 60px; width: 60px; min-width: 60px; margin-right: 16px; }
.timeline-container ul.tl li:hover::before { border-color: #258cc7; transition: all 1000ms ease-in-out; }
.timeline-container ul.tl li:before { content: ""; width: 7px; height: 100%; background-color: #503307; position: absolute; top: 0; left: 26px; z-index: -1; }
.timeline-container ul.tl li.dashed:before { background-color: #A06A17; }
ul.tl li .item-text { display: flex; flex-direction: column; flex-grow: 1; }
ul.tl li .item-title { }
ul.tl li .item-detail { color: rgba(0, 0, 0, 0.5); font-size: 12px; }
ul.tl li .item-timestamp { color: #8d8d8d; font-size: 12px; text-align: right; padding-left: 20px; }
ul.tl li .item-timestamp button.next { width: 120px; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; color: #ffffff; background-color: #A06A17; border: unset; box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); padding: 10px 18px; }
ul.tl li .item-timestamp button.next:hover { background-color: #503307; }
.payment-container .shipment-details .title-btn { width: 100%; display: flex; justify-content: space-between; align-items: center;margin: 14px; }
.payment-container .shipment-details .title-btn-d-time { width: 100%; display: flex; align-items: center;margin: 14px; }

.payment-container .shipment-details .title-btn h5 { font-size: 20px; font-style: normal; font-weight: 500; line-height: normal; color: #100; }
.payment-container .shipment-details .title-btn span { width: 214px; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; text-align: center; color: #ffffff; background-color: #503307; border: 1px solid #503307; box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); padding: 10px 18px; }
.timeline-container ul.tl li .item-icon svg path { fill-opacity: 1; }
.timeline-container ul.tl li.dashed .item-icon svg path { fill-opacity: 0.2; }
.current-status {font-weight: bold; color: #503307; text-transform: uppercase;}
/* ===== shipment-details-css-end ===== */

.modal-body .item-img { width: 100%; display: flex; justify-content: center; align-items: center; margin: 0 auto 20px; }
.modal-body .item-img img { width: 100%; height: 100%; display: flex; object-fit: contain; object-position: center; }
.table-card .avatar-sm img { width: 100%; height: 100%; display: flex; object-fit: cover; object-position: center; }
g#SvgjsG1105 { transform: translate(0, 0) !important; }
.inventory-wrapper input#search-inventory { width: calc(100% - 18px); margin: 0px 9px; }
.auth-one-bg { background-image: url(/build/icons/login-banner-bg.jpg); height: 100%; display: flex; justify-content: center; align-items: center; }
.auth-one-bg .bg-overlay { /*background: linear-gradient(to right, #A06A17, #687cfe);*/ background: #000; opacity: .7; }
.auth-page-wrapper .shape { display: none; }
.auth-page-wrapper .footer p.text-muted { color: #ffffff !important; }
.auth-page-wrapper .auth-logo { width: 100%; display: flex; justify-content: center; align-items: center; text-align: center; margin: 0 auto; position: relative; z-index: 1; }
.auth-page-wrapper .auth-logo svg { width: 200px; height: 200px; }
.auth-page-wrapper .auth-logo svg path { fill: #ffffff; }
.auth-page-wrapper .auth-page-content .card { background-color: #0000007a; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; }
.auth-page-wrapper .auth-page-content h5 { color: #ffffff !important; }
.auth-page-wrapper .auth-page-content form button { --vz-btn-bg: #503307b0; --vz-btn-border-color: #503307b0; }
.auth-page-wrapper .auth-page-content form .form-label { color: #ffffff; }
.auth-page-wrapper .auth-page-content form a.text-muted { color: #ffffff !important; }
.auth-page-wrapper .auth-page-content form .form-check .form-check-input, .auth-page-wrapper .auth-page-content form .form-check label { color: #ffffff; }
.auth-pass-inputgroup button#password-addon { background-color: #ffffff; --vz-btn-border-color: #D0D5DD; padding: 0 10px 0 0; margin: 0; border-left: unset; border-right: unset; margin-top: 10px; margin-right: 2px; border: unset; }
.auth-page-wrapper .footer a:hover { color: #ffc17b !important; }

/* .auth-page-wrapper .auth-logo, .auth-page-wrapper .auth-page-content .card-body {
    opacity: 0;
    animation: fadeIn 0.5s ease-in forwards;
}

.auth-page-wrapper .auth-logo.fade-in, .auth-page-wrapper .auth-page-content .card-body.fade-in {
    animation: fadeIn 0.5s ease-in forwards;
} */

.auth-page-wrapper { opacity: 0; animation: fadeIn 0.5s ease-in forwards; }
.auth-page-wrapper.fade-in { animation: fadeIn 0.5s ease-in forwards; }


@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.topping-radio-wrap { width: 100%; display: flex; justify-content: flex-start; align-items: center; gap: 15px; }
.topping-radio-wrap .topping-radio { display: flex; align-items: center; position: relative; z-index: 1; }
.topping-radio-wrap .topping-radio [type="radio"]:checked, .topping-radio-wrap .topping-radio [type="radio"]:not(:checked) { appearance: none; -webkit-appearance: none; }
.topping-radio-wrap .topping-radio [type="radio"]:not(:checked) + label { position: relative; padding-left: 24px; cursor: pointer; line-height: 20px; display: inline-block; color: #666; margin: 0; }
.topping-radio-wrap .topping-radio [type="radio"]:not(:checked) + label:before { content: ''; position: absolute; left: 0; top: 1px; width: 18px; height: 18px; border: 1px solid #ddd; border-radius: 100%; background: #fff; }
.topping-radio-wrap .topping-radio [type="radio"]:not(:checked) + label:after { content: ''; width: 12px; height: 12px; background: #F87DA9; position: absolute; top: 4px; left: 4px; border-radius: 100%; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; opacity: 0; /*-webkit-transform: scale(0); transform: scale(0);*/ }
.topping-radio-wrap .topping-radio [type="radio"]:checked + label { position: relative; padding-left: 24px; cursor: pointer; line-height: 20px; display: inline-block; color: #666; margin: 0; }
.topping-radio-wrap .topping-radio [type="radio"]:checked:before { content: ''; position: absolute; left: 0; top: 0; width: 19px; height: 19px; border: 1px solid #ddd; border-radius: 100%; background: #fff; }
.topping-radio-wrap .topping-radio [type="radio"]:checked:after { content: ''; width: 13px; height: 13px; background: #a06a17; position: absolute; top: 2.5px; left: 3px; border-radius: 100%; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; opacity: 1; /*-webkit-transform: scale(1); transform: scale(1);*/ }
#toppings-container { margin: 0 0 25px; }
#toppings-container h5 { margin-bottom: 15px; }
button.remove-topping { width: 48px; height: 48px; border-radius: 100%; --vz-btn-bg: var(--vz-secondary-color); --vz-btn-border-color: var(--vz-secondary-color); --vz-btn-hover-bg: var(--vz-secondary); --vz-btn-hover-border-color: var(--vz-secondary); --vz-btn-focus-shadow-rgb: var(--vz-primary-rgb); --vz-btn-active-bg: var(--vz-secondary); --vz-btn-active-border-color: var(--vz-secondary); --vz-btn-color: #F3F2F2; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M1 1L15 15M1.00003 15L8.00003 8L15 1' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; background-size: auto; font-size: 0; }
.modal { padding: 0 !important; }
.modal-backdrop { width: 100%; height: 100%; }
button#add-edit-topping {  margin: 0 0 25px; }
#inventory-results .i-card-headings .i-add-edit-btn button{ margin-right: 6px; }

.swiper-wrapper {
    will-change: transform;
}

.swiper-slide {
    backface-visibility: hidden;
    transform: translateZ(0);
}

.cat-btn { display: flex; gap: 10px; }
button.edit-main-category-btn { background-color: #f1e2cc; border-color: #fdf3e4; border-radius: .25rem; }
button.edit-main-category-btn i { color: #efae4e; }
button.delete-main-category-btn { background-color: #ffece7; border-color: #ffece7; border-radius: .25rem; }
button.delete-main-category-btn i { color: #ff7f5d; }
button.add-subcategory-btn { color: #503307; background-color: transparent; border: unset; text-decoration: underline; padding: 0; margin: 0; }
button.add-subcategory-btn:hover { color: #a06a17; background-color: transparent; border: unset; }
button.edit-sub-category-btn { background-color: #f1e2cc; border-color: #fdf3e4; border-radius: .25rem; }
button.edit-sub-category-btn i { color: #efae4e; }
button.delete-sub-category-btn { background-color: #ffece7; border-color: #ffece7; border-radius: .25rem; }
button.delete-sub-category-btn i { color: #ff7f5d; }
button.add-item-btn { color: #503307; background-color: transparent; border: unset; text-decoration: underline; padding: 0; margin: 0; }
button.add-item-btn:hover { color: #a06a17; background-color: transparent; border: unset; }
button.edit-main-category-btn:hover { background-color: #a06a17; border-color: #a06a17; }
button.edit-main-category-btn:hover i { color: #ffffff; }
button.delete-main-category-btn:hover { background-color: #ff7f5d; border-color: #ff7f5d; }
button.delete-main-category-btn:hover i { color: #ffffff; }
button.edit-sub-category-btn:hover { background-color: #a06a17; border-color: #a06a17; }
button.edit-sub-category-btn:hover i { color: #ffffff; }
button.delete-sub-category-btn:hover { background-color: #ff7f5d; border-color: #ff7f5d; }
button.delete-sub-category-btn:hover i { color: #ffffff; }


/* ===== order-items-css-start ===== */
.payment-card { width: 100%; display: flex; justify-content: space-between; gap: 20px; padding: 20px 20px 18px; }
.payment-card .payment-order-wrap { width: 35%; background-color: #F2F2F2; }
.payment-wrap.order-items .payment-body h5.title { font-size: 18px; font-style: normal; font-weight: 500; line-height: normal; color: #100; }
.payment-wrap.order-items .payment-body .cart-container { width: 100%; max-height: 332px; display: flex; flex-direction: column; gap: 20px; flex: 1; scrollbar-width: thin; scrollbar-color: #a06a17 #f1f1f1; padding: 0; overflow-y: auto; }
.payment-wrap.order-items .payment-body .cart-container .cart-item { width: 100%; display: flex; flex-direction: column; row-gap: 40px; }
.payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap { gap: 26px; }
.payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap img { width: 100px; min-height: 100px; object-fit: contain; object-position: center; background-color: #eee1ce; }
.payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap .item-info { flex: 1; }
.payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap .item-info h5 { font-size: 18px; font-style: normal; font-weight: 400; line-height: 26px; font-family: 'Poppins'; color: #503307; margin: 0 0 5px; }
.payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap .item-info p { font-size: 14px; font-style: normal; font-weight: 500; line-height: 24px; letter-spacing: -0.12px; color: #503307; margin: 0; }
.payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap .item-info .list-item { font-family: Poppins; font-size: 14px; font-style: normal; font-weight: 500; line-height: 24px; letter-spacing: -0.12px; color: #503307; }
.payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap .item-info .list-item h6 { display: none; }
.payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap .item-info .list-item ul { padding: 0; list-style-type: none; margin: 0; }
.payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap .item-info .list-item ul li { font-family: Poppins; font-weight: 400; color: #503307; }
.payment-card.order-items .payment-order-wrap .cart-footer h5 { font-size: 18px; font-style: normal; font-weight: 500; line-height: normal; color: #100; }
.payment-wrap.order-items .cart-footer table { margin: 10px 0 0; }
.payment-wrap.order-items .cart-footer table tbody { width: 100%; display: flex; flex-direction: column; gap: 29px; }
.payment-wrap.order-items .cart-footer table tr { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 0; }
.payment-wrap.order-items .cart-footer table tr th, .cart-footer table tr td { font-family: "Public Sans"; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; color: #212529; }
.payment-wrap.order-items .cart-footer table tr, .cart-footer table th, .cart-footer table td { border: unset; padding: 0; }
.payment-wrap.order-items .cart-footer table tr:last-of-type { border-radius: 0px 0px 4px 4px; background-color: #A06A17; padding: 14px; }
.payment-wrap.order-items .cart-footer table tr:last-of-type th, .payment-wrap.order-items .cart-footer table tr:last-of-type td { color: #ffffff; }
.payment-card .timeline-detail-wrap { width: 65%; display: flex; gap: 12px; background-color: #F2F2F2; }
.payment-card .timeline-detail-wrap .shipment-details { width: 35%; background-color: #ffffff; }
.payment-card .timeline-detail-wrap .shipment-details h5 { font-size: 18px; font-style: normal; font-weight: 500; line-height: normal; color: #100; }
.payment-card .timeline-detail-wrap .shipment-details ul.timeline { width: 100%; display: flex; flex-direction: column; gap: 10px; padding-left: 20px; margin: 15px  0 0; }
.payment-card .timeline-detail-wrap .details-section { width: 65%; background-color: #ffffff; }
.payment-card .timeline-detail-wrap .details-section h5 { font-size: 18px; font-style: normal; font-weight: 500; line-height: normal; color: #100; }
.payment-card .timeline-detail-wrap .details-section table { margin: 20px 0 0; }
.payment-wrap.order-items .order-details-header span.badge { display: flex; align-items: center; height: 30px; background-color: #503307 !important; }
.payment-wrap.order-items .order-details-header .order-actions { display: flex; gap: 10px; }
.payment-wrap.order-items .order-details-header .order-actions button:hover i { color: #ffffff; }
/* ===== order-items-css-end ===== */

/* ===== tooltip-css-start ===== */
span.tooltip-text { display: none; }
#cafe-orders-table_wrapper table#cafe-orders-table td:last-child a.action-btn { position: relative; }
#cafe-orders-table_wrapper table#cafe-orders-table td:last-child a.action-btn:hover span.tooltip-text { display: block; position: absolute; top: -35px; left: -14px; font-size: 14px; color: #ffffff; background-color: #000000; border-radius: 5px; padding: 4px 16px; }
#cafe-orders-table_wrapper table#cafe-orders-table .btn-group button.btn-success { position: relative; }
#cafe-orders-table_wrapper table#cafe-orders-table .btn-group button.btn-success:hover span.tooltip-text { display: block; position: absolute; top: -35px; left: -28px; font-size: 14px; color: #ffffff; background-color: #000000; border-radius: 5px; padding: 4px 16px; }
#cafe-orders-table_wrapper table#cafe-orders-table .btn-group button.reject-order { position: relative; }
#cafe-orders-table_wrapper table#cafe-orders-table .btn-group button.reject-order:hover span.tooltip-text { display: block; position: absolute; top: -35px; left: -28px; font-size: 14px; color: #ffffff; background-color: #000000; border-radius: 5px; padding: 4px 16px; }
.payment-wrap.order-items .order-details-header .order-actions button.btn-success { position: relative; }
.payment-wrap.order-items .order-details-header .order-actions button.btn-success:hover span.tooltip-text { display: block; position: absolute; top: -35px; left: -28px; font-size: 14px; color: #ffffff; background-color: #000000; border-radius: 5px; padding: 4px 16px; }
.payment-wrap.order-items .order-details-header .order-actions button.reject-order { position: relative; }
.payment-wrap.order-items .order-details-header .order-actions button.reject-order:hover span.tooltip-text { display: block; position: absolute; top: -35px; left: -28px; font-size: 14px; color: #ffffff; background-color: #000000; border-radius: 5px; padding: 4px 16px; }
button.inform-user { position: relative; }
button.inform-user:hover span.tooltip-text { display: block; position: absolute; top: -35px; left: -50px; font-size: 14px; color: #ffffff; background-color: #000000; border-radius: 5px; padding: 4px 16px; }
button.delivered-btn { position: relative; }
button.delivered-btn:hover span.tooltip-text { display: block; position: absolute; top: -35px; left: -28px; font-size: 14px; color: #ffffff; background-color: #000000; border-radius: 5px; padding: 4px 16px; }
/* ===== tooltip-css-end ===== */

/* ===== profile-&-profile-settings-css-start ===== */
.admin-info-sec .avatar { width: 80px; height: 80px; display: flex; justify-content: center; text-align: center; margin: 0 0 15px; }
.admin-info-sec th { width: 84px; }
.profile-settings a.nav-link { color: #503307; }
.profile-settings .nav-tabs-custom .nav-item .nav-link.active { color: #503307; }
.profile-settings .nav-tabs-custom .nav-item .nav-link.active:after { background: #503307; }
/* ===== profile-css-end ===== */


@media (min-width: 768px) {
    .topbar-user { background-color: var(--vz-saffron); }
}

@media (max-width: 1720.98px) {
    .payment-methods { width: 45%; }
    .payment-details { width: 55%; }
    .shopping-cart-view .item-image { /*width: 24.13%;*/ width: 75px; min-height: 75px; }
    .shopping-cart-view .item-details p.item-name { font-size: 14px; line-height: 24px; }
    .shopping-cart-view .item-details p.item-price { font-size: 20px; line-height: 30px; }
    .shopping-cart-view p.item-size { font-size: 14px; line-height: 24px; }
    .shopping-cart-view .cart-items { max-height: 250px; row-gap: 20px; }
    .payment-wrap .payment-body .listing-view { width: 30%; }
    .payment-wrap .payment-body .payment-info { width: 70%; }
    .payment-details .contact-info .mail-wrap input[type="email"] { font-size: 12px; }
    .payment-wrap .payment-details form .form-group .label-input input { font-size: 12px; }
    .card-body.inventory-infos .inv-btn button { font-size: 12px; padding-left: 8.5px; padding-right: 8.5px; }
    .shopping-cart-view .cart-item { gap: 15px; }
    .auth-page-wrapper .auth-logo svg { width: 150px; height: 150px; }
}

@media (max-width: 1580.98px) {
    .payment-wrap .card-option .card-info p { font-size: 12px; }
}

@media (max-width: 1439.98px) {
    .container { max-width: 100%; padding: 0; }
    .page-content { margin-left: 0 !important; }
    header#page-topbar { margin-left: 24px  !important; margin-right: 24px !important; }
    [data-layout=semibox] .page-content { padding: calc(70px + 3rem) .75rem 60px .75rem; }
    :is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>.menu-dropdown { left: 50px; }
    :is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>a.menu-link span { left: 60px; }
}

@media (max-width: 1399.98px) {
    .admin-info-sec .col-gap { gap: 20px; }
    .profile-settings { gap: 20px; }
}

@media (max-width: 1360.98px) {
    .shopping-cart-view .cart-footer { padding: 30px 10px 0; }
    .shopping-cart-view .cart-footer .price-list .label-price { font-size: 12px; }
    .shopping-cart-view .item-details p.item-price { font-size: 18px; line-height: 28px; }
}

@media (max-width: 1199.98px) {
    .shopping-cart-view .cart-footer { padding: 30px 10px 0; }
    .shopping-cart-view .cart-items { row-gap: 15px; }
    .payment-wrap .payment-body { flex-direction: column; }
    .payment-wrap .payment-body .listing-view { width: 100%; }
    .payment-wrap .payment-body .payment-info { width: 100%; }
    .payment-wrap .card-option .card-info { width: calc(100% - 75px); }
}

@media (max-width: 991.98px) {
    .topping-row { gap: 16px; position: relative; z-index: 1; }
    .topping-row .remove-topping-wrap { width: max-content; position: absolute; top: 0; right: 0; }
    .topping-row .remove-topping-wrap button.remove-topping { width: 20px; height: 20px; padding: 0; background-size: 10px !important; }
    .topping-row .remove-topping-wrap button.remove-topping svg { width: 0 !important; }

    .variation-row { gap: 16px; position: relative; z-index: 1; }
    .variation-row { gap: 16px; position: relative; z-index: 1; }
    .variation-row .remove-variation-wrap { width: max-content; position: absolute; top: 0; right: 0; }
    .variation-row .remove-variation-wrap button.remove-variation { width: 20px; height: 20px; padding: 0; background-size: 10px !important; }
    .variation-row .remove-variation-wrap button.remove-variation svg { width: 0 !important; }
    .payment-card { flex-direction: column; }
    .payment-card .payment-order-wrap { width: 100%; }
    .payment-card .timeline-detail-wrap { width: 100%; }
    /* .payment-wrap .payment-body { flex-direction: column; }
    .payment-wrap .payment-body .listing-view { width: 100%; }
    .payment-wrap .payment-body .payment-info { width: 100%; }
    .payment-wrap .card-option .card-info { width: calc(100% - 75px); } */
}

@media (max-width: 767.98px) {
    .container { max-width: 100%; padding: 0; }
    .vertical-overlay { width: 100%; height: 100%; }
    .page-content { margin-right: 0 !important; }
    .navbar-header .topbar-head-dropdown .dropdown-menu.show { transform: translate3d(-0px, 55px, 0px) !important; }
    footer.footer { margin-left: 0 !important; margin-right: 0 !important; }
    footer.footer .container-fluid { padding: 0 !important; margin: 0 auto !important; }
    footer.footer .col-lg-12 { text-align: center; padding: 0; margin: 0 auto; }
    .shopping-cart .cart-sidebar { width: 100%; }
    .shopping-cart .cart-header { padding: 20px; }
    .shopping-cart .cart-items { padding: 20px; }
    .shopping-cart .cart-footer { padding: 20px 20px 40px; }
    .shopping-cart .item-details p.item-name { font-size: 16px; }
    .shopping-cart .item-details p.item-price { font-size: 22px; }
    .shopping-cart p.item-size { font-size: 16px; }
    .payment-container { flex-direction: column; }
    .payment-methods { width: 100%; }
    .payment-details { width: 100%; }
    .auth-page-wrapper .auth-page-content { padding-left: 30px; padding-right: 30px; }
    p.card-text-tooltip { font-size: 12px; }
    .payment-card .timeline-detail-wrap { flex-direction: column; }
    .payment-card .timeline-detail-wrap .shipment-details { width: 100%; }
    .payment-card .timeline-detail-wrap .details-section { width: 100%; }
}

@media (max-width: 575.98px) {
    .btn { font-size: 14px; }
    .shopping-cart .cart-header .close-cart svg { width: 40px; height: 40px; }
    .shopping-cart .cart-item button.delete-item { width: 80px; height: 40px; }
    .shopping-cart .cart-header h2 { font-size: 20px; }
    .shopping-cart .cart-footer p { font-size: 20px; }
    .shopping-cart .cart-items { row-gap: 30px; }
    /* table#roles-table .action-buttons { display: flex; flex-wrap: wrap; row-gap: 8px; } */
    .payment-container .shipment-details .title-btn span { width: 120px; font-size: 12px; }
    .payment-container .shipment-details .title-btn h5 { font-size: 18px; }
    .shopping-cart-view .item-image { width: 60px; min-height: 60px; }
    .auth-page-wrapper .auth-page-content { padding-left: 20px; padding-right: 20px; }
    .card-body.inventory-infos .i-card-info p.card-text { max-width: 250px; }
    .card-body.inventory-infos .i-card-info h4 { font-size: 12px; }
}

@media (max-width: 481.98px) {
    #category-container .card-header { width: max-content; flex-direction: column; gap: 15px; }
    #category-container h2 { width: 100%; text-align: left; }
    .cafe-body-main .card-header button { width: 100%; }
    .inv-btn { flex-wrap: wrap; }
    .generate-report-btn { font-size: 14px; }
    .shopping-cart .cart-item { gap: 15px; }
    .shopping-cart .item-details p.item-name { font-size: 14px; }
    .shopping-cart .item-details p.item-price { font-size: 18px; line-height: 26px; }
    .shopping-cart .item-quantity button img.quantity-icon { width: 24px; }
    .shopping-cart p.item-size { font-size: 14px; }
    .shopping-cart .cart-items { row-gap: 20px; }
    .shopping-cart .cart-footer p { font-size: 16px; }
    .payment-wrap .payment-body { padding: 0 20px 18px; }
    .shopping-cart-view { padding: 10px; }
    .shopping-cart-view .cart-item { gap: 15px; }
    .shopping-cart-view .item-details p.item-price { font-size: 16px; line-height: 20px; }
    .shopping-cart-view .item-details p.item-name { font-size: 12px; line-height: 22px; }
    .shopping-cart-view p.item-size { font-size: 12px; line-height: 22px; }
    .shopping-cart-view .cart-footer .price-list .label-price { font-size: 12px; }
    .shopping-cart-view .cart-footer { padding: 30px 0 0; }
    .payment-container { padding: 10px; }
    .payment-methods h2 { font-size: 15px; }
    .payment-details .contact-info h2 { font-size: 15px; }
    .payment-details .payment-info-card h2 { font-size: 15px; }
    .payment-methods { padding: 20px 10px; }
    .payment-wrap .card-icon { width: 34px; margin-right: 2px; }
    .payment-wrap .card-option { gap: 0; padding: 10px; }
    .payment-details { padding: 0 0 10px; }
    .payment-wrap .payment-details form .form-group { flex-direction: column; }
    .payment-wrap .payment-details form .form-group .small-field { width: 100%; }
    .payment-wrap .payment-header { padding: 20px; }
    ul.tl li .item-timestamp button.next { width: 70px; height: 30px; display: flex; align-items: center; font-size: 12px; }
    .timeline-container ul.tl li .item-icon { width: 30px; min-width: 30px; height: 30px; margin-right: 10px; }
    .timeline-container ul.tl li .item-icon svg { width: 16px; height: 16px; }
    .timeline-container ul.tl li:before { left: 12px; }
    .timeline-container ul.tl li:first-child:after { content: ""; width: 7px; height: 20px; background-color: #f2f2f2; position: absolute; left: 12px; top: 0; z-index: -1; }
    .timeline-container ul.tl li:last-child:after { content: ""; width: 7px; height: 20px; background-color: #f2f2f2; position: absolute; left: 12px; bottom: 0; z-index: -1; }
    .auth-page-wrapper .auth-page-content { padding-left: 15px; padding-right: 15px; }
    button#add-topping { font-size: 12px; }
    button#add-variation { font-size: 12px; }
    button#add-edit-topping { font-size: 12px; }
    .add-btn-wrap .save-btn { font-size: 12px; }
    button#add-edit-variation { font-size: 12px; }
    #edit_variations_container button.btn.btn-secondary { font-size: 12px; }
    .card-body.inventory-infos .i-card-info p.card-text { max-width: 150px; }
    .inventory-img-main button.delete-btn { width: 25px; height: 25px; padding: 6px; }
    .inventory-img-main button.delete-btn i { font-size: 14px; }
    .orders-inventory-box .card .title-text { width: calc(100% - 80px); }
    .orders-inventory-box .cafe-body-main .card-header button { width: auto; }
    .orders-inventory-box #category-container .card-header { align-items: flex-start !important; }
    .payment-wrap.order-items .payment-card .payment-order-wrap .payment-body { padding: 20px 20px 18px; }
    .payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap { flex-direction: column; align-items: flex-start !important; margin: 15px 0  0; }
    .payment-wrap.order-items .payment-body .cart-container .cart-item .item-wrap .item-info { width: 100%; text-align: left; margin: 0; }
    .payment-wrap.order-items .order-details-header h5 { font-size: 16px; }
}

.empty-star { fill: none; stroke: #000;}
.filled-star {fill: #503307;stroke: #503307;}
button.favourite-btn:hover, button.favourite-btn:active, button.favourite-btn:focus-visible  {background-color: transparent;border: unset;outline: unset;}

@media screen and (min-width: 424.98px) and (max-width: 575.98px) {
    table#roles-table .action-buttons { display: flex; flex-wrap: wrap; row-gap: 8px; }
}

.action-btn { width: 30px; height: 30px; border-radius: 5px !important; }
#cafe-orders-table_wrapper table#cafe-orders-table .btn-group { width: max-content; display: flex; justify-content: space-between; gap: 10px; }
#cafe-orders-table_wrapper table#cafe-orders-table td .cafe-action { display: flex; align-items: center; gap: 10px; }
#cafe-orders-table_wrapper table#cafe-orders-table td:last-child { align-items: center; gap: 10px; }
#cafe-orders-table_wrapper table#cafe-orders-table td:last-child a.action-btn {display: flex;justify-content: center;align-items: center;background-color: #503307;}
#cafe-orders-table_wrapper table#cafe-orders-table td:last-child a.action-btn i { color: #ffffff; }
#cafe-orders-table_wrapper table#cafe-orders-table td:last-child a.action-btn:hover { background-color: #a06a17; border-color: #a06a17; }
.payment-container .shipment-details .title-btn span { width: max-content; }
.payment-wrap .payment-body .payment-info .order-actions { display: flex; gap: 10px; margin: 0; }
button.inform-user.action-btn { background-color: #0ab39c; border-color: #0ab39c; padding: 3px; }
button.inform-user.action-btn svg path, button.inform-user.action-btn svg circle { fill: #ffffff; }
button.inform-user.action-btn:hover { background-color: #228779; border-color: #228779; }
button.delivered-btn.action-btn { background-color: #5db548; border-color: #5db548; padding: 2px 2px 2px 4px; }
button.delivered-btn.action-btn svg { width: 24px; height: 24px; }
button.delivered-btn.action-btn svg path { fill: #ffffff; }
form#cancelOrderForm button { margin: 15px 0 0; }
.payment-container .shipment-details .title-btn span { width: max-content; padding: 2px 10px; font-size: 12px; border-radius: 5px; }
.payment-container { gap: 12px; }
.detail-header { margin-bottom: 8px; }
.all-price-wrap { width: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 10px 0 0; }
.all-price-wrap .label-price { gap: 5px; position: relative; z-index: 1; }
.all-price-wrap .label-price:after { content: "|"; margin-left: 5px; }
.all-price-wrap .label-price:last-child:after { display: none; }
.detail-card { border: 1px solid #a06a17; position: relative; z-index: 1; }
.detail-card .image { padding: var(--vz-card-spacer-y) var(--vz-card-spacer-x); }
.detail-card .item-name { height: max-content; color: var(--vz-secondary-color); font-size: 14px; font-style: normal; font-weight: 400; line-height: 1; background: #F3F2F2; position: absolute; right: 33px; top: 30px; border-radius: 0; z-index: 2;     box-shadow: rgb(255 255 255 / 40%) 0px 0px 0px 2px, rgb(255 255 255 / 65%) 0px 4px 6px -1px, rgb(255 255 255 / 8%) 0px 1px 0px inset; padding: 5px; }
.detail-card .detail-box ul.list-item { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 5px; }
.detail-card .detail-box ul.list-item li { width: 50%; display: flex; align-items: center; gap: 5px; margin: 0; }
.detail-card .detail-box ul.list-item li .status-badge { line-height: 1; background-color: rgb(223 0 0) !important; color: #ffffff !important; }
.detail-card .detail-box ul.list-item li.date-time strong { width: 40px; }
.all-order-btn button { background-color: #503307; border-color: #503307; }
.all-order-btn button:hover { background-color: #a06a17; border-color: #a06a17; }
.detail-card .image img { width: auto; max-width: 100%; height: 210px; display: flex; justify-content: center; align-items: center; object-fit: cover; margin: 0 auto; }
#itemDescription {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 200px; }
.custom-disabled-input {
    background-color: #e9ecef !important; /* Bootstrap gray background */
    color: #6c757d !important; /* Muted text color */
    cursor: not-allowed;
    pointer-events: none; /* Prevent interactions */
    border: 1px solid #ced4da; /* Light gray border */
}
.tooltip-btn {
    position: relative;
    display: inline-block;
    font-size: 1.3em;
    margin-right: 10px;
    cursor: pointer;
}

.tooltip-btn::before {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 120%;
    left: 50%;
    transform: translateX(-50%);
    background-color: #333;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    white-space: nowrap;
    font-size: 12px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
}

/* .tooltip-btn:hover::before {
    opacity: 1;
    visibility: visible;
} */

.dataTable {
    width: 100% !important;
    border-collapse: collapse;
    border-radius: 8px;
    overflow: hidden;
}

.dataTable thead {
    background-color: #f8f9fa;
    color: #333;
    text-transform: uppercase;
    font-weight: 600;
}

.dataTable thead th {
    padding: 12px;
    text-align: left;
    border-bottom: 2px solid #dee2e6;
}

.dataTable tbody tr {
    transition: all 0.3s ease-in-out;
}

/* .dataTable tbody tr:hover {
    background-color: #f1f1f1;
} */

.dataTable tbody td {
    padding: 10px;
    border-bottom: 1px solid #dee2e6;
}

/* .dataTable tbody a {
    text-decoration: none;
    font-weight: 500;
    color: #007bff;
    transition: color 0.3s ease-in-out;
} */

/* .dataTable tbody a:hover {
    color: #0056b3;
} */

/* .dataTable tbody a i {
    font-size: 14px;
    vertical-align: middle;
    margin-left: 5px;
} */

.dataTables_paginate .paginate_button {
    background-color: #fff !important;
    border: 1px solid #dee2e6 !important;
    padding: 6px 12px !important;
    margin: 2px !important;
    border-radius: 4px !important;
    transition: all 0.3s ease-in-out;
}

/* .dataTables_paginate .paginate_button:hover {
    background-color: #007bff !important;
    color: white !important;
} */

.dataTables_paginate .paginate_button.current {
    background-color: #007bff !important;
    color: white !important;
    font-weight: 600;
}

.dataTables_filter input {
    border: 1px solid #ced4da;
    border-radius: 4px;
    padding: 6px 12px;
    outline: none;
    transition: all 0.3s ease-in-out;
}

.dataTables_filter input:focus {
    border-color: #a06a17;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.dataTables_length select,
.dataTables_info {
    font-size: 14px;
    color: #555;
}

@media (max-width: 768px) {
    .dataTable {
        display: block;
        width: 100%;
        overflow-x: auto;
    }

    .dataTable tbody td {
        white-space: nowrap;
    }
}

/* .btn:hover, .btn:focus {
    background-color: #f8f9fa !important;
    box-shadow: none !important;
} */

.dataTables_paginate .paginate_button {
    background-color: white !important;
    border: none !important;
    color: #333 !important;
    font-weight: 600;
    padding: 6px 12px !important;
    border-radius: 4px !important;
    transition: all 0.3s ease-in-out;
}

/* .dataTables_paginate .paginate_button:hover {
    background-color: #f8f9fa !important;
    color: black !important;
} */