 @media screen and (max-width:375px) {
     .collection-item {
         padding: 0 2px;
     }

     .sticky-collection-inner .container {
         padding-right: 5px;
         padding-left: 5px;
     }
 }

 @media screen and (max-width: 767px) {
     body {
         margin-bottom: 60px;
     }

     .product-box .product-image img {
         max-height: 10rem;
         object-fit: cover;
     }

     .video-modal-content {
         width: 90% !important;
         max-height: 90vh !important;
         aspect-ratio: 9/16;
         max-width: 400px !important;
     }

     .video-modal video,
     .video-modal iframe {
         height: 100%;
         object-fit: contain;
     }

     .video-slide {
         height: 320px !important;
     }

     .category-swiper-arrow,
     .video-swiper-arrow.category-swiper-arrow,
     .video-swiper-arrow {
         top: 56% !important;
     }

     .video-title {
         padding: 20px 8px 12px !important;
         font-size: 0.9rem !important;
     }

     .home-about-section-right {
         display: none !important;
     }

     .categorySwiper .card {
         height: auto;
     }

     .footer-logo-widget {
         text-align: center;
         margin-bottom: 1rem;
     }

     #searchCanvas.offcanvas-top {
         height: auto !important;
     }

     #searchCanvas .offcanvas-search-wrapper {
         margin: 0.5rem 0 1.6rem;
     }

     .offcanvas-popular-wrapper .offcanvas-title {
         margin: 0.5rem 0 0;
     }

     .mobile-navbar .navbar-logo a {
         font-size: 1.1rem;
     }

     .mobile-navbar .icon-btn {
         font-size: 0.9rem;
         color: #e7ad47 !important;
     }

     .mobile-navbar .navbar-right {
         gap: 0;
     }

     .mobile-bottom-nav {
         height: 60px;
     }

     .mobile-bottom-nav a i {
         font-size: 18px;
     }

     .mobile-bottom-nav a span {
         font-size: 11px;
     }

     .myHeroSwiper {
         height: auto !important;
         min-height: 100px !important;
     }

     .categorySwiper .swiper-slide {
         width: 130px;
     }

     .category-swiper-arrow,
     .blog-swiper-arrow {
         width: 32px;
         height: 32px;
         font-size: 1.1rem;
     }

     .collection-title {
         font-size: 14px;
     }

     .sticky-collection-inner {
         padding: 22px 0 10px;
     }

     .collection-item {
         padding: 0 4px;
     }

     .colllection-img img {
         width: 64px;
         height: 64px;
     }

     .collection-list-inner {
         overflow: scroll;
         padding: 0 15px;
         margin: 0 -15px;
     }

     .collection-list-inner::-webkit-scrollbar {
         display: none;
     }

     .collection-list {
         width: max-content;
         margin: auto;
     }

     .collection-title {
         font-size: 12px;
     }

     .testimonialSwiper .swiper-slide {
         min-width: 0;
     }

     .product-section .product-box {
         margin-bottom: 1.5rem;
     }

     .product-section .main-row {
         padding: 0 10px;
     }

     .col-sm-6.product-box {
         width: 48%;
     }

     #productGrid .col-sm-6.product-box {
         width: 50%;
     }

     .product-section .col-sm-6.product-box {
         padding: 0 5px !important;
     }

     .breadcrumb-wrapper {
         width: 100%;
     }

     #product-toolbar {
         gap: 18px 0;
     }

     #product-toolbar .filter-btn,
     #product-toolbar .sorting-btn-wrapper {
         width: 48%;
         border-radius: 25px;
         padding: 8px;
     }

     #product-toolbar .sorting-btn {
         width: 100%;
         justify-content: center;
     }

     .profile-section-title {
         font-size: 1.1rem !important;
         font-weight: 600 !important;
         margin-bottom: 18px !important;
         color: #444 !important;
     }

     .profile-container {
         box-shadow: none;
     }

     .profile-header {
         flex-direction: column !important;
         gap: 10px !important;
         text-align: center;
     }

     .profile-avatar {
         margin: 0 auto 10px auto;
     }

     .profile-nav {
         justify-content: center;
     }

     .profile-nav .nav-link {
         padding: 6px 12px;
     }

     .tab-pane {
         padding: 0 12px;
     }

     .section-title {
         margin-bottom: 1rem;
     }

     .section-title .section-heading {
         font-size: 25px;
         margin-bottom: 0;
     }

     .home-about-section-left h2 {
         font-size: 1.8rem;
     }

     .tab-content .shop-wrapper {
         padding: 0 5px;
     }

     .tab-content .shop-wrapper {
         gap: 14px 10px;
     }

     .product-box .product-footer .cart-btn {
         font-size: 14px;
         padding: 8px 10px;
     }

     .product-box .box-inner {
         padding: 12px;
         justify-content: flex-start !important;
     }

     .signup-auth-card {
         max-width: 100%;
         padding: 24px 18px;
     }

     .auth-title {
         font-size: 1.4rem;
     }

     .forgot-password-auth-card {
         padding: 24px 16px;
     }

     .testimonial-section {
         padding: 0 0 15px;
     }

     .testimonial-section .section-title {
         padding-top: 1rem !important;
         margin-bottom: 0 !important;
     }

     .testimonialSwiper {
         margin-top: 1.2rem;
     }

     .testi-item .testi-rating-wrapper .star-box {
         font-size: 12px;
     }

     .testi-item .testi-rating-wrapper .text-muted {
         font-size: 14px;
     }

     .testimonialSwiper .testi-item .rounded-circle {
         width: 46px;
         height: 46px;
     }

     .testi-item .testi-rating-wrapper {
         margin: 0.5rem 0 0.25rem;
     }

     .testimonialSwiper .testi-item {
         height: fit-content;
     }

     .zoom-img-wrapper .main-img {
         object-fit: cover;
         height: 100%;
         border-radius: 0.5rem;
     }

     .zoom-img-wrapper,
     .mainSwiper,
     .mainSwiper .swiper-slide {
         height: 365px !important;
     }

     .thumbSwiper {
         width: 44px;
     }

     .product-swiper-wrapper {
         flex-direction: column !important;
         align-items: center;
     }

     .flex-grow-1.position-relative {
         width: 100%;
         margin-bottom: 10px;
     }

     .thumb-swiper-container {
         width: 100%;
         margin: 0;
         order: 2;
     }

     .thumb-swiper-container.me-3 {
         margin: 0 auto !important;
     }

     .thumbSwiper {
         width: 100% !important;
         height: auto !important;
         display: flex;
     }

     .thumbSwiper .swiper-wrapper {
         flex-direction: row !important;
         display: flex;
         height: auto !important;
         transform: none !important;
     }

     .thumbSwiper .swiper-slide {
         width: 68px !important;
         height: 68px !important;
         margin: 0 6px 0 0;
         margin-bottom: 0 !important;
         display: flex;
         align-items: center;
         justify-content: center;
     }

     .about-hero {
         padding: 32px 8px 24px 8px;
     }

     .about-hero h1 {
         font-size: 2rem;
     }

 }

 @media (min-width: 768px) {
     .mobile-bottom-nav {
         display: none !important;
     }

     #searchCanvas.offcanvas-top {
         height: 90vh !important;
         max-height: 100vh;
     }

     #searchCanvas .offcanvas-search-wrapper {
         margin: 1.5rem auto 2.5rem;
     }

     .offcanvas-popular-wrapper .offcanvas-title {
         margin: 1rem 0 0.5rem;
     }

     .home-about-section {
         margin-top: 3.5rem;
     }

     .section-title {
         margin-bottom: 1.5rem;
     }
 }

 @media screen and (min-width: 768px) and (max-width: 1120px) {
     .product-box .product-image img {
         max-height: 13.5rem;
         object-fit: cover;
     }

     .product-section .sidebar {
         display: none;
     }

     .profile-container {
         padding: 18px 4px;
     }

     .zoom-img-wrapper .main-img {
         object-fit: cover;
         height: 100%;
         border-radius: 0.5rem;
     }

     .zoom-img-wrapper,
     .mainSwiper,
     .mainSwiper .swiper-slide {
         height: 600px !important;
     }

     .thumbSwiper {
         height: fit-content !important;
     }

     .about-section {
         flex-direction: column;
         gap: 24px;
     }

     .about-img,
     .about-content {
         min-width: 0;
     }
 }

 @media (min-width: 992px) {
     .desktop-navbar {
         display: flex !important;
         font-family: 'Red Hat Text';
     }

     .mobile-navbar {
         display: none !important;
     }

     .navbar-expand-lg .navbar-nav {
         display: flex;
         flex-wrap: nowrap;
         overflow-x: auto;
         overflow-y: hidden;
         white-space: nowrap;
         gap: 8px;
         margin: auto;
         max-width: 100%;
         padding-bottom: 2px;
         scrollbar-width: thin;
         /* Firefox */
         scrollbar-color: #8888 #0000;
     }

     .navbar-nav .nav-link {
         white-space: nowrap;
     }

     .navbar-expand-lg .navbar-collapse {
         justify-content: space-between;
         width: 75%;
     }

     /* Webkit browsers (Chrome, Edge, Safari) */
     .navbar-nav::-webkit-scrollbar {
         height: 6px;
         background: transparent;
     }

     .navbar-nav::-webkit-scrollbar-thumb {
         background: #888;
         /* Gray thumb */
         border-radius: 4px;
     }

     .navbar-nav::-webkit-scrollbar-track {
         background: transparent;
     }

     .product-section .sidebar {
         max-width: 24%;
     }

     .product-section .main-row {
         padding: 0 15px;
     }
 }

 @media screen and (max-width: 1120px) {
     .sidebar {
         display: none !important;
     }
 }

 @media screen and (min-width: 1121px) {
     .profile-nav {
         gap: 12px;
     }

     .filter-btn.d-lg-none {
         display: none !important;
     }
 }

 @media (min-width: 1120px) and (max-width: 1280px) {
     .myHeroSwiper {
         height: 34vw !important;
     }
 }