{% extends "base.html" %}

{% block title %}Accounts Connected - {{ org.name }}{% endblock %}

{% block auth_content %}
<div style="width: 100%; max-width: 440px; padding: 0 16px; text-align: center;">

    <!-- Success icon -->
    <div style="
        width: 64px; height: 64px;
        background: var(--success-50);
        border-radius: var(--radius-full);
        display: inline-flex; align-items: center; justify-content: center;
        margin-bottom: 24px;
    ">
        <svg width="28" height="28" fill="none" stroke="var(--success-500)" viewBox="0 0 24 24" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
            <path d="M22 11.08V12a10 10 0 11-5.93-9.14"/>
            <polyline points="22 4 12 14.01 9 11.01"/>
        </svg>
    </div>

    <h1 style="
        font-family: var(--font-display);
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--text-primary);
        letter-spacing: -0.015em;
        margin-bottom: 8px;
    ">All done!</h1>

    <p style="
        font-size: 0.9375rem;
        color: var(--text-secondary);
        line-height: 1.6;
        margin-bottom: 8px;
    ">
        {% if connected_count %}
            {{ connected_count }} account{{ connected_count|pluralize }} connected to <strong style="color: var(--text-primary);">{{ workspace.name }}</strong>.
        {% else %}
            Your accounts have been connected to <strong style="color: var(--text-primary);">{{ workspace.name }}</strong>.
        {% endif %}
    </p>

    <p style="
        font-size: 0.875rem;
        color: var(--text-tertiary);
        line-height: 1.6;
        margin-bottom: 28px;
    ">
        <strong style="color: var(--text-secondary);">{{ org.name }}</strong> has been notified and will take it from here.
    </p>

    <div style="
        padding: 16px;
        background: var(--primary-soft);
        border: 1px solid var(--primary-muted);
        border-radius: var(--radius-lg);
        font-size: 0.8125rem;
        color: var(--brand-800);
        line-height: 1.6;
    ">
        You can close this page. Your agency team will be in touch soon.
    </div>
</div>
{% endblock %}