
<turbo-stream action="update" target="modal">
  <template>

    <div class="relative z-10" aria-labelledby="modal-title" role="dialog" aria-modal="true" x-data="{show: true}" x-show="show" x-init="console.log('init happened')">
      <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"></div>

      <div class="fixed inset-0 z-10 overflow-y-auto">
        <div class="flex justify-center p-4 text-center sm:p-0">
          <div class="relative transform overflow-hidden rounded-lg bg-white p-10 text-left shadow-xl transition-all sm:my-8 w-full sm:max-w-md" x-on:click.outside="show = false">
            <button class="absolute top-4 right-4" x-on:click="show = false">
              <svg class="h-5 w-5" fill="currentColor" viewbox="0 0 24 24"><path fill-rule="evenodd" d="M5.47 5.47a.75.75 0 011.06 0L12 10.94l5.47-5.47a.75.75 0 111.06 1.06L13.06 12l5.47 5.47a.75.75 0 11-1.06 1.06L12 13.06l-5.47 5.47a.75.75 0 01-1.06-1.06L10.94 12 5.47 6.53a.75.75 0 010-1.06z" clip-rule="evenodd"/></svg>
            </button>
            <div id="share-form">
              

<div class="flex flex-col">
  <p class="font-bold text-2xl mb-6">Share Job</p>
  <form method="POST" action="/modals/jobsharerequest">
    <input type="hidden" :value="Alpine.store('searchCriteria').criteria.activeJobId" data-val="true" data-val-required="The JobId field is required." id="JobId" name="JobId" value="" />
    <div class="my-4">
      <label class="block text-sm font-medium leading-6 text-gray-900" for="FromEmailAddress">Your Email<span class="text-red-600"> *</span></label>
      <div class="mt-1">
        <input type="email" id="email" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary-600 sm:text-sm sm:leading-6 placeholder:text-xs" placeholder="you@example.com" data-val="true" data-val-required="The FromEmailAddress field is required." name="FromEmailAddress" value="">
        <span class="mt-2 text-sm text-red-600 field-validation-valid" data-valmsg-for="FromEmailAddress" data-valmsg-replace="true"></span>

      </div>
    </div>
    <div class="my-4">
      <label class="block text-sm font-medium leading-6 text-gray-900" for="ToEmailAddress">Recipient Email<span class="text-red-600"> *</span></label>
      <div class="mt-1">
        <input type="email" id="email" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary-600 sm:text-sm sm:leading-6 placeholder:text-xs" placeholder="you@example.com" data-val="true" data-val-required="The ToEmailAddress field is required." name="ToEmailAddress" value="">
        <span class="mt-2 text-sm text-red-600 field-validation-valid" data-valmsg-for="ToEmailAddress" data-valmsg-replace="true"></span>

      </div>
    </div>

    <div class="my-4">
      <label class="block text-sm font-medium leading-6 text-gray-900" for="Message">Message<span class="text-red-600"> *</span></label>
      <div class="mt-1">
        <textarea rows="4" id="message" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-primary-600 sm:text-sm sm:leading-6 placeholder:text-xs" placeholder="Let employer know that you are interested and ask any questions you may have" data-val="true" data-val-required="The Message field is required." name="Message">
</textarea>
        <span class="mt-2 text-sm text-red-600 field-validation-valid" data-valmsg-for="Message" data-valmsg-replace="true"></span>
      </div>
    </div>


    <button id="apply-submit" type="submit" class="mt-4 font-bold w-full bg-primary text-white px-2 py-2 rounded-md">Send Message</button>
  <input name="__RequestVerificationToken" type="hidden" value="CfDJ8Jl1bMnrOYZLpcwn6d8N3pbjTc4USdHDgRJA1tZx-BUQW_bW1YrnGZ8_dLyLjn9AydetXTn5BUd7TbIYEXdfX8SBpKql8DeUpjYFQNpbF9FK2zZ0C5FOIkBOkzvRvouvOq_e_oF0k22ar3E8sDdeytE" /></form>
</div>

            </div>
          </div>
        </div>
      </div>
    </div>
  </template>
</turbo-stream>
