/* ####################################################
    :: Template Name: Essence - Fashion Ecommerce Template
    :: Author: Colorlib
    :: Author URL: https://colorlib.com
    :: Description: Essence is smart & elegant fashion e-commerce Template. It's suitable for all e-commerce business platform.
    :: Version: 1.0.0
    :: Created: April 27, 2018
    :: Last Updated: May 2, 2018
    #################################################### */

    /* ---------------------------------------
    ##### - PLACE YOUR CUSTOM CSS HERE - #####
    --------------------------------------- */

    .footer_area {
        background-color: #111827;
        padding: 80px 0 30px;
        color: #9ca3af;
    }

    .footer_area .footer_menu ul {
        display: block !important;
    }

    .footer_area .footer_menu ul li {
        display: block;
        width: 100%;
    }

    .footer-logo img {
        max-width: 150px;
        height: auto;
        display: block;
    }

    .footer_area p {
        line-height: 1.8;
        margin-bottom: 25px;
        color: #9ca3af;
    }

    .footer_area .footer_heading h6 {
        color: #ffffff;
        text-transform: uppercase;
        font-size: 14px;
        font-weight: 700;
        margin-bottom: 30px;
        letter-spacing: 1px;
    }

    .footer_area .footer_menu ul li a, 
    .footer_area .footer_widget_menu li a {
        color: #9ca3af;
        font-size: 14px;
        display: block;
        margin-bottom: 12px;
        transition: 0.3s;
    }

    .footer_area .footer_menu ul li a:hover, 
    .footer_area .footer_widget_menu li a:hover {
        color: #ffffff;
        padding-left: 5px;
    }

    .footer_area .footer_social_area a {
        display: inline-block;
        width: 40px;
        height: 40px;
        background-color: #1f2937;
        color: #ffffff;
        text-align: center;
        line-height: 40px;
        border-radius: 50%;
        margin-right: 10px;
        transition: 0.3s;
    }

    .footer_area .footer_social_area a:hover {
        background-color: #007bff;
        transform: translateY(-3px);
    }

    .footer-contact-info li {
        display: flex;
        align-items: flex-start;
        margin-bottom: 20px;
        font-size: 14px;
        line-height: 1.6;
        word-break: break-word;
    }

    .footer-contact-info li span {
        flex: 1;
        display: block;
    }

    .footer-contact-info li i {
        color: #007bff;
        margin-right: 15px;
        font-size: 18px;
        width: 20px;
        text-align: center;
    }

    .subscribtion_form .form-inline {
        position: relative;
        width: 100%;
    }

    .subscribtion_form input {
        width: 100%;
        height: 50px;
        background-color: #1f2937;
        border: 1px solid #374151;
        padding: 0 60px 0 20px;
        color: #ffffff;
        border-radius: 8px;
    }

    .subscribtion_form button {
        position: absolute;
        right: 5px;
        top: 5px;
        width: 40px;
        height: 40px;
        background-color: #007bff;
        border: none;
        color: #ffffff;
        border-radius: 6px;
    }

    /* Additional Responsiveness Fixes */
    @media only screen and (max-width: 767px) {
        .footer_area {
            text-align: center;
            padding: 50px 0 30px;
        }

        .footer_area .footer_heading h6 {
            margin-bottom: 20px;
            margin-top: 30px;
        }

        .footer_social_area {
            justify-content: center;
            display: flex;
            margin-bottom: 20px;
        }

        .footer-contact-info li {
            justify-content: center;
        }

        .footer-bottom {
            text-align: center;
        }

        .footer-bottom .text-md-right {
            text-align: center !important;
            margin-top: 20px;
        }

        .payment-icons {
            justify-content: center;
            display: flex;
            flex-wrap: wrap;
        }

        .subscribtion_form input {
            padding: 0 50px 0 15px;
            font-size: 13px;
        }

        .hero-content .btn {
            margin-left: 0 !important;
            margin-bottom: 10px;
            display: block;
            width: fit-content;
        }
        
        .header-meta .user-login-info a span,
        .header-meta .user-login-info a:last-child {
            display: none;
        }
        
        .header-meta .user-login-info a img {
            margin-right: 0;
        }

        .header-meta .cart-area a span {
            font-size: 10px;
            width: 15px;
            height: 15px;
            line-height: 15px;
        }
    }

    @media only screen and (max-width: 480px) {
        .section-heading h2 {
            font-size: 24px;
        }
        
        .footer_area {
            padding: 50px 0 20px;
        }
    }

    .subscribtion_form button:hover {
        background-color: #0056b3;
    }

    .subscribtion_form button {
        cursor: pointer;
    }

    .payment-icons img {
        height: 30px;
        margin-right: 10px;
        filter: grayscale(1) opacity(0.6);
        transition: 0.3s;
    }

    .payment-icons img:hover {
        filter: grayscale(0) opacity(1);
    }

    .footer-bottom {
        border-top: 1px solid #1f2937;
        margin-top: 60px;
        padding-top: 30px;
    }