html:not([data-bs-theme="light"]) {
    /* Dark Theme Colors */
    --body-bg: #000000;
    --text-color: #fff;
    --heading-color: #fff;
    --light-text-color: #b3b3b3;
    --border-color: #383838;
    --navbar-bg: rgba(0, 0, 0, 0.2);
    --navbar-scrolled-bg: rgba(0, 0, 0, 0.8);
    --navbar-scrolled-border: rgb(255 255 255 / 6%);
    --dropdown-border: #333333;
    --footer-bg: rgb(255 255 255 / 3%);
    --footer-border-top: rgb(255 255 255 / 3%);
    --footer-heading-color: #daf3ff;
    --footer-bottom-bg: #27272754;
    --footer-bottom-border-top: #1a1a1a;
    --preloader-bg: rgb(0 0 0 / 71%);
    --preloader-spinner-border: rgba(0, 0, 0, 0.15);
    --preloader-spinner-bg: #fff;
    --modal-backdrop-bg: rgb(0 0 0 / 53%);
    --modal-content-bg: rgba(0, 0, 0, 0.6);
    --modal-content-border: rgb(255 255 255 / 6%);
    --form-control-bg: #00000069;
    --form-control-border: #2a2a2a;
    --form-control-focus-border: rgba(255, 255, 255, 0.3);
    --input-autofill-shadow: rgb(0, 0, 0);
    --item-card-bg: #222222;
    --item-card-border: #303030;
    --item-image-wrapper-bg: #001516;
    --item-card-overlay-bg: #212529;
    --item-card-heading-color: #c4c4c4;
    --product-details-right-bg: #131313;
    --product-details-right-border: #1f1f1f;
    --home-product-slider-bg: #040404;
    --home-product-slider-border: #0e0e0e;
    --product-slider-wrapper-border: #161616;
    --product-slider-nav-link-border: #161616;
    --product-slider-nav-link-color: #a6a6a6;
    --product-slider-nav-link-bg: #040404;
    --swiper-slide-border: #112433;
    --swiper-nav-btn-bg: rgb(254 101 100 / 70%);
    --filter-area-bg: rgb(92 92 92 / 20%);
    --search-control-bg: #1f1f1f;
    --search-control-border: #464646;
    --search-icon-color: #999;
    --select2-bg: #1f1f1f;
    --select2-border: #464646;
    --fabric-label-color: #9b9b9b;
    --tag-item-bg: #272c31;
    --tag-item-border: #2d3541;
    --file-item-border: rgba(64, 77, 59, 0.322);
    --file-item-bg: rgb(51 51 51 / 20%);
    --section-border-top: #1a1b1b;
    --badge-bg: #2e353b;
    --badge-border: #363d44;
    --contact-form-bg: #050505;
    --contact-form-border: rgb(255 255 255 / 3%);
    --join-us-form-control-bg: rgb(255 255 255 / 1%);
    --join-us-form-control-border: rgb(255 255 255 / 15%);
    --form-control-option-bg: #2f4443;
    --partner-box-bg: #0e0e0e;
    --partner-box-border: #232323;
    --partner-content-image-border: #efefef;
    --sidebar-filter-border-right: rgb(255 255 255 / 10%);
    --sidebar-scrollbar-thumb: rgba(150, 149, 149, 0.3);
    --others-item-color: #8f8f8f;
    --product-filter-bg: rgba(0, 0, 0, 0.878);
    --product-filter-border-bottom: rgb(255 255 255 / 10%);
    --profile-avatar-bg: var(--input-bg);
    --profile-avatar-border: #151515;
    --profile-menu-link-color: #ffffff;
    --profile-menu-active-bg: #e03757;
    --profile-menu-active-border: #ffffff;
    --card-bg: none;
    --card-border: #161616;
    --pricing-card-bg: #040404;
    --pricing-card-border: #0e0e0e;
    --plan-description-color: #ddd;
    --offcanvas-bg: #00181d;
    --offcanvas-header-bg: #012c35;
    --overlay-menu-bg: rgb(0 0 0 / 29%);

    /* Primary/Accent Colors */
    --primary-color: #fe6564;
    --primary-hover-color: #ff6160;
    --branding-color: #fe6564;
    --banner-gradient-start: #fa0045;
    --banner-gradient-end: #ffffff;
    --login-button-color: #222;
    --login-button-hover-color: #fff;
    --nav-link-hover-color: #fe6564;
    --social-icon-hover-bg: #fe6564;
    --btn-3d-bg: #fe6564;
    --btn-3d-color: #222222;
    --btn-3d-icon-bg: #d94949;
    --btn-3d-icon-color: #fff;
    --btn-3d-hover-bg: #0e0e0e;
    --btn-3d-outline-border: #fe6564;
    --btn-3d-outline-color: #ffffff;
    --btn-3d-outline-hover-bg: #fe6564;
    --btn-3d-outline-hover-color: #000000;
    --light-border-color: #05393f;
    --light-border-hover-bg: #05393f;
    --light-border-hover-color: #ffffff;
    --search-btn-bg: linear-gradient(to right, #ff4b2b, #ff416c);
    --search-btn-border: #ff416c;
    --search-btn-icon-color: #fff;
    --primary-btn-bg: linear-gradient(to right, #ff4b2b, #ff416c);
    --primary-btn-border: #ff4b2b;
    --link-color: #ff4266;
    --partner-icon-bg: #ff616045;
    --partner-icon-color: #fe6564;
    --product-filter-btn-bg: #333333;
    --product-filter-btn-border: #535353;
    --pricing-card-icon-color: #fe6564;
    --modal-required-color: #fe6564;
    --secondary-nav-bg: #121212;
    --secondary-nav-border:#272727;
    --color-3d-bg:#101d23;
}

/* Light Theme Colors */
html[data-bs-theme="light"] {
    --body-bg: #f8f9fa;
    --text-color: #212529;
    --bs-border-color: #b3b3b3;
    --heading-color: #343a40;
    --light-text-color: #6c757d;
    --border-color: #dee2e6;
    --navbar-bg: #ffffff;
    --navbar-scrolled-bg: rgba(255, 255, 255, 0.9);
    --navbar-scrolled-border: rgba(0, 0, 0, 0.1);
    --dropdown-border: #e9ecef;
    --footer-bg: #f8f9fa;
    --footer-border-top: #e9ecef;
    --footer-heading-color: #343a40;
    --footer-bottom-bg: #e9ecef;
    --footer-bottom-border-top: #ced4da;
    --preloader-bg: rgb(255 255 255 / 71%);
    --preloader-spinner-border: rgba(200, 200, 200, 0.5);
    --preloader-spinner-bg: #eee;
    --modal-backdrop-bg: rgb(0 0 0 / 20%);
    --modal-content-bg: rgba(255, 255, 255, 0.9);
    --modal-content-border: rgba(0, 0, 0, 0.1);
    --form-control-bg: #ffffff;
    --form-control-border: #ced4da;
    --form-control-focus-border: rgba(0, 0, 0, 0.3);
    --input-autofill-shadow: rgb(255, 255, 255);
    --item-card-bg: rgba(255, 255, 255, 0.7);
    --item-card-border: rgba(0, 0, 0, 0.1);
    --item-image-wrapper-bg: #e9ecef;
    --item-card-overlay-bg: #f8f9fa;
    --item-card-heading-color: #212529;
    --product-details-right-bg: #ffffff;
    --product-details-right-border: #e9ecef;
    --home-product-slider-bg: #ffffff;
    --home-product-slider-border: #e9ecef;
    --product-slider-wrapper-border: #dee2e6;
    --product-slider-nav-link-border: #dee2e6;
    --product-slider-nav-link-color: #495057;
    --product-slider-nav-link-bg: #f8f9fa;
    --swiper-slide-border: #ced4da;
    --swiper-nav-btn-bg: rgb(254 101 100 / 90%);
    --filter-area-bg: rgba(255, 255, 255, 0.8);
    --search-control-bg: #ffffff;
    --search-control-border: #ced4da;
    --search-icon-color: #6c757d;
    --select2-bg: #ffffff;
    --select2-border: #ced4da;
    --fabric-label-color: #495057;
    --tag-item-bg: #e9ecef;
    --tag-item-border: #dee2e6;
    --file-item-border: rgba(0, 0, 0, 0.1);
    --file-item-bg: rgba(255, 255, 255, 0.7);
    --section-border-top: #e9ecef;
    --badge-bg: #e9ecef;
    --badge-border: #dee2e6;
    --contact-form-bg: #ffffff;
    --contact-form-border: rgba(0, 0, 0, 0.1);
    --join-us-form-control-bg: rgba(255, 255, 255, 0.9);
    --join-us-form-control-border: rgba(0, 0, 0, 0.1);
    --form-control-option-bg: #e9ecef;
    --partner-box-bg: #ffffff;
    --partner-box-border: #e9ecef;
    --partner-content-image-border: #ced4da;
    --sidebar-filter-border-right: rgba(0, 0, 0, 0.1);
    --sidebar-scrollbar-thumb: rgba(0, 0, 0, 0.1);
    --others-item-color: #495057;
    --product-filter-bg: rgba(255, 255, 255, 0.878);
    --product-filter-border-bottom: rgba(0, 0, 0, 0.1);
    --profile-avatar-bg: #f8f9fa;
    --profile-avatar-border: #ced4da;
    --profile-menu-link-color: #212529;
    --profile-menu-active-bg: #dc3545;
    --profile-menu-active-border: #ffffff;
    --card-bg: #ffffff;
    --card-border: #e9ecef;
    --pricing-card-bg: #ffffff;
    --pricing-card-border: #e9ecef;
    --plan-description-color: #495057;
    --offcanvas-bg: #f8f9fa;
    --offcanvas-header-bg: #e9ecef;
    --overlay-menu-bg: rgb(0 0 0 / 10%);

    /* Primary/Accent Colors - keep consistent or adjust as needed */
    --primary-color: #fe6564;
    --primary-hover-color: #ff6160;
    --branding-color: #fe6564;
    --banner-gradient-start: #fa0045;
    --banner-gradient-end: #ffffff;
    --login-button-color: #222;
    --login-button-hover-color: #fff;
    --nav-link-hover-color: #fe6564;
    --social-icon-hover-bg: #fe6564;
    --btn-3d-bg: #fe6564;
    --btn-3d-color: #ffffff;
    --btn-3d-icon-bg: #d94949;
    --btn-3d-icon-color: #fff;
    --btn-3d-hover-bg: #ffffff;
    --btn-3d-outline-border: #fe6564;
    --btn-3d-outline-color: #fe6564;
    --btn-3d-outline-hover-bg: #fe6564;
    --btn-3d-outline-hover-color: #ffffff;
    --light-border-color: #6c757d;
    --light-border-hover-bg: #6c757d;
    --light-border-hover-color: #ffffff;
    --search-btn-bg: linear-gradient(to right, #ff4b2b, #ff416c);
    --search-btn-border: #007bff;
    --search-btn-icon-color: #fff;
    --primary-btn-bg: linear-gradient(to right, #ff4b2b, #ff416c);
    --primary-btn-border: #ff4b2b;
    --link-color: #ff4266;
    --partner-icon-bg: #ff616045;
    --partner-icon-color: #fe6564;
    --product-filter-btn-bg: #f8f9fa;
    --product-filter-btn-border: #dee2e6;
    --pricing-card-icon-color: #007bff;
    --modal-required-color: #dc3545;
    --secondary-nav-bg: #e9e9e9;
    --secondary-nav-border:#dedede;
    --color-3d-bg:#dde4ee;
}

html[data-bs-theme="light"] .theme-icon.moon-icon,
html[data-bs-theme="dark"] .theme-icon.sun-icon {
    display: none;
}

html[data-bs-theme="dark"] .theme-icon.moon-icon,
html[data-bs-theme="light"] .theme-icon.sun-icon {
    display: inline-block;
}

.dark-logo { display: none; }
.light-logo { display: none; }

html[data-bs-theme="dark"] .dark-logo { display: none; }
html[data-bs-theme="light"] .light-logo { display: none; }
html[data-bs-theme="light"] .dark-logo { display: inline-block; }

html[data-bs-theme="light"] .partner-content-image {
    border: 1px solid #ededed;
    filter: hue-rotate(215deg);
    background: #fff;
}
html[data-bs-theme="light"]  .manage-digitization img {
    filter: none;
}
button#theme-switcher {
    background: none;
    border: none;
    color: var(--text-color);
    font-size: 19px;
    width: 45px;
    text-align: center;
}
body {
    font-family: 'Roboto', sans-serif;
    overflow-x: hidden;
    background: var(--body-bg);
    background-attachment: fixed;
    background-size: cover;
    color: var(--text-color);
}
.wow {
    visibility: hidden;
}
html {
    scroll-behavior: smooth;
}
.form-check-input:checked {
    background-color: var(--primary-color);
    border-color: var(--primary-hover-color);
}
h2 {
    font-size: 40px;
    color: var(--heading-color);
}
.branding-color{
    color: var(--branding-color);
}
.grid {
    position: fixed;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    z-index: -1;
}
.grid-svg {
    height: 100%;
    width: 100%;
    position: relative;
    z-index: 1;
}
.blur {
    height: 12rem;
    width: 12rem;
    background-color: hsl(155, 100%, 65%);
    filter: blur(100px);
    border-radius: 100px;
    z-index: 0;
    position: absolute;
}

.our-client-title h2 {
    margin-bottom: 36px;
    font-size: 40px;
    font-weight: normal;
    text-align: center;
}
.testimonial-swiper {
    position: relative;
    overflow: hidden;
}
.testimonial-card {
    background-color: var(--partner-box-bg);
    border: 1px solid var(--partner-box-border);
    border-radius: 1rem;
    padding: 1.5rem;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease;
    margin: 6px;
    /* box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; */
}
  .testimonial-swiper .swiper-wrapper{
    margin:30px 0;
  }
  .testimonial-swiper{
    position: relative;
    overflow: hidden;
  }
  .testimonial-swiper .swiper-pagination-bullet {
    width: 14px;
    height: 14px;
    background-color:var(--search-icon-color);
    transform: scale(1)!important;
    left: 0px!important;
    margin-bottom: -10px !important;
 }
  .testimonial-card:hover {
    transform: translateY(-5px);
  }

  .testimonial-card .quote {
    font-style: italic;
    color: var(--text-color);
    font-size: 20px;
    line-height: 26px;
    margin-top: 1rem;
  }

  .testimonial-header {
    display: flex;
    align-items: center;
    gap: 1rem;
  }

  .testimonial-header img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
  }

  .testimonial-name {
    margin: 0;
    font-weight: 600;
    font-size: 16px;
  }

  .testimonial-role {
    font-size: 0.875rem;
    color: #777;
    margin:0px;
  }
  .testimonial-swiper .swiper-pagination-bullet-active {
    background-color: #fe6564;
  }
.navbar.main-header {
    background-color: var(--navbar-bg);
    padding-top: 15px;
    padding-bottom: 15px;
    border-bottom:1px solid var(--border-color);
    position: sticky;
    top: 0px;
    z-index: 99;
    transition: all 0.3s ease;
}
nav.navbar.navbar-expand-lg.main-header.scrolled {
    background: var(--navbar-scrolled-bg);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(10px);
    box-shadow: 0 25px 23px rgb(0 0 0 / 0%);
    border-bottom: 1.5px solid var(--navbar-scrolled-border);
}
a.nav-link.login-button {
    padding-left: 20px!important;
    padding-right: 20px!important;
    color: var(--login-button-color)!important;
    padding-top: 5px;
    padding-bottom: 6px;
}
a.nav-link.login-button:hover {
    color: var(--login-button-hover-color)!important;
}
.dropdown-menu li, .sub-menu li {
    padding: 0.625rem 1.25rem;
    position: relative;
    border-bottom: 1px solid var(--dropdown-border);
}
.dropdown-menu li:last-child, .sub-menu li:last-child{
    border:none;
}
.dark-logo,
.light-logo{
    display: none;
}
.banner-area .banner-content h1 {
    text-transform: uppercase;
    font-size: 60px;
    background: -webkit-linear-gradient(right, var(--banner-gradient-start), var(--banner-gradient-end));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "Anton SC", sans-serif;
    /* letter-spacing: -2px; */
    opacity: 0.7;
    font-weight: 900;
}
.banner-area .banner-content p {
    font-size: 24px;
    max-width: 620px;
    line-height: 32px;
    /* text-align: center; */
    margin: 20px 0 30px;
}
.banner-area .banner-content a {
    max-width: 230px;
    text-align: center;
}
.frontpage .light-logo{
    display: inline-block;
}
.otherpage .dark-logo{
    display: inline-block;
}
.navbar.main-header{
    background-color: var(--navbar-bg);
}
.navbar.main-header .navbar-nav .nav-link {
    color:var(--text-color);
    position: relative;
}
.navbar.main-header .navbar-nav .nav-link:before {
    position: absolute;
    z-index: 1;
    content: "";
    height: 1px;
    background-color: var(--primary-color);
    bottom: -18px;
    width: 0%;
    left: 0;
    right: 0;
    margin: 0 auto;
    -webkit-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}
.navbar.main-header .navbar-nav .nav-link:hover,
.navbar.main-header .navbar-nav .nav-link.active {
    color: var(--nav-link-hover-color);
}
.navbar.main-header .navbar-nav .nav-link:hover:before,
.navbar.main-header .navbar-nav .nav-link.active:before {
    width: 100%;
}
main {
    min-height: calc(100dvh - 290px);
}
footer {
    color: var(--light-text-color);
    background-color: var(--footer-bg);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(5px);
    box-shadow: 0 25px 23px rgba(0, 0, 0, 0.15);
    border-top: 1.5px solid var(--footer-border-top);
}
footer h5 {
    color: var(--footer-heading-color);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 18px;
    margin-bottom: 20px;
}
footer a {
    color: var(--light-text-color);
}
.footer-top ul li a {
    padding: 5px 0px;
    display: inline-block;
    transition: .3s;
}
.footer-top ul li a:hover,
.footer-top a:hover,
.footer-bottom a:hover {
    color: var(--primary-color);
}
.footer-top .social-icons a {
    background: var(--primary-color);
    color: #ffffff;
    width: 30px;
    text-align: center;
    border-radius: 50%;
    height: 30px;
    font-size: 14px;
}
.footer-top .social-icons a:hover{
    background: var(--social-icon-hover-bg);
    color: var(--text-color);
}
.partcile-dec {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
}
.footer-bottom {
    padding: 25px 0;
    border-top: 1px solid var(--footer-bottom-border-top);
    margin-top: 30px;
    background: var(--footer-bottom-bg);
}
.footer-top,
.footer-bottom {
    position: relative;
    z-index: 1;
}
/*--- Preloader ---*/
#loading_1,
#loading {
    background-color: var(--preloader-bg);
    background-repeat: no-repeat;
    background-position: center center;
    height: 100vh;
    left: 0;
    overflow: visible;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999999;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    opacity: 1;
}
.tlp-preloader .animation-preloader {
    position: relative;
    z-index: 1;
}
.tlp-preloader .animation-preloader img {
    width: 118px;
    height: 118px;
    border-radius: 50%;
    position: absolute;
    z-index: 100;
    left: 50%;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%) scale(0.7);
    -ms-transform: translateY(-50%) translateX(-50%) scale(0.7);
    transform: translateY(-50%) translateX(-50%) scale(0.7);
    -webkit-animation: zoominout 2s infinite linear;
    animation: zoominout 2s infinite linear;
    -webkit-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
}
.tlp-preloader .animation-preloader .tlp-spinner {
    -webkit-animation: rotateZ 1s infinite linear;
    animation: rotateZ 1s infinite linear;
    border-radius: 50%;
    border: 5px solid var(--preloader-spinner-border);
    border-top-color: var(--primary-color);
    height: 120px;
    width: 120px;
    overflow: hidden;
    z-index: 110;
    background-color: var(--preloader-spinner-bg);
}
@-webkit-keyframes rotateZ {
    to {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
   }
}
@keyframes rotateZ {
    to {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
   }
}
@-webkit-keyframes zoominout {
    0% {
        -webkit-transform: translateY(-50%) translateX(-50%) scale(0.7);
        transform: translateY(-50%) translateX(-50%) scale(0.7);
   }
    50% {
        -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
        transform: translateY(-50%) translateX(-50%) scale(1);
   }
    100% {
        -webkit-transform: translateY(-50%) translateX(-50%) scale(0.7);
        transform: translateY(-50%) translateX(-50%) scale(0.7);
   }
}
@keyframes zoominout {
    0% {
        -webkit-transform: translateY(-50%) translateX(-50%) scale(0.7);
        transform: translateY(-50%) translateX(-50%) scale(0.7);
   }
    50% {
        -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
        transform: translateY(-50%) translateX(-50%) scale(1);
   }
    100% {
        -webkit-transform: translateY(-50%) translateX(-50%) scale(0.7);
        transform: translateY(-50%) translateX(-50%) scale(0.7);
   }
}


