/* Main scrollbar customization for the whole page */
html::-webkit-scrollbar {
    width: 8px; /* Set the width of the scrollbar */
}

html::-webkit-scrollbar-thumb {
    background-color: #0f52ba; /* Set the color of the scrollbar thumb */
}

html::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* Set the background color of the track */
}

body::-webkit-scrollbar {
    width: 8px; /* Set the width of the scrollbar */
}

body::-webkit-scrollbar-thumb {
    background-color: #0f52ba; /* Set the color of the scrollbar thumb */
}

body::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* Set the background color of the track */
}
/* Custom container-fluid without padding or margin */
.custom-container-fluid {
    width: 100%;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

.custom-container-fluid .row {
    margin-left: 0;
    margin-right: 0;
}

.custom-container-fluid .col-xs-12,
.custom-container-fluid .col-sm-12,
.custom-container-fluid .col-md-12,
.custom-container-fluid .col-lg-12 {
    padding-left: 0;
    padding-right: 0;
}

.bottom-0{
    margin-bottom: 0!important;
}
.type_7 .megamenu-style-dev .horizontal ul.megamenu > li.active > a, .type_7 .megamenu-style-dev .horizontal ul.megamenu > li.home > a, .type_7 .megamenu-style-dev .horizontal ul.megamenu > li:hover > a{
    background: #0f52ba;
    color: white !important;
    border-radius: 4px;
    margin-right: 2px;
}
.categoryslideshow .owl2-nav{display: none!important;}
a.head-label{
    color: #666 !important;
}
.home-main-slid .owl2-nav{
    display: none !important;
}

.padding-0-custom{
    padding: 0px !important;
}
.nav-form{

}
.font-19-custom{font-size: 20px !important;}
.social-widgets visible-lg{
    display: none !important;
}
.all-cat-set{
    background: transparent !important;
    border: none !important;
}
.border-4{
    border-radius: 4px !important;
}
.contact-form-heading{
    text-align: center;
    font-size: 25px;
    font-weight: 800;
    padding: 13px 0px;
    color: #0f52ba;
}

.custom-contact-form {
    max-width: 600px;
    margin: 0 auto;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.custom-contact-heading {
    font-size: 24px;
    font-weight: bold;
    color: #333;
    margin-bottom: 20px;
    text-align: center;
}

.custom-form-group {
    margin-bottom: 15px;
}

.custom-form-label {
    display: block;
    font-weight: bold;
    margin: 8px 0px;
    color: #555;
}

.custom-form-input,
.custom-form-textarea,
.custom-form-file-input {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ccc;
    border-radius: 4px !important;
    font-size: 16px;
    color: #333;

    outline: none;
    transition: border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.custom-form-input:focus,
.custom-form-textarea:focus {
    border-color: #007bff;
    box-shadow: 0 0 8px rgba(0, 123, 255, 0.5);
}

.custom-form-textarea {
    resize: vertical;
}

.custom-form-file-input {
    border: none;
    padding: 0;
    color: #666;
}

.custom-form-button {
    display: inline-block;
    background-color: #0f52ba;
    color: #fff;
    margin-top: 10px;
    font-size: 16px;
    font-weight: bold;
    padding: 10px 20px;
    border: none;
    border-radius: 4px; /* Rounded corners */
    cursor: pointer;
    text-transform: uppercase;
    transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.custom-form-button:hover {
    background-color: #0056b3;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.custom-required {
    color: red;
    margin-left: 5px;
}
.contact-form-img{
    padding: 12%;
}

/* CSS to override existing styles */
.new-style {
    display: flex !important; /* Override with flexbox */
    justify-content: space-between !important; /* Align start and end */
    align-items: center !important; /* Align vertically in the center */
}

.new-start {
    border-top: 3px solid white !important;
}

.new-end {
    background-color: transparent !important; /* Remove background */
    color: #0f52ba !important; /* Match design */
    font-size: 13px !important;
    padding: 0 !important; /* Adjust padding */
    text-transform: none !important; /* Keep consistent style */
}
a.text-decoration-none:hover{
    color: #666;
}
.scrollable-description {
    height: 260px;
    overflow-y: auto;
    word-wrap: break-word;
    padding: 10px;
}

/* Custom scrollbar for Webkit browsers (Chrome, Safari, Edge) */
.scrollable-description::-webkit-scrollbar {
    width: 10px; /* Set the width of the scrollbar */
}

.scrollable-description::-webkit-scrollbar-thumb {
    background-color: #0f52ba; /* Set the color of the scrollbar thumb */
    border-radius: 4px; /* Optional: Make the thumb rounded */
}

.scrollable-description::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* Set the background color of the track */
    border-radius: 4px; /* Optional: Make the track rounded */
}
.btn-danger{
    background: #e74c3c !important;
}
.home-slid-banner{
    height: 75vh !important;
}
.subcat-itom-txt{
    font-size:13px;
    font-weight: bold;
}





/* Menu Styles */
.shop-menu .sub-menu-custom {
    width: 60%; /* Adjust as per your design */
    padding: 15px;
    background-color: #fff;
    border: 1px solid #ddd;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    height: auto;
}

.shop-list {
    max-height: 300px; /* Adjust as needed */
    overflow-y: auto;
    border-right: 1px solid #ddd;
}

.shop-name-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.shop-name-item a {
    display: block;
    padding: 10px 15px;
    text-decoration: none;
    color: #333;
    transition: background-color 0.3s;
}

.shop-name-item a:hover {
    background-color: #f5f5f5;
    color: #000;
}

.shop-products {
    padding-left: 15px;
}

.shop-products-content {
    min-height: 200px; /* Adjust as needed */
    border: 1px solid #ddd;
    padding: 10px;
    background-color: #f9f9f9;
}

/* Shop Product Navbar */
.shop-product-navbar {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2 cards per row */
    gap: 15px;
    padding: 10px; /* Reduced padding */
    box-sizing: border-box;
    overflow-y: auto; /* Allow vertical scrolling */
    max-height: 400px; /* Set a fixed height for scrolling */
    height: 100%;
    box-sizing: border-box;
}

/* Card styles */
.custom-product-card {
    display: block;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 15px;
    text-align: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s, box-shadow 0.2s;
    text-decoration: none; /* Remove underline */
}

.custom-product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);
}

/* Image styling */
.custom-product-image {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 4px;
    margin-bottom: 10px;
}
.contact-row {
    display: flex; /* Enable flexbox for the row */
    flex-wrap: wrap; /* Allow columns to wrap on smaller screens */
    align-items: center; /* Vertically center items */
    justify-content: space-between; /* Ensure columns don't overlap */
    min-height: 100vh; /* Full screen height */
    overflow-x: hidden; /* Remove horizontal scrollbar */
}

.contact-image-column,
.contact-form-column {
    display: flex; /* Enable flexbox for individual columns */
    align-items: center; /* Center content vertically */
    justify-content: center; /* Center content horizontally */
    padding: 20px; /* Add padding for better spacing */
    box-sizing: border-box; /* Ensure padding doesn't affect width */
    flex: 1 1 50%; /* Default: each column takes 50% of row width */
}

.custom-contact-form {
    width: 100%; /* Ensure form takes full width of its column */
    max-width: 500px; /* Limit form width for large screens */
}

img.contact-form-img {
    max-width: 100%; /* Ensure the image doesn't exceed its container width */
    height: auto; /* Maintain aspect ratio */
}


/* Product name styling */
.custom-product-name {
    font-size: 12px;
    padding: 10px;
    color: #333;
}
.header-top-sm{
    display: none !important;
}

.custom-slider {
    position: relative;
    width: 100%;
}

.custom-slider .custom-slider-image {
    width: 100%;
    height: auto;
}

.custom-slider .carousel-control {
    width: 5%;
    color: #fff;
    text-shadow: none;
    border: none;
}

.custom-slider .carousel-control:hover {
    background: rgba(0, 0, 0, 0.7);
}

.custom-slider .carousel-indicators {
    bottom: 15px;
}

.custom-slider .carousel-indicators li {
    width: 10px;
    height: 10px;
    background-color: #ccc;
    border-radius: 50%;
    border: none;
}

.custom-slider .carousel-indicators .active {
    background-color: #333;
}
.product-image-container a img{
    border-top-right-radius: 36px;
    border-bottom-left-radius: 36px;
}
.fa-star:before {
    content: "\f005";
    color: #eca330;
}
.register-pic-margin{
    margin-top: 52px;
}
/* Initially hide the categories and take them out of the layout */
.hidden-category {
    visibility: hidden;
    position: absolute;
    opacity: 0;
    transition: opacity 0.5s ease-in-out, visibility 0s linear 0.5s; /* Delay visibility change until after the fade-in */
}

/* Category container will have opacity transition for smooth reveal */
.category-container {
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
}
.slider-h7 .owl2-stage-outer. owl2-item{
    width: 233px !important;
}




/* Responsive adjustments */
@media (max-width: 768px) {
    .shop-product-navbar {
        grid-template-columns: repeat(2, 1fr); /* 2 cards per row for medium screens */
    }
}

@media (max-width: 480px) {
    .shop-product-navbar {
        grid-template-columns: 1fr; /* 1 card per row for small screens */
    }
}

.big-display-none{display: none}







@media only screen and (max-width: 600px) {
    .type_7 .header-center{
        background: #eee;
    }
    img.home-slid-banner{
        height: auto !important;
    }
    .contact-form-column{
        padding-top: 0rem;
    }
    .header-top-sm{
        display: block !important;
    }
    .sm-display-none{
        display: none;
    }
    .register-pic-margin{
        margin-top: 0px;
    }
}

@media only screen and (max-width: 450px) {
    .navbar-header{
        min-width: 61rem ;
    }
    .navbar-header .row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .navbar-logo img {
        max-height: 40px !important;
        display: block !important;
    }

    .navbar-toggle {
        margin: 0 !important;
    }
    .contact-row {
        flex-direction: column; /* Stack the columns vertically */
    }

    .contact-image-column,
    .contact-form-column {
        flex: 1 1 100%; /* Make each column take the full width */
    }

    .custom-contact-form {
        max-width: 90%; /* Reduce the form width for smaller screens */
    }
}
@media only screen and (max-width: 390px) {
    .navbar-header{
        min-width: 50rem ;
    }
}

@media (min-width: 1300px) {
    header.navbar-compact {
        margin-top: -116px;
    }    }@media (min-width: 1400px) {
    header.navbar-compact {
        margin-top: -120px;
    }    }
@media (min-width: 1500px) {
    header.navbar-compact {
        margin-top: -129px;
    }    }
@media (min-width: 1600px) {
    header.navbar-compact {
        margin-top: -139px;
    }    }
@media (min-width: 1800px) {
    header.navbar-compact {
        margin-top: -156px;
    }    }@media (min-width: 2030px) {
    header.navbar-compact {
        margin-top: -172px;
    }    }