@extends('layouts.app')

@section('header')
    <div class="flex justify-between items-center">
        <h2 class="font-semibold text-xl text-black leading-tight">
            @trans('crm.CRM Settings')
        </h2>
        <div class="flex space-x-2">
            <a href="{{ route('crm.settings.sources.index') }}" class="bg-white border border-gray-300 text-black px-3 py-1 rounded text-sm hover:bg-gray-50">
                @trans('crm.Sources & Channels')
            </a>
            <a href="{{ route('crm.settings.pipelines.index') }}" class="bg-white border border-gray-300 text-black px-3 py-1 rounded text-sm hover:bg-gray-50">
                @trans('crm.Pipelines & Stages')
            </a>
        </div>
    </div>
@endsection

@section('content')
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 py-6">
    @if(session('success'))
        <div class="mb-4 bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded relative">
            {{ session('success') }}
        </div>
    @endif

    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
        <div class="border-b border-gray-200 overflow-x-auto">
            <nav class="flex -mb-px px-6 whitespace-nowrap" aria-label="Tabs">
                @php
                    $tabs = [
                        'scoring' => @trans('crm.Scoring Rules'),
                        'lost_reasons' => @trans('crm.Lost Reasons'),
                        'win_reasons' => @trans('crm.Win Reasons'),
                        'activity_types' => @trans('crm.Activity Types'),
                        'lead_stages' => @trans('crm.Lead Statuses'),
                        'pipeline_config' => @trans('crm.Pipeline Config'),
                        'opp_stages' => @trans('crm.Opportunity Stages'),
                        'channels' => @trans('crm.Channels'),
                        'assignment_rules' => @trans('crm.Assignment Rules'),
                        'automation_rules' => @trans('crm.Automation Rules'),
                        'ticket_categories' => @trans('crm.Ticket Categories'),
                    ];
                    $activeTab = request('tab', 'scoring');
                @endphp
                @foreach($tabs as $key => $label)
                    <a href="?tab={{ $key }}" class="py-4 px-6 border-b-2 font-medium text-sm {{ $activeTab == $key ? 'border-blue-500 text-blue-600' : 'border-transparent text-black hover:text-black hover:border-gray-300' }}">
                        {{ $label }}
                    </a>
                @endforeach
            </nav>
        </div>

        <div class="p-6">
            {{-- Scoring Rules --}}
            @if($activeTab == 'scoring' || $activeTab == 'scoring_rules' || $activeTab == 'scoring_config')
                <div class="space-y-6">
                    <div class="flex justify-between items-center">
                        <h3 class="text-lg font-bold">@trans('crm.Lead Scoring Rules')</h3>
                    </div>
                    
                    <form action="{{ route('crm.settings.scoring-rules.store') }}" method="POST" class="grid grid-cols-1 md:grid-cols-5 gap-4 bg-gray-50 p-4 rounded">
                        @csrf
                        <div>
                            <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Rule Name')</label>
                            <input type="text" name="name" required class="w-full text-sm rounded-md border-gray-300">
                        </div>
                        <div>
                            <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Field')</label>
                            <select name="field" required class="w-full text-sm rounded-md border-gray-300">
                                <option value="source">@trans('crm.Source')</option>
                                <option value="clinic">@trans('crm.Clinic')</option>
                                <option value="specialty">@trans('crm.Specialty')</option>
                                <option value="city">@trans('crm.City')</option>
                            </select>
                        </div>
                        <div>
                            <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Operator')</label>
                            <select name="operator" required class="w-full text-sm rounded-md border-gray-300">
                                <option value="equals">@trans('crm.Equals')</option>
                                <option value="contains">@trans('crm.Contains')</option>
                            </select>
                        </div>
                        <div>
                            <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Value')</label>
                            <input type="text" name="value" required class="w-full text-sm rounded-md border-gray-300">
                        </div>
                        <div>
                            <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Score')</label>
                            <div class="flex gap-2">
                                <input type="number" name="score" required class="w-full text-sm rounded-md border-gray-300">
                                <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded text-sm">@trans('crm.Add')</button>
                            </div>
                        </div>
                    </form>

                    <table class="min-w-full divide-y divide-gray-200">
                        <thead>
                            <tr>
                                <th class="px-4 py-2 text-left text-xs font-bold text-black uppercase">@trans('crm.Name')</th>
                                <th class="px-4 py-2 text-left text-xs font-bold text-black uppercase">@trans('crm.Condition')</th>
                                <th class="px-4 py-2 text-left text-xs font-bold text-black uppercase">@trans('crm.Score')</th>
                            </tr>
                        </thead>
                        <tbody class="divide-y divide-gray-200">
                            @forelse($scoringRules as $rule)
                                <tr>
                                    <td class="px-4 py-2 text-sm">{{ $rule->name }}</td>
                                    <td class="px-4 py-2 text-sm text-black">
                                        {{ $rule->field }} {{ $rule->operator }} '{{ $rule->value }}'
                                    </td>
                                    <td class="px-4 py-2 text-sm font-bold {{ $rule->score >= 0 ? 'text-green-600' : 'text-red-600' }}">
                                        {{ $rule->score > 0 ? '+' : '' }}{{ $rule->score }}
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="3" class="px-4 py-8 text-center text-black italic">@trans('crm.No rules defined yet')</td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>

            {{-- Lost Reasons --}}
            @elseif($activeTab == 'lost_reasons' || $activeTab == 'loss_reasons' || $activeTab == 'unqualified_reasons' || $activeTab == 'lost_reasons_report')
                <div class="space-y-6">
                    <h3 class="text-lg font-bold">@trans('crm.Lead Lost & Unqualified Reasons')</h3>
                    <form action="{{ route('crm.settings.lost-reasons.store') }}" method="POST" class="flex gap-2 max-w-md">
                        @csrf
                        <input type="text" name="reason" required placeholder="@trans('crm.Reason')" class="flex-1 text-sm rounded-md border-gray-300">
                        <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded text-sm">@trans('crm.Add')</button>
                    </form>
                    <ul class="divide-y max-w-md">
                        @foreach($lostReasons as $reason)
                            <li class="py-2 text-sm flex justify-between">
                                <span>{{ $reason->reason }}</span>
                            </li>
                        @endforeach
                    </ul>
                </div>

            {{-- Win Reasons --}}
            @elseif($activeTab == 'win_reasons')
                <div class="space-y-6">
                    <h3 class="text-lg font-bold">@trans('crm.Opportunity Win Reasons')</h3>
                    <form action="{{ route('crm.settings.win-reasons.store') }}" method="POST" class="flex gap-2 max-w-md">
                        @csrf
                        <input type="text" name="reason" required placeholder="@trans('crm.Reason')" class="flex-1 text-sm rounded-md border-gray-300">
                        <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded text-sm">@trans('crm.Add')</button>
                    </form>
                    <ul class="divide-y max-w-md">
                        @foreach($winReasons as $reason)
                            <li class="py-2 text-sm flex justify-between">
                                <span>{{ $reason->reason }}</span>
                            </li>
                        @endforeach
                    </ul>
                </div>

            {{-- Activity Types --}}
            @elseif($activeTab == 'activity_types')
                <div class="space-y-6">
                    <h3 class="text-lg font-bold">@trans('crm.Activity Types')</h3>
                    
                    <form action="{{ route('crm.settings.activity-types.store') }}" method="POST" class="grid grid-cols-1 md:grid-cols-4 gap-4 bg-gray-50 p-4 rounded">
                        @csrf
                        <div class="md:col-span-2">
                            <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Type Name')</label>
                            <input type="text" name="name" required placeholder="@trans('crm.e.g., Follow-up, Meeting, Email')" class="w-full text-sm rounded-md border-gray-300">
                        </div>
                        <div>
                            <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Icon (FontAwesome)')</label>
                            <input type="text" name="icon" placeholder="fas fa-phone" class="w-full text-sm rounded-md border-gray-300">
                        </div>
                        <div class="flex items-end">
                            <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded text-sm w-full font-bold hover:bg-blue-700">@trans('crm.Add Type')</button>
                        </div>
                    </form>

                    <ul class="divide-y max-w-2xl border rounded-lg bg-white shadow-sm overflow-hidden">
                        @forelse($activityTypes as $type)
                            <li class="px-6 py-4 text-sm flex justify-between items-center hover:bg-gray-50 transition-colors">
                                <div class="flex items-center gap-3">
                                    <span class="w-8 h-8 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center">
                                        <i class="{{ $type->icon ?? 'fas fa-tasks' }}"></i>
                                    </span>
                                    <span class="font-medium text-black">{{ $type->name }}</span>
                                </div>
                                <div class="flex items-center gap-4">
                                    <span class="text-xs {{ $type->is_active ? 'bg-green-100 text-green-700' : 'bg-red-100 text-red-700' }} px-2 py-0.5 rounded-full font-bold uppercase">
                                        @if($type->is_active) @trans('crm.Active') @else @trans('crm.Inactive') @endif
                                    </span>
                                </div>
                            </li>
                        @empty
                            <li class="px-6 py-10 text-center text-black italic">
                                @trans('crm.No activity types defined yet.')
                            </li>
                        @endforelse
                    </ul>
                </div>

            {{-- Lead Statuses --}}
            @elseif($activeTab == 'lead_stages')
                <div class="space-y-6">
                    <div class="flex justify-between items-center">
                        <h3 class="text-lg font-bold">@trans('crm.Lead Statuses')</h3>
                        <a href="{{ route('crm.settings.pipelines.index') }}" class="text-blue-600 text-sm hover:underline">
                            @trans('crm.Manage Pipeline Stages') &rarr;
                        </a>
                    </div>
                    <p class="text-sm text-black mb-4">
                        @trans('crm.Default system statuses for Leads. These are used for high-level tracking.')
                    </p>
                    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
                        @php
                            $defaultStatuses = [
                                'new' => ['label' => 'New', 'color' => 'bg-blue-100 text-blue-800'],
                                'contacted' => ['label' => 'Contacted', 'color' => 'bg-yellow-100 text-yellow-800'],
                                'interested' => ['label' => 'Interested', 'color' => 'bg-indigo-100 text-indigo-800'],
                                'qualified' => ['label' => 'Qualified', 'color' => 'bg-purple-100 text-purple-800'],
                                'converted' => ['label' => 'Converted', 'color' => 'bg-green-100 text-green-800'],
                                'lost' => ['label' => 'Lost', 'color' => 'bg-red-100 text-red-800'],
                            ];
                        @endphp
                        @foreach($defaultStatuses as $key => $status)
                            <div class="flex items-center p-3 border rounded shadow-sm bg-white">
                                <span class="px-2 py-1 rounded text-xs font-bold mr-3 {{ $status['color'] }}">
                                    {{ $key }}
                                </span>
                                <span class="text-sm font-medium">{{ __('crm.'.$status['label']) }}</span>
                            </div>
                        @endforeach
                    </div>
                </div>

            {{-- Pipeline Config --}}
            @elseif($activeTab == 'pipeline_config' || $activeTab == 'pipelines')
                <div class="space-y-8">
                    <div class="bg-gray-50 p-6 rounded-lg border-2 border-dashed border-gray-300">
                        <h3 class="text-lg font-bold mb-4">@trans('crm.Create New Pipeline')</h3>
                        <form action="{{ route('crm.settings.pipelines.store') }}" method="POST" class="flex gap-4">
                            @csrf
                            <input type="text" name="name" required placeholder="@trans('crm.Pipeline Name (e.g., Dental, Cosmetic)')" class="flex-1 rounded-md border-gray-300">
                            <button type="submit" class="bg-blue-600 text-white px-6 py-2 rounded font-bold hover:bg-blue-700">@trans('crm.Create Pipeline')</button>
                        </form>
                    </div>
                    
                    @foreach($pipelines as $pipeline)
                        <div class="border rounded-lg bg-white shadow-sm overflow-hidden">
                            <div class="bg-gray-50 px-6 py-4 border-b flex justify-between items-center">
                                <h4 class="font-bold text-black">{{ $pipeline->name }}</h4>
                                <span class="text-[10px] text-black font-mono">{{ $pipeline->uuid }}</span>
                            </div>
                            
                            <div class="p-6 grid grid-cols-1 lg:grid-cols-2 gap-8">
                                <div>
                                    <h5 class="text-sm font-bold text-black mb-4 uppercase tracking-wider">@trans('crm.Existing Stages')</h5>
                                    <div class="space-y-2">
                                        @forelse($pipeline->stages as $stage)
                                            <div class="flex items-center justify-between p-3 bg-gray-50 rounded border group hover:border-blue-300 transition-colors">
                                                <div class="flex items-center gap-3">
                                                    <div class="w-4 h-4 rounded-full shadow-sm" style="background-color: {{ $stage->color ?? '#3B82F6' }}"></div>
                                                    <span class="font-medium text-sm">{{ $stage->name }}</span>
                                                </div>
                                                <div class="flex items-center gap-2">
                                                    @if($stage->is_won) <span class="text-[9px] bg-green-100 text-green-700 px-2 py-0.5 rounded-full font-bold">@trans('crm.WON')</span> @endif
                                                    @if($stage->is_lost) <span class="text-[9px] bg-red-100 text-red-700 px-2 py-0.5 rounded-full font-bold">@trans('crm.LOST')</span> @endif
                                                    <span class="text-xs text-black font-mono">#{{ $stage->sort_order }}</span>
                                                </div>
                                            </div>
                                        @empty
                                            <p class="text-sm text-black italic text-center py-4">@trans('crm.No stages defined yet.')</p>
                                        @endforelse
                                    </div>
                                </div>

                                <div class="bg-blue-50/30 p-4 rounded-lg border border-blue-100">
                                    <h5 class="text-sm font-bold text-blue-800 mb-4 uppercase tracking-wider">@trans('crm.Add New Stage')</h5>
                                    <form action="{{ route('crm.settings.pipelines.stages.store', $pipeline->uuid) }}" method="POST" class="space-y-4">
                                        @csrf
                                        <div>
                                            <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Stage Name')</label>
                                            <input type="text" name="name" required class="w-full text-sm rounded-md border-gray-300">
                                        </div>
                                        <div class="grid grid-cols-2 gap-4">
                                            <div>
                                                <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Probability (%)')</label>
                                                <input type="number" name="probability" value="20" required class="w-full text-sm rounded-md border-gray-300">
                                            </div>
                                            <div>
                                                <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Order')</label>
                                                <input type="number" name="sort_order" value="{{ $pipeline->stages->count() + 1 }}" required class="w-full text-sm rounded-md border-gray-300">
                                            </div>
                                        </div>
                                        <div>
                                            <label class="block text-xs font-bold text-black uppercase mb-1">@trans('crm.Stage Color')</label>
                                            <input type="color" name="color" value="#3B82F6" class="w-full h-8 p-1 rounded-md border-gray-300">
                                        </div>
                                        <div class="flex gap-4 pt-2">
                                            <label class="flex items-center cursor-pointer">
                                                <input type="checkbox" name="is_won" value="1" class="rounded border-gray-300 text-blue-600">
                                                <span class="ml-2 text-xs text-black">@trans('crm.Won Stage')</span>
                                            </label>
                                            <label class="flex items-center cursor-pointer">
                                                <input type="checkbox" name="is_lost" value="1" class="rounded border-gray-300 text-blue-600">
                                                <span class="ml-2 text-xs text-black">@trans('crm.Lost Stage')</span>
                                            </label>
                                        </div>
                                        <button type="submit" class="w-full bg-gray-800 text-white px-4 py-2 rounded text-sm font-bold hover:bg-black transition-colors">@trans('crm.Add Stage to') {{ $pipeline->name }}</button>
                                    </form>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>

            {{-- Opportunity Stages --}}
            @elseif($activeTab == 'opp_stages')
                <div class="space-y-6">
                    <h3 class="text-lg font-bold">@trans('crm.Opportunity Stages')</h3>
                    <div class="bg-indigo-50 p-6 rounded-lg border border-indigo-100 text-center">
                        <svg xmlns="http://www.w3.org/2000/svg" class="mx-auto h-12 w-12 text-indigo-300 mb-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10" />
                        </svg>
                        <p class="text-black mb-4">
                            @trans('crm.Opportunity stages are defined within Pipelines. You can have different stages for different services.')
                        </p>
                        <a href="?tab=pipelines" class="inline-flex items-center px-4 py-2 bg-indigo-600 text-white rounded-md text-sm font-bold hover:bg-indigo-700 transition-colors">
                            @trans('crm.Configure Pipelines & Stages')
                        </a>
                    </div>
                </div>

            {{-- Channels --}}
            @elseif($activeTab == 'channels' || $activeTab == 'platforms')
                <div class="space-y-6">
                    <div class="flex justify-between items-center">
                        <h3 class="text-lg font-bold">@trans('crm.Marketing Channels & Platforms')</h3>
                        <a href="{{ route('crm.settings.sources.index') }}" class="bg-blue-600 text-white px-4 py-2 rounded text-sm font-bold hover:bg-blue-700">
                            @trans('crm.Add Source/Channel')
                        </a>
                    </div>
                    
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                        @foreach($sources as $source)
                            <div class="border rounded-lg bg-white overflow-hidden shadow-sm">
                                <div class="bg-gray-50 px-4 py-3 border-b flex justify-between items-center">
                                    <h4 class="font-bold text-sm text-black">{{ $source->name }}</h4>
                                    <span class="text-[9px] bg-gray-200 px-2 py-0.5 rounded-full text-black uppercase">{{ $source->type }}</span>
                                </div>
                                <div class="p-4">
                                    <ul class="space-y-2">
                                        @forelse($source->channels as $channel)
                                            <li class="flex justify-between items-center text-sm p-2 bg-gray-50 rounded group hover:bg-blue-50 transition-colors">
                                                <span class="font-medium">{{ $channel->name }}</span>
                                                <div class="flex items-center gap-3">
                                                    @if($channel->is_active)
                                                        <span class="text-[9px] text-green-600 font-bold tracking-tighter">● @trans('crm.ACTIVE')</span>
                                                    @else
                                                        <span class="text-[9px] text-red-600 font-bold tracking-tighter">● @trans('crm.INACTIVE')</span>
                                                    @endif
                                                </div>
                                            </li>
                                        @empty
                                            <li class="text-xs text-black italic text-center py-2">@trans('crm.No sub-channels defined')</li>
                                        @endforelse
                                    </ul>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>

            {{-- Assignment Rules --}}
            @elseif($activeTab == 'assignment_rules')
                <div class="space-y-6">
                    <div class="flex justify-between items-center">
                        <h3 class="text-lg font-bold">@trans('crm.Lead Assignment Rules')</h3>
                    </div>
                    
                    <div class="bg-white border rounded-lg shadow-sm overflow-hidden">
                        <table class="min-w-full divide-y divide-gray-200">
                            <thead class="bg-gray-50">
                                <tr>
                                    <th class="px-6 py-3 text-left text-xs font-bold text-black uppercase tracking-wider">@trans('crm.Rule Name')</th>
                                    <th class="px-6 py-3 text-left text-xs font-bold text-black uppercase tracking-wider">@trans('crm.Target Team')</th>
                                    <th class="px-6 py-3 text-left text-xs font-bold text-black uppercase tracking-wider">@trans('crm.Strategy')</th>
                                    <th class="px-6 py-3 text-left text-xs font-bold text-black uppercase tracking-wider">@trans('crm.Status')</th>
                                </tr>
                            </thead>
                            <tbody class="bg-white divide-y divide-gray-200">
                                @forelse($assignmentRules as $rule)
                                    <tr class="hover:bg-gray-50 transition-colors">
                                        <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-black">{{ $rule->name }}</td>
                                        <td class="px-6 py-4 whitespace-nowrap text-sm text-black">
                                            <span class="bg-blue-50 text-blue-700 px-2 py-1 rounded text-xs font-bold">
                                                {{ $rule->team->name ?? 'N/A' }}
                                            </span>
                                        </td>
                                        <td class="px-6 py-4 whitespace-nowrap text-sm text-black">{{ ucfirst(str_replace('_', ' ', $rule->strategy ?? 'round_robin')) }}</td>
                                        <td class="px-6 py-4 whitespace-nowrap text-sm">
                                            @if($rule->is_active)
                                                <span class="px-2 py-1 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">@trans('crm.Active')</span>
                                            @else
                                                <span class="px-2 py-1 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-red-800">@trans('crm.Inactive')</span>
                                            @endif
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="4" class="px-6 py-10 text-center text-black italic">@trans('crm.No assignment rules have been configured yet.')</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>

            {{-- Automation Rules --}}
            @elseif($activeTab == 'automation_rules')
                <div class="space-y-6">
                    <h3 class="text-lg font-bold">@trans('crm.Automation Rules')</h3>
                    <div class="bg-white border rounded-lg shadow-sm">
                        <ul class="divide-y divide-gray-100">
                            @forelse($automationRules as $rule)
                                <li class="px-6 py-4 flex justify-between items-center hover:bg-gray-50 transition-colors">
                                    <div>
                                        <div class="font-bold text-sm text-black">{{ $rule->name }}</div>
                                        <div class="text-xs text-black mt-1 flex items-center gap-2">
                                            <span class="bg-gray-100 px-2 py-0.5 rounded">{{ $rule->trigger_event }}</span>
                                            <span>&rarr;</span>
                                            <span class="italic">{{ $rule->action_type }}</span>
                                        </div>
                                    </div>
                                    <span class="px-3 py-1 rounded-full text-[10px] font-bold {{ $rule->is_active ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800' }}">
                                        @if($rule->is_active) @trans('crm.ACTIVE') @else @trans('crm.INACTIVE') @endif
                                    </span>
                                </li>
                            @empty
                                <li class="px-6 py-12 text-center text-black italic">@trans('crm.No automation rules defined')</li>
                            @endforelse
                        </ul>
                    </div>
                </div>


            {{-- Ticket Categories --}}
            @elseif($activeTab == 'ticket_categories')
                <div class="space-y-6">
                    <h3 class="text-lg font-bold">@trans('crm.Ticket Categories')</h3>
                    <div class="bg-gray-50 p-6 rounded-lg border text-center">
                        <p class="text-black">@trans('crm.Ticket categories are currently managed via global system tags.')</p>
                    </div>
                </div>

            {{-- Referral Sources --}}
            @elseif($activeTab == 'referral_sources')
                <div class="space-y-6">
                    <h3 class="text-lg font-bold">@trans('crm.Referral Sources')</h3>
                    <div class="bg-gray-50 p-6 rounded-lg border text-center">
                        <p class="text-black">@trans('crm.Referral sources management is integrated with the Sources & Channels system.')</p>
                        <a href="?tab=channels" class="text-blue-600 hover:underline text-sm mt-2 block">@trans('crm.Manage Sources') &rarr;</a>
                    </div>
                </div>

            {{-- Qualification Settings --}}
            @elseif($activeTab == 'qualification_settings')
                <div class="space-y-6">
                    <h3 class="text-lg font-bold">@trans('crm.Qualification Settings')</h3>
                    <div class="bg-gray-50 p-6 rounded-lg border">
                        <p class="text-sm text-black mb-4">@trans('crm.Define the criteria for qualifying leads.')</p>
                        <div class="space-y-2">
                            <label class="flex items-center">
                                <input type="checkbox" checked class="rounded border-gray-300">
                                <span class="ml-2 text-sm">@trans('crm.Require phone number for qualification')</span>
                            </label>
                            <label class="flex items-center">
                                <input type="checkbox" class="rounded border-gray-300">
                                <span class="ml-2 text-sm">@trans('crm.Require email address for qualification')</span>
                            </label>
                            <label class="flex items-center">
                                <input type="checkbox" checked class="rounded border-gray-300">
                                <span class="ml-2 text-sm">@trans('crm.Automatic qualification based on score threshold')</span>
                            </label>
                        </div>
                    </div>
                </div>

            {{-- Website Integration --}}
            @elseif($activeTab == 'website_integration')
                <div class="space-y-6">
                    <h3 class="text-lg font-bold">@trans('crm.Website & Webhook Integration')</h3>
                    <div class="bg-gray-50 p-6 rounded-lg border">
                        <h4 class="font-bold text-sm mb-2">@trans('crm.API Endpoint for External Leads')</h4>
                        <code class="block bg-gray-800 text-green-400 p-3 rounded text-xs overflow-x-auto">
                            POST {{ url('/api/crm/leads/webhook') }}
                        </code>
                        <p class="text-xs text-black mt-2">@trans('crm.Use this endpoint to push leads from your website contact forms.')</p>
                    </div>
                </div>

            @else
                <div class="py-12 text-center">
                    <p class="text-black italic">@trans('crm.Content for this section is under development or handled elsewhere.')</p>
                    <p class="text-xs text-black mt-2">Tab: {{ $activeTab }}</p>
                </div>
            @endif
        </div>
    </div>
</div>
@endsection