.navbar-brand.logo span.design-library {
    font-weight: 300;
    font-size: 25px;
    text-align: center;
    margin-left: 0px;
    color: var(--text-color);
    display: inline-block;
    padding: 1px 3px;
    text-transform: uppercase;
    position: absolute;
    top: 17px;
}

span.design-library span {
    font-family: cursive;
    color: #368df4; /* Specific colors, not themed */
    font-weight: 600;
}
.navbar-brand.logo span.design-library span:first-child {
    color: #beff00; /* Specific colors, not themed */
}
.navbar-brand.logo span.design-library span:nth-child(2) {
    color: #e800ff; /* Specific colors, not themed */
}
.navbar-brand.logo span.design-library span:nth-child(3) {
    color: #00fff3; /* Specific colors, not themed */
}
.navbar-brand.logo span.design-library span:nth-child(4) {
    color: #ff0000; /* Specific colors, not themed */
}
.navbar-brand.logo span.design-library span:nth-child(5) {
    color: #ffb300; /* Specific colors, not themed */
}

.navbar.navbar-expand-lg .navbar-nav {
    margin-left:auto;
}
li.dropdown.lang {
    margin-top: 7px;
}
.modal-backdrop {
    --bs-backdrop-opacity: 1;
    background-color: var(--modal-backdrop-bg);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    box-shadow: 0 25px 23px rgb(0 0 0 / 0%);
}
.modal-content {
    background-color: var(--modal-content-bg);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    box-shadow: 0 25px 23px rgb(0 0 0 / 0%);
    border: 1.5px solid var(--modal-content-border);
}
.modal-header .btn-close {
    position: absolute;
    right: 15px;
    top: 15px;
    opacity: 1;
    z-index: 1;
}
.modal.fade .modal-dialog {
  transition: transform 0.3s ease-out, opacity 0.3s ease-out;
  transform: translate(0, -50px);
  opacity: 0;
}
.modal .form-control {
    background-color: var(--form-control-bg) !important;
    box-shadow: 0 25px 23px rgb(0 0 0 / 0%);
    border: 1.5px solid var(--form-control-border);
    background-image: none!important;
    transition: border-color 0.5s ease;
    color: var(--text-color); /* Added for input text color */
}
.modal label {
    margin-bottom:5px;
    color: var(--text-color); /* Added for label color */
}
.modal .form-control:focus {
    border-color: var(--form-control-focus-border);
}
.modal input:-webkit-autofill {
  box-shadow: 0 0 0 1000px var(--input-autofill-shadow) inset !important;
  -webkit-text-fill-color: var(--text-color) !important;
  transition: background-color 5000s ease-in-out 0s;
}
.modal input::placeholder {
  opacity: 0.5;
  color: var(--light-text-color); /* Added for placeholder color */
}
.modal span.required {
    color: var(--modal-required-color);
}
.modal .input-inner-end-ele {
    position: relative;
}
.modal i.bi.togglePassword {
    position: absolute;
    right: 10px;
    top: 8px;
    opacity: 0.6;
    color: var(--light-text-color); /* Added for icon color */
}
.cursor-pointer{
    cursor: pointer;
}
.underline-hover {
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s ease;
}

