@media (max-width:420px) {

    /* #Region: Fonts  */
    .font-18 {
        font-size: 14px;
    }

    .font-24 {
        font-size: 14px !important;
    }

    .font-14 {
        font-size: 10px;
    }

    .points .font-17 {
        font-size: 10px;
    }

    .line-v {
        height: 30px;
    }

    .product-card {
        width: 165px !important;

        .font-14 {
            font-size: 8px !important;
        }

        .product-img img {
            width: 127px;
            height: 127px;
        }

        .mx3 {
            padding-inline: 12px !important;
        }

        .ms-32 {
            margin-inline-start: auto !important;
        }

        .product-title {
            font-size: 9px;
            height: 25px;
        }

        .discount-badge {
            font-size: 9px;
        }

        .font-11 {
            font-size: 6px;
        }

        .rect-14 {
            width: 8px;
            height: 8px;
        }

        .wishlist-btn {
            width: 26;
            height: 26;
        }

        .rect-24 {
            width: 14px;
            height: 14px;
        }

        .mt-2 {
            margin-top: 4px !important;
        }

        .z-btn {
            width: 105px;
            height: 23px;
        }

        .rect-16 {
            width: 10px;
            height: 10px;
        }

        .circle-btn {
            width: 15px !important;
            height: 15px !important;
            padding: 0px;
        }

        .rect-12 {
            width: 7px !important;
            height: 7px !important;
        }

        .lh-22 {
            line-height: 12px;
        }
    }

    .product-img img {
        width: 127px;
        height: 127px;
    }

    .mt-64 {
        margin-top: 32px !important;
    }

    /* cart */
    .total-card.ms-32 {
        margin-inline-start: 0px !important;
    }

    .fav .rect-24 {
        width: 12px;
        height: 12px;
    }

    .cart-container .prod .prod-img {
        width: 10px;
        height: 35px;
        margin-inline-start: 4px !important;
    }

    .cart-container .font-18,
    .cart-container .font-20 {
        font-size: 8px;
    }

    .fav .circle-btn.ms-32 {
        margin-inline-start: 4px !important;
    }

    .fav .circle-btn {
        width: 11px;
        height: 11px;
        padding: 3px !important;
    }

    .fav .circle-btn img {
        width: 6px;
        height: 6px;
    }

    .fav .cart-container .ms-auto {
        margin-inline-start: 4px !important;
    }

    /* profle */
    .profile .tab {
        padding: 6px 10px;
    }

    /* orders */
    .table .order-img {
        width: 50px;
        height: 32px;
    }

    td,
    th {
        font-size: 10px;
    }

    .me-sm-0 {
        margin-inline-end: 0px !important;
    }

    .filter-btn {
        width: 135px;
        padding: 2px 10px;
    }

    .filter-form .mt-40 {
        margin-top: 24px !important;
    }

    .filter-form .form-check.mt-3 {
        margin-top: 10px !important;
    }

    .scroll-y.filter {
        max-height: 400px;
    }

    .home-banner {
        height: 170px !important;
    }
}

@media (min-width: 421px) and (max-width: 767px) {
    .main-img {
        max-width: 292px!important;
        max-height: 287px!important;
      }
      .main-img img {
        max-width: 292px!important;
        max-height: 287px!important;
      }
    
      ::ng-deep .ngxImageZoomContainer {
        max-height: 292px !important;
        max-width: 287px !important;
      }
      .info-container .prod-info .font-22{
        font-size: 14px!important;
      }
      .info-container .prod-info p{
        font-size :10px !important;
      }

      .info-container .rect-32{
        width: 18px!important;
        height: 18px !important;
      }
      .prod-data .font-14 , .font-md-8{
        font-size: 8px!important;
      }
      .font-md-9{
        font-size: 9px!important;
      }
      .font-md-10{
        font-size: 10px!important;
      }
   
      .rate-btn button{
        width: 120px!important;
    }
}