﻿body {
    height: 100%;
    margin: 0;
    overflow-x: hidden; /* Prevent horizontal scrollbars */
}

/* Chnage margin between footer or navabr */
.flex-wrapper {
    display: flex;
    flex-direction: column;
    margin-bottom: 0 !important; /* margin from footer */
}

.body-content {
    flex: 1;
    margin-bottom: 0 !important; /* Remove margin below */
}

/* Set up the flex container */
.page-container {
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* Ensures the container takes the full height of the viewport */
    margin-bottom: 0 !important; /* Remove margin below */
}

/* Allow content to grow and push the footer down */
.content-wrapper {
    flex: 1;
    margin-left: 10px; /* Adjust left margin */
    margin-right: 10px; /* Adjust right margin */
}




.copyright-footer {
    text-align: center !important;
    padding: 1rem !important;
    background-color: #34495E !important;
    color: #FFFFFF !important;
    margin: 0!important; /* Remove any margins to eliminate gaps */
}

.footer-full-width {
    width: 100%;
    max-width: 100vw; /* Ensure it does not exceed viewport width */
    background-color: #f8f9fa;
    padding-top: 20px;
}

    .footer-full-width .container {
        max-width: 1140px;
        margin: auto;
    }

    .footer-full-width .btn-floating {
        width: 35px;
        height: 35px;
        margin: 5px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #fff;
    }

    .footer-full-width .form-outline {
        position: relative;
        margin-bottom: 20px;
    }

        .footer-full-width .form-outline input[type="email"] {
            border: 1px solid #ced4da;
            width: 100%;
            box-sizing: border-box;
        }

        .footer-full-width .form-outline label {
            position: absolute;
            top: -10px;
            left: 10px;
            background: #fff;
            color: #495057;
            font-size: 14px;
        }

    .footer-full-width h5 {
        font-size: 18px; /* Increased font size for better visibility */
        margin-bottom: 15px;
        text-transform: uppercase;
        color: #34495E; /* Updated color for headers */
    }

    .footer-full-width ul {
        padding: 0;
        list-style-type: none;
    }

        .footer-full-width ul li {
            margin-bottom: 10px;
        }

            .footer-full-width ul li a {
                color: #343a40;
                text-decoration: none;
                transition: color 0.3s ease; /* Smooth color transition */
            }

                .footer-full-width ul li a:hover {
                    color: #007bff; /* Change to blue on hover */
                    text-decoration: underline;
                }

    .footer-full-width .text-center {
        text-align: center;
    }

    .footer-full-width .p-3 {
        padding: 1rem !important;
    }

    /* Ensure columns align properly */
    .footer-full-width .row {
        display: flex;
        flex-wrap: wrap; /* Allow columns to wrap if necessary */
    }

    .footer-full-width .col-lg-3 {
        flex: 1; /* Ensure columns take up equal space */
        max-width: 25%; /* Ensure columns stay within the 4-column layout */
    }

    .footer-full-width .col-md-6 {
        flex: 1; /* Ensure columns take up equal space in medium screens */
        max-width: 50%; /* Two columns per row on medium screens */
    }

.copyright-footer br {
    display: none;
}

/* Style for the location address text */
.location-address-footer- {
}

    /* Hover effect on the entire address block */
    .location-address-footer-
    :hover {
        color: #007bff; /* Change color when hovered */
        text-decoration: underline; /* Add underline on hover */
        transition: color 0.3s ease;
    }

/* Ensure the address link behaves like text and fits the design */
.location-address-link {
    color: inherit; /* Inherit color so it blends with the design */
    text-decoration: none; /* Remove underline */
    display: block; /* Ensure the whole address block is clickable */
    transition: color 0.3s ease;
}

    /* Change color and add underline on hover */
    .location-address-link:hover {
        color: #007bff; /* Change color on hover */
        text-decoration: underline; /* Add underline on hover */
    }



/* Mobile View */
@media (max-width: 767px) {

    .footer-full-width .row {
        flex-wrap: wrap; /* Allow wrapping of columns */
        justify-content: flex-start; /* Align items to the left */
    }

        .footer-full-width .row > div {
            flex: 1 1 100%; /* Make each section take full width */
        }

            /* Keep the first two sections as they are */
            .footer-full-width .row > div:nth-child(1),
            .footer-full-width .row > div:nth-child(2) {
                flex: 1 1 100%; /* Make About and Location take full width */
            }

            /* Add negative margin to move Location section upwards */
            .footer-full-width .row > div:nth-child(2) {
                margin-top: -2px; /* Move Location child slighly upside .Adjust this value as needed */
            }

            /* Make Policy and Quick Links take full width */
            .footer-full-width .row > div:nth-child(3),
            .footer-full-width .row > div:nth-child(4) {
                flex: 1 1 100%; /* Full width */
                margin-top: 1rem; /* Add some top margin for spacing */
            }

            /* Center the Follow Us section specifically on the left side */
            .footer-full-width .row > div:nth-child(5) { /* Assuming Follow Us is the 5th child */
                flex: 1 1 100%; /* Full width */
                margin-top: 1rem; /* Add some top margin for spacing */
                margin-bottom: 0.4rem; /* Add some bottom margin for spacing */
            }

    .copyright-footer br {
        display: block; /* Display break for copyright on mobile */
    }
}