.underline-hover:hover {
  border-bottom: 1px solid var(--primary-color);
}
.modal.show .modal-dialog {
  transform: translate(0, 0);
  opacity: 1;
}
.container-fluid {
    padding-left: 20px;
    padding-right: 20px;
}

.banner-area {
    height: 100dvh;
    overflow: hidden;
    position: relative;
    margin-top: -75px;
    padding-top:100px;
    background-color: #000000;
}
.banner-area:after {
    content: "";
    background: rgb(0 0 0 / 10%); /* This rgba should probably be a variable too or adjusted */
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 8;
}
.banner-area .banner-content {
    min-height: 73dvh;
    display: flex;
    /* align-items: center; */
    justify-content: center;
    color:#fff;
    flex-direction: column;
}
.partcile-dec-header{
    height: 100vh;
    position: absolute!important;
    width:100%;
    top:0;
}

#video-background {
    z-index: 4;
    position: absolute;
    top: 50%;
    right: 0;
    min-height: 100%;
    height: 100%;
    transform: translateY(-50%);
    object-fit: cover;
}
/* #video-background {
    width: 100vw;
    position: absolute;
    top: -130px;
    z-index: 4;
    transform: translateX(-50%);
    left: 50%;
} */
.banner-area * {
    position: relative;
    z-index: 9;
}
.btn-3d {
    font-size: 16px;
    line-height: 28px;
    color: var(--btn-3d-color);
    font-weight: 500;
    background: var(--btn-3d-bg);
    padding: 10px 30px;
    border-radius: 12px 0;
    position: relative;
    transition: .2s;
    z-index: 1;
    display: inline-block;
    border: 1px solid transparent;
}
.iframe-fullscreen .btn-3d {
    z-index: 0;
}
.btn-3d.icon i {
    position: absolute;
    background: var(--btn-3d-icon-bg);
    height: 50px;
    top: -1px;
    width: 48px;
    right: -1px;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0px 0 12px 0px;
    font-size: 22px;
    color: var(--btn-3d-icon-color);
}
.btn-3d[disabled] {
    opacity: 0.5;
    color: var(--text-color);
    cursor: not-allowed;
}
.btn-3d::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--btn-3d-hover-bg);
    transform: scale(0);
    transition: .3s;
    z-index: -1;
    border-radius: 12px 0;
}
.btn-3d:hover {
    filter: hue-rotate(360deg);
    color: var(--text-color);
    /* background: rgba(0, 0, 0, 0.248);
    box-shadow: 0 2px 0px #b30e3b; */
}
.btn-3d:hover::before {
    transform: scale(1);
}
.btn-3d[disabled]::before {
    transform: scale(0);
}

