/* Inline overrides from the original template's style block */ .product-action { display: none; } .product-price { display: none !important; } .product-ratting { display: none; } .custom-banner .custom-block .custom-wrap .custom-info .custom-text h6 { font-size: 20px; } .main-header .header-top-area .header-area .header-icon { width: 84.33%; } .main-header .header-top-area { background-image: linear-gradient(90deg, rgb(194, 218, 227) 0%, rgb(255, 244, 223) 46.154%) !important; } .user-wrap .user-wrapper a { color: #282626; } .user-wrap .user-wrapper a span.user-title { color: #282626; } .ft-copyright-area .ft-copyright ul.ft-copryright-ul li.ft-copryright-li p { color: #3b3232; font-size: 14px; } .ft-copyright-area .ft-copyright { background-color: unset; } .footer-area, .ft-copyright-area { background-color: #fbf4e9; } .about-vision2 { background: #f0ebe0; } .custom-banner .custom-block .custom-wrap a.big-banner .custom-info .custom-text span { display: block; color: var(--body-font-color); font-size: 16px; font-weight: 500; max-width: 58.33%; line-height: 1.5; margin: 11px 0px 0px; } .about-area-2 .about-content .about-banner-area .abt-banner-desc p { font-size: 17px; } .about-area-2 .about-content .about-banner-area .abt-banner-desc ul { padding-left: 20px; } .about-area-2 .about-content .about-banner-area .abt-banner-desc li { font-size: 15px !important; padding-top: 7px !important; list-style: disc !important; } .about-area-2 { background: linear-gradient(rgb(194, 218, 227) 0%, rgb(255, 244, 223) 46.154%, rgb(255, 255, 255) 100%); } /* Tailwind v4 auto-generates `.collapse { visibility: collapse }` which conflicts with Bootstrap's collapse mechanism. Override for the user dropdown and footer links. */ .footer-area .ftlink-ul { visibility: visible !important; } .user-drower.collapse.show { visibility: visible !important; } /* Keep the header nav menu (About us, Tutorial) visible on mobile */ @media (max-width: 1199px) { .main-menu-area .main-block .header-menu { display: block !important; } } /* Keep the Register dropdown (For Sellers / For Technicians) visible on mobile */ @media (max-width: 600px) { .header-icon-block ul.shop-element li.side-wrap.user-wrap { display: block !important; } } /* React port: product tabs render as a responsive grid instead of a JS Swiper. Mirrors the template's Swiper breakpoints (rows: 2 grid) so layout matches. */ .collection-wrap .collection-slider.swiper .swiper-wrapper { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; } .collection-wrap .collection-slider.swiper .swiper-wrapper .swiper-slide { width: auto; } @media (max-width: 1398px) { .collection-wrap .collection-slider.swiper .swiper-wrapper { grid-template-columns: repeat(3, 1fr); } } @media (max-width: 1023px) { .collection-wrap .collection-slider.swiper .swiper-wrapper { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 767px) { .collection-wrap .collection-slider.swiper .swiper-wrapper { grid-template-columns: repeat(2, 1fr); gap: 12px; } } @media (max-width: 359px) { .collection-wrap .collection-slider.swiper .swiper-wrapper { grid-template-columns: repeat(1, 1fr); gap: 12px; } }