@media(max-width:991px) {

    .nav-wrapper {

        position: fixed;

        top: 0;

        right: -100%;

        width: 300px;

        height: 100vh;

        background: #10141d;

        flex-direction: column;

        justify-content: flex-start;

        align-items: flex-start;

        padding: 90px 30px;

        gap: 30px;

        transition: .35s;

        margin-left: 0;

    }

    .nav-wrapper.active {

        right: 0;

    }

    .nav-menu {

        flex-direction: column;

        width: 100%;

        align-items: flex-start;

        gap: 20px;

    }

    .nav-actions {

        width: 100%;

        flex-wrap: wrap;

    }

    .search-box {

        width: 100%;

    }

    .mobile-toggle {

        display: block;

        background: none;

        color: white;

        font-size: 25px;

    }

    .mega-menu {

        position: static;

        width: 100%;

        display: none;

        opacity: 1;

        visibility: visible;

        transform: none;

        padding: 15px;

        margin-top: 15px;

    }

    .mega-parent:hover .mega-menu {

        display: flex;

    }

}

@media (max-width:767px) {}

@media (max-width:575px) {}


@media(max-width:991px) {

    .hero-slider img {

        height: 360px;

    }

    .hero-overlay {

        padding: 35px;

    }

    .hero-overlay h1 {

        font-size: 34px;

    }

    .side-banner {

        margin-bottom: 20px;

    }

}

@media(max-width:576px) {

    .hero-slider img {

        height: 250px;

    }

    .hero-overlay {

        padding: 20px;

    }

    .hero-overlay h1 {

        font-size: 24px;

    }

    .hero-overlay p {

        font-size: 14px;

    }

    .hero-btn {

        padding: 10px 18px;

    }

}


@media(max-width:768px) {

    .section-header {

        flex-direction: column;

        align-items: flex-start;

        gap: 10px;

    }

    .section-header h2 {

        font-size: 24px;

    }

    .category-card {

        padding: 25px 15px;

    }

    .category-icon {

        width: 58px;

        height: 58px;

        font-size: 24px;

    }

}

@media(max-width:1200px) {

    .products-grid {

        grid-template-columns: repeat(3, 1fr);

    }

}

@media(max-width:992px) {

    .products-grid {

        grid-template-columns: repeat(2, 1fr);

    }

}

@media(max-width:576px) {

    .products-grid {

        grid-template-columns: 1fr;

    }

    .product-image {

        height: 150px;

    }

}

@media(max-width:768px) {

    .footer {

        text-align: center;

    }

    .footer-logo {

        justify-content: center;

    }

    .social-links {

        justify-content: center;

    }

    .newsletter-form {

        flex-direction: column;

    }

    .newsletter-form input {
        padding: 16px 16px;
        ;
    }

    .newsletter-form button {

        height: 48px;

    }

    .footer-bottom {

        flex-direction: column;

        gap: 12px;

    }

}

@media(max-width:991px) {

    .filter-sidebar {

        margin-bottom: 30px;

    }

    .products-toolbar {

        flex-direction: column;

        align-items: flex-start;

        gap: 20px;

    }

    .toolbar-actions {

        width: 100%;

    }

    .toolbar-actions select {

        width: 100%;

    }

}

@media(max-width:576px) {

    .page-title h1 {

        font-size: 28px;

    }

}

@media(max-width:1200px) {

    .products-grid {

        grid-template-columns: repeat(3, 1fr);

    }

}

@media(max-width:576px) {

    .products-grid {

        grid-template-columns: 1fr;

    }

}

@media(max-width:576px) {

    .quick-filters {

        overflow-x: auto;

        flex-wrap: nowrap;

        padding-bottom: 8px;

        scrollbar-width: none;

    }

    .quick-filters::-webkit-scrollbar {

        display: none;

    }

    .filter-chip {

        white-space: nowrap;

        flex-shrink: 0;

    }

}

@media(max-width:991px) {

    .mobile-filter-btn {

        display: flex;

        align-items: center;

        gap: 10px;

        background: var(--primary);

        color: #fff;

        padding: 12px 18px;

        border-radius: 12px;

    }

}


@media(max-width:991px) {

    .product-info {

        margin-top: 20px;

    }

    .main-image img {

        height: 330px;

    }

}

@media(max-width:576px) {

    .product-info h1 {

        font-size: 26px;

    }

    .thumbnail-images {

        justify-content: center;

    }

    .thumbnail-images img {

        width: 70px;

        height: 70px;

    }

    .action-buttons {

        flex-direction: column;

    }

    .wishlist-outline {

        width: 100%;

        height: 50px;

    }

    .buy-btn {
        padding: 16px;
    }
}

