/*#kt_aside_menu_wrapper {*/
/*    height: 300px !important;*/
/*}*/


.delivery-info {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 8px;
    border-radius: 5px;
    background-color:white;
    cursor: pointer;
}


.delivery-text span {
    display: block;
    font-weight: bold;
}

.delivery-text p {
    margin: 0;
    font-size: 0.9rem;
}

.logo-container {
    padding: 8px;
    border-radius: 5px;
    border: 1px dashed black;
}

.category-slider {
    overflow-x: scroll;
    white-space: nowrap;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    scrollbar-width: none;
}

.category-slider::-webkit-scrollbar {
    display: none; /* Hide scrollbar for Chrome, Safari, and Opera */
}

.category {
    display: inline-block;
    margin-top:4px;
    padding: 10px 20px;
    margin-right: 10px;
    border-radius: 8px;
    text-align: center;
    cursor: pointer;
}

.category.active {
    background-color: #009ef7 !important;
    color: #fff;
}

.sticky-categories {
    position: sticky;
    top: 0;
    z-index: 1020;
}

.col-sticky {
    /*background-color: #f5f5f5;*/
    padding: 5px;
    border-radius: 5px;
}

.sticky-sidebar {
    /*width: 275px;*/

}
.fixed-sidebar {
    position: fixed !important;
    /*top: 80px;*/
    top: 144px;
    width: 350px;
    max-height: calc(100vh - 150px);
    margin-right: 15px;
    overflow-y: auto;

}

.product {
    background-color: transparent;
}

.product:hover {
    /*background: linear-gradient(to right,#D9CDEC,#ADB9DE,#7BA7C9);*/
    background-color: #D9CDEC;
}

@media (max-width: 767px) {
    #logo_div {
        display: none !important;
    }

    .delivery-info {
        padding: 0px
    }

    #signin_div {
        display: none !important;
    }

    /*.fixed-sidebar {*/
    /*    display: none;*/

    /*}*/


    /*.sticky-sidebar {*/
    /*    display: none;*/

    /*}*/

    #scrollLeft{
        display: none;
    }
    #scrollRight{
        display: none;
    }
    #stepper{
        margin-bottom: 5px;
    }
}

#map {
    width: 100%;
    height: 200px;
}

.pac-container {
    z-index: 2000;
}


.delivery-info:hover {
    background-color: #000000;
    color:#ffffff;
}

.carousel-image {
    height: 250px;
    object-fit: cover;
    width: 100%;
}

@media (max-width: 992px) {
    .carousel-image {
        height: 140px;
    }
}

.landing-header{
    height:66px !important
}


.product-card{
    cursor:pointer;
}







ul.timeline {
    list-style-type: none;
    display: flex;
    flex-wrap: nowrap;
    /*overflow-x: auto;       */
    padding: 0;
    margin: 0;
}

ul.timeline > li {
    margin-left: 0px;               /* Control spacing between items */
    margin-right: 15px;               /* Control spacing between items */
    margin-bottom: -20px;               /* Control spacing between items */
    flex: 0 0 auto;             /* Prevent flex items from growing or shrinking */
    position: relative;
    display: flex;              /* Use flexbox for inner alignment */
    flex-direction: column;     /* Stack elements vertically */
    align-items: center;        /* Center-align the items */
}

ul.timeline > li:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 50%;                   /* Center vertically */
    left: 27px;                 /* Start at the right edge of the item */
    width: 90px;                /* Set the length of the line; adjust as necessary */
    height: 4px;                /* Height of the line */
    background-color: #d4d9df;  /* Color of the line */
    z-index: 300;
}

ul.timeline > li:before {
    content: '\2713';
    background: #fff;
    display: inline-block;
    border-radius: 50%;
    border: 2px solid #d4d9df;
    position: absolute;
    top: 50%;                   /* Center the circle vertically */
    left: 50%;                  /* Center the circle horizontally */
    transform: translate(-50%, -50%); /* Adjust centering of circle */
    width: 20px;
    height: 20px;
    z-index: 400;
    text-align: center;
    line-height: 20px;
    color: #d4d9df;
    font-size: 14px;
}

ul.timeline > li.active:before {
    background: #28a745;
    color: #fff;
    border-color: #28a745;
    font-size: 14px;
}


/*///*/



ul.timeline > li.active:not(:last-child)::after {
    background-color: #28a745;
}

.img-container {
    width: 100%;
    height: 150px;
    overflow: hidden;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
}

.responsive-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

#cart_count {
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #28a745;
    color: white;
    font-size: 10px;
}
.drawer{
    overflow-x: hidden !important;
}

.tns.tns-default .tns-outer {
    margin: 0 0 !important;
}



.phone-input-container {
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 5px;
    overflow: hidden;
    /*max-width: 300px;*/
}

.phone-prefix {
    background-color: #f1f1f1;
    padding: 10px;
    font-size: 16px;
    font-weight: bold;
    border-right: 1px solid #ccc;
    color: #333;
    user-select: none;
}

.phone-input {
    border: none;
    outline: none;
    padding: 10px;
    flex: 1;
    font-size: 16px;
}

.phone-input:focus {
    border-color: #007bff;
}

.landing-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background-color: transparent;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.landing-header.scrolled {
    background-color: white;
}

.product-card-image{
    width: 100%;
    height: auto;
    object-fit: contain;
    max-width: 300px;
    max-height: 300px;
    display: block;
    margin: 0 auto;
}

@media (max-width: 768px) {
    #searchProductDiv {
        display: none !important;
    }
}