{# app/modules/loyalty/templates/loyalty/merchant/card-detail.html #}
{% extends "merchant/base.html" %}
{% from 'shared/macros/headers.html' import detail_page_header %}
{% from 'shared/macros/alerts.html' import loading_state, error_state %}
{% from 'shared/macros/tables.html' import table_wrapper, table_header %}

{% block title %}{{ _('loyalty.merchant.card_detail.title') }}{% endblock %}

{% block i18n_modules %}['loyalty']{% endblock %}

{% block alpine_data %}merchantLoyaltyCardDetail(){% endblock %}

{% block content %}
{% call detail_page_header("card?.customer_name || '" + _('loyalty.merchant.card_detail.title') + "'", '/merchants/loyalty/cards', subtitle_show='card') %}
    {{ _('loyalty.merchant.card_detail.card_label') }}: <span x-text="card?.card_number"></span>
{% endcall %}

{{ loading_state(_('loyalty.merchant.card_detail.loading')) }}
{{ error_state(_('loyalty.merchant.card_detail.error_loading')) }}

{% set card_detail_api_prefix = '/merchants/loyalty' %}
{% set card_detail_back_url = '/merchants/loyalty/cards' %}
{% include 'loyalty/shared/card-detail-view.html' %}

{% endblock %}

{% block extra_scripts %}
<script defer src="{{ url_for('loyalty_static', path='shared/js/loyalty-card-detail-view.js') }}"></script>
<script defer src="{{ url_for('loyalty_static', path='merchant/js/loyalty-card-detail.js') }}"></script>
{% endblock %}