<?php
// header.php
if (session_status() === PHP_SESSION_NONE) {
    session_start();
}

// Variables que puede definir cada página ANTES de incluir header.php:
// $currentPage   = 'index' | 'login' | 'registro' | 'producto' | 'carrito' | 'pago';
// $searchEnabled = true/false  (para activar/desactivar el buscador header)

// Estado de login
$isLogged = isset($_SESSION['id_cliente']);
$nombreCliente = null;
if ($isLogged) {
    $nombreCliente = $_SESSION['nombre_cliente']
        ?? $_SESSION['usuario_cliente']
        ?? 'Cliente';
}

// Defaults
$currentPage   = $currentPage   ?? '';
$searchEnabled = $searchEnabled ?? ($currentPage === 'index');
?>
<header>
  <!-- FRANJA ROJA -->
  <div class="topbar">
    <div class="top-left">
      <span>📞 (809) 533-9616</span>
      <span>✉️ info@supermercadodragondeoro.com</span>
    </div>
    <div class="top-search">
      <div class="search-wrap">
        <input
          type="search"
          id="q"
          placeholder="Buscar"
          aria-label="Buscar productos"
          <?php if (!$searchEnabled): ?>
            disabled style="opacity:.3;cursor:not-allowed"
          <?php endif; ?>
        >
        <button type="button" id="btnBuscar" class="search-btn" <?php if (!$searchEnabled): ?>disabled style="opacity:.2;cursor:not-allowed"<?php endif; ?>>
          <img src="images/lupa.png" alt="Buscar">
        </button>
      </div>
    </div>
    <div class="top-right">
      <a href="#" aria-label="Facebook">f</a>
      <a href="#" aria-label="Instagram">◎</a>
    </div>
  </div>

  <!-- BARRA BLANCA -->
  <div class="nav-white">
    <div class="logo-wrap">
      <a href="index.php">
        <img src="images/logo_dragon1.png" alt="Supermercado Dragón de Oro">
      </a>
    </div>
    <nav class="main-menu">
      <a href="index.php" class="<?= $currentPage === 'index' ? 'activo' : '' ?>">Inicio</a>
      <a href="#" class="<?= $currentPage === 'nosotros' ? 'activo' : '' ?>">Nosotros</a>
      <a href="#" class="<?= $currentPage === 'ofertas' ? 'activo' : '' ?>">Ofertas</a>
      <a href="#" class="<?= $currentPage === 'contactos' ? 'activo' : '' ?>">Contactos</a>

      <?php if (!$isLogged): ?>
        <!-- Mi Cuenta (no logueado) -->
        <div class="cuenta-wrap">
          <button class="btn-cuenta" id="btnCuenta" aria-haspopup="true" aria-expanded="false">
            Mi Cuenta ▾
          </button>
          <div class="dropdown" id="menuCuenta">
            <a href="login.php">Ingresar</a>
            <div class="divider"></div>
            <a href="registro.php">Registrarme</a>
          </div>
        </div>
      <?php else: ?>
        <!-- Mi Cuenta (logueado) -->
        <div class="cuenta-wrap">
          <button class="btn-cuenta" id="btnCuenta" aria-haspopup="true" aria-expanded="false">
            <?= htmlspecialchars('Hola, ' . $nombreCliente) ?> ▾
          </button>
          <div class="dropdown" id="menuCuenta">
            <a href="logout.php">Cerrar sesión</a>
          </div>
        </div>
      <?php endif; ?>

      <!-- CARRITO MINI -->
      <div class="cart-mini-wrap" onclick="window.location.href='carrito.php'">
        <img src="images/carrito_compra4.png" alt="Carrito de compras">
        <div>
          <div class="cart-mini-label">Carrito</div>
          <div class="cart-mini-count" id="cartMiniCount">0</div>
          <div class="cart-mini-total" id="cartMiniTotal">RD$ 0.00</div>
        </div>
      </div>
    </nav>
  </div>
</header>

<script>
  // Claves de carrito unificadas
  const CART_ITEMS_KEY = 'cart_items_super';
  const CART_COUNT_KEY = 'cart_count_super';
  const CART_TOTAL_KEY = 'cart_total_super';

  // Sincroniza mini carrito en el header
  (function syncMiniCart(){
    const count = parseInt(localStorage.getItem(CART_COUNT_KEY) || '0', 10);
    const total = parseFloat(localStorage.getItem(CART_TOTAL_KEY) || '0') || 0;

    const cartMiniCountEl = document.getElementById('cartMiniCount');
    const cartMiniTotalEl = document.getElementById('cartMiniTotal');
    if (cartMiniCountEl) cartMiniCountEl.textContent = count;
    if (cartMiniTotalEl) {
      cartMiniTotalEl.textContent = 'RD$ ' + total.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,');
    }
  })();

  // Toggle menú "Mi Cuenta"
  (function(){
    const btnCuenta = document.getElementById('btnCuenta');
    const menuCuenta = document.getElementById('menuCuenta');
    if (!btnCuenta || !menuCuenta) return;

    btnCuenta.addEventListener('click', () => {
      const show = menuCuenta.style.display !== 'block';
      menuCuenta.style.display = show ? 'block' : 'none';
      btnCuenta.setAttribute('aria-expanded', show ? 'true' : 'false');
    });

    document.addEventListener('click', e => {
      if (!menuCuenta.contains(e.target) && !btnCuenta.contains(e.target)) {
        menuCuenta.style.display = 'none';
        btnCuenta.setAttribute('aria-expanded', 'false');
      }
    });
  })();

  // Acción lupa (solo cuando el buscador está habilitado)
  (function(){
    const inputQ = document.getElementById('q');
    const btnBuscar = document.getElementById('btnBuscar');
    if (!inputQ || !btnBuscar || inputQ.disabled) return;

    // Enter
    inputQ.addEventListener('keydown', e => {
      if (typeof cargarProductos === 'function' && e.key === 'Enter') {
        e.preventDefault();
        cargarProductos();
      }
    });

    // Click en lupa
    btnBuscar.addEventListener('click', () => {
      if (typeof cargarProductos === 'function') {
        cargarProductos();
      }
      inputQ.focus();
    });
  })();
</script>
