<!DOCTYPE html>
<html lang="zxx">
<meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack -->
<head>
    <?php $this->load->view('web/inc/stylesheet'); ?>
    <link rel="stylesheet" href="<?= base_url('assets/web/css/custom-style.css'); ?>">
</head>

<body class='sc5'>

    <?php $this->load->view('web/inc/navigation'); ?>
    <!-- navbar end -->

    <!-- page banner start -->
    <div class="page-banner-area bgs-cover overlay text-white py-80 rpy-125 rmt-65"
        style="background-image: url(<?= base_url('assets/web/'); ?>img/background/asha-axom-page-title-background.webp);">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-xl-12 col-lg-8">
                    <div class="breadcrumb-inner text-center">
                        <h2 class="page-title"><?=$PageName;?></h2>
                        <ul class="page-list">
                            <li><a href="index.html">Home</a></li>
                            <li>Cause Details</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- page banner end -->

    <!-- Cause Details area start -->
    <div class="cause-details-area py-60">
        <div class="container">
            <div class="row gap-60">
                <div class="col-lg-8">
                    <div class="cause-details-content">
                        <div class="details-slider mb-30">
                            <div id="causeDetailsCarousel" class="carousel slide" data-ride="carousel">
                                <div class="carousel-inner">
                                    <div class="carousel-item active">
                                        <img src="<?= base_url('assets/web/'); ?>img/hero/testslider.webp" class="d-block w-100" alt="Slide 1">
                                    </div>
                                    <div class="carousel-item">
                                        <img src="<?= base_url('assets/web/'); ?>img/hero/testslider.webp" class="d-block w-100" alt="Slide 2">
                                    </div>
                                    <div class="carousel-item">
                                        <img src="<?= base_url('assets/web/'); ?>img/hero/testslider.webp" class="d-block w-100" alt="Slide 3">
                                    </div>
                                </div>
                                <a class="carousel-control-prev" href="#causeDetailsCarousel" role="button" data-slide="prev">
                                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                                    <span class="sr-only">Previous</span>
                                </a>
                                <a class="carousel-control-next" href="#causeDetailsCarousel" role="button" data-slide="next">
                                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                                    <span class="sr-only">Next</span>
                                </a>
                            </div>
                            <div class="carousel-thumbnails mt-3">
                                <div class="row">
                                    <div class="col-4">
                                        <img src="<?= base_url('assets/web/'); ?>img/hero/testslider.webp" class="img-thumbnail" alt="Thumbnail 1" data-target="#causeDetailsCarousel" data-slide-to="0">
                                    </div>
                                    <div class="col-4">
                                        <img src="<?= base_url('assets/web/'); ?>img/hero/testslider.webp" class="img-thumbnail" alt="Thumbnail 2" data-target="#causeDetailsCarousel" data-slide-to="1">
                                    </div>
                                    <div class="col-4">
                                        <img src="<?= base_url('assets/web/'); ?>img/hero/testslider.webp" class="img-thumbnail" alt="Thumbnail 3" data-target="#causeDetailsCarousel" data-slide-to="2">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="social-buttons d-flex justify-content-between align-items-center mt-4">
                            <button class="btn btn-outline-primary btn-lg d-flex align-items-center">
                                <i class="fa fa-thumbs-up mr-2"></i> Like
                            </button>
                            <button class="btn btn-outline-primary btn-lg d-flex align-items-center">
                                <i class="fa fa-user-plus mr-2"></i> Follow
                            </button>
                            <div class="btn-group dropup">
                                <button class="btn btn-outline-primary btn-lg dropdown-toggle d-flex align-items-center" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    <i class="fa fa-share mr-2"></i> Share
                                </button>
                                <div class="dropdown-menu">
                                    <a class="dropdown-item d-flex align-items-center" href="https://www.facebook.com/sharer/sharer.php?u=<?= urlencode(current_url()); ?>" target="_blank">
                                        <i class="fa fa-facebook mr-2"></i> Facebook
                                    </a>
                                    <a class="dropdown-item d-flex align-items-center" href="https://api.whatsapp.com/send?text=<?= urlencode(current_url()); ?>" target="_blank">
                                        <i class="fa fa-whatsapp mr-2"></i> WhatsApp
                                    </a>
                                </div>
                            </div>
                        </div>
                        <div class="donate-tab-div">
                            <ul class="nav nav-tabs" id="myTab">
                                <li class="nav-item"> <a href="#about_tab" class="nav-link active" data-bs-toggle="tab"><i class="fa fa-book"></i> About</a> </li>
                                <li class="nav-item"> <a href="#document_tab" class="nav-link" data-bs-toggle="tab"><i class="fa fa-file"></i> Document</a> </li>
                                <li class="nav-item"> <a href="#updates_tab" class="nav-link" data-bs-toggle="tab"><i class="fa fa-refresh"></i> Updates</a> </li>
                                <li class="nav-item"> <a href="#comment_tab" class="nav-link" data-bs-toggle="tab"><i class="fa fa-comment"></i> Comment's <sup class="comment-count"><?=$comment_count;?></sup></a> </li>
                            </ul>
                            <div class="tab-content">
                                <div class="tab-pane fade active show" id="about_tab">
                                    <?=$campaign->p_about;?>
                                </div>
                                <div class="tab-pane fade" id="document_tab">
                                    <?php
                                        $p_documents = json_decode($campaign->p_documents);
                                        if($p_documents==TRUE):
                                            foreach($p_documents as $p_document):
                                                echo '<img src="'.base_url().$campaign->p_documents_path.$p_document.'" class="document-image">';
                                            endforeach;
                                        else:
                                            echo '<p class="text-center">No Documents</p>';
                                        endif;
                                    ?>
                                </div>
                                <div class="tab-pane fade" id="updates_tab">
                                    <?=$campaign->p_updates;?>
                                </div>
                                <div class="tab-pane fade" id="comment_tab">
                                    <?php
                                    $this->load->view('website/donate-view-comments');
                                    ?>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="col-lg-4">
                    <div class="main-sidebar rmt-75">
                        <div class="widget widget_donate">
                            <h5 class="widget-title">Support This Cause</h5>
                            <a class="btn btn-primary" href="donate.html">Donate Now</a>
                            <div class="donate-widget-inner">
                                <div class="cause-price">
                                    <span>Raised : $87,689</span>
                                    <span>Goal : $100,000</span>
                                </div>
                                <div class="progress">
                                    <div class="progress-bar progress-bar-striped progress-bar-animated" style="width: 87%">
                                    </div>
                                </div>
                                <div class="cause-info">
                                    <span>Supporters: 1500</span>
                                    <span>Days Left: 30</span>
                                </div>
                            </div>
                        </div>
                        <div class="widget widget_donors">
                            <h5 class="widget-title">Top Donors</h5>
                            <ul>
                                <li>
                                    <div class="image">
                                        <img src="<?= base_url('assets/web/'); ?>img/donors/donor1.jpg" alt="Donor">
                                    </div>
                                    <div class="content">
                                        <h6>John Doe</h6>
                                        <span>$500</span>
                                    </div>
                                </li>
                                <li>
                                    <div class="image">
                                        <img src="<?= base_url('assets/web/'); ?>img/donors/donor2.jpg" alt="Donor">
                                    </div>
                                    <div class="content">
                                        <h6>Jane Smith</h6>
                                        <span>$300</span>
                                    </div>
                                </li>
                                <li>
                                    <div class="image">
                                        <img src="<?= base_url('assets/web/'); ?>img/donors/donor3.jpg" alt="Donor">
                                    </div>
                                    <div class="content">
                                        <h6>Michael Johnson</h6>
                                        <span>$250</span>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="widget widget_donors">
                            <h5 class="widget-title">Recent Donors</h5>
                            <ul>
                                <li>
                                    <div class="image">
                                        <img src="<?= base_url('assets/web/'); ?>img/donors/donor4.jpg" alt="Donor">
                                    </div>
                                    <div class="content">
                                        <h6>Emily Davis</h6>
                                        <span>$100</span>
                                    </div>
                                </li>
                                <li>
                                    <div class="image">
                                        <img src="<?= base_url('assets/web/'); ?>img/donors/donor5.jpg" alt="Donor">
                                    </div>
                                    <div class="content">
                                        <h6>Chris Brown</h6>
                                        <span>$75</span>
                                    </div>
                                </li>
                                <li>
                                    <div class="image">
                                        <img src="<?= base_url('assets/web/'); ?>img/donors/donor6.jpg" alt="Donor">
                                    </div>
                                    <div class="content">
                                        <h6>Sarah Wilson</h6>
                                        <span>$50</span>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="widget widget-recent-causes">
                            <h5 class="widget-title">Recent Causes</h5>
                            <ul>
                                <li>
                                    <div class="image">
                                        <img src="<?= base_url('assets/web/'); ?>img/widgets/cause1.jpg" alt="Cause">
                                    </div>
                                    <div class="content">
                                        <h6><a href="cause-details.html">Clothes For Everyone</a></h6>
                                        <div class="cause-price">
                                            <span><i class="flaticon-line-chart"></i> Raised : $23,785</span>
                                            <span><i class="flaticon-target"></i> Goal : $87,563</span>
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div class="image">
                                        <img src="<?= base_url('assets/web/'); ?>img/widgets/cause2.jpg" alt="Cause">
                                    </div>
                                    <div class="content">
                                        <h6><a href="cause-details.html">New Kindergarten</a></h6>
                                        <div class="cause-price">
                                            <span><i class="flaticon-line-chart"></i> Raised : $17,568</span>
                                            <span><i class="flaticon-target"></i> Goal : $20,898</span>
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div class="image">
                                        <img src="<?= base_url('assets/web/'); ?>img/widgets/cause3.jpg" alt="Cause">
                                    </div>
                                    <div class="content">
                                        <h6><a href="cause-details.html">Food for childen</a></h6>
                                        <div class="cause-price">
                                            <span><i class="flaticon-line-chart"></i> Raised : $30,635</span>
                                            <span><i class="flaticon-target"></i> Goal : $50,658</span>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <!-- <div class="widget widget_cta">
                            <div class="cta-widget-inner" style="background-image: url(<?= base_url('assets/web/'); ?>img/widgets/cta-bg.jpg);">
                                <h5>We have provided financial help to 5 million people</h5>
                                <a class="btn ml-5" href="donate.html">Donate Now</a>
                            </div>
                        </div> -->
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Cause Details area end -->
    <?php $this->load->view('web/inc/footer'); ?>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js"></script>
</body>
/* Prevent text selection */
body {
    user-select: none !important;
}

/* Disable context menu on images */
img {
    pointer-events: none;
}

/* Hide unnecessary error icons or overlays */
.error-icon, .browser-extension-icon {
    display: none !important;
}

/* Keep cursor pointer for links */
a {
    cursor: pointer !important;
}
