@{
    ViewData["Title"] = "Dashboard";
}

<swp-page-container>
    <!-- Stats Bar -->
    <swp-stats-bar>
        <swp-stat-card class="highlight">
            <swp-stat-value>12</swp-stat-value>
            <swp-stat-label>Bookinger i dag</swp-stat-label>
            <swp-stat-trend class="up">
                <i class="ph ph-check-circle"></i>
                4 gennemført, 2 i gang
            </swp-stat-trend>
        </swp-stat-card>
        <swp-stat-card class="success">
            <swp-stat-value>8.450 kr</swp-stat-value>
            <swp-stat-label>Forventet omsætning</swp-stat-label>
            <swp-stat-trend class="up">
                <i class="ph ph-trend-up"></i>
                +12% vs. gennemsnit
            </swp-stat-trend>
        </swp-stat-card>
        <swp-stat-card>
            <swp-stat-value>78%</swp-stat-value>
            <swp-stat-label>Belægningsgrad</swp-stat-label>
            <swp-stat-trend class="up">
                <i class="ph ph-trend-up"></i>
                God kapacitet
            </swp-stat-trend>
        </swp-stat-card>
        <swp-stat-card class="warning">
            <swp-stat-value>4</swp-stat-value>
            <swp-stat-label>Kræver opmærksomhed</swp-stat-label>
        </swp-stat-card>
    </swp-stats-bar>

    <!-- Dashboard Content -->
    <swp-dashboard-grid>
        <swp-main-column>
            <!-- AI Insight -->
            <swp-card>
                <swp-ai-insight>
                    <swp-ai-header>
                        <i class="ph ph-sparkle"></i>
                        <span>AI Analyse</span>
                    </swp-ai-header>
                    <swp-ai-text>
                        <strong>Godt i gang!</strong> 4 af 12 bookinger er gennemført. 2 er i gang nu, og 6 venter.
                        Forventet omsætning: <strong>8.450 kr</strong> – allerede realiseret <strong>2.150 kr</strong>.
                    </swp-ai-text>
                </swp-ai-insight>
            </swp-card>

            <!-- Today's Bookings Preview -->
            <swp-card>
                <swp-card-header>
                    <swp-card-title>
                        <i class="ph ph-calendar-check"></i>
                        Dagens bookinger
                    </swp-card-title>
                    <swp-card-action>Se alle</swp-card-action>
                </swp-card-header>
                <swp-card-content>
                    <p>Booking oversigt kommer her...</p>
                </swp-card-content>
            </swp-card>
        </swp-main-column>

        <swp-side-column>
            <!-- Quick Actions -->
            <swp-card>
                <swp-card-header>
                    <swp-card-title>Hurtige handlinger</swp-card-title>
                </swp-card-header>
                <swp-card-content>
                    <swp-quick-actions>
                        <swp-quick-action-btn>
                            <i class="ph ph-plus"></i>
                            Ny booking
                        </swp-quick-action-btn>
                        <swp-quick-action-btn>
                            <i class="ph ph-user-plus"></i>
                            Ny kunde
                        </swp-quick-action-btn>
                    </swp-quick-actions>
                </swp-card-content>
            </swp-card>
        </swp-side-column>
    </swp-dashboard-grid>
</swp-page-container>