<turbo-frame id="modal">
  <div class="relative z-20" data-controller="modal" data-action="click->modal#closeIfOutside">
  <!-- Backdrop -->
  <div class="fixed inset-0 bg-gray-500/50 dark:bg-gray-900/80 transition-opacity" data-modal-target="backdrop" data-transition-enter="ease-out duration-300" data-transition-enter-start="opacity-0" data-transition-enter-end="opacity-100" data-transition-leave="ease-in duration-200" data-transition-leave-start="opacity-100" data-transition-leave-end="opacity-0"></div>

  <div class="fixed inset-0 z-10 overflow-y-auto">
    <div class="flex min-h-full items-end sm:items-center justify-center p-2 sm:p-0">
      <!-- Modal panel -->
      <div class="relative transform overflow-hidden rounded-xl bg-white dark:bg-gray-800 px-4 pt-5 pb-4 text-left shadow-xl transition-all w-full sm:my-8 sm:w-full sm:max-w-md sm:p-6" data-modal-target="content" data-transition-enter="ease-out duration-300" data-transition-enter-start="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95" data-transition-enter-end="opacity-100 translate-y-0 sm:scale-100" data-transition-leave="ease-in duration-200" data-transition-leave-start="opacity-100 translate-y-0 sm:scale-100" data-transition-leave-end="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95">

        <!-- Close button -->
        <div class="absolute top-0 right-0 pt-4 pr-4">
          <button type="button" class="rounded-md bg-white dark:bg-gray-800 text-gray-400 hover:text-gray-500 dark:hover:text-gray-300 focus:outline-hidden focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" data-action="modal#close">
            <span class="sr-only">Close</span>
            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="size-6">
  <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"></path>
</svg>

          </button>
        </div>

        

    <div>
      <div class="mb-6 text-center">
        <h2 class="text-2xl font-bold mb-2 dark:text-white">Sign in or create an account</h2>
        <p class="text-gray-600 dark:text-gray-400">Choose your preferred sign in method</p>
      </div>

      <form class="button_to" method="post" action="/auth/google_oauth2?user_type=talent"><button class="inline-flex items-center justify-center w-full px-4 py-3 text-lg font-semibold text-white dark:text-black bg-gray-900 dark:bg-gray-100 rounded-xl hover:bg-gray-800 dark:hover:bg-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 dark:focus:ring-gray-400 transition-all duration-200" data-turbo="false" type="submit"><img class="size-5" alt="Google" src="/assets/icons/social/google-668a9918.svg" /><span class="ml-2">Continue with Google</span></button><input type="hidden" name="authenticity_token" value="RfGXrbceS4keAtsQ8iJAoNVlE5wHprDOkJlyIV0ZYsG80XZme-gUPOmIZJLZP6cO-_2tvfG9iKU3B6WNoJEZJA" autocomplete="off" /></form>

      <div class="flex items-center my-4">
        <div class="flex-grow border-t border-gray-200 dark:border-gray-700"></div>
        <span class="px-4 text-sm text-gray-500 dark:text-gray-400 font-medium">OR</span>
        <div class="flex-grow border-t border-gray-200 dark:border-gray-700"></div>
      </div>

      <form class="flex flex-col gap-2" data-turbo="false" action="/talent/session_intent" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="b3aL8-u_mz9OpO4fdxOpwCODEaYge0xf1UyH5SmsndEcklZ8ivlpp5FB_pTfmNKWoPQAWQo89k2eQ6Dg1-qbDw" autocomplete="off" />
        <input placeholder="Enter your email…" required="required" autofocus="autofocus" class="p-3 text-xl rounded-sm bg-white dark:bg-gray-700 dark:text-white dark:placeholder:text-gray-400 border border-gray-300 dark:border-gray-600 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400" type="email" name="email" id="email" />
        <button name="button" type="submit" class="group bg-blue-600 hover:bg-blue-500 dark:hover:bg-blue-700 text-white text-xl font-bold p-3 rounded-sm">
          <div class="hidden group-enabled:block">Email me a sign in link</div>
          <div class="hidden group-disabled:block">Loading…</div>
</button></form>    </div>


</div>    </div>
  </div>
</div>
</turbo-frame>