.btn-3d-outline {
    font-size: 16px;
    line-height: 28px;
    color: var(--btn-3d-outline-color);
    font-weight: 500;
    background: transparent;
    padding: 10px 30px;
    border-radius: 12px 0;
    position: relative;
    transition: .2s;
    z-index: 1;
    display: inline-block;
    border: 1px solid var(--btn-3d-outline-border);
}
.btn-3d-outline::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--btn-3d-outline-hover-bg);
    transform: scale(0);
    transition: .3s;
    z-index: -1;
    border-radius: 12px 0;
}
.btn-3d-outline:hover {
    color: var(--btn-3d-outline-hover-color);
}

.btn-3d-outline.light-border{
    border: 1px solid var(--light-border-color);
}
.light-border.btn-3d-outline::before{
    background: var(--light-border-hover-bg);
}
.light-border.btn-3d-outline:hover {
    color: var(--light-border-hover-color);
}
.payment-form {
    border: 1px solid var(--light-border-color);
    height: 100%;
    border-radius: 10px;
    padding: 10px;
}
.payment-form h3{
    text-align: center;
    color: var(--heading-color); /* Added for h3 color */
}

.btn-3d-outline:hover::before {
    transform: scale(1);
}
.btn-3d-outline[disabled] {
    opacity: 0.5;
    color: var(--primary-color);
    cursor: not-allowed;
}
.btn-3d-outline[disabled]::before {
    transform: scale(0);
}
.active>.page-link, 
.page-link.active {
    background-color: #fe6564;
    border-color: #F44336;
}
.page-link {
    color: var(--text-color);
}
.search-card.search-result-box {
    max-height: calc(100dvh - 100px);
    overflow-y: auto;
    z-index: 999;
    box-shadow: 0 0 4px var(--badge-bg);
    overflow-x: hidden;
    display: none;;
}
.search-result-box .list-group-item a {
    display: flex;
    gap: 5px;
}
.search-result-box .list-group-item .image {
    width: 30%;
}
.search-result-box .list-group-item .content {
    width: 70%;
}
.search-result-box .list-group-item .content p {
    margin-bottom: 5px;
    line-height: 18px;
    color:var(--text-color);
    font-size: 14px;
}
.search-result-box .list-group-item .content p.price {
    color: var(--primary-color);
}
.item-list-grid {
    --minWidth: 17.7rem;
    --maxWidth: 0fr;
    --repeat: auto-fit;
    display: grid;
    grid-template-columns: repeat(var(--repeat), minmax(var(--minWidth), var(--maxWidth)));
    gap: 15px;
}
/* .item-list-grid.list {
    grid-template-columns: 1fr;
} */
.item-card {
    position: relative;
    padding-bottom: 0;
    background: var(--item-card-bg);
    border-radius: 8px;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    border: 1px solid var(--item-card-border);
    max-width: 300px;
}
/* .item-card:hover {
    transform: translateY(-5px);
} */
.item-card:hover {
    border-color: var(--primary-color);
}
.item-card .btn-3d,
.swiper-slide .btn-3d {
    padding: 5px 12px;
    font-size: 12px;
    margin-bottom: 3px;
}
.item-card .btn-3d:hover,
.swiper-slide .btn-3d:hover {
    color:var(--text-color);
}

