{% for oauth in oauth %}
	<form id="ucp_oauth_{{ oauth.SERVICE_ID }}" method="post" action="{{ S_UCP_ACTION }}" class="iz-form">
		<section class="iz-card iz-card--oauth">
			<header class="iz-card__header">
				<h3 class="iz-card__title">{{ oauth.SERVICE_NAME }}</h3>
			</header>

			<div class="iz-card__body">
				{% if oauth.UNIQUE_ID %}

					<div class="iz-field">
						<label class="iz-label" for="oauth-id-{{ oauth.SERVICE_ID }}">
							{{ L_UCP_AUTH_LINK_ID }}{{ L_COLON }}
						</label>

						<div class="iz-inputgroup">
							<input
								id="oauth-id-{{ oauth.SERVICE_ID }}"
								class="iz-input"
								type="text"
								value="{{ oauth.UNIQUE_ID }}"
								readonly
							>
							<button
								type="submit"
								name="submit"
								value="{{ L_UCP_AUTH_LINK_UNLINK }}"
								class="iz-btn iz-btn--danger"
							>
								{{ L_UCP_AUTH_LINK_UNLINK }}
							</button>
						</div>
					</div>

				{% else %}

					<p class="iz-prose">
						{{ L_UCP_AUTH_LINK_ASK }}
					</p>

					<div class="iz-actions">
						<button
							type="submit"
							name="submit"
							value="{{ L_UCP_AUTH_LINK_LINK }}"
							class="iz-btn iz-btn--primary"
						>
							{{ L_UCP_AUTH_LINK_LINK }}
						</button>
					</div>

				{% endif %}

				{{ oauth.HIDDEN_FIELDS }}
				{{ S_HIDDEN_FIELDS }}
				{{ S_FORM_TOKEN }}
			</div>
		</section>
	</form>

	<div class="iz-space iz-space--sm"></div>
{% endfor %}
