{# Step 1 — Google account / Application Default Credentials.
   No state to save here; it's a precondition check. If gcloud ADC
   isn't configured, show the command + a "Re-check" button that
   re-runs the probe. #}
{% extends "setup/layout.html" %}

{% block content %}
<div class="ui-pane">
  <h2 class="ui-section-title">Step 1 · Sign in with Google</h2>
  <p class="ui-section-subtitle">
    Governor Audit reads <code class="font-mono bg-slate-100 dark:bg-slate-800 px-1.5 py-0.5 rounded">INFORMATION_SCHEMA.JOBS_BY_PROJECT</code>
    using <strong>Application Default Credentials</strong> from your local
    <code class="font-mono bg-slate-100 dark:bg-slate-800 px-1.5 py-0.5 rounded">gcloud</code>.
    No service-account JSON. No browser OAuth.
  </p>

  {% if principal %}
    <div class="mt-6 border border-emerald-300 dark:border-emerald-500/30 bg-emerald-50 dark:bg-emerald-950/40 px-4 py-4">
      <p class="font-semibold text-emerald-700 dark:text-emerald-300">ADC detected</p>
      <p class="mt-1 text-sm text-emerald-700 dark:text-emerald-300">
        Signed in as <code class="font-mono break-all">{{ principal }}</code>.
      </p>
    </div>

    <form method="post" action="/setup/account" class="mt-6 flex items-center gap-3">
      <button type="submit" class="ui-btn-primary transition-colors">
        <span class="btn-label">Continue</span>
        <svg class="btn-spinner h-4 w-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" aria-hidden="true">
          <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
          <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"></path>
        </svg>
      </button>
      <p class="text-sm text-slate-500 dark:text-slate-400">Wrong account? Run <code class="font-mono">gcloud auth application-default login</code> with a different identity, then refresh.</p>
    </form>
  {% else %}
    <div class="mt-6 border border-amber-300 dark:border-amber-500/30 bg-amber-50 dark:bg-amber-950/40 px-4 py-4">
      <p class="font-semibold text-amber-700 dark:text-amber-300">No active gcloud principal detected</p>
      <p class="mt-1 text-sm text-amber-700 dark:text-amber-300">
        Run this in a terminal, then come back and click <strong>Re-check</strong>:
      </p>
      <pre class="mt-3 rounded-sm border border-amber-200 dark:border-amber-700 bg-white dark:bg-slate-900 p-3 font-mono text-sm overflow-x-auto">gcloud auth application-default login</pre>
      {% if probe_message %}
        <p class="mt-3 text-sm text-amber-700 dark:text-amber-300">{{ probe_message }}</p>
      {% endif %}
    </div>

    <form method="get" action="/setup/account" class="mt-6">
      <button type="submit" class="ui-btn-secondary transition-colors">
        <span class="btn-label">Re-check ADC</span>
        <svg class="btn-spinner h-4 w-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" aria-hidden="true">
          <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
          <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"></path>
        </svg>
      </button>
    </form>
  {% endif %}
</div>
{% endblock %}