.item-card .item-image-wrapper {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1/1;
    width: 100%;
    border-radius: 8px 8px 0 0;
    background: var(--item-image-wrapper-bg);
}
.garment-design .item-card .item-image-wrapper{
    aspect-ratio: 3/4;
}
.item-card .item-image-wrapper img {
    max-width: 100%;
    transition: .7s;
}
.show-sold .item-image-wrapper .product-image,
.show-sold .item-image-wrapper .image-container {
    filter: blur(3px);
}
.search-box {
    margin: 0 auto;
    padding: 0px;
    border-radius: 5px;
    position: relative;
    border:1px solid var(--border-color);
}
.search-box .search-bar-input{
    outline: none;
    box-shadow: none;
    background: transparent;
}
/* For WebKit browsers (Chrome, Safari, Edge, Opera) */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  display: none;
  -webkit-appearance: none; /* Removes any default styling */
  appearance: none; /* Standard property for removing default styling */
}

/* For Internet Explorer and older Edge versions */
input[type="search"]::-ms-clear {
  display: none;
  width: 0;
  height: 0;
}

input[type="search"]::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}
.grid-products-gallery {
    position: relative;
}
.grid-products-gallery .dropdown {
    position: absolute;
    z-index: 9;
    top: 17px;
    right: 44px;
    width: calc(100% - 60px);
    text-align: right;
}
.grid-products-gallery .dropdown-menu.sold-customer {
    margin-top: 5px !important;
}
.thumbnail-container.ratio-3-4 .swiper-slide {
    min-width: 75px;
}
span.clear-btn {
    display: none;
    position: absolute;
    right: 0;
    background: var(--body-bg);
    padding: 4px 11px;
    z-index: 1;
}
.search-box #searchInput {
    border: none;
    height: 54px;
    width: calc(100% - 20px);
    background: transparent;
    outline: none;
}
/* .product-details-right {
    background-color: var(--product-details-right-bg);
    border: 1px solid var(--product-details-right-border);
    padding: 15px;
    border-radius: 5px;
} */
.product-details-right h1 {
    font-size: 20px;
    margin: 0;
    color: var(--heading-color);
}
.product-details-right .category-name {
    padding: 5px 10px;
    box-shadow: 0 0 4px var(--badge-bg);
    border-radius: 5px;
    text-align: center;
    line-height: 14px;
}
.product-details-right .pricing-area p {
    font-size: 24px;
}
.product-details-right .card {
    box-shadow: 0 0 4px var(--badge-bg);
    border:none;
}
.product-details-right h3{
    font-size:20px;
}
.product-details-right .label {
    white-space: nowrap;
    font-weight: 500;
}
.product-details-right .value {
    text-align: right;
    line-height: 19px;
}
.file-format-item {
    border: 1px solid var(--btn-3d-bg);
    border-radius: 5px;
    padding: 5px 8px;
    text-align: center;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    font-size: 13px;
    gap: 4px;
}
.supported-software-item {
    border: 1px solid var(--btn-3d-bg);
    border-radius: 5px;
    justify-content: center;
    padding: 5px;
    font-size: 12px;
    font-weight: 500;
}
/* .file-format-item .info {
    max-width: 152px;
    line-height: 14px;
    font-size: 11px;
} */
.item-card .overlay {
    bottom: 0;
    width: 100%;
    padding: 15px 10px;
    border-radius: 0 0 8px 8px;
}
.item-card .overlay h3 {
    min-height: 38px;
    font-size: 16px;
    color: var(--item-card-heading-color);
    font-weight: 500;
}
.item-card .overlay p {
    font-size: 14px;
    color: var(--text-color);
    margin:0px;
}
.item-card .overlay .price {
    font-weight: 700;
    margin-bottom:0px;
    color:var(--primary-color);
    font-size: 16px;
}

.design-story {
    background-color: var(--product-details-right-bg);
    border: 1px solid var(--product-details-right-border);
    margin-top: 30px;
    border-radius: 5px;
    padding: 15px 15px 0px;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.design-story::before {
    content: "";
    position: absolute;
    top: -80px;
    right: -80px;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: rgba(124, 92, 255, 0.1);
}
.design-story::after {
    content: "";
    position: absolute;
    bottom: -100px;
    left: -100px;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    background: rgba(34, 211, 238, 0.1);
}
.pricing-area strong {
    color: #fe6564;
}


.designer-story {
    background-color: var(--product-details-right-bg);
    border-radius: 5px;
    border: 1px solid var(--product-details-right-border);
    padding: 20px 20px 0px;
    align-items: center;
    position: relative;
    overflow: hidden;
    margin-top: 30px;
    height: 100%;
}
.designer-story .content p {
    line-height: 1.7;
    margin: 1rem 0;
    color:var(--text-color);
}
.designer-story .content ul {
    margin: 1.2rem 0;
    padding-left: 20px;
    color:var(--text-color);
}
.designer-story .content ul li {
    margin-bottom: 10px;
    position: relative;
    padding-left: 20px;
}
.designer-story .content ul li::before {
    content: "✔";
    position: absolute;
    left: 0;
    color: #7c5cff;
}


.home-product-slider {
    padding-top: 50px;
    background-color:var(--home-product-slider-bg);
    border-top: 1px solid var(--home-product-slider-border);
    border-bottom: 1px solid var(--home-product-slider-border);
}
.home-product-slider .product-slider-wrapper {
    border: 1px solid var(--partner-box-border);
    border-radius: 10px;
    margin-top: 50px;
    margin-bottom: 50px;
}
.home-product-slider ul {
    display: flex;
    align-items: center;
    justify-content: center;
    list-style: none;
    gap: 19px;
    font-size: 20px;
    margin-top: -23px;
}

/* .home-product-slider ul:after {
    content: "";
    position: absolute;
    background: url("https://mirora-theme.myshopify.com/cdn/shop/t/19/assets/line_title.png")  center no-repeat;
    height: 1px;
    width: 100%;
} */
.home-product-slider ul li a {
    display: block;
    border: 1px solid var(--partner-box-border);
    padding: 8px 30px;
    color: var(--product-slider-nav-link-color);
    position: relative;
    z-index: 1;
    background: var(--partner-box-bg);
    font-size: 16px;
    font-weight: 400;
    transition: .3s;
    /* min-width: 240px; */
    text-align: center;
    text-transform: uppercase;
    border-radius: 5px;
}
.home-product-slider ul li a img {
    width: 30px;
    margin-right: 8px;
}
.home-product-slider ul li a:hover,
.home-product-slider ul li a.active {
    border-color:var(--primary-color);
    color:var(--primary-color);
}
.home-product-slider ul li a:hover {
    background-color: var(--primary-color);
    color: var(--text-color);
}
/* .grid-products-gallery {
    display: grid;
    grid-template-columns: 120px calc(100% - 120px);
} */
.thumbnail-container .swiper-slide{
    height: 100px;
    min-width: 100px;
    border-radius: 10px;
    background-size: cover;
}
.testimonial {
    padding-top: 50px;
    background-color:var(--home-product-slider-bg);
    border-top: 1px solid var(--home-product-slider-border);
    border-bottom: 1px solid var(--home-product-slider-border);
}
.manage-digitization{
    padding-top:50px;
}
.manage-digitization img{
    filter: hue-rotate(170deg) invert(1); /* This filter might need separate values for light/dark theme */
}
.swiper {
    max-width: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
}

.swiper .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    border: 1px solid var(--swiper-slide-border);
    max-width: 300px;
}
.swiper .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
    /* visibility: hidden; */
}
/* Custom styles for navigation buttons */
.swiper .swiper-button-next,
.swiper .swiper-button-prev {
  color: var(--text-color);
  background: var(--swiper-nav-btn-bg);
  padding: 15px;
  border-radius: 50%;
  width: 45px;
  height: 60px;
}
.swiper .swiper-button-prev {
    border-radius: 0 6px 6px 0;
    left:0px;
}
.swiper .swiper-button-next{
    border-radius: 6px 0 0 6px;
    right:0px;
}