@media(max-width:991px) {

    .product-info {

        margin-top: 20px;

    }

    .main-image img {

        height: 330px;

    }

}

@media(max-width:576px) {

    .product-info h1 {

        font-size: 26px;

    }

    .thumbnail-images {

        justify-content: center;

    }

    .thumbnail-images img {

        width: 70px;

        height: 70px;

    }

    .action-buttons {

        flex-direction: column;

    }

    .wishlist-outline {

        width: 100%;

        height: 50px;

    }

}


@media(max-width:768px) {

    .product-tab-nav {

        overflow-x: auto;

        flex-wrap: nowrap;

        scrollbar-width: none;

    }

    .product-tab-nav::-webkit-scrollbar {

        display: none;

    }

    .product-tab-nav .nav-link {

        white-space: nowrap;

    }

    .tab-card {

        padding: 22px;

    }

    .product-spec-table th {

        width: 120px;

    }

}


@media(max-width:768px) {

    .related-products h2 {

        font-size: 26px;

    }

}

@media(max-width:576px) {

    .auth-card {

        padding: 30px 22px;

    }

    .auth-card h1 {

        font-size: 28px;

    }

}

@media(max-width:576px) {

    .otp-input {

        width: 45px;

        height: 55px;

        font-size: 20px;

    }

}


@media(max-width:768px) {

    .order-top {

        flex-direction: column;

        align-items: flex-start;

        gap: 15px;

    }

    .order-bottom {

        flex-direction: column;

        align-items: flex-start;

        gap: 15px;

    }

    .primary-btn {

        width: 100%;

    }

}


@media(max-width:992px) {

    .cart-item {

        flex-wrap: wrap;

    }

    .cart-price {

        width: 100%;

        text-align: right;

    }

}

@media(max-width:576px) {

    .cart-item img {

        width: 90px;

        height: 90px;

    }

    .cart-info {

        width: 100%;

    }

}

@media(max-width:992px) {

    .cart-summary {

        position: static;

        margin-top: 20px;

    }

    .discount-input {

        flex-direction: column;

    }

    .discount-input button {

        width: 100%;

        height: 48px;

    }

}

@media(max-width:576px) {

    .error-code {

        font-size: 72px;

    }

    .error-icon {

        width: 90px;

        height: 90px;

    }

    .error-icon i {

        font-size: 36px;

    }

    .error-actions {

        flex-direction: column;

    }

    .error-actions a {

        width: 100%;

    }

}

@media(max-width:576px) {

    .profile-card {

        flex-direction: column;

        text-align: center;

    }

}


@media(max-width:992px) {

    .desktop-menu {

        display: none;

    }

    .search-box {

        display: none;

    }

    .mobile-toggle {

        display: flex;

    }

    .mobile-search {

        display: flex;

    }

    .logo span {

        font-size: 22px;

    }

    .nav-actions {

        gap: 10px;

    }

}

@media(max-width:768px) {

    .brand-card {

        height: 100px;

    }

    .brand-card img {

        max-width: 90px;

        max-height: 45px;

    }

}

@media(max-width:768px) {

    .about-card {

        padding: 28px;

    }

    .about-big-icon {

        font-size: 90px;

    }

    .about-cta {

        padding: 40px 20px;

    }

}

@media(max-width:768px) {

    .blog-grid {

        grid-template-columns: 1fr;

    }

    .blog-body {

        padding: 18px;

    }

    .blog-card img {

        height: 190px;

    }

}



@media(max-width:576px) {

    .shipping-method-content {

        padding: 14px;

        gap: 12px;

    }

    .shipping-method-icon {

        width: 42px;

        height: 42px;

        min-width: 42px;

        font-size: 17px;

    }

    .shipping-method-header {

        align-items: flex-start;

        flex-direction: column;

        gap: 5px;

    }

    .shipping-price {

        font-size: 13px;

    }

}


@media(max-width:576px){

    .payment-result-page{

        padding:40px 15px;

    }

    .payment-result-card{

        padding:40px 20px;

        border-radius:20px;

    }

    .payment-result-icon{

        width:75px;

        height:75px;

        font-size:30px;

    }

    .payment-result-card h1{

        font-size:22px;

    }

    .payment-info{

        grid-template-columns:1fr;

        padding:10px;

    }

    .payment-info-item{

        padding:14px 10px;

        border-left:none !important;

        border-bottom:1px solid rgba(255,255,255,.07);

    }

    .payment-info-item:last-child{

        border-bottom:none;

    }

    .payment-result-actions{

        flex-direction:column;

    }

    .payment-result-actions a{

        width:100%;

    }

}