@model PlanTempus.Application.Features.Customers.Components.CustomerDetailHeaderViewModel

<swp-customer-detail-header>
    <swp-customer-avatar-large>@Model.Initials</swp-customer-avatar-large>
    <swp-customer-detail-info>
        <swp-customer-name-row>
            <swp-customer-detail-name>@Model.Name</swp-customer-detail-name>
            <swp-customer-detail-tags>
                @foreach (var tag in Model.Tags)
                {
                    <swp-tag class="@tag.CssClass">@tag.Text</swp-tag>
                }
            </swp-customer-detail-tags>
            <swp-booking-exclusion data-excluded="@(Model.BookingAllowed ? "false" : "true")">
                @if (Model.BookingAllowed)
                {
                    <i class="ph ph-check icon"></i>
                    <span>@Model.BookingAllowedText</span>
                }
                else
                {
                    <i class="ph ph-x icon"></i>
                    <span>@Model.BookingBlockedText</span>
                }
            </swp-booking-exclusion>
        </swp-customer-name-row>
        <swp-contact-line>
            <a href="@Model.PhoneHref">@Model.Phone</a>
            <span class="separator">|</span>
            <a href="@Model.EmailHref">@Model.Email</a>
            <span class="separator">|</span>
            <span>@Model.CustomerSinceText</span>
        </swp-contact-line>
        <swp-fact-boxes-inline>
            <swp-fact-inline>
                <swp-fact-inline-value>@Model.FactVisits</swp-fact-inline-value>
                <swp-fact-inline-label>@Model.FactVisitsLabel</swp-fact-inline-label>
            </swp-fact-inline>
            <swp-fact-inline>
                <swp-fact-inline-value>@Model.FactInterval</swp-fact-inline-value>
                <swp-fact-inline-label>@Model.FactIntervalLabel</swp-fact-inline-label>
            </swp-fact-inline>
            <swp-fact-inline>
                <swp-fact-inline-value>@Model.FactHairdresser</swp-fact-inline-value>
                <swp-fact-inline-label>@Model.FactHairdresserLabel</swp-fact-inline-label>
            </swp-fact-inline>
            <swp-fact-inline>
                <swp-fact-inline-value>@Model.FactRevenue</swp-fact-inline-value>
                <swp-fact-inline-label>@Model.FactRevenueLabel</swp-fact-inline-label>
            </swp-fact-inline>
        </swp-fact-boxes-inline>
    </swp-customer-detail-info>
</swp-customer-detail-header>