@extends('admin.layouts')

@section('content')

<div class="card p-2 p-md-4">

    <!-- Header -->
    <div class="d-flex align-items-center justify-content-between mb-5">

        <a href="{{ route('view_gold') }}"
            class="btn btn-icon btn-label-primary">
            <i class="ti tabler-arrow-left"></i>
        </a>

        <div class="text-center">
            <h6 class="mb-0 text-primary fw-bold">
                GA/25/08/0428
            </h6>

            <small class="text-dark fw-semibold">
                Lakshmi | 94876 54321
            </small>
        </div>

        <span class="badge bg-success-subtle text-success px-2 py-1">
            Active
        </span>

    </div>


    <!-- Tabs -->
    <div class="border-bottom mb-3">

        <ul class="nav nav-tabs border-0 flex-nowrap overflow-auto">



            <li class="nav-item">
                <a class="nav-link py-1 px-2 small"
                    href="{{route('view_ga_case')}}">
                    Overview
                </a>
            </li>

            <li class="nav-item">
                <a class="nav-link py-1 px-2 small"
                    href="{{route('view_gold')}}">
                    Gold
                </a>
            </li>

            <li class="nav-item">
                <a class="nav-link active py-1 px-2 small fw-semibold"
                    href="{{route('view_loan')}}">
                    Loan
                </a>
            </li>

            <li class="nav-item">
                <a class="nav-link py-1 px-2 small"
                    href="{{route('interest')}}">
                    Interest
                </a>
            </li>

            <li class="nav-item">
                <a class="nav-link py-1 px-2 small"
                    href="{{route('bp_link')}}">
                    BP Link
                </a>
            </li>

            <li class="nav-item">
                <a class="nav-link py-1 px-2 small"
                    href="{{route('movement')}}">
                    Movement
                </a>
            </li>

        </ul>

    </div>



    <!-- Loan & Interest Details -->
    <div>

        <h5 class="text-primary fw-bold mb-3">
            Loan & Interest Details
        </h5>

        <!-- Loan Details -->
        <div class="row g-2 mb-3">

            <!-- Gold Rate -->
            <div class="col-md-6 col-12">
                <div class="border rounded p-2 h-100">
                    <small class="text-muted d-block">
                        Gold Rate (22K)
                    </small>

                    <span class="fw-semibold">
                        ₹ 12,000 / g
                    </span>
                </div>
            </div>

            <!-- Eligible Net Weight -->
            <div class="col-md-6 col-12">
                <div class="border rounded p-2 h-100">
                    <small class="text-muted d-block">
                        Eligible Net Weight
                    </small>

                    <span class="fw-semibold">
                        41.790 g
                    </span>
                </div>
            </div>

            <!-- Loan Amount -->
            <div class="col-md-6 col-12">
                <div class="border rounded p-2 h-100">
                    <small class="text-muted d-block">
                        Loan Amount (Principal)
                    </small>

                    <span class="fw-semibold text-primary">
                        ₹ 5,00,000
                    </span>
                </div>
            </div>

            <!-- Interest Policy -->
            <div class="col-md-6 col-12">
                <div class="border rounded p-2 h-100">
                    <small class="text-muted d-block">
                        Interest Policy
                    </small>

                    <span class="fw-semibold">
                        Standard (As per R.D Policy)
                    </span>
                </div>
            </div>

        </div>


        <!-- Expected Interest -->
        <div class="alert alert-primary py-2 px-2 mb-3">

            <div class="d-flex justify-content-between align-items-center">

                <span class="small">
                    Expected Interest (Next 1 Month)
                </span>

                <strong>
                    ₹ 10,000
                </strong>

            </div>

        </div>


        <!-- Disbursement Details -->
        <h6 class="text-primary fw-bold mb-2">
            Disbursement Details
        </h6>

        <div class="row g-2 mb-3">

            <!-- Disbursement Mode -->
            <div class="col-md-6 col-12">
                <div class="border rounded p-2 h-100">

                    <small class="text-muted d-block">
                        Disbursement Mode
                    </small>

                    <span class="fw-semibold">
                        Bank Transfer
                    </span>

                </div>
            </div>

            <!-- Disbursement Date -->
            <div class="col-md-6 col-12">
                <div class="border rounded p-2 h-100">

                    <small class="text-muted d-block">
                        Disbursement Date
                    </small>

                    <span class="fw-semibold">
                        25-08-2026
                    </span>

                </div>
            </div>

        </div>


        <!-- Bank Details -->
        <h6 class="text-primary fw-bold mb-2">
            Bank Details
        </h6>

        <div class="border rounded p-2 mb-3">

            <div class="row g-2">

                <div class="col-md-4 col-12">
                    <small class="text-muted d-block">
                        Bank Name
                    </small>

                    <span class="fw-semibold">
                        Indian Bank
                    </span>
                </div>

                <div class="col-md-4 col-12">
                    <small class="text-muted d-block">
                        Account Number
                    </small>

                    <span class="fw-semibold">
                        XXXXXXXX4321
                    </span>
                </div>

                <div class="col-md-4 col-12">
                    <small class="text-muted d-block">
                        IFSC
                    </small>

                    <span class="fw-semibold">
                        IDIB0001234
                    </span>
                </div>

            </div>

        </div>


        <!-- Owner Approval -->
        <h6 class="text-primary fw-bold mb-2">
            Owner Approval
        </h6>

        <div class="row g-2 mb-3">

            <!-- Approved By -->
            <div class="col-md-6 col-12">

                <div class="border rounded p-2 h-100">

                    <small class="text-muted d-block">
                        Approved By
                    </small>

                    <span class="fw-semibold">
                        Ramesh K
                    </span>

                </div>

            </div>

            <!-- Approval Date -->
            <div class="col-md-6 col-12">

                <div class="border rounded p-2 h-100">

                    <small class="text-muted d-block">
                        Approval Date
                    </small>

                    <span class="fw-semibold">
                        25-08-2026
                    </span>

                </div>

            </div>

        </div>


        <!-- Outstanding -->
        <h6 class="text-primary fw-bold mb-2">
            Outstanding
        </h6>

        <div class="row g-2">

            <div class="col-md-4 col-12">
                <div class="border rounded p-2 h-100">

                    <small class="text-muted d-block">
                        Principal Outstanding
                    </small>

                    <span class="fw-bold text-danger">
                        ₹ 5,00,000
                    </span>

                </div>
            </div>

            <div class="col-md-4 col-12">
                <div class="border rounded p-2 h-100">

                    <small class="text-muted d-block">
                        Interest Outstanding
                    </small>

                    <span class="fw-bold text-danger">
                        ₹ 10,000
                    </span>

                </div>
            </div>

            <div class="col-md-4 col-12">
                <div class="border rounded p-2 h-100">

                    <small class="text-muted d-block">
                        Total Outstanding
                    </small>

                    <span class="fw-bold text-primary">
                        ₹ 5,10,000
                    </span>

                </div>
            </div>

        </div>

    </div>

    @endsection