@extends('layouts.app')
    <div class="container-fluid p-0">
        <div class="main-container">
            <div class="row g-0 h-100">

{{-- 
                @php
                    dd($data);
                @endphp --}}
                <!-- Sidebar -->
                <div class="col-lg-3 col-md-4">
                    <div class="sidebar d-flex flex-column">
                        <ul class="sidebar-nav flex-grow-1">
                            <li>
                                <a href="#" class="active">
                                    <i class="fas fa-cog"></i>
                                    Equipment
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <i class="fas fa-chart-line"></i>
                                    Income prices
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <i class="fas fa-users"></i>
                                    Referral program
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <i class="fas fa-bell"></i>
                                    Notifications
                                </a>
                            </li>
                        </ul>
                        <div class="logout-section">
                            <a href="#" class="text-danger">
                                <i class="fas fa-sign-out-alt"></i>
                                Log Out
                            </a>
                        </div>
                    </div>
                </div>

                <!-- Main Content -->
                <div class="col-lg-9 col-md-8">
                    <div class="content-area">
                        <!-- Header -->
                        <div class="header-section">
                            <h1 class="page-title">My Hardware</h1>
                            <button class="btn download-btn">
                                <i class="fas fa-download me-2"></i>
                                DOWNLOAD SOFT
                            </button>
                        </div>

                  <div class="hardware-list">
    @foreach($data as $modem)
        <div class="hardware-item">
            <a href="{{ route('equipment.show', $modem->id) }}">
    <div class="hardware-title">
        Partner Modem ({{ $modem->equipment_uuid }})
    </div>
</a>
            <div class="stats-row">
                <div class="stat-item">
                    <div class="stat-label">Total Port</div>
                    <div class="stat-value total">{{ $modem->number_of_ports  ?? 0 }}</div>
                </div>
                <div class="stat-item">
                    <div class="stat-label">Ready</div>
                    <div class="stat-value ready">{{ $modem->ready ?? 0 }}</div>
                </div>
                <div class="stat-item">
                    <div class="stat-label">Status</div>
                    <div class="stat-value orders">{{ $modem->in_orders ?? 0 }}</div>
                </div>
                <div class="stat-item">
                    <div class="stat-label">Country</div>
                    <div class="stat-value error">{{ $modem->country ?? "Null" }}</div>
                </div>
                <div class="stat-item">
                    <div class="stat-label">Partner Contact</div>
                    <div class="stat-value earn">{{ $modem->partner_contact ?? "Null" }}</div>
                </div>
            </div>
        </div>
    @endforeach
</div>

                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>