{{--
    Search Result Item Component
    
    A reusable result card for displaying search results, list items, etc.
    Supports different color schemes, icons, badges, and metadata.
    
    @props
    - href: string - Primary link URL
    - color: string - Color scheme (primary, warning, success, info) - default: primary
    - icon: string - Icon name for the left avatar
    - title: string - Main title text
    - external: bool - Show external link button - default: true
    - animationDelay: int - Animation delay in ms - default: 0
    - compact: bool - Use compact layout - default: false
    
    @slots
    - default: Meta badges and additional content
    - subtitle: Subtitle text below title
    - actions: Custom action buttons
    
    @example
    <x-ui.search-result.item 
        :href="$project->full_url"
        color="primary"
        icon="block-over"
        :title="$client->name_and_surname"
        :animation-delay="$index * 50"
    >
        <x-ui.search-result.ref-badge prefix="D" :id="$project->id"/>
        <x-ui.search-result.status-badge :status="$statusLabel" :is-danger="$isRefus"/>
        <x-ui.search-result.date-badge :date="$date"/>
    </x-ui.search-result.item>
--}}

@props([
    'href' => '#',
    'color' => 'primary',
    'icon' => 'file',
    'title' => '',
    'external' => true,
    'animationDelay' => 0,
    'compact' => false,
])

@php
    $colorClasses = [
        'primary' => ['item' => 'search-item-primary', 'icon' => 'bg-primary-soft'],
        'warning' => ['item' => 'search-item-warning', 'icon' => 'bg-warning-soft'],
        'success' => ['item' => 'search-item-success', 'icon' => 'bg-success-soft'],
        'info' => ['item' => 'search-item-info', 'icon' => 'bg-info-soft'],
        'danger' => ['item' => 'search-item-danger', 'icon' => 'bg-danger-soft'],
    ];
    
    $itemClass = $colorClasses[$color]['item'] ?? $colorClasses['primary']['item'];
    $iconClass = $colorClasses[$color]['icon'] ?? $colorClasses['primary']['icon'];
@endphp

<div 
    class="search-result-item {{ $itemClass }} {{ $compact ? 'compact' : '' }}"
    style="--item-delay: {{ $animationDelay }}ms;"
    {{ $attributes }}
>
    <a href="{{ $href }}" class="result-item-link">
        <div class="result-item-icon {{ $iconClass }}">
            <x-ui.nicon :name="$icon"/>
        </div>
        <div class="result-item-content">
            <div class="result-item-main">
                <span class="result-item-title">{!! e($title) !!}</span>
                
                @if(isset($subtitle) && $subtitle->isNotEmpty())
                <span class="result-item-subtitle">
                    {{ $subtitle }}
                </span>
                @endif
                
                @if($slot->isNotEmpty())
                <div class="result-item-meta">
                    {{ $slot }}
                </div>
                @endif
            </div>
        </div>
    </a>
    
    @if(isset($actions) && $actions->isNotEmpty())
        {{ $actions }}
    @elseif($external)
        <a 
            href="{{ $href }}" 
            target="_blank" 
            class="result-item-action" 
            x-data="tooltip" 
            title="@lang('Open in new tab')"
        >
            <x-ui.nicon name="external"/>
        </a>
    @endif
</div>