@extends('test.layouts.index')

@section('CONTAINER_SECTION')
<style>
    #state_dropdown {
        margin-bottom: 0 !important;
    }

    #first_name-error,
    #last_name-error,
    #email-error,
    #phone_number-error {
        text-align: left;
        display: inline-block;
        width: 100%;
        /* Ensures it takes the full width of the parent container */
    }

    .error {
        color: red;
        font-size: 17px;
    }

    .test-page-cont-block .agree-terms-cont {
        display: flex;
        flex-wrap: wrap;
        gap: 0 10px;
        justify-content: center;
    }

    .test-page-cont-block .agree-terms-cont label#wants_special_offers-error {
        order: 3;
        display: block;
        width: 100%;
    }

    .multi_step_form #msform.test-page-cont-block fieldset {
        margin: 0 0 0 auto;
        width: min(100%, 800px);
    }

    .multi_step_form #msform.test-page-cont-block #progressbar li.active span {
        left: 50%;
        transform: translateX(-50%);
    }

    .multi_step_form #msform.test-page-cont-block {
        min-height: 690px !important;
    }

    .multi_step_form #msform.test-page-cont-block .loader {
        max-width: 120px;
        max-height: 120px;
        width: 100%;
        height: 100%;
        top: 0;
        left: auto;
        /* right: calc(100% - 80%); */
        bottom: 0;
        margin: auto;
        position: absolute;
    }

    #msform.test-page-cont-block .setp input {
        color: black !important;
    }

    @media (max-width: 1366px) {
        .multi_step_form #msform.test-page-cont-block .loader {
            right: calc(100% - 65%);
        }
    }

    @media (max-width: 991px) {
        .multi_step_form #msform.test-page-cont-block fieldset {
            margin: 0 auto;
        }

        .multi_step_form #msform.test-page-cont-block .error {
            font-size: 14px;
        }

        .multi_step_form #msform.test-page-cont-block .loader {
            right: 0;
            left: 0;
        }
    }

    @media (min-width: 1100px) and (max-width: 1199px) {
        .banner_main::before {
            left: -40% !important;
        }
    }
</style>

<div class="banner-form-main">
    <div class="banner-form-left-image">
        <img src="https://d3826r4eibktfp.cloudfront.net/assets/images/left_befo.jpg" alt="left_befo" height="618" width="525">
    </div>
    <div class="banner-form-block">
        <form id="msform" action="{{ route('LEAD_STORE', $_GET) }}" method="post" class="test-page-cont-block">
            @csrf
            <input type="hidden" id="ref_url" name="ref_url" value="