<div id="main-content" class="card">
  {{#isLinkDamaged}}
    <header>
      <h1 id="fxa-report-sign-in-link-damaged-header">{{#t}}Link damaged{{/t}}</h1>
    </header>

    <section>
      <p>
        {{#t}}The link you clicked was missing characters, and may have been broken by your email client. Copy the address carefully, and try again.{{/t}}
      </p>
    </section>
  {{/isLinkDamaged}}

  {{#isLinkValid}}
    <header>
      <h1 id="fxa-report-sign-in-header">{{#t}}Report unauthorized sign-in?{{/t}}</h1>
    </header>

    <section>
      <div class="success"></div>
      <div class="error"></div>

      <p>
        {{#t}}You received an email about attempted access to your account. Would you like to report this activity as suspicious?{{/t}}
      </p>

      <form novalidate>
        <div class="button-row">
          <button id="submit-btn" type="submit">{{#t}}Report activity{{/t}}</button>
        </div>
      </form>
    </section>

    {{#hasSupportLink}}
      <div class="links">
        <a href="{{{ escapedSupportLink }}}" id="support-link" target="_blank">{{#t}}Why is this happening?{{/t}}</a>
      </div>
    {{/hasSupportLink}}
  {{/isLinkValid}}
</div>
