@extends('layouts.master')

@section('title', 'Quick Diary Entry')

@push('styles')
@include('modules.processing.diary._diary-design')
<style>
.quick-show-page { max-width: 860px; margin: 0 auto; padding: 24px 28px; }
.kv { display:grid; grid-template-columns: 170px 1fr; gap: 10px 18px; }
@media (max-width: 640px) { .kv { grid-template-columns: 1fr; } }
.k { font-size:.76rem; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-muted); font-weight:700; }
.v { font-size:.95rem; color:var(--ink-soft); }
.v strong { color:var(--ink); font-weight:700; }
.notes-box { background:var(--blue-pale); border:1.5px solid var(--rule-strong); border-radius:var(--r-lg); padding:16px 18px; }
</style>
@endpush

@section('content')
@php
    $assigneeName = $entry?->assignedUser?->name
        ?? (auth()->check() ? auth()->user()->name : null)
        ?? '—';
@endphp

<div class="quick-show-page">
    <nav class="diary-topnav">
        <a href="{{ url('/') }}"><i class="fas fa-home"></i></a>
        <span class="sep">/</span>
        <a href="{{ route('modules.processing.diary.dashboard') }}">Diary</a>
        <span class="sep">/</span>
        <span class="current">Quick Entry</span>
    </nav>

    <div style="display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px;">
        <div style="display:flex;align-items:center;gap:14px;">
            <div style="width:54px;height:54px;background:linear-gradient(135deg,var(--blue-light),var(--blue-deep));border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;font-size:1.35rem;color:#fff;box-shadow:var(--sh-blue);">
                <i class="fas fa-bolt"></i>
            </div>
            <div>
                <h1 style="font-family:var(--font-serif);font-size:1.85rem;font-weight:700;color:var(--ink);line-height:1.15;margin:0 0 5px;">Quick Entry</h1>
                <p style="font-family:var(--font-sans);font-size:.82rem;color:var(--ink-muted);margin:0;">View quick task details and take action.</p>
            </div>
        </div>

        <div style="display:flex;gap:10px;flex-wrap:wrap;">
            <a href="{{ route('modules.processing.diary.entry.edit', ['type' => 'quick', 'id' => $entry->id]) }}" class="btn-diary btn-diary-ghost">
                <i class="fas fa-edit"></i> Edit
            </a>
            <a href="{{ route('modules.processing.diary.entry.print', ['type' => 'quick', 'id' => $entry->id]) }}" target="_blank" class="btn-diary btn-diary-ghost">
                <i class="fas fa-print"></i> Print
            </a>
            <form action="{{ route('modules.processing.diary.entry.destroy', ['type' => 'quick', 'id' => $entry->id]) }}"
                  method="POST"
                  onsubmit="return confirm('Delete this quick entry?')"
                  style="display:inline;">
                @csrf @method('DELETE')
                <button type="submit" class="btn-diary btn-diary-danger">
                    <i class="fas fa-trash"></i> Delete
                </button>
            </form>
        </div>
    </div>

    @if(session('success'))
        <div class="diary-alert success" role="alert">
            <i class="fas fa-check-circle"></i>
            <span>{{ session('success') }}</span>
            <button class="da-close" onclick="this.closest('.diary-alert').remove()">&times;</button>
        </div>
    @endif

    <div class="diary-card" style="animation:slideUp .45s ease both;">
        <div class="diary-card-body">
            <div class="kv">
                <div class="k">Date</div>
                <div class="v"><strong>{{ optional($entry->entry_date)->format('D, d M Y') ?? '—' }}</strong></div>

                <div class="k">Task Type</div>
                <div class="v">{{ $entry->task_type ? ucwords(str_replace('-', ' ', $entry->task_type)) : '—' }}</div>

                <div class="k">Title</div>
                <div class="v"><strong>{{ $entry->task_title }}</strong></div>

                <div class="k">Assigned To</div>
                <div class="v">{{ $assigneeName }}</div>
            </div>

            <div style="margin-top:18px;">
                <div class="k" style="margin-bottom:8px;">Notes</div>
                <div class="notes-box">
                    <div class="v" style="white-space:pre-wrap;">{{ $entry->notes ?: '—' }}</div>
                </div>
            </div>
        </div>
        <div style="padding:16px 18px;border-top:1.5px solid var(--rule);display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;">
            <a href="{{ route('modules.processing.diary.dashboard') }}" class="btn-diary btn-diary-ghost">
                <i class="fas fa-arrow-left"></i> Back to Dashboard
            </a>
            <a href="{{ route('modules.processing.diary.list') }}" class="btn-diary btn-diary-primary">
                <i class="fas fa-list"></i> All Entries
            </a>
        </div>
    </div>
</div>
@endsection