/* Media Query for desktop devices */
/* Custom width for .offcanvas-start */
.offcanvas-start {
    width: 400px; /* Change width to desired value */
}

@media (max-width: 768px) {
    /* Optional: Adjust for smaller screens */
    .offcanvas-start {
        width: 250px;
    }
}
@media only screen and (min-width: 1200px) {
    .product-card {
        flex-direction: column;
        align-items: center;
        text-align: center;
        height: 100%;
    }
}

/* Media Query for mobile devices */
@media only screen and (max-width: 768px) {
    #header{
        padding-top:0px;
        padding-bottom:0px;
    }
    .logo {
        padding: 5px 0px 10px 10px;
    }
    .logo img{
        height:50px;
    }
    .loginmobile{
        padding: 0px;
        padding-right: 20px;
    }
    .usermenu{
        display: none;
        padding: 20px 0px 0px;
    }
    #category-area{
        padding: 10px 0px;
    }
    #category-area .heading{
        font-size:16px;
        padding: 10px;
        margin-bottom: 0px;
        border-radius: 5px;
    }
    .product-card {
        flex-direction: column;
        align-items: center;
        text-align: center;
        height: 100%;
    }

    .product-card .product-image img {
        margin-bottom: 10px;
    }

    .product-card .product-details {
        text-align: center;
    }

    .product-card .add-to-cart-btn {
        width: 100%;
        margin-top: 10px;
    }

    .product-card .price-area{
        max-width: 100%;
    }
}

@media only screen and (max-width: 468px) {
    #related_products{
        padding-top: 10px;
    }    
    #related_products .title h2{
        padding-bottom: 10px;
    }
    #category-area img{
        height: 100px;
    }
    .product-card .product-title{
        min-height: 60px;
    }
    #category-area .image-box .product-title a, .product-card a{
        font-size:12px;
    }
}