{% if navigation_render_location_v2|default('page') == 'global-host' or not global_role_navigation_host_v2|default(false) %}
{#
  UI/UX V2 Phase 1F — System Admin workspace navigation.
  Presentation only. Existing routes and route-level permissions remain authoritative.
#}
{% set _system_admin_path = request.url.path %}
{% set navigation_aria_label_v2 = 'System administration navigation' %}
{% set navigation_items_v2 = [
  {
    'label': 'Dashboard',
    'visible': true,
    'active': _system_admin_path.startswith('/system-admin/dashboard'),
    'children': [
      {'label': 'Overview', 'url': '/system-admin/dashboard?tab=overview', 'active': _system_admin_path.startswith('/system-admin/dashboard') and (request.query_params.get('tab', 'overview') == 'overview')},
      {'label': 'Firms', 'url': '/system-admin/dashboard?tab=firms', 'active': _system_admin_path.startswith('/system-admin/dashboard') and request.query_params.get('tab') == 'firms'},
      {'label': 'Setup Health', 'url': '/system-admin/dashboard?tab=firm-setup-health', 'active': _system_admin_path.startswith('/system-admin/dashboard') and request.query_params.get('tab') == 'firm-setup-health'},
      {'label': 'Service Catalogue', 'url': '/system-admin/dashboard?tab=catalogue', 'active': _system_admin_path.startswith('/system-admin/dashboard') and request.query_params.get('tab') == 'catalogue'},
      {'label': 'Platform SMTP', 'url': '/system-admin/dashboard?tab=smtp', 'active': _system_admin_path.startswith('/system-admin/dashboard') and request.query_params.get('tab') == 'smtp'},
      {'label': 'Storage', 'url': '/system-admin/dashboard?tab=storage', 'active': _system_admin_path.startswith('/system-admin/dashboard') and request.query_params.get('tab') == 'storage'},
      {'label': 'Billing Readiness', 'url': '/system-admin/dashboard?tab=billing', 'active': _system_admin_path.startswith('/system-admin/dashboard') and request.query_params.get('tab') == 'billing'},
      {'label': 'Reports', 'url': '/system-admin/dashboard?tab=reports', 'active': _system_admin_path.startswith('/system-admin/dashboard') and request.query_params.get('tab') == 'reports'},
      {'label': 'Wizards', 'url': '/system-admin/dashboard?tab=wizards', 'active': _system_admin_path.startswith('/system-admin/dashboard') and request.query_params.get('tab') == 'wizards'},
      {'label': 'Audit Logs', 'url': '/system-admin/dashboard?tab=audit-logs', 'active': _system_admin_path.startswith('/system-admin/dashboard') and request.query_params.get('tab') == 'audit-logs'}
    ]
  },
  {
    'label': 'Firms',
    'visible': true,
    'active': _system_admin_path.startswith('/system-settings/tenants') or _system_admin_path.startswith('/system-settings/branches') or _system_admin_path.startswith('/wizards/system/firm'),
    'children': [
      {'label': 'Audit Firms', 'url': '/system-settings/tenants', 'active': _system_admin_path.startswith('/system-settings/tenants')},
      {'label': 'Branches', 'url': '/system-settings/branches', 'active': _system_admin_path.startswith('/system-settings/branches')},
      {'label': 'Create Firm Wizard', 'url': '/wizards/system/firm/new', 'active': _system_admin_path.startswith('/wizards/system/firm')}
    ]
  },
  {
    'label': 'Catalogue',
    'visible': true,
    'active': _system_admin_path.startswith('/services/catalogue') or _system_admin_path.startswith('/services/categories') or _system_admin_path.startswith('/services/defaults') or _system_admin_path.startswith('/services/templates') or _system_admin_path.startswith('/services/bulk-imports'),
    'children': [
      {'label': 'Service Catalogue', 'url': '/services/catalogue', 'active': _system_admin_path == '/services/catalogue'},
      {'label': 'Create Catalogue Service', 'url': '/services/catalogue/new', 'active': _system_admin_path.startswith('/services/catalogue/new')},
      {'label': 'Service Categories', 'url': '/services/categories', 'active': _system_admin_path.startswith('/services/categories')},
      {'label': 'System Default Tasks', 'url': '/services/defaults', 'active': _system_admin_path.startswith('/services/defaults')},
      {'label': 'Task Templates', 'url': '/services/templates', 'active': _system_admin_path.startswith('/services/templates')},
      {'label': 'Bulk Imports', 'url': '/services/bulk-imports', 'active': _system_admin_path.startswith('/services/bulk-imports')}
    ]
  },
  {
    'label': 'Platform',
    'visible': true,
    'active': _system_admin_path.startswith('/domains') or _system_admin_path.startswith('/email/platform-smtp') or _system_admin_path.startswith('/platform-billing') or _system_admin_path.startswith('/marketplace'),
    'children': [
      {'label': 'Domain Mappings', 'url': '/domains', 'active': _system_admin_path == '/domains'},
      {'label': 'Tenant Subdomains', 'url': '/domains/tenant-subdomains', 'active': _system_admin_path.startswith('/domains/tenant-subdomains')},
      {'label': 'Firm Domains', 'url': '/domains/firm-domain', 'active': _system_admin_path.startswith('/domains/firm-domain')},
      {'label': 'Consultant Domains', 'url': '/domains/consultant-domains', 'active': _system_admin_path.startswith('/domains/consultant-domains')},
      {'label': 'DNS Verification', 'url': '/domains/verification', 'active': _system_admin_path.startswith('/domains/verification')},
      {'label': 'SSL Status', 'url': '/domains/ssl', 'active': _system_admin_path.startswith('/domains/ssl')},
      {'label': 'Platform SMTP', 'url': '/email/platform-smtp', 'active': _system_admin_path.startswith('/email/platform-smtp')},
      {'label': 'Platform Billing', 'url': '/platform-billing', 'active': _system_admin_path.startswith('/platform-billing')},
      {'label': 'Marketplace', 'url': '/marketplace', 'active': _system_admin_path.startswith('/marketplace')}
    ]
  },
  {
    'label': 'Operations',
    'visible': true,
    'active': _system_admin_path.startswith('/documents/storage-nodes') or _system_admin_path.startswith('/documents/branch-storage-dashboard') or _system_admin_path.startswith('/documents/storage-jobs') or _system_admin_path.startswith('/documents/download-requests'),
    'children': [
      {'label': 'Storage Nodes', 'url': '/documents/storage-nodes', 'active': _system_admin_path.startswith('/documents/storage-nodes')},
      {'label': 'Branch Storage Dashboard', 'url': '/documents/branch-storage-dashboard', 'active': _system_admin_path.startswith('/documents/branch-storage-dashboard')},
      {'label': 'Storage Jobs', 'url': '/documents/storage-jobs', 'active': _system_admin_path.startswith('/documents/storage-jobs')},
      {'label': 'Download Requests', 'url': '/documents/download-requests', 'active': _system_admin_path.startswith('/documents/download-requests')}
    ]
  },
  {
    'label': 'Firm Operations',
    'visible': true,
    'active': _system_admin_path.startswith('/clients') or _system_admin_path.startswith('/services') or _system_admin_path.startswith('/employees') or _system_admin_path.startswith('/consultants') or _system_admin_path.startswith('/documents') or _system_admin_path.startswith('/billing') or _system_admin_path.startswith('/notice-cases'),
    'children': [
      {'label': 'Clients', 'url': '/clients', 'active': _system_admin_path.startswith('/clients')},
      {'label': 'Firm Services', 'url': '/services', 'active': _system_admin_path == '/services'},
      {'label': 'Engagements', 'url': '/services/engagements', 'active': _system_admin_path.startswith('/services/engagements')},
      {'label': 'Employees', 'url': '/employees', 'active': _system_admin_path.startswith('/employees')},
      {'label': 'Consultants', 'url': '/consultants', 'active': _system_admin_path.startswith('/consultants')},
      {'label': 'Documents', 'url': '/documents', 'active': _system_admin_path == '/documents'},
      {'label': 'Billing', 'url': '/billing', 'active': _system_admin_path.startswith('/billing')},
      {'label': 'Notice & Cases', 'url': '/notice-cases', 'active': _system_admin_path.startswith('/notice-cases')}
    ]
  },
  {
    'label': 'Administration',
    'visible': true,
    'active': _system_admin_path.startswith('/system-settings') or _system_admin_path.startswith('/email/settings'),
    'children': [
      {'label': 'Settings Dashboard', 'url': '/system-settings', 'active': _system_admin_path == '/system-settings'},
      {'label': 'Users', 'url': '/system-settings/users', 'active': _system_admin_path.startswith('/system-settings/users')},
      {'label': 'Roles & Permissions', 'url': '/system-settings/rbac/roles', 'active': _system_admin_path.startswith('/system-settings/rbac')},
      {'label': 'Financial Years', 'url': '/system-settings/financial-years', 'active': _system_admin_path.startswith('/system-settings/financial-years')},
      {'label': 'Branding', 'url': '/system-settings/branding', 'active': _system_admin_path.startswith('/system-settings/branding')},
      {'label': 'Firm Email Settings', 'url': '/email/settings', 'active': _system_admin_path.startswith('/email/settings')},
      {'label': 'Audit Logs', 'url': '/system-settings/audit-logs', 'active': _system_admin_path.startswith('/system-settings/audit-logs')}
    ]
  },
  {
    'label': 'Alerts',
    'url': '/alerts',
    'visible': true,
    'active': _system_admin_path.startswith('/alerts'),
    'badge': unread_alert_count if unread_alert_count is defined and unread_alert_count > 0 else none
  }
] %}

<div class="border-b border-slate-200 bg-white shadow-sm" data-uiux-v2-pilot="system-admin">
  {% include "ui/templates/components/navigation_v2.html" %}
  {% include "ui/templates/components/mobile_navigation_v2.html" %}
</div>

{#
  UI/UX V2 Phase 1F.2 — desktop dropdown interaction compatibility.
  This affects only the System Admin desktop navigation rendered above.
  Existing links, routes, active states and mobile navigation remain unchanged.
#}
<script>
(function () {
  "use strict";

  function initialiseSystemAdminDropdowns() {
    var root = document.querySelector('[data-uiux-v2-pilot="system-admin"]');
    if (!root || root.dataset.dropdownAutoCloseInitialised === "true") {
      return;
    }

    var desktopNav = root.querySelector('nav[data-uiux-v2="desktop-navigation"]');
    if (!desktopNav) {
      return;
    }

    root.dataset.dropdownAutoCloseInitialised = "true";

    function openDropdowns() {
      return Array.prototype.slice.call(
        desktopNav.querySelectorAll('details[open]')
      );
    }

    function closeDropdown(details) {
      if (details && details.open) {
        details.open = false;
      }
    }

    function closeAllExcept(exception) {
      openDropdowns().forEach(function (details) {
        if (details !== exception) {
          closeDropdown(details);
        }
      });
    }

    desktopNav.querySelectorAll('details').forEach(function (details) {
      details.addEventListener('toggle', function () {
        if (details.open) {
          closeAllExcept(details);
        }
      });

      details.querySelectorAll('a[href]').forEach(function (link) {
        link.addEventListener('click', function () {
          closeDropdown(details);
        });
      });
    });

    document.addEventListener('click', function (event) {
      openDropdowns().forEach(function (details) {
        if (!details.contains(event.target)) {
          closeDropdown(details);
        }
      });
    });

    document.addEventListener('keydown', function (event) {
      if (event.key === 'Escape') {
        closeAllExcept(null);
      }
    });
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', initialiseSystemAdminDropdowns, { once: true });
  } else {
    initialiseSystemAdminDropdowns();
  }
})();
</script>
{% endif %}