{# Close Report Detail Partial #}
{# Displays the full report content for server-side rendering #}
{# Used for initial page load with today's report #}

{# Sales Summary Row #}
<div class="row g-3 mb-4">
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-primary">
            <div class="stat-icon"><i class="fa fa-dollar-sign"></i></div>
            <div class="stat-value">${{ (report.salesSummary.netSalesRetail / 100)|number_format(0) }}</div>
            <div class="stat-label">Net Sales</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-secondary">
            <div class="stat-icon"><i class="fa fa-chart-line"></i></div>
            <div class="stat-value">${{ (report.salesSummary.grossSalesRetail / 100)|number_format(0) }}</div>
            <div class="stat-label">Gross Sales</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-info">
            <div class="stat-icon"><i class="fa fa-shopping-cart"></i></div>
            <div class="stat-value">{{ report.salesSummary.salesCount|default(0) }}</div>
            <div class="stat-label">Sales Count</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-success">
            <div class="stat-icon"><i class="fa fa-receipt"></i></div>
            <div class="stat-value">${{ (report.salesSummary.averageRetail / 100)|number_format(0) }}</div>
            <div class="stat-label">Avg Sale</div>
        </div>
    </div>
</div>

{# Buys Section #}
<div class="row g-3 mb-4">
    <div class="col-12">
        <h6 class="text-uppercase text-muted mb-3"><i class="fa fa-handshake me-2"></i>Buys</h6>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-primary">
            <div class="stat-icon"><i class="fa fa-box"></i></div>
            <div class="stat-value">{{ report.buys.buysCount|default(0) }}</div>
            <div class="stat-label">Buys Count</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-warning">
            <div class="stat-icon"><i class="fa fa-tags"></i></div>
            <div class="stat-value">${{ (report.buys.buysCost / 100)|number_format(0) }}</div>
            <div class="stat-label">Buy Cost</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-info">
            <div class="stat-icon"><i class="fa fa-store"></i></div>
            <div class="stat-value">${{ (report.buys.buysRetail / 100)|number_format(0) }}</div>
            <div class="stat-label">Buy Retail</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-secondary">
            <div class="stat-icon"><i class="fa fa-hourglass-half"></i></div>
            <div class="stat-value">${{ (report.buys.buysOutstanding / 100)|number_format(0) }}</div>
            <div class="stat-label">Outstanding</div>
        </div>
    </div>
</div>

{# Labor Section (if available) #}
{% if report.labor %}
<div class="row g-3 mb-4">
    <div class="col-12">
        <h6 class="text-uppercase text-muted mb-3"><i class="fa fa-users me-2"></i>Labor</h6>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-primary">
            <div class="stat-icon"><i class="fa fa-percentage"></i></div>
            <div class="stat-value">{{ report.labor.laborPercentage|default(0)|number_format(1) }}%</div>
            <div class="stat-label">Labor %</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-warning">
            <div class="stat-icon"><i class="fa fa-money-bill"></i></div>
            <div class="stat-value">${{ (report.labor.laborDollars / 100)|number_format(0) }}</div>
            <div class="stat-label">Labor Cost</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-info">
            <div class="stat-icon"><i class="fa fa-clock"></i></div>
            <div class="stat-value">{{ report.labor.laborHours|default(0)|number_format(1) }}</div>
            <div class="stat-label">Hours Worked</div>
        </div>
    </div>
</div>
{% endif %}

{# Cash Section (if available) #}
{% if report.cash %}
{% set cashVariance = report.cash.cashVariance|default(0) %}
{% set varianceClass = cashVariance == 0 ? 'success' : (cashVariance|abs > 500 ? 'danger' : 'warning') %}
<div class="row g-3 mb-4">
    <div class="col-12">
        <h6 class="text-uppercase text-muted mb-3"><i class="fa fa-cash-register me-2"></i>Cash</h6>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-primary">
            <div class="stat-icon"><i class="fa fa-plus-circle"></i></div>
            <div class="stat-value">${{ (report.cash.cashPaidIn / 100)|number_format(0) }}</div>
            <div class="stat-label">Paid In</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-info">
            <div class="stat-icon"><i class="fa fa-minus-circle"></i></div>
            <div class="stat-value">${{ (report.cash.cashPaidOut / 100)|number_format(0) }}</div>
            <div class="stat-label">Paid Out</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-{{ varianceClass }}">
            <div class="stat-icon"><i class="fa fa-balance-scale"></i></div>
            <div class="stat-value">${{ (cashVariance / 100)|number_format(0) }}</div>
            <div class="stat-label">Variance</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="stat-card stat-card-secondary">
            <div class="stat-icon"><i class="fa fa-lock"></i></div>
            <div class="stat-value">${{ (report.cash.safeBalance / 100)|number_format(0) }}</div>
            <div class="stat-label">Safe Balance</div>
        </div>
    </div>
</div>
{% endif %}

{# Checklists Section (if available) #}
{% if report.checklists %}
<div class="row g-3 mb-4">
    <div class="col-12">
        <h6 class="text-uppercase text-muted mb-3"><i class="fa fa-tasks me-2"></i>Checklists</h6>
    </div>

    {# Opening Checklist - uses flat structure from ChecklistDataVO #}
    {% if report.checklists.hasOpeningChecklist %}
    <div class="col-md-6">
        <div class="card h-100">
            <div class="card-header bg-light py-2">
                <strong>Opening Checklist</strong>
                {% if report.checklists.openingCheckListSubmitter %}
                <span class="text-muted small float-end">{{ report.checklists.openingCheckListSubmitter }}</span>
                {% endif %}
            </div>
            <div class="card-body py-2">
                {% if report.checklists.openingCheckListComments %}
                <div class="mb-2 small text-muted fst-italic">{{ report.checklists.openingCheckListComments }}</div>
                {% endif %}
                <div class="d-flex align-items-center text-success">
                    <i class="fa fa-check-circle me-2"></i>
                    <span>Submitted</span>
                </div>
            </div>
        </div>
    </div>
    {% endif %}

    {# Closing Checklist - uses flat structure from ChecklistDataVO #}
    {% if report.checklists.hasClosingChecklist %}
    <div class="col-md-6">
        <div class="card h-100">
            <div class="card-header bg-light py-2">
                <strong>Closing Checklist</strong>
                {% if report.checklists.closingCheckListSubmitter %}
                <span class="text-muted small float-end">{{ report.checklists.closingCheckListSubmitter }}</span>
                {% endif %}
            </div>
            <div class="card-body py-2">
                {% if report.checklists.closingCheckListComments %}
                <div class="mb-2 small text-muted fst-italic">{{ report.checklists.closingCheckListComments }}</div>
                {% endif %}
                <div class="d-flex align-items-center text-success">
                    <i class="fa fa-check-circle me-2"></i>
                    <span>Submitted</span>
                </div>
            </div>
        </div>
    </div>
    {% endif %}

    {# Task Summary (if tasks exist) #}
    {% if report.checklists.totalTaskCount > 0 %}
    <div class="col-12">
        <div class="card">
            <div class="card-body py-2">
                <div class="d-flex justify-content-between align-items-center">
                    <span><i class="fa fa-tasks me-2"></i>Tasks Completed</span>
                    <span class="badge bg-{{ report.checklists.completedTaskCount == report.checklists.totalTaskCount ? 'success' : 'warning' }}">
                        {{ report.checklists.completedTaskCount }} / {{ report.checklists.totalTaskCount }}
                    </span>
                </div>
            </div>
        </div>
    </div>
    {% endif %}

    {# Day Close Info (if submitted) #}
    {% if report.checklists.dayCloseSubmitter %}
    <div class="col-12">
        <div class="card">
            <div class="card-body py-2">
                <div class="d-flex justify-content-between align-items-center">
                    <span><i class="fa fa-calendar-check me-2"></i>Day Closed By</span>
                    <span class="badge bg-primary">{{ report.checklists.dayCloseSubmitter }}</span>
                </div>
                {% if report.checklists.dayCloseComments %}
                <div class="mt-2 small text-muted fst-italic">{{ report.checklists.dayCloseComments }}</div>
                {% endif %}
            </div>
        </div>
    </div>
    {% endif %}
</div>
{% endif %}