@include('layouts.header')

{{-- main content --}}

<!-- Title page -->
<section class="bg-img1 txt-center p-lr-15 p-tb-92" style="background-image: url('{{ asset('images/bg-0011.webp') }}');" loading="lazy">
    <h2 class="txt-center gradient-text mob-text"> 
      <span class="great-vibes-regular center-line ">
        <a href="https://www.instagram.com/bwc_clothing/" target="_blank" class="gradient-text mob-text">
            <strong>&gt;&gt; Join The Circle &lt;&lt;</strong>
        </a>
    </span>
    <!--<p class="tagline tagline-mob">-Join The Circle, Wear Breadwinners Circle</p>-->
    </h2>
</section>

<!-- Content page -->
<section class="bg0 p-t-104 p-b-116">
    <div class="container">
        <div class="flex-w flex-tr">
            <div class="size-210 bor10 p-lr-70 p-t-55 p-b-70 p-lr-15-lg w-full-md">
                @if(session('success'))
                    <div class="alert alert-success">
                        {{ session('success') }}
                    </div>
                @endif

                
<form action="{{ route('contact.store') }}" method="POST">
    @csrf
    <h4 class="mtext-105 cl2 txt-center p-b-30">
        Send Us A Message
    </h4>

    <div class="bor8 m-b-20 how-pos4-parent">
        <i class="fas fa-user how-pos4 p-l-20"></i>
        <input class="stext-111 cl2 plh3 size-116 p-l-62 p-r-30" type="text" name="name" placeholder="Your Name" required>
    </div>

    <div class="bor8 m-b-20 how-pos4-parent">
        <i class="fas fa-envelope how-pos4 p-l-20"></i>
        <input class="stext-111 cl2 plh3 size-116 p-l-62 p-r-30" type="email" name="email" placeholder="Your Email Address" required>
    </div>

    <div class="bor8 m-b-30 how-pos4-parent">
        <i class="fas fa-comment-alt how-pos4 p-l-20"></i>
        <textarea class="stext-111 cl2 plh3 size-120 p-lr-28 p-tb-25" name="message" placeholder="How Can We Help?" required></textarea>
    </div>

    <button class="flex-c-m stext-101 cl0 size-121 bg3 bor1 hov-btn3 p-lr-15 trans-04 pointer">
        Submit
    </button>
</form>

<style>
    .how-pos4-parent {
        position: relative;
    }

    .how-pos4 {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 10px;
        font-size: 1.2em;
        color: #999;
    }

    .how-pos4.p-l-20 {
        left: 20px;
    }
</style>
            </div>

            <div class="size-210 bor10 flex-w flex-col-m p-lr-93 p-tb-30 p-lr-15-lg w-full-md">
                <!--<div class="flex-w w-full p-b-42">-->
                <!--    <span class="fs-18 cl5 txt-center size-211">-->
                <!--        <span class="lnr lnr-map-marker"></span>-->
                <!--    </span>-->

                <!--    <div class="size-212 p-t-2">-->
                <!--        <span class="mtext-110 cl2">-->
                <!--            Address-->
                <!--        </span>-->

                <!--        <p class="stext-115 cl6 size-213 p-t-18">-->
                <!--            Coza Store Center 8th floor, 379 Hudson St, New York, NY 10018 US-->
                <!--        </p>-->
                <!--    </div>-->
                <!--</div>-->

                <!--<div class="flex-w w-full p-b-42">-->
                <!--    <span class="fs-18 cl5 txt-center size-211">-->
                <!--        <span class="lnr lnr-phone-handset"></span>-->
                <!--    </span>-->

                <!--    <div class="size-212 p-t-2">-->
                <!--        <span class="mtext-110 cl2">-->
                <!--            Lets Talk-->
                <!--        </span>-->

                <!--        <p class="stext-115 cl1 size-213 p-t-18">-->
                <!--            +1 800 1236879-->
                <!--        </p>-->
                <!--    </div>-->
                <!--</div>-->

                <div class="flex-w w-full">
                    <span class="fs-18 cl5 txt-center size-211">
                        <span class="lnr lnr-envelope"></span>
                    </span>

                    <div class="size-212 p-t-2">
                        <span class="mtext-110 cl2">
                            Sale Support
                        </span>

                        <p class="stext-115 size-213 p-t-18" >
                            <a href="mailto:support@bwcclothing.com" style="color: #393830; font-weight: bold; text-decoration: none;">
            support@bwcclothing.com
        </a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

@include('layouts.footer')