{% extends "base.html" %}

{% block title %}Sign In - certmesh Dashboard{% endblock %}

{% block content %}
<div class="row justify-content-center align-items-center min-vh-75">
    <div class="col-sm-10 col-md-6 col-lg-4 col-xl-3">
        <div class="card shadow cm-login-card">
            <div class="card-body p-4 p-md-5">
                <!-- Branding -->
                <div class="text-center mb-4">
                    <h4 class="fw-bold">certmesh</h4>
                    <p class="text-body-secondary small">TLS Certificate Lifecycle Management</p>
                </div>

                <!-- Error message -->
                {% if error %}
                <div class="alert alert-danger d-flex align-items-start" role="alert">
                    <i class="bi bi-exclamation-triangle-fill me-2 mt-1 flex-shrink-0"></i>
                    <div>{{ error | e }}</div>
                </div>
                {% endif %}

                <!-- SSO login button -->
                <div class="d-grid gap-3">
                    <a href="/dashboard/auth/start" class="btn btn-primary btn-lg">
                        <i class="bi bi-box-arrow-in-right me-2"></i>
                        Sign in with SSO
                    </a>
                </div>

                <hr class="my-4">

                <p class="text-body-secondary text-center small mb-0">
                    Authentication is handled by your organization's identity provider.
                    If you cannot sign in, contact your IT administrator.
                </p>
            </div>
        </div>
    </div>
</div>
{% endblock %}