.swiper .swiper-button-next::after,
.swiper .swiper-button-prev::after {
  font-size: 20px;
}
.swiper .swiper-slide .overlay {
    text-align: center;
    width: 100%;
    background: var(--item-card-overlay-bg);
    padding: 10px 5px;
    border-radius: 0 0 7px 7px;
    transition: .3s;
    transform: translateY(90px);
    bottom: 0px;
    position: absolute;
}
.swiper .swiper-slide:hover .overlay {
    transform: translateY(0px);
}
.swiper .swiper-slide .overlay h3 {
    font-size: 16px;
    color: var(--text-color);
    font-weight: 400;
}

.filter-area {
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 20px;
    z-index: 9;
    position: sticky;
    top: 71px;
    background: var(--filter-area-bg);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(1px);
    -webkit-backdrop-filter: blur(5px);
}
.search-icon{
    color: var(--text-color);
}
.search-container {
    display: flex;
    max-width: 400px;
    margin: auto;
}
.search-container .form-control {
    padding-left: 2.5rem;
    border-radius: 5px 0 0 5px;
    background: var(--search-control-bg);
    border-color: var(--search-control-border);
    color:var(--text-color);
    min-width: 460px;
}
.search-container .fa-search {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--search-icon-color);
}
.search-container .btn {
    border-radius: 0 5px 5px 0;
    min-width: 48px;
    color: var(--text-color);
    margin-left: -1px;
    background: var(--search-btn-bg);
    border-color: var(--search-btn-border);
}
.search-container .btn i{
    color:var(--search-btn-icon-color);
}
.search-wrapper {
    position: relative;
    flex-grow: 1;
}

.select2-container--default
    .select2-selection--single
    .select2-selection__rendered {
    line-height: 40px;
    font-size: 14px;
}
.select2-container--default
    .select2-selection--single
    .select2-selection__rendered {
    color: var(--text-color);
}
.select2-container--default .select2-selection--single {
    background: var(--select2-bg)!important;
    border-color: var(--select2-border)!important;
    border-radius: 5px!important;
}

@media(max-width:1600px){

}

.fabric-specification h3{
    font-size:18px;
    color: var(--heading-color);
}

.fabric-specification .label {
    color: var(--fabric-label-color);
}

.tag-item {
    background: var(--tag-item-bg);
    border: 1px solid var(--tag-item-border);
    border-radius: 30px;
    padding: 3px 7px;
    font-size: 12px;
    color: var(--text-color);
}
.file-item {
    border: 1px solid var(--file-item-border);
    background: var(--file-item-bg);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    padding: 8px;
    border-radius: 5px;
}
.file-item h5 {
    margin-bottom: 5px;
    font-size: 15px;
    color: var(--heading-color);
}
.file-item p {
    margin: 0px;
    font-size: 12px;
    line-height: 15px;
    color: var(--light-text-color);
}
.file-item h5 i {
    border: 1px solid;
    width: 18px;
    height: 18px;
    font-size: 11px;
    text-align: center;
    border-radius: 50%;
    position: relative;
    top: -3px;
    padding: 2px;
    cursor: pointer;
    color: var(--text-color); /* Assuming icon color should match text */
}
/* .supported-software, .physical-size, .fabric-specification {
    margin: 10px 0;
    border-top: 1px solid var(--section-border-top);
    padding-top: 15px;
} */
.supported-software h3,
.physical-size h3{
    font-size:18px;
    color: var(--heading-color);
}
.supported-software .badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.supported-software .badge {
    display: flex;
    align-items: center;
    gap: 1px;
    height: 32px;
    padding: 0 8px;
    background: var(--badge-bg);
    border-radius: 8px;
    font-weight: 400;
    font-size: 13px;
    color: var(--text-color);
    border: 1px solid var(--badge-border);
    text-decoration: none;
}
.app-sprite-icon {
    display: flex;
    aspect-ratio: 1/1;
}
.supported-software .badge>h3 {
    margin-left: 6px;
    margin-bottom:0px;
    font-size: 13px;
    color: var(--text-color);
}
button.btn.btn-primary {
    background: var(--primary-btn-bg);
    border-color: var(--primary-btn-border);
    color: #ffffff;
}
a {
    color: var(--link-color);
    text-decoration: none;
}




.contact-form {
    text-align: left;
    padding: 50px;
    background-color: var(--contact-form-bg);
    border: 1.5px solid var(--contact-form-border);
    border-radius: 8px;
    color: var(--text-color); /* Added for contact form text */
}

.join-us .form-control {
    text-align: left;
    padding: 10px 15px;
    background-color: var(--join-us-form-control-bg);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(5px);
    border: 1.5px solid var(--join-us-form-control-border);
    border-radius: 8px;
    color: var(--text-color); /* Added for input text color */
}
.form-control option{
    background-color: var(--form-control-option-bg);
    color: var(--text-color); /* Added for option text color */
}
ul.dt-contact-iconblock-section.dt-sc-column {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
    font-size: 18px;
    margin-top: 50px;
    color: var(--text-color); /* Added for list item text */
}
li.dt-contact-icon-block {
    display: flex;
    align-items: center;
    gap: 10px;
}
.dt-contact-icon-content p {
    margin: 0px;
}
li.dt-contact-icon-block a {
    color: var(--primary-color);
}
ul.dt-sc-social-icons {
    display: flex;
    list-style: none;
    padding: 0px;
    gap: 15px;
}
ul.dt-sc-social-icons li a {
    color: var(--primary-color);
}
/* who we are */


.section.partner {
    padding:70px 0px;
  }


