{#
 # Address Card Component (Bootstrap 5)
 #
 # Reusable address display card with optional edit link.
 #
 # Expected context:
 #   title      - Card header title (e.g., "Billing address")
 #   address    - Formatted address HTML string
 #   phone      - Phone number (optional)
 #   email      - Email address (optional)
 #   edit_url   - URL to edit this address (optional)
 #
 # Usage:
 #   {% include 'components/address-card.html.twig' with {
 #       title: 'Billing address',
 #       address: order.get_formatted_billing_address(),
 #       phone: order.get_billing_phone(),
 #       email: order.get_billing_email(),
 #       edit_url: wc_get_endpoint_url('edit-address', 'billing')
 #   } %}
 #
 # @package WcBootstrap
 # @since 0.1.0
 #}

<div class="card h-100">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h3 class="h6 mb-0">{{ title|esc_html }}</h3>
        {% if edit_url is defined and edit_url %}
            <a href="{{ edit_url|esc_url }}" class="btn btn-sm btn-outline-primary">
                <i class="bi bi-pencil me-1" aria-hidden="true"></i>{{ __('Edit') }}
            </a>
        {% endif %}
    </div>
    <div class="card-body">
        <address class="mb-0" style="font-style: normal; line-height: 1.6;">
            {% if address %}
                {{ address|wp_kses_post }}
            {% else %}
                <span class="text-body-secondary">{{ __('N/A') }}</span>
            {% endif %}

            {% if phone is defined and phone %}
                <p class="mt-2 mb-0">
                    <i class="bi bi-telephone me-1" aria-hidden="true"></i>
                    {{ phone|esc_html }}
                </p>
            {% endif %}

            {% if email is defined and email %}
                <p class="mt-1 mb-0">
                    <i class="bi bi-envelope me-1" aria-hidden="true"></i>
                    {{ email|esc_html }}
                </p>
            {% endif %}
        </address>
    </div>
</div>