.maincomponent-num {
    font-size: var(--font-xxl);
    line-height: var(--font-xxl);
    font-weight: var(--font-bold)
}
@media (max-width:640.98px) {
    .maincomponent-num {
        font-size: var( --font-md);
        line-height: var(--font-md);
        font-weight: var( --font-regular)
    }
}

@media (max-width:375px) {
    .maincomponent-num {
        font-size: var( --font-sm);
        line-height: var(--font-sm);
        font-weight: var( --font-regular)
    }
}

.maincomponent-label {
    font-size: var(--font-lg);
    max-width: fit-content;
    font-weight: var(--font-bold)
}

@media (max-width:640.98px) {
    .maincomponent-label {
        font-size: var(--font-xxs) !important;
        max-width: fit-content;
        font-weight: var(--font-regular)
    }
}

@media (max-width:375px) {
    .maincomponent-label {
        font-size: var(--font-xxxs) !important;
        max-width: fit-content;
        font-weight: var(--font-regular)
    }
}
.img-max {
    max-width: 80px;
}

@media (max-width: 375px) {
    .product-title {
        font-size: var(--font-sm) !important;
    }

    .product-price {
        font-size: var(--font-xs) !important;
    }
    .view-all {
        font-size: var( --font-xxxs) !important;
    }
    .img-max {
        max-width: 60px;
    }
}


@media (min-width: 769px) {
    .product-title {
        font-size: var(--font-lg) !important;
    }

    .product-price {
        font-size: var(--font-md) !important;
    }
    .view-all {
        font-size: var(--font-md) !important;
    }
}