.service-content-wrapper {
    grid-column-gap: 73px;
    grid-row-gap: 73px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    margin-top: 80px;
    display: grid;
  }

  .partner-section-wrapper {
    text-align: center;
  }

  .partner-title-text {
    margin-top: 16px;
    color: var(--heading-color);
  }

  .partner-title-wrapper {
    text-align: center;
    width: 100%;
    max-width: 552px;
    margin-left: auto;
    margin-right: auto;
  }

  .partner-title-wrapper.service {
    max-width: 764px;
  }

  .partner-short-text {
    color: var(--text-color);
    width: 100%;
    max-width: 540px;
    margin: 10px auto 10px;
}

  .partner-short-text.margin {
    margin-bottom: 0;
  }

  .partner-short-text.contact {
    max-width: 507px;
  }

  .partner-content-box {
    text-align: left;
    width: 100%;
    height: 100%;
    padding: 24px;
    background-color: var(--partner-box-bg);
    border: 1px solid var(--partner-box-border);
    border-radius: 8px;
    color: var(--text-color); /* Added for partner box text */
}
.partner-content-box i {
    font-size: 24px;
    width: 50px;
    height: 50px;
    background: var(--partner-icon-bg);
    color: var(--partner-icon-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
}
.partner-content-box .partner-content-box-title {
    color: var(--footer-heading-color); /* Reusing for a bright heading */
}
  .partner-content-box-short-text {
    color: var(--light-text-color);
    margin-top: 14px;
  }

  .partner-content-box-image {
    margin-bottom: 30px;
    filter: hue-rotate(190deg); /* This filter might need separate values for light/dark theme */
}

.partner-content-image {
    object-fit: cover;
    width: 100%;
    min-width: 380px;
    border: 1px solid #dddddd;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    filter: hue-rotate(
33deg) invert(0.95);
}

.partner-content-image img {
    width: 100%;
    display: block;
}

  .partner-content-wrapper {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    justify-content: flex-start;
    align-items: stretch;
    margin-top: 45px;
    display: flex;
  }

.partner-content-box-wrapper {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    grid-template-rows: auto auto;
    grid-template-columns: 100%;
    grid-auto-columns: 1fr;
    display: grid;
    min-width: calc(50% - 220px);
}

.products-page {
    margin-bottom: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    transition: grid-template-columns 0.4s ease;
}
.products-page.sidebar-close {
    grid-template-columns: 0 1fr;
}
.products-page.sidebar-close .sidebar-filter {
    width: 0;
}
.sidebar-filter {
    border-right: 1px solid var(--border-color);
    transition: width 0.4s ease;
    width: 300px;
}
.sidebar-filter #filter-form {
    z-index: 9;
    top: 73px;
    overflow: auto;
    max-height: calc(100dvh - 74px);
    padding-top: 20px;
    padding-bottom: 20px;
    position: sticky;
}
.sidebar-filter #filter-form::-webkit-scrollbar{
    opacity: 0;
    width: 0;
}
.sidebar-filter:hover #filter-form::-webkit-scrollbar {
    width: 6px; /* slim scrollbar */
    opacity: 1;
    transition: opacity 0.3s;
}

.sidebar-filter #filter-form::-webkit-scrollbar-thumb {
    background-color: var(--sidebar-scrollbar-thumb);
    border-radius: 3px;
}

.others-item .second-step-item {
    color: var(--others-item-color);
    transition: .3s;
}
.others-item .second-step-item:hover {
    color: var(--text-color);
}
.sidebar-filter .form-group > label {
    text-transform: capitalize;
    margin-bottom: 8px;
    color: var(--text-color);
}
.product-filter {
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 20px;
    background: var(--product-filter-bg);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    border-bottom: 1px solid var(--border-color);
    position: sticky;
    top: 73px;
    z-index: 1;
}
.product-filter button.btn.btn-primary {
    background: var(--product-filter-btn-bg);
    border-color: var(--product-filter-btn-border);
}
.product-filter .filter-left {
    padding-left: 50px;
}
.product-filter .humberger-menu {
    position: absolute;
    width: 57px;
    font-size: 20px;
    left: 0;
    text-align: center;
    height: 100%;
    top: 0;
    display: flex;
    align-items: center;
    cursor: pointer;
    justify-content: center;
    transition: .3s;
}
.product-filter .humberger-menu:hover{
    color: var(--primary-color);
    background-color: var(--secondary-nav-bg);
}
.product-filter .humberger-menu:after {
    content: "";
    position: absolute;
    right: 0;
    width: 1px;
    height: 100%;
    background:var(--border-color);
    top: 0;
}
.profile-sidebar-sticky .avatar {
    --size: 2.1875rem;
    block-size: 5rem;
    inline-size: 5rem;
    min-inline-size: 5rem;
    display: grid;
    place-items: center;
    background-color: var(--profile-avatar-bg);
    border-color: var(--profile-avatar-border) !important;
}
.profile-sidebar-sticky .avatar img {
    max-inline-size: 100%;
    block-size: auto;
}
.profile-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
.profile-menu li a {
    padding: 0.625rem;
    border-radius: 0.25rem;
    -webkit-border-start: 0.1875rem solid transparent;
    border-inline-start: 0.1875rem solid transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0.625rem;
    color: var(--profile-menu-link-color);
}
.profile-menu li.active a {
    background-color: var(--profile-menu-active-bg);
    border-color: var(--profile-menu-active-border);
    color: var(--text-color);
}
.profile-dropdown .avatar {
    border: 1px solid var(--profile-avatar-border);
}
.card {
    background: var(--card-bg);
    border-color: var(--card-border);
    color: var(--text-color); /* Added for card text color */
}

.pricing-card {
    background-color: var(--pricing-card-bg);
    border: 1px solid var(--pricing-card-border);
    padding: 30px;
    border-radius: 45px 0;
    transition: .3s;
    color: var(--text-color); /* Added for pricing card text */
}

.pricing-card .pricing-card:hover {
    box-shadow: 0 0 25px rgba(13,110,253,0.5); /* This rgba should probably be a variable too or adjusted */
    transform: translateY(-5px);
}

.pricing-card .price {
    font-size: 2rem;
    font-weight: bold;
    margin: 0.5rem 0;
    color: var(--heading-color);
}

.pricing-card .plan-description {
    font-size: 0.95rem;
    margin-top: 1rem;
    color: var(--plan-description-color);
    line-height: 1.6;
}

.pricing-card .monthly, .pricing-card .yearly {
    display: none;
}

.pricing-card .show {
    display: block;
}

.pricing-card .plan-btn {
    border-radius: 50px;
    font-weight: 500;
    padding: 0.6rem 1.5rem;
}

.pricing-card h5 {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--heading-color);
}

.pricing-card .card-icon {
    font-size: 1rem;
    color: var(--pricing-card-icon-color);
    margin-right: 8px;
}
.offcanvas-start {
    transform: translateX(-100%);
    transition: transform 0.3s ease-in-out;
    max-width: 200px;
    background: var(--offcanvas-bg);
}

.offcanvas-start.show {
    transform: translateX(0);
}
.offcanvas.hiding {
  transform: translateX(-100%);
}
.toggle-filter{
    display: none;
}
.toggle-filter.active{
    display: block;
}
.navbar-right-mobile{
    display: flex;
    align-items: center;
    gap:15px;
}
.navbar-right-mobile button {
    border: none;
    background: none;
    color: var(--text-color); /* Added for button icon color */
}
div#overlay-menu {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 8;
    width: 100%;
    height: 100%;
    background: var(--overlay-menu-bg);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(2px);
    box-shadow: 0 25px 23px rgb(0 0 0 / 0%);
}
.offcanvas-header {
    background: var(--offcanvas-header-bg);
}
.offcanvas ul.navbar-nav li:last-child{
    display: none;
}
.offcanvas ul.navbar-nav li a {
    text-transform: uppercase;
    color: var(--text-color);
}


