Tul xxx Tul

Viewing: admin_header.php

<?php
if (session_status() !== PHP_SESSION_ACTIVE) {
  session_start();
}

require_once __DIR__ . '/admin_roles.php';
ensureAdminRolesSchema($conn);

$adminRole = getRoleBySession($conn);
$_SESSION['admin_role'] = $adminRole;
$current_page = basename($_SERVER['PHP_SELF']);
enforceAdminPermissionForFile($current_page);

$roleLabels = getAvailableAdminRoles();
$currentRoleLabel = $roleLabels[$adminRole] ?? ucfirst($adminRole);

if (!isset($message) || !is_array($message)) {
  $message = [];
}

if (!empty($_SESSION['flash_messages']) && is_array($_SESSION['flash_messages'])) {
  foreach ($_SESSION['flash_messages'] as $flashMessage) {
    $message[] = $flashMessage;
  }
  unset($_SESSION['flash_messages']);
}

if (isset($message) && is_array($message)) {
  foreach ($message as $msg) {
    echo '
      <div class="message">
         <span>' . $msg . '</span>
         <i class="fas fa-times" onclick="this.parentElement.remove();"></i>
      </div>
      ';
  }
}

if (!isset($fetch_profile) || !$fetch_profile) {
  $select_profile = $conn->prepare("SELECT * FROM `admin` WHERE id = ?");
  $select_profile->execute([$admin_id]);
  $fetch_profile = $select_profile->fetch(PDO::FETCH_ASSOC);
}

if (!$fetch_profile) {
  $fetch_profile = ['name' => 'Administrador'];
}

$systemCurrency = getSystemCurrency($conn);
$businessName = getBusinessName($conn);
$businessLogo = getBusinessLogo($conn);
$businessLogoVersion = getBusinessLogoVersion($conn);
$businessLogoHref = '../' . ltrim($businessLogo, '/');
if ($businessLogoVersion !== '') {
  $businessLogoHref .= (strpos($businessLogoHref, '?') === false ? '?' : '&') . 'v=' . rawurlencode($businessLogoVersion);
}
$restaurantTheme = getRestaurantTheme($conn);
$themeColors = $restaurantTheme['colors'];
?>
<link rel="icon"
  href="../icon.php?size=64<?= $businessLogoVersion !== '' ? '&v=' . rawurlencode($businessLogoVersion) : ''; ?>"
  type="image/png">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

