<tr>
	<th>
		<label for="{{ vars.otp_field_name }}" class="form-label">{{ strings.title }}</label>
	</th>
	<td>
		{% include '/admin/user/profile/mfa/mfa_records_table.twig' with {
			records: vars.yubikeys,
			heading: strings.registered_yubi_ids,
			empty_message: strings.no_active_yubi_ids,
			label_header: strings.yubikey,
			used_header: strings.used,
			registered_header: strings.registered,
			action_header: strings.action,
			remove_label: strings.remove_label,
			remove_button_class: 'shield_remove_yubi',
			remove_data_attribute: 'data-yubikeyid'
		} only %}

		{% if flags.show_explanatory_text %}
			<p style="margin-bottom: 5px">{{ strings.enter_otp }}</p>
		{% endif %}
		<input class="regular-text shield_yubi_otp"
			   type="text"
			   id="{{ vars.otp_field_name }}"
			   name="{{ vars.otp_field_name }}"
			   placeholder="{{ strings.placeholder_enter_otp }}"
			   value="" autocomplete="off" />
		{% if flags.show_explanatory_text %}
			{% if flags.is_profile_active %}
				<p class="description">{{ strings.to_remove_device }}</p>
			{% endif %}
			<p class="description">{{ strings.multiple_for_pro }}</p>
		{% endif %}
	</td>
</tr>