.hero {
    position: relative;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--text-color);
}
.hero::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.6); /* dark overlay - consider making this a variable */
    z-index: 1;
}
.hero-content {
    position: relative;
    z-index: 2;
    padding: 2rem;
}
.hero h1 {
    font-size: 4rem;
    font-weight: 700;
    margin-bottom: 1rem;
    color: var(--heading-color);
}
.hero p {
    font-size: 1.5rem;
    margin-bottom: 2rem;
    color: var(--text-color);
}
.hero .btn-primary {
    padding: 0.75rem 2rem;
    font-size: 1.2rem;
}
.section-title {
    text-align: center;
    font-size: 2.5rem;
    margin-bottom: 2rem;
    color: var(--heading-color);
}


.accordion-header h2{
	font-size:16px;
	margin-bottom:0px;
    font-weight: 500;
}
.accordion-button-icon {
	transform: rotate(90deg);
	transition:.3s;
}
.accordion-button-icon.collapsed {
	transform: rotate(0deg);
}
button.accordion-button-icon.collapsed:hover {
	color: #fff;
}
.accordion-button-icon::after {
	font-family: 'FontAwesome';
	content: '\f054';
	transition: transform 0.2s;
	z-index: 1;
	position: relative;
  font-size: 12px;
}
.collapse {
    transition: max-height 0.4s ease-out, padding 0.4s ease-out;
}
.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    transition: height 0.3s ease-out;
}
.first-step-item {
	margin-bottom: 5px;
}
.first-step-item > div >.card-content-wrapper {
	padding-right:5px
}
.card-content-wrapper {
	padding: 0 0 0px 10px;
	margin-left: 10px;
}
.second-step-item,
.third-step-item,
.four-step-item{
	margin-top: 5px;
	position:relative;
}
.cursor-pointer{
	cursor:pointer;
}
/* .first-step-item .accordion-header.collapsed {
	background: #fff;
} */
.first-step-item > .accordion-header {
    padding: 5px 5px 5px 0px!important;
}
.first-step-item > div > .card-content-wrapper {
    padding-left: 0;
    margin-left: 0;
}
.second-step-item h2 a {
	font-weight: 600;
}
.third-step-item h2 a {
	font-weight: 400;
}
.card-content-wrapper a{
	color:#333;
	font-size:14px;
	font-weight:normal;
	text-decoration:none;
	transition:.2s;
	position:relative;
}
.card-content-wrapper a:hover,
.card-content-wrapper a.active{
	color:#fe6564;
}
.card-content-wrapper a:before,
.card-content-wrapper a.active:before {
	position: absolute;
	z-index: 1;
	content: "";
	height: .5px;
	background-color: #fe6564;
	bottom: -2px;
	width: 0%;
	left: 0;
	right: 0;
	margin: 0 auto;
	-webkit-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}
.card-content-wrapper a:hover::before,
.card-content-wrapper a.active::before {
	width: 100%;
}
button.accordion-button-icon {
	position: relative;
	border: none;
	outline: none;
	background: #fe6564;
	color: #fff;
	width: 26px;
	height: 26px;
	text-align: center;
	padding: 0px;
	border-radius: 50%;
	font-weight:700;
}

button.accordion-button-icon.collapsed {
	background:transparent;
	color:#222;

}
.accordion-button-icon::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(.5);
	visibility: hidden;
	opacity: 0;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-color: #fe6564;
	transition: transform .3s, opacity .3s;
}
.accordion-button-icon:hover::before{
	transform: translate(-50%, -50%) scale(1);
	visibility: visible;
	opacity: 1;
}

.accordion-button-icon:hover::before{
	transform: translate(-50%, -50%) scale(1);
	visibility: visible;
	opacity: 1;
}

@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1400px;
    }
}
@media (min-width: 1900px) {
    .products-page {
        max-width: 1900px;
        margin: 0 auto;
    }
    .item-list-grid {
        --minWidth: 18.75rem;
    }
}
@media (max-width: 1899px) {
    .products-page {
        max-width: 1515px;
        margin: 0 auto;
    }
    .item-list-grid {
        --minWidth: 24%;
    }
}
@media (max-width: 1490px) {
    .products-page {
        max-width: 100%;
        margin: 0 auto;
    }
    .item-list-grid {
        --minWidth: calc(27% - 35px);
    }
}
@media (max-width: 1300px) {
    .item-list-grid {
        --minWidth: calc(36% - 38px);
    }
    .sidebar-filter {
        width: 240px;
    }
}
@media (max-width: 991px) {
    .item-list-grid {
        --minWidth: calc(53% - 30px);
    }
    .sidebar-filter {
        width: 220px;
    }
}

/* @media (min-width: 1600px) {
    .item-list-grid {
        grid-template-columns: repeat(auto-fit, minmax(297px, 297px));
    }
} */
/* .thumbnail-container .swiper-slide:first-child, .thumbnail-container .swiper-slide:nth-child(2) {
    display: block;
}
.thumbnail-container .swiper-slide,
.thumbnail-container2 .swiper-slide {
    display: none;
}

.thumbnail-container2 .swiper-slide:not(:first-child):not(:nth-child(2)) {
    display: block;
} */
  /* your styles here */
.item-card .item-image-wrapper .dropdown .dropdown-toggle{
    position: absolute;
    right:10px;
    top:10px;
    z-index: 9999;
    font-size: 12px;
}
.item-card .item-image-wrapper .dropdown .dropdown-toggle::after {
    margin-left: 0;
}
.dropdown-menu.sold-customer::before {
    content: '';
    position: absolute;
    top: -8px;
    right: 20px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid white;
}
.dropdown-menu.sold-customer {
    display: flex!important;
    transform: translateX(50px);
    opacity: 0;
    visibility: hidden;
    transition: transform .30s ease, opacity .30s ease, visibility .30s;
    background:rgba(255, 255, 255, 0.8);
    border: none;
    flex-wrap: wrap;
    padding: 10px;
    margin-top: 0px !important;
    inset: unset !important;
    will-change: transform, opacity;
    border-radius: 5px;
    right: 0px!important;
    justify-content: center;
    gap: 7px;
    width: 100%;
    height: 100%;
}

.dropdown:hover .dropdown-menu.sold-customer,
.dropdown-menu.sold-customer.show {
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
}
.dropdown-menu.sold-customer .customer-list {
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    align-items: center;
}
.customer-item {
    width: calc(50% - 8px);
    margin: 2px;
    text-align: center;
    border-radius: 5px;
    padding: 6px;
    height: 38%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.customer-item img {
    width: 100%;
}
.item-card:hover .customer-item img {
    transform: scale(1);
}
.others-item.custom-items {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 6px;
}
.others-item.custom-items .form-check.second-step-item {
    width: calc(50% - 6px);
    background: #ffffff;
    padding: 5px;
    box-shadow: 0 0 4px #ddd;
    border-radius: 5px;
    display: flex;
    align-items: center;
    transition: .3s;
}
.others-item.custom-items .form-check.second-step-item:hover {
    background-color: #fff3f3;
}
.others-item.custom-items .form-check.second-step-item .form-check-input {
    margin-left: 0;
    margin-right: 5px;
    margin-top: 0px;
}
.show-sold .item-image-wrapper .dropdown {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}