.cust-badge {
   height: 32px;
   padding: 0 12px;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 50px;
   font-size: 14px;
}

.orange-500 {
   color: #d9822b;
}

.bg-orange-100 {
   background-color: #fff3e6;
}
/* 
.inset-shadow {
   box-shadow: 0 0 0 1px #d3d7e1;
} */

.circles i {
   border-radius: 50%;
}

.indicater-p {
   display: flex;
   justify-content: start;
   gap: 8px;
   align-items: center;
}

.indicater-p i {
   border-radius: 50%;
}

.indicater-p i::before {
   border-radius: 50%;
}

.indicater-p i.text-white::before {
   border: 1px solid #d3d7e1;
}

.avatar-card-inner {
   display: flex;
   align-items: center;
   gap: 12px;
}

.avatar-card-inner .icon {
   border-radius: 50%;
   min-width: 30px;
   height: 30px;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: #FBFBFB;
   color: white;
}

.prodect-card-gray .card-content p,
.cust-progress p {
   color: #445794;
   margin: 0;
}

.bg-primary-100 {
   background-color: #ccd4ed !important;
}

.bg-green-200 {
   background-color: #b4dbc6 !important;
}

.shadow-unset {
   box-shadow: unset;
}

.prodect-card-gray.col-flex {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}

.bg-primary-100 {
   background-color: #d9eef7 !important;
}

.bg-secondary-500 {
   background-color: #051855 !important;
}

.bg-gray-300 {
   background-color: #c1c7d7 !important;
}

.bg-green-100 {
   background-color: #e6f3ed !important;
}

.bg-secondery-100 {
   background-color: #ccd4ed !important;
}

.red-500 {
   color: #b93838 !important;
}

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

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

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

.rounded-full {
   border-radius: 50% !important;
}

.mw-unset {
   min-width: unset !important;
}

.prodect-card-gray .product-title {
   flex-wrap: wrap;
   gap: 10px;
}

.primary-blue-300 {
   color: #445794 !important;
}

.white-bg-card {
   background-color: white;
   padding: 24px;
   border: 1px solid #d3d7e1;
}

.btn-2.red {
   background-color: #b93838;
   border-color: #b93838;
}

.top-space {
   margin-top: 200px;
}

.btn-2.red:hover {
   background-color: transparent;
   color: #b93838;
}

.prodect-card-gray.para-m-0 p {
   margin: 0;
}

.orange-border-500 {
   border: 1px solid #d9822b !important;
}

.green-border-500 {
   border: 1px solid #FBFBFB !important;
}

.primary-border-500 {
   border: 1px solid #6C3CE4 !important;
}

.secondery-border-500 {
   border: 1px solid #051855 !important;
}

.snapshort .avatar {
   min-width: 38px;
   width: 38px;
   aspect-ratio: 1;
   height: unset;
}

.snapshort .avatar-lg {
   min-width: 60px;
   width: 60px;
}

.snapshort .avatar-md {
   min-width: 48px;
   width: 48px;
}

.max-w-unset {
   max-width: unset !important;
}

.primary-select {
   background-color: #6C3CE4;
   color: white;
   padding-right: 40px;
   background-image: url(../img/custom/arrow-down-white.svg);
   background-size: 12px 12px;
}

.cust-vart-tabs.cust-vart-tabs-v2 {
   border: unset;
}
.cust-vart-tabs.cust-vart-tabs-v2 .tab-content {
   border-left: unset;
   overflow: auto;
}

.cust-vart-tabs.cust-vart-tabs-v2 .tab-content::-webkit-scrollbar {
   display: none;
}

.cust-vart-tabs.cust-vart-tabs-v2 .inputs-box {
   border: 1px solid #c1c7d7;
   border-radius: 0;
}

.cust-vart-tabs.cust-vart-tabs-v2 .inputs-box input {
   border: unset;
}

.cust-vart-tabs.cust-vart-tabs-v2 .inputs-box input:last-child {
   max-width: 120px;
}
.cust-vart-tabs.cust-vart-tabs-v2 .inputs-box input:last-child.form-control:focus {
   box-shadow: unset;
}

.cust-vart-tabs.cust-vart-tabs-v2 .screen-print-wrapper .content {
   height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}
.cust-vart-tabs.cust-vart-tabs-v2 .screen-print-wrapper {
   position: relative;
   z-index: 1;
   max-width: 500px;
}
.cust-vart-tabs.cust-vart-tabs-v2 .screen-print-wrapper::before {
   content: "";
   position: absolute;
   z-index: -1;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 60%;
   background-color: #eff2f9;
   border: 1px solid #d3d7e1;
}

