@props([
'ticket' => null,
'compact' => false,
'showActions' => true,
'showFinancial' => false,
'href' => null,
])

@php
$ticket = $ticket ?? \App\Support\RepairTicketPresenter::requestPreview();
$mode = $ticket['mode'] ?? 'request';
$isRequest = $mode === 'request';
$isLead = $mode === 'lead' || ! empty($ticket['is_lead']);
$isAdmin = $mode === 'admin';
$steps = \App\Domain\Repair\RepairOrderStatusPresenter::customerSteps();
$currentStep = (int) ($ticket['current_step'] ?? 0);

$statusClass = match ($ticket['status'] ?? 'new') {
'submitted' => 'repair-card-badge--received',
'new' => 'repair-card-badge--new',
'received' => 'repair-card-badge--received',
'diagnosed' => 'repair-card-badge--diagnosed',
'waiting_parts' => 'repair-card-badge--waiting',
'in_repair' => 'repair-card-badge--repairing',
'completed' => 'repair-card-badge--completed',
'delivered' => 'repair-card-badge--delivered',
default => 'repair-card-badge--received',
};

$priorityClass = match ($ticket['priority'] ?? 'medium') {
'low' => 'repair-card-priority--low',
'high' => 'repair-card-priority--high',
'critical' => 'repair-card-priority--critical',
default => 'repair-card-priority--medium',
};

$aiBarClass = fn (int $score) => match (true) {
$score >= 90 => 'repair-card-ai-bar--red',
$score >= 80 => 'repair-card-ai-bar--amber',
default => 'repair-card-ai-bar--blue',
};

$slaRemaining = isset($ticket['sla_remaining_seconds']) && $ticket['sla_remaining_seconds'] !== null
? sprintf(
'%02d:%02d:%02d',
intdiv($ticket['sla_remaining_seconds'], 3600),
intdiv($ticket['sla_remaining_seconds'] % 3600, 60),
$ticket['sla_remaining_seconds'] % 60
)
: null;
@endphp

