<%= form_for '', url: mfa_setup_path, data: { turbo_frame: :_top }, html: { id: 'mfa_form' } do |f| %>
  <p class="text-center">
    <%= t('use_an_authenticator_mobile_app_like_google_authenticator_or_1password_to_scan_the_qr_code_below') %>
  </p>
  <div>
    <%== RQRCode::QRCode.new(@provision_url).as_svg(viewbox: true, svg_attributes: { class: 'md:w-80 md:h-80 my-4 mx-auto' }) %>
  </div>
  <div class="form-control my-6 space-y-2">
    <%= f.text_field :otp_attempt, required: true, placeholder: 'XXX-XXX', class: 'base-input text-center' %>
    <span>
      <%= @error_message %>
    </span>
  </div>
  <div class="form-control mt-4">
    <%= f.button button_title(title: t('save')), class: 'base-button' %>
  </div>
<% end %>
