@extends('layouts.app')

@section('title', 'Reports — TechCorp Manager')

@section('content')
<div class="tc-page-head">
    <h2>Reports &amp; analytics</h2>
    <p>High-level counts and financial summary. Export workflows can use the JSON API or future PDF routes.</p>
</div>

<div class="tc-stats">
    <div class="tc-stat">
        <div class="label">Total clients</div>
        <div class="value blue">{{ number_format($clientsCount) }}</div>
    </div>
    <div class="tc-stat">
        <div class="label">Total invoices</div>
        <div class="value purple">{{ number_format($invoicesCount) }}</div>
    </div>
    <div class="tc-stat">
        <div class="label">Team members</div>
        <div class="value green">{{ number_format($employeesCount) }}</div>
    </div>
    <div class="tc-stat">
        <div class="label">Projects</div>
        <div class="value warning">{{ number_format($projectsCount) }}</div>
    </div>
    <div class="tc-stat">
        <div class="label">Revenue (paid)</div>
        <div class="value green">${{ number_format($stats['revenue'], 2) }}</div>
    </div>
    <div class="tc-stat">
        <div class="label">Pending revenue</div>
        <div class="value warning">${{ number_format($stats['pendingRevenue'], 2) }}</div>
    </div>
    <div class="tc-stat">
        <div class="label">Servers</div>
        <div class="value blue">{{ number_format($serversCount) }}</div>
    </div>
    <div class="tc-stat">
        <div class="label">Est. server cost / mo</div>
        <div class="value purple">${{ number_format($monthlyServerCost, 2) }}</div>
    </div>
</div>

<div class="tc-card">
    <h3>Module pages</h3>
    <p style="color:var(--text-light);font-size:0.9rem;margin:0 0 12px;">Open each area for full tables:</p>
    <ul style="margin:0;padding-left:1.2rem;line-height:1.8;">
        <li><a href="{{ route('web.clients.index') }}">Clients</a></li>
        <li><a href="{{ route('web.invoices.index') }}">Invoices</a></li>
        <li><a href="{{ route('web.projects.index') }}">Projects</a></li>
        <li><a href="{{ route('web.servers.index') }}">Servers</a></li>
        <li><a href="{{ route('web.domains.index') }}">Domains</a></li>
        <li><a href="{{ route('web.team.index') }}">Team</a></li>
    </ul>
</div>
@endsection
