@extends('layouts.user')

@section('title', 'My Meals')
@section('page-title', 'My Meals')
@section('page-subtitle', 'Manage your meals for today.')

@section('content')

    @if (session('success'))
        <div class="card">
            {{ session('success') }}
        </div>
    @endif

    @if ($errors->any())
        <div class="card">
            <strong>Please fix the following errors:</strong>
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    <div class="page-heading">
        <div>
            <h2>Log a Meal</h2>
            <p>Select a food and enter the amount you ate.</p>
        </div>
    </div>

    <div class="card form-card">
        <form method="POST" action="{{ route('user.meals.store') }}">
            @csrf

            <div class="form-grid">
                <div class="form-group">
                    <label for="meal_type">Meal Type</label>
                    <select class="form-control" id="meal_type" name="meal_type" required>
                        <option value="">Select meal type</option>
                        @foreach (['Breakfast', 'Lunch', 'Dinner', 'Snacks'] as $type)
                            <option value="{{ $type }}" @selected(old('meal_type') === $type)>
                                {{ $type }}
                            </option>
                        @endforeach
                    </select>
                </div>

                <div class="form-group">
                    <label for="food_id">Select Food</label>
                    <select class="form-control" id="food_id" name="food_id" required>
                        <option value="">Select food</option>
                        @foreach ($foods as $food)
                            <option value="{{ $food->id }}" @selected((string) old('food_id') === (string) $food->id)>
                                {{ $food->name }} — {{ number_format($food->calories_per_100g) }} kcal / 100g
                            </option>
                        @endforeach
                    </select>
                </div>

                <div class="form-group">
                    <label for="quantity_grams">Quantity</label>
                    <div class="quantity-input">
                        <input class="form-control" id="quantity_grams" name="quantity_grams" type="number" min="1"
                            max="10000" step="0.1" value="{{ old('quantity_grams', 100) }}" required>
                        <span>grams</span>
                    </div>
                </div>
            </div>

            <button type="submit" class="btn btn-primary">
                Add Meal
            </button>
        </form>
    </div>

    <div class="section-header">
        <div>
            <h3>Today's Meals</h3>
            <p>
                {{ number_format($todayCalories) }} kcal ·
                Protein {{ number_format($proteinTotal, 1) }}g ·
                Carbs {{ number_format($carbsTotal, 1) }}g ·
                Fat {{ number_format($fatTotal, 1) }}g
            </p>
        </div>
    </div>

    <div class="card table-card">
        <table>
            <thead>
                <tr>
                    <th>Meal</th>
                    <th>Food</th>
                    <th>Quantity</th>
                    <th>Calories</th>
                    <th>Protein</th>
                    <th>Time</th>
                    <th>Action</th>
                </tr>
            </thead>

            <tbody>
                @forelse ($meals as $meal)
                    <tr>
                        <td>{{ $meal->meal_type }}</td>
                        <td>{{ $meal->food_name }}</td>
                        <td>{{ number_format($meal->quantity_grams) }}g</td>
                        <td>{{ number_format($meal->calories) }} kcal</td>
                        <td>{{ number_format($meal->protein, 1) }}g</td>
                        <td>{{ $meal->consumed_at?->format('h:i A') ?? '—' }}</td>
                        <td>
                            <form method="POST" action="{{ route('user.meals.destroy', $meal->id) }}"
                                onsubmit="return confirm('Delete this meal?')">
                                @csrf
                                @method('DELETE')

                                <button type="submit" class="delete-btn">
                                    Delete
                                </button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="7">No meals logged today.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>

@endsection