import { Col, Container, Image, InputGroup, Form, Row, Stack, Button } from "react-bootstrap"
import { Link } from "react-router-dom"

const Footer = () => {
    return (
        <>
            <Stack className="footer-top-bg">
                <Container>
                    <Row className="footer-top">
                        <Col className="footer-column-first">
                            <Stack className=" flex-wrap flex-row">
                                <Link to="/">
                                    <Image src="/images/footer-logo.svg" />
                                </Link>
                                <p> 
                                    Join us on the journey where innovation meets excellence. Welcome to <Link to="/">hire.webiletechnologies.com</Link>, where your success is our priority.
                                </p>
                            </Stack>
                        </Col>
                        <Col className="footer-column-second footer-column-menu">
                            <label>Quick Links</label>
                            <ul>
                                <li>
                                    <Link to="/">
                                        Home
                                    </Link>
                                </li>
                                <li>
                                    <Link to="/about">
                                        About Us
                                    </Link>
                                </li>
                                {/* <li>
                                    <Link to="/blog">
                                        Blog
                                    </Link>
                                </li> */}
                                <li>
                                    <Link to="/contact-us">
                                        Contact Us
                                    </Link>
                                </li>
                                <li>
                                    <Link to="/hire-resources">
                                        Hire Resources
                                    </Link>
                                </li>
                                {/* <li>
                                    <Link to="">
                                        Site Map
                                    </Link>
                                </li>
                                <li>
                                    <Link to="">
                                        Become a Partner
                                    </Link>
                                </li> */}
                            </ul>
                        </Col>
                        <Col className="footer-column-menu footer-column-third">
                            <label>Hire Us</label>
                            <ul>
                                <li>
                                    <Link to="/hire-php-developers">
                                        Hire Php Developers
                                    </Link>
                                </li>
                                <li>
                                    <Link to="/hire-ui-ux-designers">
                                        Hire UI/UX Designers
                                    </Link>
                                </li>
                                <li>
                                    <Link to="/hire-android-developers">
                                        Hire Android Developers
                                    </Link>
                                </li>
                                <li>
                                    <Link to="/hire-ios-developers">
                                        Hire IOS Developers
                                    </Link>
                                </li>
                                <li>
                                    <Link to="/hire-nodejs-developers">
                                        Hire Node.Js Developers
                                    </Link>
                                </li>
                            </ul>
                        </Col>
                        <Col className="footer-column-four">
                            {/* <Form className="subscribe-form">
                                <label>Subscribe Our Newsletter</label>
                                <Form.Group className="form-field">
                                    <Form.Control type="tel" placeholder="Enter Your Email" />
                                    <Button type="submit" className="btn btn-primary default-btn-style border-0">Subscribe</Button>
                                </Form.Group>
                            </Form> */}
                            <Stack className="flex-wrap flex-row social-icons">
                                <label>Follow Us</label>
                                <Link to="https://www.facebook.com/webiletechnologies/" target="_blank" className="social-icons-list facebook">
                                    <svg xmlns="http://www.w3.org/2000/svg" fill="#000000" height="19px" width="19px" version="1.1" id="Layer_1" viewBox="0 0 310 310">
                                        <g id="XMLID_834_">
                                            <path id="XMLID_835_" d="M81.703,165.106h33.981V305c0,2.762,2.238,5,5,5h57.616c2.762,0,5-2.238,5-5V165.765h39.064   c2.54,0,4.677-1.906,4.967-4.429l5.933-51.502c0.163-1.417-0.286-2.836-1.234-3.899c-0.949-1.064-2.307-1.673-3.732-1.673h-44.996   V71.978c0-9.732,5.24-14.667,15.576-14.667c1.473,0,29.42,0,29.42,0c2.762,0,5-2.239,5-5V5.037c0-2.762-2.238-5-5-5h-40.545   C187.467,0.023,186.832,0,185.896,0c-7.035,0-31.488,1.381-50.804,19.151c-21.402,19.692-18.427,43.27-17.716,47.358v37.752H81.703   c-2.762,0-5,2.238-5,5v50.844C76.703,162.867,78.941,165.106,81.703,165.106z"/>
                                        </g>
                                    </svg>
                                </Link>
                                <Link to="https://x.com/webiletech" target="_blank" className="social-icons-list twitter">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="19" viewBox="0 0 24 19" fill="none">
                                        <path d="M7.45633 18.3054C16.4037 18.3054 21.2966 11.2635 21.2966 5.15722C21.2966 4.95701 21.2923 4.75805 21.2826 4.55984C22.2323 3.90765 23.0579 3.09378 23.7094 2.16705C22.8377 2.53494 21.8998 2.7827 20.9159 2.89457C21.9201 2.32246 22.6912 1.41725 23.0547 0.338359C22.1145 0.867671 21.0739 1.25283 19.9662 1.46005C19.0784 0.561846 17.8144 0 16.4156 0C13.729 0 11.5504 2.0697 11.5504 4.62091C11.5504 4.98354 11.5931 5.33616 11.6766 5.67452C7.63389 5.48132 4.04903 3.64237 1.65017 0.846398C1.2321 1.52912 0.991315 2.32272 0.991315 3.16911C0.991315 4.77232 1.85012 6.18757 3.15598 7.0157C2.35803 6.99242 1.60855 6.7842 0.952853 6.43758C0.9518 6.45685 0.9518 6.47612 0.9518 6.4964C0.9518 8.73477 2.62884 10.603 4.85436 11.0267C4.44577 11.1323 4.01584 11.1891 3.57195 11.1891C3.25846 11.1891 2.95366 11.1596 2.65756 11.1058C3.2769 12.9417 5.07249 14.2777 7.20185 14.3154C5.53667 15.555 3.43944 16.2935 1.16044 16.2935C0.76792 16.2935 0.380667 16.2723 0 16.2295C2.15281 17.5404 4.70895 18.3054 7.45633 18.3054Z" fill="black"/>
                                    </svg>
                                </Link>
                                <Link to="https://www.linkedin.com/company/webile-technologies" target="_blank" className="social-icons-list linkedin">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="19" viewBox="0 0 20 19" fill="none">
                                        <path d="M0.313001 6.30817H4.25872V18.9995H0.313001V6.30817ZM2.28596 -0.000488281C3.54706 -0.000488281 4.57193 1.02438 4.57193 2.28759C4.57193 3.54953 3.54706 4.5744 2.28596 4.5744C1.02191 4.5744 0 3.54953 0 2.28759C0 1.02438 1.02191 -0.000488281 2.28596 -0.000488281Z" fill="black"/>
                                        <path d="M6.73267 6.30841H10.5162V8.04387H10.5701C11.0967 7.04565 12.3838 5.99414 14.3022 5.99414C18.2966 5.99414 19.0338 8.62187 19.0338 12.0391V18.9998H15.0911V12.8279C15.0911 11.3558 15.0655 9.46274 13.0413 9.46274C10.9886 9.46274 10.6754 11.0673 10.6754 12.7222V18.9998H6.73267V6.30841Z" fill="black"/>
                                    </svg>
                                </Link>
                                <Link to="https://www.instagram.com/webiletechnologies/" target="_blank" className="social-icons-list instagram">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="19" height="19" viewBox="0 0 19 19" fill="none">
                                        <path d="M13.1444 18.9995H5.8558C2.62686 18.9995 0 16.3727 0 13.1439V5.85531C0 2.62637 2.62686 -0.000488281 5.8558 -0.000488281H13.1444C16.3731 -0.000488281 19 2.62637 19 5.85531V13.1439C19 16.3727 16.3731 18.9995 13.1444 18.9995ZM5.8558 1.47729C3.44174 1.47729 1.47778 3.44126 1.47778 5.85531V13.1439C1.47778 15.5578 3.44174 17.5217 5.8558 17.5217H13.1444C15.5583 17.5217 17.5222 15.5578 17.5222 13.1439V5.85531C17.5222 3.44126 15.5583 1.47729 13.1444 1.47729H5.8558Z" fill="black"/>
                                        <path d="M9.55385 14.8763C6.61856 14.8763 4.23068 12.4882 4.23068 9.55315C4.23068 6.61807 6.61877 4.22998 9.55385 4.22998C12.4889 4.22998 14.877 6.61807 14.877 9.55315C14.877 12.4882 12.4891 14.8763 9.55385 14.8763ZM9.55385 5.70776C7.43345 5.70776 5.70846 7.43275 5.70846 9.55315C5.70846 11.6735 7.43345 13.3985 9.55385 13.3985C11.6742 13.3985 13.3992 11.6735 13.3992 9.55315C13.3994 7.43275 11.6745 5.70776 9.55385 5.70776Z" fill="black"/>
                                        <path d="M14.8954 5.24194C15.4663 5.24194 15.9292 4.77909 15.9292 4.20813C15.9292 3.63717 15.4663 3.17432 14.8954 3.17432C14.3244 3.17432 13.8616 3.63717 13.8616 4.20813C13.8616 4.77909 14.3244 5.24194 14.8954 5.24194Z" fill="black"/>
                                    </svg>
                                </Link>
                            </Stack>
                        </Col>
                    </Row>
                </Container>
            </Stack>
            <Container fluid className="footer-bottom text-center">
                <Stack className="flex-row justify-content-center">
                    Copyright © 2025 <Link to="/">hire.webiletechnologies.com</Link>, All Rights Reserved.
                </Stack>
            </Container>
        </>
    )
}


export default Footer