<div class="dropdown">
    <button class="dropdown-btn" type="button" data-bs-toggle="dropdown" aria-expanded="false">
        <span class="dropdownText">@lang('All Departments')</span>
        <span class="icon">
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
                <path d="M7.9987 11.3333L12.6654 6H3.33203L7.9987 11.3333Z" fill="currentColor" fill-opacity="0.4" />
            </svg>
        </span>
    </button>
    <ul class="dropdown-menu">
        <li class="dropdown-item">
            <div class="dropdown-link departmentOption" data-department="">@lang('All Departments')</div>
        </li>
        @foreach ($departments as $department)
            <li class="dropdown-item">
                <div class="dropdown-link departmentOption" data-department="{{ $department->id }}">{{ __($department->name) }}</div>
            </li>
        @endforeach
    </ul>
</div>
