<?php include 'header.php'; ?>
<?php include '_top-header.php'; ?>

<div class="page">

    <div class="container p-0">

        <div class="profile-layout">

            <div class="start">
                <?php include '_profile-layout-side-menu.php' ?>
            </div><!-- start -->

            <div class="end">

                <div class="card h-100">

                    <div class="flex-between mb-3">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="#">Home</a></li>
                            <li class="breadcrumb-item active">Create post</li>
                        </ol>

                        <a href="#" class="btn btn-danger-faded btn-sm"> Delete post </a>

                    </div>

                    <div class="steps-wizard-wrapper">

                        <div class="start">

                            <div class="steps-wrapper">

                                <a href="profile-create-post-1.php" class="step done">
                                    <i class="icon-check"></i>
                                    Post Details
                                </a>

                                <a href="profile-create-post-2.php" class="step done">
                                    <i class="icon-check"></i>
                                    target audience
                                </a>

                                <a href="#" class="step current">
                                    <i class="icon-check"></i>
                                    Package
                                </a>

                                <a href="#" class="step">
                                    <i class="icon-check"></i>
                                    Post Review
                                </a>
                            </div>

                        </div> <!-- start -->

                        <div class="center">

                            <div class="form-group">
                                <label> Budget </label>
                                <input type="text" class="form-control" placeholder="Enter Amount in KWD">
                            </div>



                            <p class="font-medium"> Choose Package </p>


                            <div class="packages-list">

                                <?php for ($i = 0; $i < 4; $i++) { ?>

                                    <div class="custom-control package-item <?php echo $i == 0 ? 'disabled' : ''; ?> custom-radio control-border mb-3 p-1 border position-relative">

                                        <input type="radio" id="address<?php echo $i; ?>" name="shipping_address" class="custom-control-input" <?php echo $i == 0 ? 'disabled' : ''; ?>>

                                        <label class="custom-control-label line-height-1-5 w-100" for="address<?php echo $i; ?>">

                                            <div class="flex-between mb-0">

                                                <div class="flex-center gap-2">
                                                    <img src="assets/img/packages/package-<?php echo $i + 1 ?>.png" class="w-50px h-50px cover package-image">
                                                    <div class="d-block">
                                                        <p class="font-bold m-0"> Premium </p>
                                                        <p class="color-success m-0"> 500 Fils Per share </p>
                                                    </div>
                                                </div>

                                                <div class="flex-start gap-2">

                                                    <div class="tooltip-wrapper">

                                                        <i class="icon icon-info-3 icon-lg"></i>

                                                        <div class="tooltip-text">
                                                            <p class="font-medium mb-1"> Add new target audience </p>
                                                            <p class="m-0 color-gray small">Morem ipsum dolor sit amet, consectetur adipiscing elit. Etiam eu turpis molestie, dictum est a, mattis tellus. Sed dignissim, metus nec fringilla </p>
                                                        </div>

                                                    </div>

                                                </div>

                                            </div>

                                        </label>

                                        <div class="bg-gray-light p-2 base-border-radius flex-between">
                                            <span class="small"> Estimated number of Audience </span>
                                            <span class="color-primary"> 1250 </span>
                                        </div>

                                    </div>

                                <?php } ?>

                            </div> <!--  list -->



                        </div><!-- center -->

                        <div class="end">

                            <div class="row">

                                <div class="col-6">
                                    <a href="#" class="btn btn-outline-primary"> Back </a>
                                </div>

                                <div class="col-6">
                                    <div class="flex-end w-100 gap-3">
                                        <a href="#" class="btn btn-primary-faded"> Save & Exit </a>
                                        <a href="profile-create-post-4.php" class="btn btn-primary"> Next </a>

                                    </div>
                                </div>

                            </div>

                        </div><!-- end -->

                    </div><!-- steps-wizard-wrapper -->

                </div> <!-- card -->

            </div> <!-- end -->

        </div> <!-- profile-layout -->

    </div> <!-- container -->

</div> <!-- page -->

<?php include 'footer.php'; ?>

