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

<div class="page">



    <div class="container">

        <hr />

        <h6 class="mb-3 font-medium">choose Payment Method</h6>

        <div class="payment-options">

            <div class="custom-control custom-radio control-border mb-2">
                <input type="radio" id="customRadio1" name="customRadio" class="custom-control-input" checked>
                <label class="custom-control-label lead d-flex gap-1" for="customRadio1">
                    <i class="icon icon-wallet-checked icon-xl ms-1 me-1"></i>
                    Wallet
                </label>
            </div>

            <div class="custom-control custom-radio control-border mb-2">
                <input type="radio" id="customRadio2" name="customRadio" class="custom-control-input">
                <label class="custom-control-label lead d-flex gap-1" for="customRadio2">
                    <i class="icon icon-cash-on-delivery icon-xl ms-1 me-1"></i>
                    Cash on delivery
                </label>
            </div>

            <div class="custom-control custom-radio control-border mb-2">
                <input type="radio" id="customRadio3" name="customRadio" class="custom-control-input">
                <label class="custom-control-label lead flex-start gap-1" for="customRadio3">
                    <img src="assets/img/knet.png" class="border-radius-xs h-20px me-1 ms-1">
                    K net
                </label>
            </div>

        </div>

        <hr />
        <hr />
        <hr />


        <h6 class="mb-3 font-medium">choose address </h6>

        <div class="addresses-list mt-4">

            <div class="custom-control custom-radio control-border address-item mb-3 mx-3 p-1 border rounded position-relative">

                <input type="radio" id="address2" name="shipping_address" class="custom-control-input" checked>

                <label class="custom-control-label line-height-1-5 w-100" for="address2">

                    <div class="mb-1">
                        <span class="badge badge-primary-faded badge-sm ">Fahd akhoya </span>
                    </div>

                    <div class="flex-between">
                        <div class="mb-1">
                            <p class="mb-0 color-gray font-light">Receiver name</p>
                            <p class="mb-0">Fahd Abdulaziz abo salman</p>
                        </div>
                        <div class="mb-1">
                            <div class="color-gray font-light">Phone number</div>
                            <div>+966 2345626363</div>
                        </div>
                    </div>

                    <div class="mb-3">
                        <div class="color-gray font-light">Address details</div>
                        <div>Kuwait, Hwayli, Elsafa Walmarwa, Building 4, Apt.45</div>
                    </div>

                    <div class="flex-between gap-3">
                        <a href="#" class="btn btn-outline-primary btn-sm btn-block">Continue</a>
                        <a href="#" class="btn btn-danger-faded btn-sm text-danger" style="right: 10px; top: 10px;">
                            <i class="icon icon-trash"></i>
                        </a>
                    </div>

                </label>
                
            </div>

            <div class="custom-control custom-radio control-border address-item mb-3 mx-3 p-1 border rounded position-relative">
                <input type="radio" id="address3" name="shipping_address" class="custom-control-input">
                <label class="custom-control-label line-height-1-5  w-100" for="address3">
                    <div class="mb-1">
                        <span class="badge badge-primary-faded badge-sm">Fahd akhoya</span>
                    </div>
                    <div class="flex-between">
                        <div class="mb-1">
                            <div class="text-gray">Receiver name</div>
                            <div>Fahd Abdulaziz abo salman</div>
                        </div>
                        <div class="mb-1">
                            <div class="text-gray">Phone number</div>
                            <div>+966 2345626363</div>
                        </div>
                    </div>
                    <div class="mb-3">
                        <div class="text-gray">Address details</div>
                        <div>Kuwait, Hwayli, Elsafa Walmarwa, Building 4, Apt.45</div>
                    </div>
                    <div class="flex-between gap-3">
                        <a href="#" class="btn btn-outline-primary      btn-sm btn-block">Continue</a>
                        <a href="#" class="btn btn-danger-faded btn-sm text-danger" style="right: 10px; top: 10px;">
                            <i class="icon icon-trash"></i>
                        </a>
                    </div>
                </label>
            </div>
        </div>

    </div>
</div>

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