@extends('layouts.master')
@section('title') @lang('translation.investment-plan') @endsection
@section('content')
@component('components.breadcrumb')
@slot('title') Investment Plan @endslot

<div class="row justify-content-center mt-2">
    <div class="col-lg-5">
        <div class="text-center mb-4 pb-2">
            <h2 class="fw-bold fs-1">Select Investment Plan</h2>
        </div>
    </div><!--end col-->
</div><!--end row-->

<div class="row justify-content-center">
    <div class="col-xl-12">
        <div class="row">
            <div class="col-lg-4">
                <div class="card pricing-box">
                    <div class="card-body p-4 m-2">
                        <div class="d-flex align-items-center">
                            <div class="flex-grow-1">
                                <h3 class="mb-1 fw-semibold">3-Months Plan</h3>
                                <p class="text-muted mb-0">Perfect for side investment</p>
                            </div>
                            <div class="avatar-sm">
                                <div class="avatar-title bg-light rounded-circle text-primary">
                                    <i class="ri-book-mark-line fs-20"></i>
                                </div>
                            </div>
                        </div>
                        <div class="pt-4">
                            <h2>4%<span class="fs-13 text-muted">/Return on Payment</span></h2>
                        </div>
                        <hr class="my-4 text-muted">
                        <div>
                            <ul class="list-unstyled text-muted vstack gap-3">
                                <li>
                                    <div class="d-flex">
                                        <div class="flex-shrink-0 text-success me-1">
                                            <i class="ri-checkbox-circle-fill fs-15 align-middle"></i>
                                        </div>
                                        <div class="flex-grow-1">
                                            Tentative weekly, monthly, and total profits for the plan duration.
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div class="d-flex">
                                        <div class="flex-shrink-0 text-success me-1">
                                            <i class="ri-checkbox-circle-fill fs-15 align-middle"></i>
                                        </div>
                                        <div class="flex-grow-1">
                                            View profit accrual in real-time on the dashboard.
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div class="d-flex">
                                        <div class="flex-shrink-0 text-danger me-1">
                                            <i class="ri-close-circle-fill fs-15 align-middle"></i>
                                        </div>
                                        <div class="flex-grow-1">
                                            Analyze and Predict Financial Trends
                                        </div>
                                    </div>
                                </li>
                            </ul>
                            <div class="mt-4">
                                <a href="javascript:void(0);" class="btn btn-soft-success w-100 waves-effect waves-light">Get started</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div><!--end col-->
            <div class="col-lg-4">
                <div class="card pricing-box ribbon-box right">
                    <div class="card-body p-4 m-2">
                        <div class="ribbon-two ribbon-two-danger"><span>Popular</span></div>
                        <div>
                            <div class="d-flex align-items-center">
                                <div class="flex-grow-1">
                                    <h3 class="mb-1 fw-semibold">6-Months Plan</h3>
                                    <p class="text-muted mb-0">Perfect for most of investors </p>
                                </div>
                                <div class="avatar-sm">
                                    <div class="avatar-title bg-light rounded-circle text-primary">
                                        <i class="ri-medal-line fs-20"></i>
                                    </div>
                                </div>
                            </div>

                            <div class="pt-4">
                            <h2>8%<span class="fs-13 text-muted">/Return on Payment</span></h2>
                            </div>
                        </div>
                        <hr class="my-4 text-muted">
                        <div>
                            <ul class="list-unstyled text-muted vstack gap-3">
                                <li>
                                    <div class="d-flex">
                                        <div class="flex-shrink-0 text-success me-1">
                                            <i class="ri-checkbox-circle-fill fs-15 align-middle"></i>
                                        </div>
                                        <div class="flex-grow-1">
                                            Tentative weekly, monthly, and total profits for the plan duration.
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div class="d-flex">
                                        <div class="flex-shrink-0 text-success me-1">
                                            <i class="ri-checkbox-circle-fill fs-15 align-middle"></i>
                                        </div>
                                        <div class="flex-grow-1">
                                            View profit accrual in real-time on the dashboard.
                                        </div>
                                    </div>
                                </li>
                                <li>
                                <div class="d-flex">
                                        <div class="flex-shrink-0 text-success me-1">
                                            <i class="ri-checkbox-circle-fill fs-15 align-middle"></i>
                                        </div>
                                        <div class="flex-grow-1">
                                            Analyze and Predict Financial Trends
                                        </div>
                                    </div>
                                </li>
                            </ul>
                            <div class="mt-4">
                                <a href="javascript:void(0);" class="btn btn-success w-100 waves-effect waves-light">Get started</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div><!--end col-->
            <div class="col-lg-4">
                <div class="card pricing-box">
                    <div class="card-body p-4 m-2">
                        <div>
                            <div class="d-flex align-items-center">
                            <div class="flex-grow-1">
                                    <h3 class="mb-1 fw-semibold">12-Months Plan</h3>
                                    <p class="text-muted mb-0">Perfect for organizations</p>
                                </div>
                                <div class="avatar-sm">
                                    <div class="avatar-title bg-light rounded-circle text-primary">
                                        <i class="ri-stack-line fs-20"></i>
                                    </div>
                                </div>
                            </div>

                            <div class="pt-4">
                            <h2>10%<span class="fs-13 text-muted">/Return on Payment</span></h2>
                            </div>
                        </div>
                        <hr class="my-4 text-muted">
                        <div>
                        <ul class="list-unstyled text-muted vstack gap-3">
                                <li>
                                    <div class="d-flex">
                                        <div class="flex-shrink-0 text-success me-1">
                                            <i class="ri-checkbox-circle-fill fs-15 align-middle"></i>
                                        </div>
                                        <div class="flex-grow-1">
                                            Tentative weekly, monthly, and total profits for the plan duration.
                                        </div>
                                    </div>
                                </li>
                                <li>
                                <div class="d-flex">
                                        <div class="flex-shrink-0 text-success me-1">
                                            <i class="ri-checkbox-circle-fill fs-15 align-middle"></i>
                                        </div>
                                        <div class="flex-grow-1">
                                        Enable three essential business services.
                                        </div>
                                    </div>
                                </li>
                                <li><div class="d-flex">
                                        <div class="flex-shrink-0 text-success me-1">
                                            <i class="ri-checkbox-circle-fill fs-15 align-middle"></i>
                                        </div>
                                        <div class="flex-grow-1">
                                            Analyze and Predict Financial Trends
                                        </div>
                                    </div>
                                </li>
                            </ul>
                            <div class="mt-4">
                                <a href="javascript:void(0);" class="btn btn-soft-success w-100 waves-effect waves-light">Get started</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div><!--end col-->
        </div><!--end row-->
    </div><!--end col-->
</div><!--end row-->

@endsection
@section('script')
<script src="{{ URL::asset('build/js/pages/pricing.init.js') }}"></script>
@endsection