<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ $grapeVariety->variety_name }}</title>
</head>
<body>
    <h1>{{ $grapeVariety->variety_name }}</h1>

    <div>
        <strong>Wine Type:</strong> {{ $grapeVariety->wine_type }}
    </div>

    <div>
        <strong>Origin:</strong> {{ $grapeVariety->origin ?? 'N/A' }}
    </div>

    <div>
        <strong>Description:</strong>
        <p>{{ $grapeVariety->description ?? 'N/A' }}</p>
    </div>

    <div>
        <strong>Characteristics:</strong>
        <p>{{ $grapeVariety->characteristics ?? 'N/A' }}</p>
    </div>

    @if($grapeVariety->image_url)
        <div>
            <img src="{{ $grapeVariety->image_url }}" alt="{{ $grapeVariety->variety_name }}">
        </div>
    @endif

    <div>
        <h2>Variations</h2>
        @if($grapeVariety->variations->count() > 0)
            <ul>
                @foreach($grapeVariety->variations as $variation)
                    <li>{{ $variation->color }} - {{ $variation->description }}</li>
                @endforeach
            </ul>
        @else
            <p>No variations available.</p>
        @endif
    </div>

    <div>
        <a href="{{ route('grape-varieties.edit', $grapeVariety) }}">Edit</a>
        <a href="{{ route('grape-varieties.index') }}">Back to List</a>
    </div>
</body>
</html>
