<?php
$this->load->model('category_model');

$categories = $this->category_model->get_categories(null, 8);
$language = get_languages();
$cookie_lang = $this->input->cookie('language', TRUE);


/*

if(strpos($_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI'], '/member-contacts') !== false){
    // Do nothing
}
else if(strpos($_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI'], '/blogs') !== false){
    // Do nothing
}
else if(strpos($_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI'], '/login') !== true){
    header("Location: " . base_url('/admin/login'));
}
*/


//header("Location: https://comfortme.com.hk/home/lang/tc");
$logo = get_settings('logo');
$web_settings = get_settings('web_settings', true);
$auth_settings = get_settings('authentication_settings', true);
$point = (isset($this->data['user']->id)) ? get_member_point($this->data['user']->id) : 0;
?>

<!-- Loading Leading Overlay -->
<!--
<div id="loading-modal-overlay" class="loading-modal-overlay">
    <div class="loading-modal-content">
        <img src="<?= get_image_url($logo, 'thumb', 'sm'); ?>" alt="Loading Logo" class="loading-modal-logo" />
    </div>
</div>
-->

<div class="top_panel_fixed_wrap"></div>
<!-- Overlay -->
<div class="new-header-menu-overlay" id="new-header-menu-overlay"></div>
<header class="new-header-top_panel_wrap new-header-top_panel_style_6 new-header-scheme_original" style="border-bottom: 1px solid #ddd;">
  <div class="new-header-top_panel_wrap_inner new-header-top_panel_inner_style_6 new-header-top_panel_position_above">
    <div class="new-header-top_panel_middle">
      <div class="new-header-content_wrap">

        <div class="new-header-contact_logo">
          <div class="new-header-logo">
            <a href="<?=base_url()?>">
              <img src="<?= get_image_url($logo, 'thumb', 'sm'); ?>" alt="Logo" />
              <span class="new-header-logo_name">香港長沙聯誼會</span>
            </a>
          </div>
        </div>

        <!-- Mobile controls: hamburger & login -->
        <div class="new-header-mobile_controls" style="gap:10px;">
          <button aria-label="Toggle menu" class="new-header-hamburger" id="new-header-hamburger" type="button" aria-expanded="false" aria-controls="new-header-nav">
            <span></span>
            <span></span>
            <span></span>
          </button>
          <div class="new-header-contact_button_mobile">
            <a href="<?=base_url('login')?>" class="new-header-first_button" style="
              color: black; 
              text-decoration: none; 
              padding: 8px 15px; 
              border: 1.5px solid black; 
              border-radius: 4px; 
              font-weight: 600;
              white-space: nowrap;
              user-select: none;
              transition: background-color 0.3s ease;
            ">登入</a>
          </div>
        </div>

        <!-- Desktop login button -->
        

        <div class="new-header-menu_main_wrap">
          <nav class="new-header-menu_main_nav_area new-header-menu_hover_fade" id="new-header-nav" aria-label="Primary">
            <ul id="new-header-menu_main" class="new-header-menu_main_nav" role="menubar">
              <li class="new-header-menu-item" role="none">
                <a href="<?=base_url()?>" role="menuitem" tabindex="0" class="new-header-menu-link">主頁</a>
              </li>
              <li class="new-header-menu-item" role="none">
                <a href="<?=base_url('home/about_us')?>" role="menuitem" tabindex="0" class="new-header-menu-link">關於我們</a>
              </li>
              <li class="new-header-menu-item" role="none">
                <a href="<?=base_url('home/about_structure')?>" role="menuitem" tabindex="0" class="new-header-menu-link">組織架構</a>
              </li>
              <li class="new-header-menu-item" role="none">
                <a href="<?=base_url('blogs')?>" role="menuitem" tabindex="0" class="new-header-menu-link">文章</a>
              </li>
              <li class="new-header-menu-item" role="none">
                <a href="<?=base_url('home/contact-us')?>" role="menuitem" tabindex="0" class="new-header-menu-link">聯絡我們</a>
              </li>
            </ul>
          </nav>
        </div>
        <div class="new-header-contact_button" style="margin-left: 20px; white-space: nowrap;">
          <a href="<?=base_url('login')?>" class="new-header-first_button">登入</a> 
        </div>

      </div>
    </div>
  </div>
</header>
<script>
  (function(){
    const hamburger = document.getElementById('new-header-hamburger');
    const nav = document.getElementById('new-header-nav');
    const overlay = document.getElementById('new-header-menu-overlay');

    function closeMenu() {
      hamburger.setAttribute('aria-expanded', 'false');
      nav.classList.remove('new-header-active');
      overlay.classList.remove('new-header-active');
    }

    hamburger.addEventListener('click', () => {
      const expanded = hamburger.getAttribute('aria-expanded') === 'true';
      if(expanded) {
        closeMenu();
      } else {
        hamburger.setAttribute('aria-expanded', 'true');
        nav.classList.add('new-header-active');
        overlay.classList.add('new-header-active');
      }
    });

    // Auto close mobile menu on menu link click
    document.querySelectorAll('#new-header-nav a').forEach(link => {
      link.addEventListener('click', () => {
        if(window.innerWidth <= 768){
          closeMenu();
        }
      });
    });

    // Close menu if clicking outside menu (on overlay)
    overlay.addEventListener('click', closeMenu);

    // Optional: close menu on ESC key
    document.addEventListener('keydown', e => {
      if(e.key === 'Escape') {
        if(nav.classList.contains('new-header-active')) {
          closeMenu();
        }
      }
    });

  })();
</script>

The above code is the header in my webpage, 
suppose there is menu icon that for mobile user to open the mobile menu, but I found that there nothing happen in mobile menu.