{% extends "base.html" %}

{% block extra_head %}
<link rel="stylesheet" href="/plugins/vendor/assets/css/vendor.ui.css">
{% endblock %}

{% block content %}
<div class="container vendor-portal" data-vendor-page="profile">
    {% if vendor %}
    <header class="vendor-hero">
        <h1>Your store</h1>
        <p class="text-muted">Details the store uses to reach you. Ask them if something needs updating.</p>
    </header>

    <div class="vendor-profile-card">
        <div class="vendor-profile-row">
            <span class="label">Store name</span>
            <strong>{{ vendor.store_name }}</strong>
        </div>
        <div class="vendor-profile-row">
            <span class="label">Phone</span>
            <strong>{{ vendor.phone | default(value='—') }}</strong>
        </div>
        <div class="vendor-profile-row">
            <span class="label">Email</span>
            <strong>{{ vendor.email | default(value='—') }}</strong>
        </div>
        <div class="vendor-profile-row">
            <span class="label">Address</span>
            <strong>{{ vendor.address | default(value='—') }}</strong>
        </div>
    </div>

    <a class="btn btn-secondary vendor-btn-lg" href="/auth/logout">Log out</a>
    {% else %}
    <div class="card p-5 text-center vendor-access-denied">
        <h3>Vendor access needed</h3>
    </div>
    {% endif %}
</div>
{% endblock %}