@model PlanTempus.Application.Features.Services.Components.ServiceDetailHeaderViewModel

<swp-service-detail-header>
    <swp-service-info>
        <swp-service-name-row>
            <swp-service-name contenteditable="true">@Model.Name</swp-service-name>
            @if (Model.Tags.Any())
            {
                <swp-tags-row>
                    @foreach (var tag in Model.Tags)
                    {
                        <swp-tag class="@tag.CssClass">@tag.Text</swp-tag>
                    }
                </swp-tags-row>
            }
            <swp-status-indicator data-active="@Model.IsActive.ToString().ToLower()">
                <span class="icon">●</span>
                <span class="text">@Model.StatusText</span>
            </swp-status-indicator>
        </swp-service-name-row>
        <swp-fact-boxes-inline>
            <swp-fact-inline>
                <swp-fact-inline-value>@Model.DurationRange</swp-fact-inline-value>
                <swp-fact-inline-label>@Model.LabelDuration</swp-fact-inline-label>
            </swp-fact-inline>
            <swp-fact-inline>
                <swp-fact-inline-value>@Model.FromPrice</swp-fact-inline-value>
                <swp-fact-inline-label>@Model.LabelFromPrice</swp-fact-inline-label>
            </swp-fact-inline>
            <swp-fact-inline>
                <swp-fact-inline-value>@Model.EmployeeCount</swp-fact-inline-value>
                <swp-fact-inline-label>@Model.LabelEmployees</swp-fact-inline-label>
            </swp-fact-inline>
            <swp-fact-inline>
                <swp-fact-inline-value>@Model.BookingsThisYear</swp-fact-inline-value>
                <swp-fact-inline-label>@Model.LabelBookingsThisYear</swp-fact-inline-label>
            </swp-fact-inline>
        </swp-fact-boxes-inline>
    </swp-service-info>
</swp-service-detail-header>