{{--
=====================================================
Etebarit - by Gisoo Web Solutions
------------------------------------------------------
Gisoo.net
------------------------------------------------------
Copyright (c) 2026 Gisoo Web Solutions
=====================================================
This code is protected by copyright
=====================================================
File: index.blade.php
------------------------------------------------------
Use: Contract organizations list from the approved
     design: filter pills, search, remaining-cap column
     and the derived full-capacity badge.
=====================================================
--}}

@extends('layouts.admin')

@section('title', __('admin.organizations.title'))

@section('breadcrumb')
    <x-ui.breadcrumb :items="[
        ['label' => __('admin.breadcrumb.home'), 'url' => route('admin.users.index')],
        ['label' => __('admin.organizations.breadcrumb')],
    ]" />
@endsection

@section('page')
    @php $canManage = auth('admin')->user()->allowed('organizations.manage'); @endphp

    <div class="mb-5 flex flex-wrap items-end justify-between gap-4">
        <div>
            <h1 class="mb-1 text-2xl font-bold tracking-tight">{{ __('admin.organizations.title') }}</h1>
            <p class="text-sm text-ink-muted">{{ __('admin.organizations.subtitle') }}</p>
        </div>

        @if ($canManage)
            <a href="{{ route('admin.organizations.create') }}"
               class="inline-flex items-center gap-2 rounded-xl bg-primary-600 px-5 py-2.5 text-sm font-bold text-white shadow-lg shadow-primary-600/25 transition hover:bg-primary-700">
                <svg class="size-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
                {{ __('admin.organizations.add') }}
            </a>
        @endif
    </div>

    <x-ui.info-box class="mb-5">
        {{ __('admin.organizations.info') }}
    </x-ui.info-box>

    <div class="rounded-2xl border border-line bg-white p-5">
        <div class="mb-4.5 flex flex-wrap items-center justify-between gap-3.5">
            <div class="inline-flex flex-wrap gap-0.5 rounded-xl bg-[#f2f0fa] p-1">
                @foreach (__('admin.organizations.filters') as $key => $label)
                    <a
                        href="{{ route('admin.organizations.index', array_filter(['status' => $key === 'all' ? null : $key, 'q' => $search ?: null])) }}"
                        @class([
                            'rounded-[9px] px-4 py-2 text-[13px] font-bold transition',
                            'bg-white text-primary-600 shadow-sm' => $status === $key,
                            'text-ink-muted hover:text-primary-600' => $status !== $key,
                        ])
                    >{{ $label }}</a>
                @endforeach
            </div>

            <form method="GET" action="{{ route('admin.organizations.index') }}" class="flex items-center rounded-[11px] border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3 transition focus-within:border-primary-600 focus-within:bg-white">
                @if ($status !== 'all')
                    <input type="hidden" name="status" value="{{ $status }}">
                @endif
                <svg class="size-4 shrink-0 text-ink-faint" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><circle cx="11" cy="11" r="7"/><line x1="21" y1="21" x2="16.5" y2="16.5"/></svg>
                <input type="text" name="q" value="{{ $search }}" placeholder="{{ __('admin.organizations.search_placeholder') }}"
                       class="w-40 border-none bg-transparent px-2 py-2.5 text-[13px] outline-none placeholder:text-ink-faint sm:w-48">
            </form>
        </div>

        @php $showReorder = $reorderable && $canManage; @endphp
        <div class="overflow-x-auto rounded-[14px] border border-[#f0eff5]">
            <table class="w-full min-w-[820px] border-collapse text-right text-[13.5px]">
                <thead>
                    <tr class="bg-[#faf9fd] text-ink-muted">
                        @if ($showReorder)
                            <th class="w-[70px] px-3 py-3.5 text-center font-bold">{{ __('admin.organizations.columns.order') }}</th>
                        @endif
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.organizations.columns.organization') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.organizations.columns.users') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.organizations.columns.remaining') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.organizations.columns.open_installments') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.organizations.columns.status') }}</th>
                        <th class="px-4.5 py-3.5 text-center font-bold">{{ __('admin.organizations.columns.actions') }}</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse ($organizations as $organization)
                        <tr class="border-t border-[#f0eff5]">
                            @if ($showReorder)
                                <td class="px-3 py-3.5 text-center">
                                    <div class="inline-flex flex-col gap-0.5">
                                        @foreach (['up' => 'M6 15l6-6 6 6', 'down' => 'M6 9l6 6 6-6'] as $direction => $arrow)
                                            <form method="POST" action="{{ route('admin.organizations.move', $organization) }}">
                                                @csrf
                                                <input type="hidden" name="direction" value="{{ $direction }}">
                                                <button type="submit" class="flex h-[22px] w-[26px] items-center justify-center rounded-md border border-line bg-white text-primary-600 transition hover:bg-[#f2f0fa]">
                                                    <svg class="size-3" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="{{ $arrow }}"/></svg>
                                                </button>
                                            </form>
                                        @endforeach
                                    </div>
                                </td>
                            @endif
                            <td class="px-4.5 py-3.5">
                                <div class="flex items-center gap-2.5">
                                    @if ($organization->logo_path)
                                        <img src="{{ route('media.organization-logo', $organization) }}" alt="{{ $organization->name }}" class="size-[34px] rounded-[9px] object-cover">
                                    @else
                                        <span class="flex size-[34px] shrink-0 items-center justify-center rounded-[9px] bg-[#efeafb] text-primary-600">
                                            <svg class="size-[18px]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 21V6l7-3v18"/><path d="M11 8h6a2 2 0 0 1 2 2v11"/><path d="M4 21h17"/></svg>
                                        </span>
                                    @endif
                                    <a href="{{ route('admin.organizations.show', $organization) }}" target="_blank" class="font-bold text-ink transition hover:text-primary-600">
                                        {{ $organization->name }}
                                    </a>
                                </div>
                            </td>
                            <td class="px-4.5 py-3.5 text-ink-soft">@fa($organization->active_users_count) {{ __('admin.organizations.users_suffix') }}</td>
                            <td class="px-4.5 py-3.5">
                                @if ($organization->credit_cap === 0)
                                    <span class="text-ink-faint">&mdash;</span>
                                @else
                                    <span @class(['font-bold', 'text-green-600' => $organization->remainingCap() > 0, 'text-secondary-500' => $organization->remainingCap() === 0])>@toman($organization->remainingCap())</span>
                                    <span class="text-ink-faint"> {{ __('admin.organizations.of') }} @toman($organization->credit_cap) {{ __('admin.toman') }}</span>
                                @endif
                            </td>
                            <td class="px-4.5 py-3.5 text-ink-soft">@fa($organization->open_installments_count)</td>
                            <td class="px-4.5 py-3.5">
                                <span @class([
                                    'rounded-2xl px-2.5 py-1.5 text-xs font-bold',
                                    'bg-[#e7f7ee] text-green-600' => $organization->status === \App\Models\Organization::STATUS_ACTIVE,
                                    'bg-secondary-50 text-secondary-500' => $organization->status === \App\Models\Organization::STATUS_FULL,
                                    'bg-[#f1f0f5] text-ink-muted' => $organization->status === \App\Models\Organization::STATUS_INACTIVE,
                                ])>
                                    {{ __("admin.organizations.statuses.{$organization->status}") }}
                                </span>
                            </td>
                            <td class="px-4.5 py-3.5 text-center">
                                <a href="{{ route('admin.organizations.show', $organization) }}" class="inline-flex rounded-[9px] bg-[#f2f0fa] px-4 py-2 text-[12.5px] font-bold text-primary-600 transition hover:bg-[#e8e3f8]">
                                    {{ __('admin.organizations.details') }}
                                </a>
                            </td>
                        </tr>
                    @empty
                        <tr class="border-t border-[#f0eff5]">
                            <td colspan="{{ $showReorder ? 7 : 6 }}" class="px-4.5 py-10 text-center text-sm text-ink-muted">
                                {{ __('admin.organizations.empty') }}
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        @if ($showReorder && $organizations->count() > 1)
            <div class="mt-3.5 flex items-center gap-2 text-xs text-ink-faint">
                <svg class="size-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01"/></svg>
                {{ __('admin.organizations.order_hint') }}
            </div>
        @endif

        @if ($organizations->hasPages())
            <div class="mt-4.5">
                {{ $organizations->links() }}
            </div>
        @endif
    </div>
@endsection