<style>
  :root {
    --sidebar-width: 240px;
    --topbar-height: 70px;
    --admin-color-primary: <?= htmlspecialchars($themeColors['admin_primary']); ?>;
    --admin-color-primary-dark: <?= htmlspecialchars($themeColors['admin_primary_dark']); ?>;
    --admin-color-secondary: <?= htmlspecialchars($themeColors['admin_secondary']); ?>;
    --admin-color-highlight: <?= htmlspecialchars($themeColors['admin_accent']); ?>;
    --admin-color-muted: rgba(255, 255, 255, 0.65);
    --admin-color-text: <?= htmlspecialchars($themeColors['admin_text']); ?>;
    --admin-color-bg: <?= htmlspecialchars($themeColors['admin_bg']); ?>;
    --admin-color-surface: <?= htmlspecialchars($themeColors['admin_surface']); ?>;
    --restaurant-admin-primary: var(--admin-color-primary);
    --restaurant-admin-primary-dark: var(--admin-color-primary-dark);
    --restaurant-admin-secondary: var(--admin-color-secondary);
    --restaurant-admin-accent: var(--admin-color-highlight);
    --restaurant-admin-bg: var(--admin-color-bg);
    --restaurant-admin-surface: var(--admin-color-surface);
    --restaurant-admin-text: var(--admin-color-text);
    --main-color: var(--admin-color-primary);
    --primary: var(--admin-color-primary);
    --primary-dark: var(--admin-color-primary-dark);
    --success: <?= htmlspecialchars($themeColors['success']); ?>;
    --warning: <?= htmlspecialchars($themeColors['warning']); ?>;
    --danger: <?= htmlspecialchars($themeColors['danger']); ?>;
    --info: <?= htmlspecialchars($themeColors['info']); ?>;
    --success-color: <?= htmlspecialchars($themeColors['success']); ?>;
    --pos-bg: var(--admin-color-bg);
    --pos-card-bg: var(--admin-color-surface);
    --pos-surface: var(--admin-color-surface);
    --pos-primary: var(--admin-color-primary);
    --pos-primary-dark: var(--admin-color-primary-dark);
    --pos-primary-hover: var(--admin-color-primary-dark);
    --pos-secondary: var(--admin-color-secondary);
    --pos-accent: var(--admin-color-highlight);
    --pos-success: <?= htmlspecialchars($themeColors['success']); ?>;
    --pos-danger: <?= htmlspecialchars($themeColors['danger']); ?>;
    --pos-warning: <?= htmlspecialchars($themeColors['warning']); ?>;
    --pos-text: var(--admin-color-text);
    --pos-text-muted: #64748b;
    --pos-border: rgba(15, 23, 42, 0.12);
  }

  body.admin-panel {
    font-family: 'Montserrat', Arial, sans-serif;
    margin: 0;
    padding-top: var(--topbar-height);
    padding-left: 0;
    transition: none;
    min-height: 100vh;
    position: relative;
    background: var(--admin-color-bg);
  }

  @media (min-width: 992px) {
    body.admin-panel {
      padding-left: var(--sidebar-width);
    }
  }

  body.admin-panel.sidebar-open {
    overflow: hidden;
  }

  .admin-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: var(--sidebar-width);
    height: 100vh;
    background: linear-gradient(185deg, var(--admin-color-primary) 0%, var(--admin-color-primary-dark) 70%, var(--admin-color-secondary) 100%);
    color: #fff;
    display: flex;
    flex-direction: column;
    padding: 1.5rem 1.1rem 1.8rem;
    box-shadow: 10px 0 26px color-mix(in srgb, var(--admin-color-primary) 18%, transparent);
    z-index: 1050;
    transition: transform 0.3s ease;
    overflow: hidden;
  }


  .admin-sidebar .sidebar-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 2.2rem;
    text-align: center;
  }

  .admin-sidebar .sidebar-brand img {
    width: 120px;
    height: 120px;
    border-radius: 28px;
    padding: 0;
    background: transparent;
    box-shadow: none;
    object-fit: contain;
    object-position: center;
  }

  .sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
    padding-right: 0.3rem;
  }

  /* Custom Webkit Scrollbar */
  .sidebar-nav::-webkit-scrollbar {
    width: 6px;
  }

  .sidebar-nav::-webkit-scrollbar-track {
    background: transparent;
  }

  .sidebar-nav::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 10px;
  }

  .sidebar-nav::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255, 255, 255, 0.5);
  }

  .nav-badge {
    background: #ef4444;
    color: white;
    font-size: 0.75rem;
    font-weight: 800;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    margin-left: auto;
    box-shadow: 0 2px 5px rgba(239, 68, 68, 0.4);
  }

  @keyframes pulseBadge {
    0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); }
    70% { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); }
    100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
  }

  .nav-badge.pulse {
    animation: pulseBadge 2s infinite;
  }

  .sidebar-link {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.85rem 1.15rem;
    border-radius: 12px;
    text-decoration: none;
    color: #fff;
    font-weight: 700;
    font-size: 1.3rem;
    letter-spacing: 0.3px;
    position: relative;
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  }

  .sidebar-link i {
    font-size: 1.45rem;
  }

  .sidebar-link:hover {
    background: rgba(255, 255, 255, 0.16);
    transform: translateX(6px);
    box-shadow: 0 10px 18px rgba(0, 0, 0, 0.22);
  }

  .sidebar-link.active {
    background: rgba(255, 255, 255, 0.22);
    box-shadow: 0 14px 26px rgba(0, 0, 0, 0.28);
  }

  .sidebar-link.active::before {
    content: '';
    position: absolute;
    left: -1.2rem;
    top: 12px;
    bottom: 12px;
    width: 4px;
    border-radius: 12px;
    background: var(--admin-color-highlight);
  }

  .sidebar-footer {
    display: none;
  }

  /* ── Submenús desplegables ── */
  .sidebar-submenu-group {
    display: flex;
    flex-direction: column;
  }

  .sidebar-submenu-toggle {
    border: none;
    background: transparent;
    cursor: pointer;
    width: 100%;
    text-align: left;
    justify-content: flex-start;
  }

  .sidebar-submenu-toggle .sidebar-chevron {
    margin-left: auto;
    font-size: 0.75rem;
    transition: transform 0.3s ease;
  }

  .sidebar-submenu-group.open>.sidebar-submenu-toggle .sidebar-chevron {
    transform: rotate(180deg);
  }

  .sidebar-submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
    padding-left: 0.6rem;
  }

  .sidebar-submenu-group.open>.sidebar-submenu {
    max-height: 500px;
  }

  .sidebar-sublink {
    font-size: 1.1rem !important;
    padding: 0.6rem 1rem !important;
    border-left: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 0 12px 12px 0 !important;
    margin-left: 0.4rem;
  }

  .sidebar-sublink i {
    font-size: 1.15rem !important;
  }

  .sidebar-sublink.active {
    border-left-color: var(--admin-color-highlight);
  }

  .admin-topbar {
    position: fixed;
    top: 0;
    left: 0;
    height: var(--topbar-height);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.68) 100%);
    backdrop-filter: saturate(175%) blur(12px);
    -webkit-backdrop-filter: saturate(175%) blur(12px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.5rem;
    z-index: 1040;
    transition: background 0.2s ease, box-shadow 0.2s ease, backdrop-filter 0.2s ease;
  }

  .admin-topbar::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--admin-color-primary) 0%, var(--admin-color-highlight) 100%);
    opacity: 0.85;
  }

  .admin-topbar.scrolled {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: saturate(180%) blur(10px);
    -webkit-backdrop-filter: saturate(180%) blur(10px);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.10);
  }

  @media (min-width: 992px) {
    .admin-topbar {
      left: var(--sidebar-width);
      width: calc(100% - var(--sidebar-width));
    }
  }

  .topbar-left {
    display: flex;
    align-items: center;
    gap: 1rem;
  }

  .sidebar-toggle {
    border: none;
    background: rgba(255, 255, 255, 0.7);
    color: var(--admin-color-primary);
    font-size: 1.5rem;
    cursor: pointer;
    border-radius: 12px;
    padding: 0.3rem 0.55rem;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    display: none;
  }

  .sidebar-toggle:hover {
    background: rgba(255, 255, 255, 0.9);
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.10);
  }

  .topbar-right {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    position: relative;
  }

  .topbar-avatar {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.45rem 0.9rem;
    border-radius: 999px;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.35));
    border: 1px solid rgba(255, 255, 255, 0.7);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06), inset 0 -2px 10px rgba(0, 0, 0, 0.03);
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
    position: relative;
    overflow: hidden;
  }

  .topbar-avatar::after {
    content: '';
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #1db954;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px rgba(179, 0, 0, 0.25);
  }

  .topbar-avatar::before {
    content: '';
    position: absolute;
    left: -30%;
    top: -120%;
    width: 60%;
    height: 300%;
    transform: rotate(25deg);
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0.0));
    transition: transform .4s ease, opacity .3s ease;
    opacity: 0;
  }

  .topbar-avatar:hover {
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
    transform: translateY(-1px);
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.65), rgba(255, 255, 255, 0.45));
    border-color: rgba(255, 255, 255, 0.85);
  }

  .topbar-avatar:hover::before {
    transform: rotate(25deg) translateX(160%);
    opacity: 1;
  }

  .topbar-avatar img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: contain;
    background: #fff;
    border: none;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(179, 0, 0, 0.55), 0 10px 20px rgba(179, 0, 0, 0.18);
  }

  .topbar-avatar span {
    font-weight: 700;
    color: var(--admin-color-text);
    background: linear-gradient(90deg, var(--admin-color-primary) 0%, #222 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .profile {
    position: absolute;
    top: calc(100% + 12px);
    right: 2rem;
    min-width: 240px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18);
    border: 1px solid rgba(0, 0, 0, 0.05);
    padding: 1.1rem 1.4rem;
    display: none;
    flex-direction: column;
    gap: 0.75rem;
    z-index: 1055;
  }

  .profile::before {
    content: '';
    position: absolute;
    top: -10px;
    right: 36px;
    width: 18px;
    height: 18px;
    transform: rotate(45deg);
    background: #fff;
    border-left: 1px solid rgba(0, 0, 0, 0.05);
    border-top: 1px solid rgba(0, 0, 0, 0.05);
  }

  .profile.active {
    display: flex;
    animation: fadeInProfile 0.25s ease;
  }

  .profile p {
    margin: 0;
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--admin-color-text);
    display: flex;
    align-items: center;
    gap: 0.6rem;
  }

  .profile .btn,
  .profile .delete-btn {
    display: block;
    width: 100%;
    text-align: center;
    padding: 0.6rem 0.85rem;
    border-radius: 12px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
  }

  .profile .btn {
    background: linear-gradient(115deg, var(--admin-color-primary) 0%, var(--admin-color-primary-dark) 100%);
    color: #fff !important;
    box-shadow: 0 10px 28px rgba(179, 0, 0, 0.22);
  }

  .profile .btn:hover {
    box-shadow: 0 14px 34px rgba(179, 0, 0, 0.28);
  }

  .profile .delete-btn {
    background: #fff5f5;
    color: var(--admin-color-primary) !important;
    border: 1px solid rgba(179, 0, 0, 0.2);
  }

  .profile .delete-btn:hover {
    background: var(--admin-color-primary);
    color: #fff !important;
    box-shadow: 0 12px 30px rgba(179, 0, 0, 0.25);
  }

  .sidebar-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1035;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
  }

  .sidebar-overlay.show {
    opacity: 1;
    visibility: visible;
  }

  @media (max-width: 991.98px) {
    .admin-sidebar {
      transform: translateX(-100%);
    }

    .admin-sidebar.show {
      transform: translateX(0);
    }

    .admin-topbar {
      left: 0;
      width: 100%;
      padding: 0 1.1rem;
    }

    .profile {
      right: 1rem;
    }

    .sidebar-toggle {
      display: inline-flex;
    }
  }

  @media (max-width: 575.98px) {
    .topbar-avatar span {
      display: none;
    }
  }

  @keyframes fadeInProfile {
    from {
      opacity: 0;
      transform: translateY(-6px);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
</style>

<script>
  window.SYSTEM_CURRENCY = <?= json_encode($systemCurrency, JSON_UNESCAPED_UNICODE | JSON_HEX_TAG | JSON_HEX_APOS | JSON_HEX_AMP | JSON_HEX_QUOT); ?>;
  window.formatMoneyJs = function (value) {
    const c = window.SYSTEM_CURRENCY || {};
    const fractionRaw = c.fraction_size ?? 0;
    const fraction = Math.max(0, Math.min(6, parseInt(fractionRaw, 10) || 0));
    const number = Number(value || 0);
    const formatted = number.toLocaleString('es-CO', { minimumFractionDigits: fraction, maximumFractionDigits: fraction });
    const template = (c.template || '$1');
    const symbol = (c.symbol || '$');
    const symbolPos = template.indexOf('$');
    const numberPos = template.indexOf('1');
    if (symbolPos === -1 || numberPos === -1) {
      return symbol + formatted;
    }
    if (symbolPos < numberPos) {
      const between = template.slice(symbolPos + 1, numberPos);
      const glue = /\s/.test(between) ? ' ' : '';
      return symbol + glue + formatted;
    }
    const between = template.slice(numberPos + 1, symbolPos);
    const glue = /\s/.test(between) ? ' ' : '';
    return formatted + glue + symbol;
  };

  // Real-time polling for pending delivery orders
  document.addEventListener("DOMContentLoaded", () => {
    const badge = document.getElementById('nav-badge-delivery');
    if(!badge) return;

    let lastCount = parseInt(badge.textContent || 0, 10);

    setInterval(async () => {
      try {
        const response = await fetch('api_get_pending_delivery.php');
        const data = await response.json();
        if(data && data.success) {
          const count = parseInt(data.count || 0, 10);
          if (count > 0) {
            badge.textContent = count;
            badge.style.display = 'inline-block';
            
            // Optional: If count increased, maybe flash it or do something
            if (count > lastCount) {
              badge.classList.remove('pulse');
              void badge.offsetWidth; // trigger reflow
              badge.classList.add('pulse');
            }
          } else {
            badge.style.display = 'none';
            badge.textContent = '';
          }
          
          lastCount = count;
        }
      } catch (error) {
        console.error("Error polling delivery orders", error);
      }
    }, 15000); // Check every 15 seconds
  });
</script>

<aside class="admin-sidebar" id="admin-sidebar" aria-label="Menú principal">
  <div class="sidebar-brand">
    <img src="<?= htmlspecialchars($businessLogoHref); ?>" alt="<?= htmlspecialchars($businessName); ?>">
  </div>
  <?php
  // Determinar si algún submenú debe estar abierto según la página actual
  $gestiones_pages = ['catalogs.php', 'menu_items.php', 'preparers.php', 'product_preparers.php', 'manage_rooms.php', 'delivery_zones.php', 'gallery.php'];
  $contactos_pages = ['customers.php', 'accounts_receivable.php', 'suppliers.php', 'accounts_payable.php'];
  $reportes_pages = ['profit_reports.php', 'reports.php'];
  $database_pages = ['database_backup.php', 'database_restore.php'];
  $gestiones_open = in_array($current_page, $gestiones_pages);
  $contactos_open = in_array($current_page, $contactos_pages);
  $reportes_open = in_array($current_page, $reportes_pages);
  $database_open = in_array($current_page, $database_pages);
  ?>
  <nav class="sidebar-nav">
    <?php /* 1) INICIO */ ?>
    <?php if (adminCanAccess($adminRole, 'dashboard')): ?>
      <a href="dashboard.php" class="sidebar-link <?= $current_page === 'dashboard.php' ? 'active' : ''; ?>">
        <i class="fas fa-chart-line"></i>
        <span>Inicio</span>
      </a>
    <?php endif; ?>

    <?php /* 2) CAJA */ ?>
    <?php if (adminCanAccess($adminRole, 'caja')): ?>
      <a href="caja.php" class="sidebar-link <?= $current_page === 'caja.php' ? 'active' : ''; ?>">
        <i class="fas fa-cash-register"></i>
        <span>Caja</span>
      </a>
    <?php endif; ?>

    <?php /* 3) COMANDA */ ?>
    <?php if (adminCanAccess($adminRole, 'dine_in_orders')): ?>
      <a href="dine_in_orders.php" class="sidebar-link <?= $current_page === 'dine_in_orders.php' ? 'active' : ''; ?>">
        <i class="fas fa-clipboard-list"></i>
        <span>Comanda</span>
      </a>
    <?php endif; ?>

    <?php /* 4) PEDIDOS A DOMICILIO */ ?>
    <?php if (adminCanAccess($adminRole, 'delivery_orders')): 
        $pendingDeliveryOrdersCount = 0;
        try {
            $qPending = $conn->query("SELECT COUNT(*) FROM `delivery_orders` WHERE status = 'pendiente' AND source = 'web'");
            $pendingDeliveryOrdersCount = (int)$qPending->fetchColumn();
        } catch(Throwable $e) {}
    ?>
      <a href="delivery_orders.php" class="sidebar-link <?= $current_page === 'delivery_orders.php' ? 'active' : ''; ?>">
        <i class="fas fa-motorcycle"></i>
        <span style="flex: 1;">Pedidos a Domicilio</span>
        <span id="nav-badge-delivery" class="nav-badge pulse" style="display: <?= $pendingDeliveryOrdersCount > 0 ? 'inline-block' : 'none'; ?>;">
          <?= $pendingDeliveryOrdersCount > 0 ? $pendingDeliveryOrdersCount : ''; ?>
        </span>
      </a>
    <?php endif; ?>

    <?php /* 5) GESTIONES (submenú) */ ?>
    <div class="sidebar-submenu-group <?= $gestiones_open ? 'open' : ''; ?>">
      <button type="button" class="sidebar-link sidebar-submenu-toggle"
        aria-expanded="<?= $gestiones_open ? 'true' : 'false'; ?>">
        <i class="fas fa-cogs"></i>
        <span>Gestiones</span>
        <i class="fas fa-chevron-down sidebar-chevron"></i>
      </button>
      <div class="sidebar-submenu">
        <?php if (adminCanAccess($adminRole, 'products')): ?>
          <?php if ($adminRole === 'owner'): ?>
            <a href="catalogs.php"
              class="sidebar-link sidebar-sublink <?= $current_page === 'catalogs.php' ? 'active' : ''; ?>">
              <i class="fas fa-layer-group"></i>
              <span>Catálogos</span>
            </a>
          <?php endif; ?>
          <a href="menu_items.php"
            class="sidebar-link sidebar-sublink <?= $current_page === 'menu_items.php' ? 'active' : ''; ?>">
            <i class="fas fa-utensils"></i>
            <span>Menú</span>
          </a>
        <?php endif; ?>
        <?php if (adminCanAccess($adminRole, 'preparers')): ?>
          <a href="preparers.php"
            class="sidebar-link sidebar-sublink <?= $current_page === 'preparers.php' ? 'active' : ''; ?>">
            <i class="fas fa-user-tie"></i>
            <span>Preparadores</span>
          </a>
        <?php endif; ?>
        <?php if (adminCanAccess($adminRole, 'product_preparers')): ?>
          <a href="product_preparers.php"
            class="sidebar-link sidebar-sublink <?= $current_page === 'product_preparers.php' ? 'active' : ''; ?>">
            <i class="fas fa-user-check"></i>
            <span>Asignar Preparadores</span>
          </a>
        <?php endif; ?>
        <?php if (adminCanAccess($adminRole, 'dine_in_orders')): ?>
          <a href="manage_rooms.php"
            class="sidebar-link sidebar-sublink <?= $current_page === 'manage_rooms.php' ? 'active' : ''; ?>">
            <i class="fas fa-chair"></i>
            <span>Salones y Mesas</span>
          </a>
        <?php endif; ?>
        <?php if (adminCanAccess($adminRole, 'delivery_zones')): ?>
          <a href="delivery_zones.php"
            class="sidebar-link sidebar-sublink <?= $current_page === 'delivery_zones.php' ? 'active' : ''; ?>">
            <i class="fas fa-location-dot"></i>
            <span>Zonas de Entrega</span>
          </a>
        <?php endif; ?>
        <?php if (adminCanAccess($adminRole, 'gallery')): ?>
          <a href="gallery.php"
            class="sidebar-link sidebar-sublink <?= $current_page === 'gallery.php' ? 'active' : ''; ?>">
            <i class="fas fa-images"></i>
            <span>Galería</span>
          </a>
        <?php endif; ?>
      </div>
    </div>

    <?php /* 6) CONTACTOS (submenú) */ ?>
    <div class="sidebar-submenu-group <?= $contactos_open ? 'open' : ''; ?>">
      <button type="button" class="sidebar-link sidebar-submenu-toggle"
        aria-expanded="<?= $contactos_open ? 'true' : 'false'; ?>">
        <i class="fas fa-address-book"></i>
        <span>Contactos</span>
        <i class="fas fa-chevron-down sidebar-chevron"></i>
      </button>
      <div class="sidebar-submenu">
        <?php if (adminCanAccess($adminRole, 'customers')): ?>
          <a href="customers.php"
            class="sidebar-link sidebar-sublink <?= in_array($current_page, ['customers.php', 'accounts_receivable.php']) ? 'active' : ''; ?>">
            <i class="fas fa-users"></i>
            <span>Clientes y Cuentas</span>
          </a>
        <?php endif; ?>
        <?php if (adminCanAccess($adminRole, 'suppliers')): ?>
          <a href="suppliers.php"
            class="sidebar-link sidebar-sublink <?= in_array($current_page, ['suppliers.php', 'accounts_payable.php']) ? 'active' : ''; ?>">
            <i class="fas fa-truck"></i>
            <span>Proveedores y Cuentas</span>
          </a>
        <?php endif; ?>
      </div>
    </div>

    <?php /* 7) INVENTARIOS */ ?>
    <?php if (adminCanAccess($adminRole, 'inventory')): ?>
      <a href="inventory.php" class="sidebar-link <?= $current_page === 'inventory.php' ? 'active' : ''; ?>">
        <i class="fas fa-boxes-stacked"></i>
        <span>Inventario</span>
      </a>
    <?php endif; ?>

    <?php /* 8) USUARIOS */ ?>
    <?php if (adminCanAccess($adminRole, 'admin_accounts')): ?>
      <a href="admin_accounts.php" class="sidebar-link <?= $current_page === 'admin_accounts.php' ? 'active' : ''; ?>">
        <i class="fas fa-user-gear"></i>
        <span>Usuarios</span>
      </a>
    <?php endif; ?>

    <?php /* 9) CONFIGURACIONES */ ?>
    <?php if (adminCanAccess($adminRole, 'settings')): ?>
      <a href="settings.php" class="sidebar-link <?= $current_page === 'settings.php' ? 'active' : ''; ?>">
        <i class="fas fa-gear"></i>
        <span>Configuración</span>
      </a>
    <?php endif; ?>

    <?php /* 10) REPORTES (submenú) */ ?>
    <div class="sidebar-submenu-group <?= $reportes_open ? 'open' : ''; ?>">
      <button type="button" class="sidebar-link sidebar-submenu-toggle"
        aria-expanded="<?= $reportes_open ? 'true' : 'false'; ?>">
        <i class="fas fa-chart-pie"></i>
        <span>Reportes</span>
        <i class="fas fa-chevron-down sidebar-chevron"></i>
      </button>
      <div class="sidebar-submenu">
        <?php if (adminCanAccess($adminRole, 'profit_reports')): ?>
          <a href="profit_reports.php"
            class="sidebar-link sidebar-sublink <?= $current_page === 'profit_reports.php' ? 'active' : ''; ?>">
            <i class="fas fa-sack-dollar"></i>
            <span>Reporte de Ganancias</span>
          </a>
        <?php endif; ?>
        <?php if (adminCanAccess($adminRole, 'reports')): ?>
          <a href="reports.php"
            class="sidebar-link sidebar-sublink <?= $current_page === 'reports.php' ? 'active' : ''; ?>">
            <i class="fas fa-chart-bar"></i>
            <span>Reportes</span>
          </a>
        <?php endif; ?>
      </div>
    </div>

    <?php /* 11) BASE DE DATOS (submenú) */ ?>
    <?php if (adminCanAccess($adminRole, 'database_management')): ?>
    <div class="sidebar-submenu-group <?= $database_open ? 'open' : ''; ?>">
      <button type="button" class="sidebar-link sidebar-submenu-toggle"
        aria-expanded="<?= $database_open ? 'true' : 'false'; ?>">
        <i class="fas fa-database"></i>
        <span>Base de Datos</span>
        <i class="fas fa-chevron-down sidebar-chevron"></i>
      </button>
      <div class="sidebar-submenu">
        <a href="database_backup.php"
          class="sidebar-link sidebar-sublink <?= $current_page === 'database_backup.php' ? 'active' : ''; ?>">
          <i class="fas fa-download"></i>
          <span>Respaldar</span>
        </a>
        <a href="database_restore.php"
          class="sidebar-link sidebar-sublink <?= $current_page === 'database_restore.php' ? 'active' : ''; ?>">
          <i class="fas fa-arrow-rotate-left"></i>
          <span>Restaurar</span>
        </a>
      </div>
    </div>
    <?php endif; ?>
  </nav>
  <div class="sidebar-footer">
    <a href="../index.php" target="_blank" rel="noopener">
      <i class="fas fa-external-link-alt"></i>
      <span>Ver Sitio</span>
    </a>
  </div>
</aside>

<div class="sidebar-overlay" id="sidebar-overlay" role="presentation"></div>

<header class="admin-topbar" id="admin-topbar">
  <div class="topbar-left">
    <button id="sidebar-toggle" class="sidebar-toggle" aria-label="Alternar menú">
      <i class="fas fa-bars"></i>
    </button>
  </div>
  <div class="topbar-right">
    <div class="topbar-avatar" id="user-btn" role="button" aria-haspopup="true" aria-expanded="false">
      <img src="<?= htmlspecialchars($businessLogoHref); ?>" alt="<?= htmlspecialchars($businessName); ?>">
      <span><?= htmlspecialchars($fetch_profile['name'] ?? 'Administrador'); ?> ·
        <?= htmlspecialchars($currentRoleLabel); ?></span>
      <i class="fas fa-chevron-down"></i>
    </div>
    <div class="profile" id="profile-box" role="menu">
      <p><i class="fas fa-user-circle"></i> <?= htmlspecialchars($fetch_profile['name'] ?? 'Administrador'); ?></p>
      <p><i class="fas fa-user-shield"></i> <?= htmlspecialchars($currentRoleLabel); ?></p>
      <?php $profileHref = adminCanAccess($adminRole, 'admin_accounts') ? 'admin_accounts.php?edit_me=1' : 'update_profile.php'; ?>
      <a href="<?= htmlspecialchars($profileHref); ?>" class="btn" role="menuitem"><i class="fas fa-user-edit"></i>
        Actualizar Perfil</a>
      <a href="../components/admin_logout.php" class="delete-btn" role="menuitem"><i class="fas fa-sign-out-alt"></i>
        Cerrar Sesión</a>
    </div>
  </div>
</header>

<script>
  document.body.classList.add('admin-panel');

  const sidebar = document.getElementById('admin-sidebar');
  const sidebarToggle = document.getElementById('sidebar-toggle');
  const sidebarOverlay = document.getElementById('sidebar-overlay');
  const userBtn = document.getElementById('user-btn');
  const profileBox = document.getElementById('profile-box');
  const topbar = document.getElementById('admin-topbar');

  function closeSidebar() {
    if (!sidebar) return;
    sidebar.classList.remove('show');
    sidebarOverlay?.classList.remove('show');
    document.body.classList.remove('sidebar-open');
  }

  sidebarToggle?.addEventListener('click', () => {
    const opening = sidebar?.classList.toggle('show');
    sidebarOverlay?.classList.toggle('show', !!opening);
    document.body.classList.toggle('sidebar-open', !!opening);
  });

  sidebarOverlay?.addEventListener('click', closeSidebar);

  userBtn?.addEventListener('click', (event) => {
    event.stopPropagation();
    const expanded = profileBox?.classList.toggle('active');
    userBtn.setAttribute('aria-expanded', expanded ? 'true' : 'false');
  });

  document.addEventListener('click', (event) => {
    if (profileBox && !profileBox.contains(event.target) && !userBtn?.contains(event.target)) {
      profileBox.classList.remove('active');
      userBtn?.setAttribute('aria-expanded', 'false');
    }

    if (window.innerWidth < 992 && sidebar && !sidebar.contains(event.target) && !sidebarToggle?.contains(event.target)) {
      closeSidebar();
    }
  });

  window.addEventListener('resize', () => {
    if (window.innerWidth >= 992) {
      sidebar?.classList.remove('show');
      sidebarOverlay?.classList.remove('show');
      document.body.classList.remove('sidebar-open');
    }
    if (profileBox) {
      profileBox.classList.remove('active');
      userBtn?.setAttribute('aria-expanded', 'false');
    }
  });

  function updateTopbarScrolled() {
    if (!topbar) return;
    if (window.scrollY > 6) {
      topbar.classList.add('scrolled');
    } else {
      topbar.classList.remove('scrolled');
    }
  }

  updateTopbarScrolled();
  window.addEventListener('scroll', updateTopbarScrolled);

  // ── Submenús desplegables ──
  document.querySelectorAll('.sidebar-submenu-toggle').forEach(btn => {
    btn.addEventListener('click', () => {
      const group = btn.closest('.sidebar-submenu-group');
      if (!group) return;
      const isOpen = group.classList.toggle('open');
      btn.setAttribute('aria-expanded', isOpen ? 'true' : 'false');
    });
  });
</script>
User / IP	: 216.73.216.227
Host / Server	: 45.84.207.204 / aircan.me
System	: Linux lt-bnk-web1726.main-hosting.eu 5.14.0-611.36.1.el9_7.x86_64 #1 SMP PREEMPT_DYNAMIC Tue Mar 3 11:23:52 EST 2026 x86_64