<style>
    @media (max-width: 600px) {   
        .menu-sidebar {
            background: url("<?php echo base_url();?>files/assets/images/thumb/log-reg-bg-mobile.png");
            background-position: center;
            background-size: cover;
            background-attachment: fixed;
            background-repeat: no-repeat;
        }
    }
    
    .menu-icon-text .active {
        background: #BEDD5C !important;
        color: #fff !important;
    }
    .menu {
        backdrop-filter: blur(3px);
    }
</style>


    <div class="main-wrapper d-flex flex-wrap" style="z-index: 10000;">
        <img src="<?php echo base_url();?>files/assets/images/icon/toggler2.svg" alt="toggler" class="sidebar-toggler-icon d-none d-lg-block" style="cursor: pointer;">
        
        <div class="menu-sidebar  menu-icon-text-show" style="background: url(<?=base_url()?>/files/assets/images/thumb/log-reg-bg-mobile.png); background-size: cover; background-position: center;">
            <div class="logo menu-icon-text"><img style="width: 100px; max-width: 100px !important; margin-right: 10px" src="<?php echo base_url();?>files/assets/images/thumb/log-reg-logo.png" alt="logo"></div>
            <div class="logo menu-icon px-3"><img style="width: 60px;" src="<?php echo base_url();?>files/assets/images/thumb/log-reg-logo.png" alt="logo"></div>

            <ul class="menu font-nunito">
                <li>
                    <a style="color: white !important;" class="menu-icon-text <?=($this->uri->segment(1) == 'sgallery') ? 'active' : ''?>" href="<?=base_url('sgallery')?>"><img src="<?php echo base_url();?>files/assets/images/icon/logo-sidebar.png" alt="icon"> Album</a>
                    <a style="color: white !important;" class="menu-icon <?=($this->uri->segment(1) == 'sgallery') ? 'active' : ''?>" href="<?=base_url('sgallery')?>"><img src="<?php echo base_url();?>files/assets/images/icon/logo-sidebar.png" alt="icon"></a>
                </li>

                <!--  <li>
                    <a class="menu-icon-text <?=($this->uri->segment(1) == 'clixar') ? 'active' : ''?>" href="<?=base_url('clixar')?>"><img src="<?php echo base_url();?>files/assets/images/icon/clixar.png" alt="icon"> Clix AR</a>
                    <a class="menu-icon <?=($this->uri->segment(1) == 'clixar') ? 'active' : ''?>" href="<?=base_url('clixar')?>"><img src="<?php echo base_url();?>files/assets/images/icon/clixar.png" alt="icon"></a>
                </li> -->



                <li>
                    <a style="color: white !important;" class="menu-icon-text <?=($this->uri->segment(1) == 'account') ? 'active' : ''?>" href="<?=base_url('account')?>"><img src="<?php echo base_url();?>files/assets/images/icon/logo-sidebar.png" alt="icon"> Profile</a>
                    <a style="color: white !important;" class="menu-icon <?=($this->uri->segment(1) == 'account') ? 'active' : ''?>" href="<?=base_url('account')?>"><img src="<?php echo base_url();?>files/assets/images/icon/logo-sidebar.png" alt="icon"></a>
                </li>
             <!--    <li>
                    <a class="menu-icon-text <?=($this->uri->segment(1) == 'purchase') ? 'active' : ''?>" href="<?=base_url('purchase')?>"><img src="<?php echo base_url();?>files/assets/images/icon/package.png" alt="icon"> Package</a>
                    <a class="menu-icon <?=($this->uri->segment(1) == 'purchase') ? 'active' : ''?>" href="<?=base_url('purchase')?>"><img src="<?php echo base_url();?>files/assets/images/icon/package.png" alt="icon"></a>
                </li> -->
                <li>
                    <a style="color: white !important;" class="menu-icon-text <?=($this->uri->segment(1) == 'myqr') ? 'active' : ''?>" href="<?=base_url('myqr')?>"><img src="<?php echo base_url();?>files/assets/images/icon/logo-sidebar.png" alt="icon"> My QR</a>
                    <a style="color: white !important;" class="menu-icon <?=($this->uri->segment(1) == 'myqr') ? 'active' : ''?>" href="<?=base_url('myqr')?>"><img src="<?php echo base_url();?>files/assets/images/icon/logo-sidebar.png" alt="icon"></a>
                </li>

                <!-- <li>
                    <a class="menu-icon-text <?=($this->uri->segment(1) == 'clixar') ? 'active' : ''?>" href="<?=base_url('clixar')?>"><img src="<?php echo base_url();?>files/assets/images/icon/clixar.png" alt="icon"> Clixar</a>
                    <a class="menu-icon <?=($this->uri->segment(1) == 'myqr') ? 'active' : ''?>" href="<?=base_url('clixar')?>"><img src="<?php echo base_url();?>files/assets/images/icon/clixar.png" alt="icon"></a>
                </li> -->

                <li>
                    <a style="color: white !important;" class="logout-btn menu-icon-text" href="javascript:void(0)" data-bs-target="#confirmModal" data-bs-toggle="modal"><img src="<?php echo base_url();?>files/assets/images/icon/logo-sidebar.png" alt="icon"> Logout</a>
                    <a style="color: white !important;" class="logout-btn menu-icon" href="javascript:void(0)" data-bs-target="#confirmModal" data-bs-toggle="modal"><img src="<?php echo base_url();?>files/assets/images/icon/logo-sidebar.png" alt="icon"></a>
                </li>
            </ul>

            <div class="mt-auto">
                <!-- <img src="<?php echo base_url();?>files/assets/images/shape/menu-bottom-shape.svg" alt="shape" class="menu-bottom-shape w-auto h-auto object-point-none"> -->
            </div>
        </div>


        <!-- Modal -->
        <div class="modal fade" id="confirmModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content bg-transparent border-0">
                    <div class="modal-body p-0">
                        <!-- Logout Success -->
                        <div class="popup-wrapper logout-modal">
                            <div class="text-center">
                                <img src="<?php echo base_url();?>files/assets/images/icon/alert.png" alt="thumb" style="width: 150px;">
                                <h4 class="mb-4 mt-4">Are You Sure?</h4>
                            </div>
                            <a href="<?=base_url('logout')?>" class="cmn--btn d-block text-center mt-3 mt-sm-4 " style="">Confirm</a>

                            <a href="javascript:void(0)" data-bs-dismiss="modal" class="cmn--btn d-block text-center mt-3 active modal-cancel">Cancel</a>
                        </div>
                        <!-- Logout Success -->

                    </div>
                </div>
            </div>
        </div>

      
    
