@extends('layout')

@section('content')
    <div class="dashboard_main-content">
        <div class="dashboard_main-header">
            <div class="dashboard_main-header_info">
                <h1 class="dashboard_main-title">Ticket Details</h1>
                <ul class="dashboard_main-breadcrumb">
                    <li><a href="{{ route('admin.dashboard') }}">Dashboard</a></li>
                    <li><a href="{{ route('tickets.index') }}">Tickets</a></li>
                    <li><span>Ticket Details</span></li>
                </ul>
            </div>
            <div class="dashboard_main-actions">
                <a href="{{ route('tickets.edit', $ticket->id) }}" class="dashboard_main-btn">
                    Quick Action
                    <img src="{{ asset('assets/images/icons/angle_right.svg') }}" alt="icon" class="svg" />
                </a>
            </div>
        </div>

        <div class="dashboard_main-body">
            <div class="ticket_details-card_body">
                <div class="ticket_details-card_head">
                    <div class="ticket_details-card_head_info">
                        <h3 class="ticket_details-card_title">
                            {{ $ticket->name }}
                        </h3>
                        <strong class="ticket_details-card_price">
                            {{ $ticket->price }}
                            @if ($ticket->currency)
                                {{ $ticket->currency->symbol ?? $ticket->currency->name }}
                            @else
                                {{ getSetting('default_currency') === 'USD' ? '$' : getSetting('default_currency') ?? '' }}
                            @endif
                        </strong>
                        <span class="ticket_details-card_category">
                            {{ optional($ticket->category)->name ?? 'No Category' }}
                        </span>
                    </div>
                    <div class="ticket_details-card_head_data">
                        <p class="ticket_details-card_id">
                            <span class="title">ID</span>
                            <span class="value">#{{ $ticket->id }}</span>
                            <button class="copy-btn" type="button"
                                onclick="navigator.clipboard.writeText('{{ $ticket->id }}')">
                                <img src="{{ asset('assets/images/icons/copy.svg') }}" alt="icon" class="svg" />
                            </button>
                        </p>

                        <span
                            class="ticket_details-card_status {{ $ticket->status === 'active' ? 'active_status' : 'inactive' }}">
                            {{ ucfirst($ticket->status) }}
                        </span>
                    </div>
                </div>

                <p class="ticket_details-desc">
                    {{ $ticket->description ?? 'No description available.' }}
                </p>

                @if (!empty($ticket->features))
                    <div class="ticket_details-features">
                        <h3 class="ticket_details-features_title">Ticket Features</h3>
                        <ul class="ticket_details-features_list">
                            @foreach ($ticket->features as $feature)
                                <li>{{ $feature }}</li>
                            @endforeach
                        </ul>
                    </div>
                @else
                    <div class="ticket_details-features">
                        <h3 class="ticket_details-features_title">Ticket Features</h3>
                        <p>No features listed for this ticket.</p>
                    </div>
                @endif

            </div>
        </div>
    </div>
@endsection