.screen-print-wrapper .text:last-child h4 {
   padding: 44px 0 24px 24px;
}

.cust-vart-tabs.cust-vart-tabs-v2 .sublimation .text:last-child {
   border-bottom: 0;
}
.cust-vart-tabs.cust-vart-tabs-v2 .sublimation .text {
   padding: 16px;
   border-bottom: 1px solid #c1c7d7;
}
.cust-vart-tabs.cust-vart-tabs-v2 .sublimation .image img {
   max-height: unset;
}

.payment-tabs .cust-vart-tabs.cust-vart-tabs-v2 .sublimation td.td-style {
   padding: 0 !important;
}
.charges-tab .cust-table tr th:last-child,
.charges-tab .cust-table tr td:last-child {
   text-align: end;
}

.orders .filter-btns button.active span {
   background-color: #d9eef7;
   color: #6C3CE4;
}

/* order process page  */
@media (min-width: 768px) {
   .order-process .track-wrapper .row .col-md-auto {
      width: 10%;
   }
}

.track-wrapper .tracking-card-v2 .complete .track-icon i {
   display: block;
}

.track-wrapper .tracking-card-v2 .inner-content {
   max-width: unset;
   margin: unset;
}

.track-wrapper .tracking-card-v2.tracking-card::before {
   display: none;
}

.track-wrapper .tracking-card-v2 .track-icon {
   width: 100%;
   aspect-ratio: unset;
   height: 58px;
   border-radius: unset;
   background-color: #eff2f9;
   border-color: #dcdfe8;
   border-left-color: transparent;
   border-right-color: transparent;
}

.track-wrapper .row > div:last-child .tracking-card-v2 .track-icon {
   border-right: 1px solid #dcdfe8;
}

.track-wrapper .row > div:first-child .tracking-card-v2 .track-icon {
   border-left: 1px solid #dcdfe8;
}

.track-wrapper .tracking-card-v2 .inner-content h6 {
   font-weight: 500;
   margin-top: 12px;
}

.track-wrapper .tracking-card-v2 .complete .track-icon,
.track-wrapper .tracking-card-v2 .active .track-icon {
   background-color: #6C3CE4;
   border-color: #6C3CE4;
}

.track-wrapper .tracking-card-v2 .inner-content p {
   display: none;
   font-size: 14px;
   color: #8c94b4;
}

.track-wrapper .tracking-card-v2 .complete.inner-content p,
.track-wrapper .tracking-card-v2 .active.inner-content p {
   display: block;
}

.title-bg-gray {
   background-color: #eff2f9;
   height: 43px;
   display: flex;
   align-items: center;
   font-weight: 500;
   padding: 0 16px;
   font-size: 16px;
}

.tr-images {
   display: flex;
   gap: 10px;
   align-items: center;
}

.tr-images img {
   max-width: 65px;
   max-height: unset !important;
}

.outline-box-select {
   height: auto;
   padding: 0;
}

.outline-box-select h4 {
   height: 60px;
   border-bottom: 1px solid #c1c7d7;
}

.shirt-title input {
   width: 100%;
   height: 35px;
   background-color: #e6f3fa;
   border: 1px solid #d3d7e1;
   outline: unset !important;
   padding: 0 10px;
}

select.select-cust-outline {
   height: 60px;
   background-image: url(../img/custom/arrow-down-outline.svg);
}

.colors-box .box.active .avatar {
   outline: 3px solid #6C3CE4;
}

.print-shirt-card {
   position: relative;
   z-index: 1;
   margin: 90px 0 50px;
}

.print-shirt-card .main-img {
   max-width: 335px;
   margin: auto;
}

.print-point {
   position: absolute;
   z-index: 0;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   margin: auto;
   max-width: 195px;
   max-height: 235px;
}

.print-area {
   width: 100%;
   min-height: 190px;
}

.cust-toast {
   background-color: #eff2f9;
   padding: 12px 20px;
}

.max-w-330 {
   max-width: 330px;
}

/* mediaQuery  */
@media (max-width: 991px) {
   .track-wrapper .tracking-card-v2 .inner-content h6,
   .track-wrapper .tracking-card-v2 .inner-content p {
      font-size: 12px;
   }
}

