@extends('member.layout')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <!-- Account Header -->
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title">
                        Investment Details: {{ $moneyMarketAccount->account_number }}
                        <span class="badge {{ $moneyMarketAccount->getStatusBadgeClass() }} ml-2">
                            {{ ucfirst($moneyMarketAccount->status) }}
                        </span>
                    </h3>
                    <div class="card-tools">
                        <a href="{{ route('member.money-market.index') }}" class="btn btn-secondary btn-sm">
                            <i class="fas fa-arrow-left"></i> Back to Investments
                        </a>
                    </div>
                </div>

                <div class="card-body">
                    <div class="row">
                        <!-- Investment Information -->
                        <div class="col-md-6">
                            <h5>Investment Information</h5>
                            <table class="table table-borderless">
                                <tr>
                                    <th width="40%">Account Number:</th>
                                    <td>{{ $moneyMarketAccount->account_number }}</td>
                                </tr>
                                <tr>
                                    <th>Status:</th>
                                    <td>
                                        <span class="badge {{ $moneyMarketAccount->getStatusBadgeClass() }}">
                                            {{ ucfirst($moneyMarketAccount->status) }}
                                        </span>
                                    </td>
                                </tr>
                                <tr>
                                    <th>Currency:</th>
                                    <td>{{ $moneyMarketAccount->currency_code }}</td>
                                </tr>
                            </table>
                        </div>

                        <!-- Investment Terms -->
                        <div class="col-md-6">
                            <h5>Investment Terms</h5>
                            <table class="table table-borderless">
                                <tr>
                                    <th width="40%">Principal Amount:</th>
                                    <td>{{ \App\Helpers\CurrencyHelper::format($moneyMarketAccount->principal_amount, $moneyMarketAccount->currency_code) }}</td>
                                </tr>
                                <tr>
                                    <th>Interest Rate:</th>
                                    <td>{{ number_format($moneyMarketAccount->interest_rate, 2) }}% per annum</td>
                                </tr>
                                <tr>
                                    <th>Term:</th>
                                    <td>{{ $moneyMarketAccount->term_months }} months</td>
                                </tr>
                                <tr>
                                    <th>Start Date:</th>
                                    <td>{{ $moneyMarketAccount->start_date->format('M d, Y') }}</td>
                                </tr>
                                <tr>
                                    <th>Maturity Date:</th>
                                    <td>{{ $moneyMarketAccount->maturity_date->format('M d, Y') }}</td>
                                </tr>
                            </table>
                        </div>
                    </div>

                    <hr>

                    <!-- Financial Summary -->
                    <div class="row">
                        <div class="col-md-12">
                            <h5>Financial Summary</h5>
                            <div class="row">
                                <div class="col-md-4">
                                    <div class="card border-primary">
                                        <div class="card-body text-center">
                                            <h6 class="card-title">Principal Amount</h6>
                                            <h4 class="text-primary">{{ \App\Helpers\CurrencyHelper::format($moneyMarketAccount->principal_amount, $moneyMarketAccount->currency_code) }}</h4>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="card border-success">
                                        <div class="card-body text-center">
                                            <h6 class="card-title">Interest Earned</h6>
                                            <h4 class="text-success">{{ \App\Helpers\CurrencyHelper::format($moneyMarketAccount->interest_earned, $moneyMarketAccount->currency_code) }}</h4>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="card border-info">
                                        <div class="card-body text-center">
                                            <h6 class="card-title">Total Value</h6>
                                            <h4 class="text-info">{{ \App\Helpers\CurrencyHelper::format($moneyMarketAccount->total_amount, $moneyMarketAccount->currency_code) }}</h4>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- Progress and Timeline -->
                    <div class="row mt-4">
                        <div class="col-md-12">
                            <h5>Investment Progress</h5>
                            <div class="progress mb-3">