{% load i18n %}
{% load hospital_filters %}
<div class="sidebar">
    <!-- Brand -->
    <div class="sidebar-brand">
        <i class="bi bi-heart-pulse-fill"></i> PX360
    </div>

    <!-- Navigation -->
    <nav class="sidebar-nav">
        <ul class="nav flex-column">
            <!-- Command Center -->
            <li class="nav-item">
            <!-- PX Actions -->
            <li class="nav-item">
                <a class="nav-link {% if 'actions' in request.path %}active{% endif %}"
                   href="{% url 'actions:action_list' %}">
                    <i class="bi bi-clipboard-check"></i>
                    {% trans "PX Actions" %}
                    <span class="badge bg-warning">{{ action_count|default:0 }}</span>
                </a>
            </li>

            <!-- Journeys -->
            <li class="nav-item">
                <a class="nav-link {% if 'journeys' in request.path %}active{% endif %}"
                   href="{% url 'journeys:instance_list' %}">
                    <i class="bi bi-diagram-3"></i>
                    {% trans "Patient Journeys" %}
                </a>
            </li>

            <!-- Surveys -->
            <li class="nav-item">
                <a class="nav-link {% if 'surveys' in request.path %}active{% endif %}"
                   href="{% url 'surveys:instance_list' %}">
                    <i class="bi bi-clipboard-data"></i>
                    {% trans "Surveys" %}
                </a>
            </li>

            <!-- Physicians -->
            <li class="nav-item">
                <a class="nav-link {% if 'physicians' in request.path %}active{% endif %}"
                   href="{% url 'physicians:physician_list' %}">
                    <i class="bi bi-person-badge"></i>
                    {% trans "Physicians" %}
                </a>
            </li>

            <hr class="my-2" style="border-color: rgba(255,255,255,0.1);">

            <!-- Organizations -->
            <li class="nav-item">
                <a class="nav-link {% if 'organizations' in request.path and 'api' not in request.path %}active{% endif %}"
                   href="{% url 'organizations:hospital_list' %}">
                    <i class="bi bi-building"></i>
                    {% trans "Organizations" %}
                </a>
            </li>

            <!-- Call Center -->
            <li class="nav-item">
                <a class="nav-link {% if 'callcenter' in request.path %}active{% endif %}"
                   data-bs-toggle="collapse"
                   href="#callcenterMenu"
                   role="button"
                   aria-expanded="{% if 'callcenter' in request.path %}true{% else %}false{% endif %}"
                   aria-controls="callcenterMenu">
                    <i class="bi bi-telephone"></i>
                    {% trans "Call Center" %}
                    <i class="bi bi-chevron-down ms-auto"></i>
                </a>
                <div class="collapse {% if 'callcenter' in request.path %}show{% endif %}" id="callcenterMenu">
                    <ul class="nav flex-column ms-3">
                        <li class="nav-item">
                            <a class="nav-link {% if request.resolver_match.url_name == 'interaction_list' %}active{% endif %}"
                               href="{% url 'callcenter:interaction_list' %}">
                                <i class="bi bi-list-ul"></i>
                                {% trans "Interactions" %}
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.resolver_match.url_name == 'create_complaint' %}active{% endif %}"
                               href="{% url 'callcenter:create_complaint' %}">
                                <i class="bi bi-plus-circle"></i>
                                {% trans "Create Complaint" %}
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.resolver_match.url_name == 'create_inquiry' %}active{% endif %}"
                               href="{% url 'callcenter:create_inquiry' %}">
                                <i class="bi bi-plus-circle"></i>
                                {% trans "Create Inquiry" %}
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.resolver_match.url_name == 'complaint_list' and 'callcenter' in request.path %}active{% endif %}"
                               href="{% url 'callcenter:complaint_list' %}">
                                <i class="bi bi-exclamation-triangle"></i>
                                {% trans "Complaints" %}
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if request.resolver_match.url_name == 'inquiry_list' and 'callcenter' in request.path %}active{% endif %}"
                               href="{% url 'callcenter:inquiry_list' %}">
                                <i class="bi bi-question-circle"></i>
                                {% trans "Inquiries" %}
                            </a>
                        </li>
                    </ul>
                </div>
            </li>

            <!-- Social Media -->
            <li class="nav-item">
                <a class="nav-link {% if 'social' in request.path %}active{% endif %}"
                   href="{% url 'social:mention_list' %}">
                    <i class="bi bi-chat-dots"></i>
                    {% trans "Social Media" %}
                </a>
            </li>

            <!-- References -->
            <li class="nav-item">
                <a class="nav-link {% if 'references' in request.path %}active{% endif %}"
                   href="{% url 'references:dashboard' %}">
                    <i class="bi bi-folder"></i>
                    {% trans "References" %}
                </a>
            </li>

            <!-- Standards -->
            <li class="nav-item">
                <a class="nav-link {% if 'standards' in request.path %}active{% endif %}"
                   href="{% url 'standards:dashboard' %}">
                    <i class="bi bi-shield-check"></i>
                    {% trans "Standards" %}
                </a>
            </li>

            <hr class="my-2" style="border-color: rgba(255,255,255,0.1);">

            <!-- Analytics -->
            <li class="nav-item">
                <a class="nav-link {% if 'analytics' in request.path %}active{% endif %}"
                   href="{% url 'analytics:dashboard' %}">
                    <i class="bi bi-graph-up"></i>
                    {% trans "Analytics" %}
                </a>
            </li>

            <!-- QI Projects -->
            <li class="nav-item">
                <a class="nav-link {% if 'projects' in request.path %}active{% endif %}"
                   href="{% url 'projects:project_list' %}">
                    <i class="bi bi-kanban"></i>
                    {% trans "QI Projects" %}
                </a>
            </li>

            <hr class="my-2" style="border-color: rgba(255,255,255,0.1);">

            <!-- Settings (PX Admin only) -->
            {% if user.is_px_admin %}
            <li class="nav-item">
                <a class="nav-link {% if 'config' in request.path %}active{% endif %}"
                   href="{% url 'config:dashboard' %}">
                    <i class="bi bi-gear"></i>
                    {% trans "Settings" %}
                    <i class="bi bi-chevron-down ms-auto"></i>
                </a>
                <div class="collapse {% if 'config' in request.path %}show{% endif %}" id="settingsMenu">
                    <ul class="nav flex-column ms-3">
                        <li class="nav-item">
                            <a class="nav-link {% if request.resolver_match.url_name == 'config_dashboard' %}active{% endif %}"
                               href="{% url 'config:dashboard' %}">
                                <i class="bi bi-sliders"></i>
                                {% trans "Configuration" %}
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link {% if 'onboarding' in request.path %}active{% endif %}"
                               href="{% url 'accounts:provisional-user-list' %}">
                                <i class="bi bi-person-plus"></i>
                                {% trans "Onboarding" %}
                                <span class="badge bg-info">{{ provisional_user_count|default:0 }}</span>
                            </a>
                        </li>
                    </ul>
                </div>
            </li>
            {% endif %}
        </ul>
    </nav>

    <!-- Hospital Display -->
    {% if current_hospital %}
    <div class="hospital-selector px-3 py-2" style="border-top: 1px solid rgba(255,255,255,0.1);">
        {% if is_px_admin %}
        <div class="dropdown">
            <button class="btn btn-light w-100 d-flex align-items-center text-start" type="button" data-bs-toggle="dropdown">
                <i class="bi bi-hospital me-2 text-primary"></i>
                <div class="flex-grow-1">
                    <div class="fw-semibold" style="font-size: 0.9rem;">
                        {{ current_hospital.name|truncatewords:3 }}
                    </div>
                    <div class="text-muted" style="font-size: 0.75rem;">
                        {% if current_hospital.city %}{{ current_hospital.city }}{% endif %}
                    </div>
                </div>
                <i class="bi bi-chevron-down text-muted"></i>
            </button>
            <ul class="dropdown-menu w-100" style="max-height: 400px; overflow-y: auto;">
                <li class="dropdown-header">
                    <i class="bi bi-building me-2"></i>{% trans "Switch Hospital" %}
                </li>
                <li><hr class="dropdown-divider"></li>
                {% get_all_hospitals as hospitals %}
                {% for hospital in hospitals %}
                <li>
                    <form action="{% url 'core:select_hospital' %}" method="post">
                        {% csrf_token %}
                        <input type="hidden" name="hospital_id" value="{{ hospital.id }}">
                        <button type="submit" class="dropdown-item d-flex align-items-center w-100{% if hospital.id == current_hospital.id %} active{% endif %}">
                            <i class="bi bi-hospital me-2 text-primary"></i>
                            <div class="text-start flex-grow-1">
                                <div class="fw-semibold" style="font-size: 0.9rem;">{{ hospital.name }}</div>
                                <div class="text-muted" style="font-size: 0.75rem;">
                                    {% if hospital.city %}{{ hospital.city }}{% endif %}
                                </div>
                            </div>
                            {% if hospital.id == current_hospital.id %}
                            <i class="bi bi-check2 text-success"></i>
                            {% endif %}
                        </button>
                    </form>
                </li>
                {% endfor %}
                <li><hr class="dropdown-divider"></li>
                <li>
                    <a href="{% url 'core:select_hospital' %}" class="dropdown-item">
                        <i class="bi bi-list-ul me-2"></i>{% trans "View All Hospitals" %}
                    </a>
                </li>
            </ul>
        </div>
        {% else %}
        <div class="d-flex align-items-center">
            <i class="bi bi-hospital me-2 text-primary"></i>
            <div>
                <div class="fw-semibold" style="font-size: 0.9rem;">
                    {{ current_hospital.name|truncatewords:3 }}
                </div>
                <div class="text-muted" style="font-size: 0.75rem;">
                    {% if current_hospital.city %}{{ current_hospital.city }}{% endif %}
                </div>
            </div>
        </div>
        {% endif %}
    </div>
    {% endif %}
</div>