@media (max-width: 767px) {
   .flex-wrap-mob {
      flex-direction: column-reverse;
      align-items: flex-end;
      gap: 10px;
   }

   .white-bg-card {
      padding: 15px;
   }

   .snapshort .prodect-card-gray h4 {
      font-size: 18px;
   }

   .snapshort .prodect-card-gray .white-bg-card {
      flex-direction: column;
      gap: 15px;
      position: relative;
   }
   .snapshort .prodect-card-gray .white-bg-card button {
      width: 100%;
   }

   .snapshort .prodect-card-gray .white-bg-card .flat-btn {
      position: absolute;
      z-index: 0;
      top: 7px;
      right: 10px;
      max-width: 10px;
   }

   .snapshort .prodect-card-gray .white-bg-card .flat-btn i {
      font-size: 14px;
   }

   .top-space {
      margin-top: 30px;
   }

   .cust-vart-tabs.cust-vart-tabs-v2 .screen-print-wrapper::before {
      height: 100%;
   }

   .cust-vart-tabs.cust-vart-tabs-v2 .screen-print-wrapper .row {
      width: 100%;
   }

   .cust-vart-tabs.cust-vart-tabs-v2 .screen-print-wrapper h4 {
      padding: 0;
   }

   .track-wrapper .tracking-card-v2 {
      margin-bottom: 20px;
   }

   .track-wrapper .tracking-card-v2 .inner-content {
      flex-direction: column;
      gap: 0;
   }

   .track-wrapper .tracking-card-v2 .track-icon {
      height: 45px;
   }

   .cust-vart-tabs.cust-vart-tabs-v2 .screen-print-wrapper {
      padding: 15px;
   }
}
.form-switch .form-check-input{
   max-height: 1.5rem !important;
   border-radius: 0 !important;
   width: 3em !important;
}
.form-switch .form-check-input {
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3crect x='-3' y='-3' width='6' height='6' fill='%239ca3af'/%3e%3c/svg%3e") !important;
}
.form-switch .form-check-input:focus {
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3crect x='-3' y='-3' width='6' height='6' fill='%2345a4ff'/%3e%3c/svg%3e") !important;
}
.form-switch .form-check-input:checked {
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3crect x='-3' y='-3' width='6' height='6' fill='%23fff'/%3e%3c/svg%3e") !important;
}
.snap-image {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 16px;
   width: 100%;
}
.snap-image img {
   width: 45%;
   max-width: unset !important;
}
.website .site-img {
   position: relative;
   overflow: hidden;
   min-height: 50px;
}

/* loader overlay */
.website .site-img .img-loader {
   position: absolute;
   inset: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   background: #f3f3f3;
   z-index: 2;
}

/* spinner */
.website .site-img .spinner {
   width: 42px;
   height: 42px;
   border: 4px solid #ddd;
   border-top-color: #666;
   border-radius: 50%;
   animation: spin 0.8s linear infinite;
}

.website @keyframes spin {
            to { transform: rotate(360deg); }
         }

/* image */
.website .site-img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
}

/* hide loader when loaded */
.website .site-img.loaded .img-loader {
   display: none;
}
.website .site-img img {
   opacity: 0;
   transition: opacity .3s ease;
}

.website .site-img.loaded img {
   opacity: 1;
}
.select2-container{
   z-index: 9999 !important;
}
.light-style .select2-container--default .select2-selection--single .select2-selection__rendered{
   line-height: normal !important;
}

/* Select2 Styling inside outline-box-select / select-card */
.outline-box-select .select-card {
   position: relative;
   background: #fff;
}

.outline-box-select .select-card .select2-container {
   width: 100% !important;
   display: block;
   z-index: 100 !important;
}

/* Suppress webkit spin buttons and search inputs */
.outline-box-select .select-card .select2-container input::-webkit-outer-spin-button,
.outline-box-select .select-card .select2-container input::-webkit-inner-spin-button,
.outline-box-select .select-card .select2-container input::-webkit-search-cancel-button,
.outline-box-select .select-card .select2-container input::-webkit-search-decoration {
   -webkit-appearance: none !important;
   margin: 0 !important;
}

.outline-box-select .select-card .select2-container .select2-choice .select2-search-field,
.outline-box-select .select-card .select2-container .select2-choice .select2-search-icon {
   display: none !important;
}

