---
import CaptchaFields from './Captcha/CaptchaFields.astro';
import Icon from './AstroIcon.astro';
---

<div class='my-0 px-5 rounded-lg text-left sm:text-center sm:pb-10 pb-8'>
  <div class='sm:max-w-[400px] mx-auto'>
    <div class='hidden sm:block'><Icon icon='bell' /></div>
    <h2 class='text-3xl mb-1 font-medium hidden sm:block'>Upcoming</h2>
    <p class='text-gray-600 mb-0 sm:mb-5'>Please check back later or subscribe below.</p>

    <form action='https://news.roadmap.sh/subscribe' method='post' accept-charset='utf-8' captcha-form>
      <input
        type='email'
        required
        name='email'
        id='email'
        autofocus
        class='mt-1 block w-full mb-2 border-2 rounded-md py-2 sm:py-3 px-3 sm:px-3.5 text-md'
        placeholder='Enter your email'
      />

      <CaptchaFields />

      <input type='hidden' name='list' value='tTqz1w7nexY3cWDpLnI88Q' />
      <input type='hidden' name='subform' value='yes' />

      <button
        type='submit'
        name='submit'
        class='text-white bg-gradient-to-r from-amber-700 to-blue-800 hover:from-amber-800 hover:to-blue-900 font-regular rounded-md text-md px-5 py-2.5 w-full text-center'
      >
        Get Notified
      </button>
    </form>
  </div>
</div>