%script{ type: "text/ng-template", id: "registration/introduction.html" }
  .row
    .small-12.columns
      %header
        %h2 {{'registration_greeting' | t}}
        %h4
          %small
            %i.ofn-i_040-hub
          {{'registration_intro' | t}}

  .row{ 'data-equalizer' => true }
    .small-12.medium-12.large-6.columns.pad-top{ 'data-equalizer-watch' => true }
      %h5 {{'registration_checklist' | t}}:
      %ul.check-list
        %li
          {{'registration_time' | t}}
        %li
          {{'registration_enterprise_address' | t}}
        %li
          {{'registration_contact_details' | t}}
        %li
          {{'registration_logo' | t}}
        %li
          {{'registration_promo_image' | t}}
        %li
          {{'registration_about_us' | t}}

    .small-9.medium-8.large-5.columns.pad-top.end{ 'data-equalizer-watch' => true}
      %h5
        {{'registration_outcome_headline' | t}}
      %p{ "ng-bind-html" => "t('registration_outcome1_html')" }
      %p {{'registration_outcome2' | t}}
      %p {{'registration_outcome3' | t}}

  .row{'ng-init' => "tos_required=#{Spree::Config.enterprises_require_tos}" }
    %hr
    .small-12.medium-6.columns{'ng-hide' => '!tos_required' }
      %p.tos-message
        #{t(:enterprise_tos_message)}
        %a{href: Spree::Config.footer_tos_url, target: "_blank" } #{t(:enterprise_tos_link_text)}
      %p.tos-checkbox
        %input{ type: 'checkbox', name: 'accept_terms', id: 'accept_terms', ng: { model: "tos_accepted" } }
          %label{for: "accept_terms"} #{t(:enterprise_tos_agree)}

    .small-12.medium-6.columns
      %input.button.primary.left{ type: "button", value: "{{'registration_action' | t}}", ng: { click: "select('details')", disabled: "tos_required && !tos_accepted", model: "tos_accepted"} }