<article
    {{ $attributes->class([
        'repair-ticket-card group relative',
        'repair-ticket-card--compact' => $compact,
        'repair-ticket-card--request' => $isRequest,
        'repair-ticket-card--chat' => $isRequest,
        'repair-ticket-card--lead' => $isLead,
        'repair-ticket-card--linked' => filled($href),
    ]) }}>
    @if ($href)
        <a href="{{ $href }}" class="repair-ticket-card__hit" aria-label="{{ __('site.account_request_open') }}">
            <span class="repair-ticket-card__hit-glow" aria-hidden="true"></span>
            <span class="repair-ticket-card__hit-cta">
                <x-site.svg-icon name="chat" class="h-4 w-4" />
                <span class="repair-ticket-card__hit-cta-text">{{ __('site.account_request_open') }}</span>
                <x-site.svg-icon name="back" class="h-3.5 w-3.5 repair-ticket-card__hit-cta-arrow" flip />
            </span>
        </a>
    @endif
    @unless ($isRequest)
    {{-- Header --}}
    <header @class(['repair-card-header p-2', 'repair-card-header--stack' => $isLead])>
        <div class="repair-card-header__inner">
            <div class="repair-card-header__meta min-w-0 flex-1 ">
                <span class="repair-card-header__device ">{{ $ticket['device_name'] }}</span>
                @if (! empty($ticket['lead_type_label']))
                <span class="repair-card-badge repair-card-badge--received">{{ $ticket['lead_type_label'] }}</span>
                @endif
                @if (! empty($ticket['repair_id']))
                <span class="repair-card-header__id">
                    {{ $isLead ? __('site.account_request_id') : __('site.repair_card_id') }}
                    {{ $ticket['repair_id'] }}
                </span>
                @else
                <span class="repair-card-header__id">
                    <span @class(['repair-card-badge', $statusClass, 'animate-pulse'=> ($ticket['status'] ?? '') === 'in_repair'])>
                        {{ $ticket['status_label'] }}
                    </span>
                </span>
                @endif
                @if ($isLead && ! empty($ticket['status_label']))
                    <span class="repair-card-badge {{ $statusClass }}">{{ $ticket['status_label'] }}</span>
                @endif
            </div>
            <div class="repair-card-header__status"></div>
        </div>
    </header>
    @endunless

    <div @class(['repair-card-body', 'repair-card-body--chat'=> $isRequest])>
        @if ($isLead)
        <section class="repair-card-section">
            <h3 class="repair-card-section__title">{{ __('assistant.summary_title') }}</h3>
            <dl class="site-assistant-summary__list eca-request-summary">
                @foreach (($ticket['summary_fields'] ?? []) as $field)
                    <dt>{{ $field['label'] }}</dt>
                    <dd @class(['whitespace-pre-wrap' => ($field['key'] ?? '') === 'body'])>{{ $field['value'] }}</dd>
                @endforeach
            </dl>
            @if ($href)
                <p class="mt-4 text-sm font-semibold eca-theme-accent">{{ __('site.account_request_continue') }}</p>
            @endif
        </section>
        @endif

        {{-- Device grid --}}
        @unless ($isRequest || $isLead)
        <section class="repair-card-section">
            <h3 class="repair-card-section__title">{{ __('site.repair_card_device_info') }}</h3>
            <dl class="repair-card-grid">
                <div class="repair-card-grid__item">
                    <dt>{{ __('site.repair_card_device') }}</dt>
                    <dd>{{ $ticket['device_name'] }}</dd>
                </div>
                <div class="repair-card-grid__item">
                    <dt>{{ __('site.repair_card_category') }}</dt>
                    <dd>{{ $ticket['category'] }}</dd>
                </div>
                <div class="repair-card-grid__item">
                    <dt>{{ __('site.repair_card_serial') }}</dt>
                    <dd dir="ltr" class="font-mono text-xs">{{ $ticket['serial'] }}</dd>
                </div>
                <div class="repair-card-grid__item">
                    <dt>{{ __('site.repair_card_warranty') }}</dt>
                    <dd>
                        <span @class([ 'repair-card-inline-badge' , 'repair-card-inline-badge--success'=> $ticket['warranty_active'],
                            ])>{{ $ticket['warranty'] }}</span>
                    </dd>
                </div>
            </dl>
        </section>
        @endunless

        {{-- Timeline (hidden in request/chat mode — shown inside assistant instead) --}}
        @unless ($isRequest || $isLead)
        <section class="repair-card-section repair-card-section--timeline">
            <h3 class="repair-card-section__title">
                {{ __('site.repair_card_timeline') }}
            </h3>
            @php
            $useGridTimeline = $compact;
            $stepRows = array_chunk($steps, 4);
            $progressPct = $ticket['progress_percent']
            ?? ($ticket['sla_percent'] ?? ($currentStep > 0 ? min(100, ($currentStep / max(1, count($steps) - 1)) * 100) : 0));
            @endphp
            <div @class(['repair-card-timeline', 'repair-card-timeline--grid'=> $useGridTimeline])>
                @unless ($useGridTimeline)
                <div class="repair-card-timeline__track" aria-hidden="true"></div>
                <div
                    class="repair-card-timeline__progress"
                    style="--repair-progress: {{ (int) $progressPct }}"
                    aria-hidden="true"></div>
                @endunless
                @if ($useGridTimeline)
                @foreach ($stepRows as $rowIndex => $rowSteps)
                <ol @class(['repair-card-timeline__row', 'repair-card-timeline__row--tail'=> $rowIndex === 1])>
                    @foreach ($rowSteps as $localIndex => $rowStep)
                    @php
                    $index = ($rowIndex * 4) + $localIndex;
                    $state = $index < $currentStep ? 'done' : ($index===$currentStep ? 'active' : 'pending' );
                        @endphp
                        <li @class(['repair-card-step', "repair-card-step--{$state}" ])>
                        <span class="repair-card-step__dot">
                            @if ($state === 'done')
                            <x-site.svg-icon name="check" class="h-3 w-3" />
                            @else
                            <span>{{ $index + 1 }}</span>
                            @endif
                        </span>
                        <span class="repair-card-step__label">{{ __('site.repair_step_'.$rowStep) }}</span>
                        </li>
                        @endforeach
                </ol>
                @endforeach
                @else
                <ol class="repair-card-timeline__steps">
                    @foreach ($steps as $index => $step)
                    @php
                    $state = $index < $currentStep ? 'done' : ($index===$currentStep ? 'active' : 'pending' );
                        @endphp
                        <li @class(['repair-card-step', "repair-card-step--{$state}" ])>
                        <span class="repair-card-step__dot">
                            @if ($state === 'done')
                            <x-site.svg-icon name="check" class="h-4 w-4" />
                            @else
                            <span>{{ $index + 1 }}</span>
                            @endif
                        </span>
                        <span class="repair-card-step__label">{{ __('site.repair_step_'.$step) }}</span>
                        </li>
                        @endforeach
                </ol>
                @endif
            </div>
        </section>
        @endunless

        @if (! empty($ticket['status_logs']))
        <section class="repair-card-section">
            <h3 class="repair-card-section__title">{{ __('site.repair_order_timeline') }}</h3>
            <ol class="repair-card-status-log">
                @foreach ($ticket['status_logs'] as $log)
                <li class="repair-card-status-log__item">
                    <div class="repair-card-status-log__meta">
                        <span>{{ $log['at']?->format('Y-m-d H:i') }}</span>
                        <span>
                            @if ($log['from'])
                            {{ $log['from'] }} →
                            @endif
                            {{ $log['to'] }}
                        </span>
                    </div>
                    @if (! empty($log['note']))
                    <p class="repair-card-status-log__note">{{ $log['note'] }}</p>
                    @endif
                </li>
                @endforeach
            </ol>
        </section>
        @endif

        {{-- Chat / form slot --}}
        @if ($isRequest)
        <section class="repair-card-chat-slot">
            <div class="repair-card-form-panel repair-card-form-panel--chat">
                {{ $slot }}
            </div>
        </section>
        @elseif (! $isLead && ! empty($ticket['issue']))
        <section class="repair-card-section">
            <h3 class="repair-card-section__title">{{ __('site.repair_card_issue') }}</h3>
            <div class="repair-card-issue">
                <p class="whitespace-pre-wrap leading-relaxed">{{ $ticket['issue'] }}</p>
            </div>
        </section>
        @endif

        @unless ($isRequest || $isLead)
        {{-- AI Diagnostics --}}
        @if (! empty($ticket['ai_diagnostics']))
        <section class="repair-card-section">
            <h3 class="repair-card-section__title">{{ __('site.repair_card_ai') }}</h3>
            <ul class="repair-card-ai-list">
                @foreach ($ticket['ai_diagnostics'] as $diag)
                <li>
                    <div class="repair-card-ai-list__row">
                        <span>{{ $diag['label'] }}</span>
                        <span class="repair-card-ai-list__score">{{ $diag['score'] }}%</span>
                    </div>
                    <div class="repair-card-ai-bar">
                        <span @class(['repair-card-ai-bar__fill', $aiBarClass($diag['score'])]) style="--repair-fill: {{ (int) $diag['score'] }}"></span>
                    </div>
                </li>
                @endforeach
            </ul>
        </section>
        @endif

        {{-- Technician + Priority + Cost --}}
        <section class="repair-card-section repair-card-section--split">
            @if (! empty($ticket['technician']))
            <div class="repair-card-tech">
                <img src="{{ $ticket['technician']['avatar'] }}" alt="" class="repair-card-tech__avatar" loading="lazy" />
                <div class="min-w-0">
                    <p class="repair-card-tech__name">{{ $ticket['technician']['name'] }}</p>
                    <p class="repair-card-tech__role">{{ $ticket['technician']['role'] }}</p>
                    <div class="repair-card-tech__badges">
                        <span class="repair-card-inline-badge repair-card-inline-badge--info">{{ $ticket['technician']['badge'] }}</span>
                        <span class="repair-card-inline-badge">{{ __('site.repair_card_level') }} {{ $ticket['technician']['level'] }}</span>
                    </div>
                </div>
            </div>
            @endif

            <div class="repair-card-side-stack">
                <div @class(['repair-card-priority', $priorityClass])>
                    <span class="repair-card-priority__label">{{ __('site.repair_card_priority') }}</span>
                    <span class="repair-card-priority__value">{{ __('site.repair_priority_'.$ticket['priority']) }}</span>
                </div>

                @if ($showFinancial)
                <section class="eca-smart-card__financial repair-card-cost" aria-label="{{ __('site.repair_card_final') }}">
                    @if (! empty($ticket['final_cost']))
                    <div class="eca-smart-card__financial-item">
                        <span class="eca-smart-card__financial-label">{{ __('site.repair_card_final') }}</span>
                        <span class="eca-smart-card__financial-value eca-smart-card__financial-value--accent">{{ $ticket['final_cost'] }}</span>
                    </div>
                    @endif
                    @if (! empty($ticket['estimated_cost']) && empty($ticket['final_cost']))
                    <div class="eca-smart-card__financial-item">
                        <span class="eca-smart-card__financial-label">{{ __('site.repair_card_estimated') }}</span>
                        <span class="eca-smart-card__financial-value">{{ $ticket['estimated_cost'] }}</span>
                    </div>
                    @endif
                    @if (! empty($ticket['paid_cost']) && ($ticket['paid_cost'] ?? '—') !== '—')
                    <div class="eca-smart-card__financial-item">
                        <span class="eca-smart-card__financial-label">{{ __('site.card_paid') }}</span>
                        <span class="eca-smart-card__financial-value eca-smart-card__financial-value--paid">{{ $ticket['paid_cost'] }}</span>
                    </div>
                    @endif
                    @if (! empty($ticket['remaining_cost']))
                    <div class="eca-smart-card__financial-item eca-smart-card__financial-item--remaining">
                        <span class="eca-smart-card__financial-label">{{ __('site.card_remaining') }}</span>
                        <span class="eca-smart-card__financial-value eca-smart-card__financial-value--remaining">{{ $ticket['remaining_cost'] }}</span>
                    </div>
                    @endif
                </section>
                @elseif ($isAdmin && (! empty($ticket['estimated_cost']) || ! empty($ticket['final_cost'])))
                <div class="repair-card-cost">
                    @if (! empty($ticket['estimated_cost']))
                    <div>
                        <span class="repair-card-cost__label">{{ __('site.repair_card_estimated') }}</span>
                        <span class="repair-card-cost__value">{{ $ticket['estimated_cost'] }}</span>
                    </div>
                    @endif
                    @if (! empty($ticket['final_cost']))
                    <div>
                        <span class="repair-card-cost__label">{{ __('site.repair_card_final') }}</span>
                        <span class="repair-card-cost__value repair-card-cost__value--accent">{{ $ticket['final_cost'] }}</span>
                    </div>
                    @endif
                    @if (! empty($ticket['profit']))
                    <div class="repair-card-cost__profit">
                        <span class="repair-card-cost__label">{{ __('site.repair_card_profit') }}</span>
                        <span class="repair-card-cost__value">{{ $ticket['profit'] }}</span>
                    </div>
                    @endif
                </div>
                @endif
            </div>
        </section>

        {{-- Customer --}}
        <section class="repair-card-section">
            <h3 class="repair-card-section__title">{{ __('site.repair_card_customer') }}</h3>
            <div class="repair-card-customer">
                <div>
                    <p class="repair-card-customer__name">{{ $ticket['customer_name'] }}</p>
                    @if (! empty($ticket['customer_phone']))
                    <p class="repair-card-customer__phone" dir="ltr">{{ $ticket['customer_phone'] }}</p>
                    @endif
                </div>
                @if (! empty($ticket['customer_tier']))
                <span class="repair-card-inline-badge repair-card-inline-badge--gold">{{ $ticket['customer_tier'] }}</span>
                @endif
            </div>
        </section>

        {{-- Parts --}}
        @if (! empty($ticket['parts']))
        <section class="repair-card-section">
            <h3 class="repair-card-section__title">{{ __('site.repair_card_parts') }}</h3>
            <ul class="repair-card-parts">
                @foreach ($ticket['parts'] as $part)
                <li class="repair-card-parts__item">
                    <span>{{ $part['name'] }}</span>
                    <span @class([ 'repair-card-inline-badge' , 'repair-card-inline-badge--success'=> $part['status_key'] === 'installed',
                        'repair-card-inline-badge--warning' => $part['status_key'] === 'ordered',
                        ])>{{ $part['status'] }}</span>
                </li>
                @endforeach
            </ul>
        </section>
        @endif

        {{-- SLA --}}
        @if ($slaRemaining !== null)
        <section class="repair-card-section">
            <h3 class="repair-card-section__title">{{ __('site.repair_card_sla') }}</h3>
            <div class="repair-card-sla">
                <div
                    class="repair-card-sla__ring"
                    style="--sla-pct: {{ $ticket['sla_percent'] ?? 100 }}"
                    aria-hidden="true"></div>
                <div>
                    <p class="repair-card-sla__label">{{ __('site.repair_card_sla_remaining') }}</p>
                    <p @class(['repair-card-sla__time', 'animate-bounce text-red-400'=> $ticket['sla_urgent']]) dir="ltr">{{ $slaRemaining }}</p>
                </div>
            </div>
        </section>
        @endif
        @endunless

        {{-- Actions --}}
        @if ($showActions && ! $isRequest)
        <footer class="repair-card-actions">
            {{ $actions ?? '' }}
        </footer>
        @endif
    </div>
</article>