/* HIDE select2-arrow completely to eliminate duplicate left arrow */
.outline-box-select .select-card .select2-container .select2-choice .select2-arrow,
.outline-box-select .select-card .select2-container .select2-selection--single .select2-selection__arrow,
.outline-box-select .select-card .select2-container .select2-choice .select2-arrow b,
.outline-box-select .select-card .select2-container .select2-selection--single .select2-selection__arrow b {
   display: none !important;
   width: 0 !important;
   height: 0 !important;
   background: none !important;
}

/* Single Chevron Down Arrow directly on select2-choice */
.outline-box-select .select-card .select2-container .select2-choice,
.outline-box-select .select-card .select2-container .select2-selection--single {
   height: 56px !important;
   line-height: 56px !important;
   background: #ffffff !important;
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23445794' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
   background-repeat: no-repeat !important;
   background-position: right 16px center !important;
   border: none !important;
   box-shadow: none !important;
   border-radius: 0 !important;
   padding: 0 65px 0 16px !important;
   display: flex !important;
   align-items: center !important;
   outline: none !important;
}

.outline-box-select .select-card .select2-container .select2-choice .select2-chosen,
.outline-box-select .select-card .select2-container .select2-selection--single .select2-selection__rendered {
   height: 56px !important;
   line-height: 56px !important;
   color: #445794 !important;
   font-size: 15px !important;
   font-weight: 500 !important;
   padding-left: 0 !important;
   padding-right: 0 !important;
   padding-top: 0 !important;
   margin-top: 0 !important;
   overflow: hidden !important;
   text-overflow: ellipsis !important;
   white-space: nowrap !important;
   width: 100% !important;
}

/* Position clear / cross button (x) to the left of the single chevron arrow */
.outline-box-select .select-card .select2-container .select2-search-choice-close,
.outline-box-select .select-card .select2-container .select2-allowclear,
.outline-box-select .select-card .select2-container .select2-selection__clear {
   position: absolute !important;
   right: 42px !important;
   top: 50% !important;
   transform: translateY(-50%) !important;
   width: 18px !important;
   height: 18px !important;
   background: none !important;
   border: none !important;
   margin: 0 !important;
   padding: 0 !important;
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
   z-index: 5 !important;
   opacity: 0.7 !important;
   transition: opacity 0.2s ease !important;
   text-decoration: none !important;
}

.outline-box-select .select-card .select2-container .select2-search-choice-close::after,
.outline-box-select .select-card .select2-container .select2-allowclear::after,
.outline-box-select .select-card .select2-container .select2-selection__clear::after {
   content: "×" !important;
   font-family: Arial, sans-serif !important;
   font-size: 20px !important;
   line-height: 1 !important;
   color: #8c94b4 !important;
   font-weight: bold !important;
}

.outline-box-select .select-card .select2-container .select2-search-choice-close:hover::after,
.outline-box-select .select-card .select2-container .select2-allowclear:hover::after,
.outline-box-select .select-card .select2-container .select2-selection__clear:hover::after {
   color: #b93838 !important;
}

.outline-box-select .select-card .select2-container-active .select2-choice,
.outline-box-select .select-card .select2-container--open .select2-selection--single {
   border: none !important;
   box-shadow: none !important;
}

.select2-drop-mask {
   z-index: 99998 !important;
}

.select2-drop-active,
.select2-drop,
.select2-dropdown,
.select2-container--open .select2-dropdown {
   border: 1px solid #c1c7d7 !important;
   border-radius: 0 0 0.5rem 0.5rem !important;
   box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12) !important;
   margin-top: -1px !important;
   z-index: 99999 !important;
   background: #ffffff !important;
   pointer-events: auto !important;
}

.select2-drop .select2-results,
.select2-dropdown .select2-results,
.select2-results {
   padding: 4px 0 !important;
   max-height: 240px !important;
   margin: 0 !important;
   overflow-x: hidden !important;
   overflow-y: auto !important;
   -webkit-overflow-scrolling: touch !important;
   touch-action: pan-y !important;
   pointer-events: auto !important;
}

.select2-results li,
.select2-results .select2-result,
.select2-results .select2-result-label,
.select2-results__option {
   cursor: pointer !important;
   padding: 10px 16px !important;
   font-size: 14px !important;
   color: #445794 !important;
   line-height: 1.4 !important;
   pointer-events: auto !important;
   user-select: none !important;
}

.select2-results .select2-highlighted,
.select2-results .select2-highlighted .select2-result-label,
.select2-results__option--highlighted[aria-selected],
.select2-results__option--highlighted {
   background-color: #6C3CE4 !important;
   color: #ffffff !important;
}
}