@include('site.header')
<style>
    body {
        background-color: #f4f4f4;
    }

    .qr-container {
        margin-top: 80px;
    }

    .btn-green {
        background-color: #28a745;
        color: white;
    }

    .btn-green:hover {
        background-color: #218838;
    }

    .qr-preview {
        text-align: center;
    }

    .qr-preview img {
        margin-top: 20px;
    }
</style>
<div class="breadcrumb-section">
    <div class="container">
        <div class="row">
            {{-- <div class="col-sm-6">
                <div class="page-title">
                    <h2>{{ $page_title ?? '' }}</h2>
                </div>
            </div> --}}
            <div class="col-sm-12">
                <nav aria-label="breadcrumb" class="theme-breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="/">Home</a></li>
                        <li class="breadcrumb-item active" aria-current="page">{{ $page_title ?? '' }}</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>
</div>
<!-- breadcrumb end -->


<!-- section start -->
<section class="section-b-space blog-page ratio2_3">
    <div class="container">
        <div class="row">
            <div class="col-xl-9 col-lg-8 col-md-7">
                <div class="card">
                    <div class="card-body">

                {{-- Validation Errors --}}
                @if ($errors->any())
                    <div class="alert alert-danger">
                        <ul class="mb-0">
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif

                {{-- Success Message --}}
                @if (session('success'))
                    <div class="alert alert-success">
                        {{ session('success') }}
                    </div>
                @endif

                {{-- Error Message --}}
                @if (session('error'))
                    <div class="alert alert-danger">
                        {{ session('error') }}
                    </div>
                @endif

                <div class="row">
                    <div class="col-md-6">
                        <form method="POST" action="{{ route('gst.calculate') }}">
                            @csrf
                            <div class="form-group">
                                <label for="amount">Enter Amount (₹):</label>
                                <input type="number" name="amount" id="amount" class="form-control" required
                                    step="0.01" min="0">
                            </div>

                            <div class="form-group">
                                <label for="gst_rate">Select GST Rate (%):</label>
                                <select name="gst_rate" id="gst_rate" class="form-control" required>
                                    <option value="5">5%</option>
                                    <option value="12">12%</option>
                                    <option value="18">18%</option>
                                    <option value="28">28%</option>
                                </select>
                            </div>

                            <div class="form-group">
                                <label>GST Type:</label><br>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="gst_type" id="exclusive"
                                        value="exclusive" checked>
                                    <label class="form-check-label" for="exclusive">Exclusive (Add GST)</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="gst_type" id="inclusive"
                                        value="inclusive">
                                    <label class="form-check-label" for="inclusive">Inclusive (Extract GST)</label>
                                </div>
                            </div>

                            <button type="submit" class="mt-3 btn btn-primary">Calculate</button>
                        </form>

                    </div>
                    <div class="col-md-6 ps-5">
                        @if (session('result'))
                            <div class="mt-4 alert">
                                <p><strong>Calculation Type:</strong> {{ session('result')['type'] }}</p>
                                <p><strong>Base Amount:</strong> ₹{{ session('result')['base'] }}</p>
                                <p><strong>GST ({{ session('result')['rate'] }}%):</strong>
                                    ₹{{ session('result')['gst'] }}</p>
                                <p><strong>Total Amount:</strong> ₹{{ session('result')['total'] }}</p>
                            </div>
                        @endif

                    </div>
                </div>
            </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-lg-4 col-md-5">

        </div>

    </div>
</section>
@include('site.footer')