{% extends 'templates/nhs_transaction_layout.html' %}
{% import 'includes/form_macros.html' as form_macros %}

{% block afterHeader %}
  {% include "includes/service-headers/low-income.html" %}
{% endblock %}

{% block content %}

<main id="content" role="main">
  
  <div class="grid-row">
    <div class="column-two-thirds">

  <h1 class="heading-large">
    Do you want to be sent an email of your certificate?
  </h1>

<!-- Preferred contact method -->
  <form action="" method="get" class="form">
<div class="form-item-wrapper">
  <fieldset>
    <legend class="hidden">Do you want to be sent an email of your certificate?</legend>

 <p class="lede">An email receipt will be sent to you with a copy of your certifcate</p>
      

    <div class="inline-form-groups">
      <div class="form-group">
        <input type="radio" id="email" name="contact">
        <label class="form-control-radio js-toggle" for="email" data-show="#contact-email-address" data-hide="#contact-mobile-number">
          Yes
        </label>
      </div>
      <div class="form-group">
        <input type="radio" id="mobile" name="contact">
        <label class="form-control-radio js-toggle" for="mobile" data-hide="#contact-email-address">
          No
        </label>
      </div>
    </div>

    <div class="js-hidden panel-indent" id="contact-email-address">
      <label class="form-label-bold" for="email-address">
        Email address
      </label>
      <input type="text" id="email-address" class="form-control">
    </div>


  </fieldset>
</div>


    {{
      form_macros.button({
        label: 'Save and continue'
      })
    }}
    <p class="navigation"><a class="cancel" href="../lis-home">Save and come back later</a></p>
  </form>
    </div>
    </div>
</main>

{% endblock %}








