@extends('layouts.app')
@section('title', 'Bangladesh Unbound - Edit Package')
@section('page-title', 'View Package')@push('styles')
<!-- Quill.js CSS -->
<link href="https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css" rel="stylesheet">

<style>
    .rich-text-editor {
        min-height: 120px;
        border: 1px solid #ced4da;
        border-radius: 0.375rem;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

    .rich-text-editor .ql-editor {
        min-height: 100px;
    }

    .rich-text-editor .ql-toolbar {
        border-top: 1px solid #ced4da;
        border-left: 1px solid #ced4da;
        border-right: 1px solid #ced4da;
        border-bottom: none;
        border-radius: 0.375rem 0.375rem 0 0;
    }

    .rich-text-editor .ql-container {
        border-top: none;
        border-left: 1px solid #ced4da;
        border-right: 1px solid #ced4da;
        border-bottom: 1px solid #ced4da;
        border-radius: 0 0 0.375rem 0.375rem;
    }
</style>
@endpush
@section('breadcrumb')
<!-- Breadcrumb Navigation -->
<nav class="breadcrumb-container" aria-label="breadcrumb" class="mb-4">
    <ol class="breadcrumb">
        <li class="breadcrumb-item">
            <a href="{{ route('customer.dashboard') }}">
                <img src="{{ asset('backend/img/ico/ico-dashboard.svg') }}" alt="Dashboard" class="breadcrumb-icon">
                Dashboard
            </a>
        </li>
        <li class="breadcrumb-item">
            <a href="{{ route('customer.custom-package-requests.index') }}">
                <img src="{{ asset('backend/img/ico/ico-packages.svg') }}" alt="Packages" class="breadcrumb-icon">
                 Custom Package Requests
            </a>
        </li>
        <li class="breadcrumb-item active" aria-current="page">
            <img src="{{ asset('backend/img/ico/ico-packages.svg') }}" alt="Create Package" class="breadcrumb-icon">
            View Package
        </li>
    </ol>
</nav>

@endsection
@section('content')
<!-- Create Package Header -->
<div class="create-package-header">
    <div class="d-flex align-items-center justify-content-between">
        <h3 class="mb-0 section-title">
            <img src="{{ asset('backend/img/ico/ico-packages.svg') }}" alt="Create Package" class="section-icon">
            View Package
        </h3>
    </div>
</div>

<div class="create-package-container">

        <div class="form-section">
            <h4 class="section-subtitle">Package Name:</h4>
            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <input type="text" class="form-control @error('name') is-invalid @enderror" id="name"
                            name="name" placeholder="Enter package name" value="{{ old('name', $tourPackage->name) }}"
                            disabled>
                        @error('name')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- Price Information Card -->
            <div class="form-card">
                <h5 class="card-title">Price Information</h5>
                <div class="row">
                    <div class="col-md-4">
                        <div class="mb-3 form-group">
                            <label for="unit_price" class="form-label">Regular Price</label>
                            <input type="number" class="form-control @error('unit_price') is-invalid @enderror"
                                id="unit_price" name="unit_price" placeholder="Enter regular price" step="0.01"
                                value="{{ old('unit_price', $tourPackage->unit_price) }}" disabled>
                            @error('unit_price')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="mb-3 form-group">
                            <label for="discount_price" class="form-label">Discounted Price</label>
                            <input type="number" class="form-control @error('discount_price') is-invalid @enderror"
                                id="discount_price" name="discount_price" placeholder="Enter discounted price"
                                step="0.01" value="{{ old('discount_price', $tourPackage->discount_price) }}" disabled>
                            @error('discount_price')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="mb-3 form-group">
                            <label for="booking_amount" class="form-label">Booking Money</label>
                            <input type="number" class="form-control @error('booking_amount') is-invalid @enderror"
                                id="booking_amount" name="booking_amount" placeholder="Enter booking money" step="0.01"
                                value="{{ old('booking_amount', $tourPackage->booking_amount) }}" disabled>
                            @error('booking_amount')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>
            </div>

            <div class="form-card">
                <h5 class="card-title">Package Settings</h5>
                <div class="row">
                    <div class="col-md-3">
                        <div class="mb-3 form-check">
                            <input type="hidden" name="is_show_on_website" value="0">
                            <input class="form-check-input" type="checkbox" id="is_show_on_website"
                                name="is_show_on_website" value="1" {{ old('is_show_on_website',
                                $tourPackage->is_show_on_website) ? 'checked' : '' }}  disabled>
                            <label class="form-check-label" for="is_show_on_website">
                                Show this on Website?
                            </label>
                        </div>
                    </div>

                    <div class="col-md-3">
                        <div class="mb-3 form-check">
                            <input type="hidden" name="is_featured" value="0">
                            <input class="form-check-input" type="checkbox" id="is_featured" name="is_featured"
                                value="1" {{ old('is_featured', $tourPackage->is_featured) ? 'checked' : '' }}  disabled>
                            <label class="form-check-label" for="is_featured">
                                Make this Featured?
                            </label>
                        </div>
                    </div>

                    <div class="col-md-3">
                        <div class="mb-3 form-check">
                            <input type="hidden" name="is_popular_day_trips" value="0">
                            <input class="form-check-input" type="checkbox" id="is_popular_day_trips"
                                name="is_popular_day_trips" value="1" {{ old('is_popular_day_trips',
                                $tourPackage->is_popular_day_trips) ? 'checked' : '' }}  disabled>
                            <label class="form-check-label" for="is_popular_day_trips">
                                Popular Day Trips?
                            </label>
                        </div>
                    </div>

                    <div class="col-md-3">
                        <div class="mb-3 form-check">
                            <input type="hidden" name="is_travellers_choice" value="0">
                            <input class="form-check-input" type="checkbox" id="is_travellers_choice"
                                name="is_travellers_choice" value="1" {{ old('is_travellers_choice',
                                $tourPackage->is_travellers_choice) ? 'checked' : '' }}  disabled>
                            <label class="form-check-label" for="is_travellers_choice">
                                Tours by Travellers Choice?
                            </label>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Activities Selection -->
            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <h4 class="section-subtitle">Select Activities:</h4>
                        <div class="activities-checkboxes">
                            <div class="row">
                                <div class="col-md-6">
                                    @php
                                    $activities = is_array($tourPackage->tour_activities)
                                    ? $tourPackage->tour_activities
                                    : json_decode($tourPackage->tour_activities, true) ?? [];
                                    $oldActivities = old('tour_activities', $activities);
                                    @endphp
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="artCrafts"
                                            name="tour_activities[]" value="art-crafts" {{ in_array('art-crafts',
                                            $oldActivities) ? 'checked' : '' }} disabled>
                                        <label class="form-check-label" for="artCrafts">
                                            Art & Crafts
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="boatCruise"
                                            name="tour_activities[]" value="boat-cruise" {{ in_array('boat-cruise',
                                            $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="boatCruise">
                                            Boat & Cruise
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="culinaryFood"
                                            name="tour_activities[]" value="culinary-food" {{ in_array('culinary-food',
                                            $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="culinaryFood">
                                            Culinary & Food
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="cyclingCamping"
                                            name="tour_activities[]" value="cycling-camping" {{
                                            in_array('cycling-camping', $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="cyclingCamping">
                                            Cycling & Camping
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="folkFestivals"
                                            name="tour_activities[]" value="folk-festivals" {{
                                            in_array('folk-festivals', $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="folkFestivals">
                                            Folk & Festivals
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="historyHeritage"
                                            name="tour_activities[]" value="history-heritage" {{
                                            in_array('history-heritage', $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="historyHeritage">
                                            History & Heritage
                                        </label>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="natureWildlife"
                                            name="tour_activities[]" value="nature-wildlife" {{
                                            in_array('nature-wildlife', $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="natureWildlife">
                                            Nature & Wildlife
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="trailingWalking"
                                            name="tour_activities[]" value="trailing-walking" {{
                                            in_array('trailing-walking', $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="trailingWalking">
                                            Trailing & Walking
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="adventureSports"
                                            name="tour_activities[]" value="adventure-sports" {{
                                            in_array('adventure-sports', $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="adventureSports">
                                            Adventure & Sports
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="photographyTours"
                                            name="tour_activities[]" value="photography-tours" {{
                                            in_array('photography-tours', $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="photographyTours">
                                            Photography Tours
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="religiousSites"
                                            name="tour_activities[]" value="religious-sites" {{
                                            in_array('religious-sites', $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="religiousSites">
                                            Religious Sites
                                        </label>
                                    </div>
                                    <div class="form-check activity-checkbox">
                                        <input class="form-check-input" type="checkbox" id="beachCoastal"
                                            name="tour_activities[]" value="beach-coastal" {{ in_array('beach-coastal',
                                            $oldActivities) ? 'checked' : '' }}  disabled>
                                        <label class="form-check-label" for="beachCoastal">
                                            Beach & Coastal
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @error('tour_activities')
                        <div class="mt-1 text-danger small">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>
        </div>

        <!-- Package Details Section -->
        <div class="form-section">
            <h4 class="section-subtitle">Package Details:</h4>

            <!-- Tour Date Information -->
            <div class="form-card">
                <h5 class="card-title">Tour Date</h5>
                <div class="row">
                    <div class="col-md-6">
                        <div class="mb-3 form-group">
                            <label for="from_date" class="form-label">
                                <i class="bi bi-calendar text-success me-2"></i>From Date
                            </label>
                            <input type="date" class="form-control @error('from_date') is-invalid @enderror"
                                id="from_date" name="from_date"
                                value="{{ old('from_date', optional($tourPackage->from_date)->format('Y-m-d')) }}"
                                disabled>
                            @error('from_date')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3 form-group">
                            <label for="to_date" class="form-label">
                                <i class="bi bi-calendar-check text-success me-2"></i>To Date
                            </label>
                            <input type="date" class="form-control @error('to_date') is-invalid @enderror" id="to_date"
                                name="to_date"
                                value="{{ old('to_date', optional($tourPackage->to_date)->format('Y-m-d')) }}" disabled>
                            @error('to_date')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>
            </div>

            <!-- Tour Information Grid -->
            <div class="tour-info-grid">
                <div class="row">
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="tour_type_id" class="form-label">
                                <i class="bi bi-calendar-check text-success me-2"></i>Tour Type
                            </label>
                            <select class="form-control admin-select @error('tour_type_id') is-invalid @enderror"
                                id="tour_type_id" name="tour_type_id" disabled>
                                <option value="">Select Tours Type</option>
                                @foreach ($tourTypes as $type)
                                <option value="{{ $type->id }}" {{ old('tour_type_id', $tourPackage->tour_type_id) ==
                                    $type->id ? 'selected' : '' }}>
                                    {{ $type->name }}
                                </option>
                                @endforeach
                            </select>
                            @error('tour_type_id')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="duration" class="form-label">
                                <i class="bi bi-clock text-success me-2"></i>Duration
                            </label>
                            <input type="text" class="form-control @error('duration') is-invalid @enderror"
                                id="duration" name="duration" placeholder="e.g., 2 Days, 1 Night"
                                value="{{ old('duration', $tourPackage->duration) }}" disabled>
                            @error('duration')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="group_size" class="form-label">
                                <i class="bi bi-people text-success me-2"></i>Group Size
                            </label>
                            <input type="text" class="form-control @error('group_size') is-invalid @enderror"
                                id="group_size" name="group_size" placeholder="e.g., 8 Persons (Max)"
                                value="{{ old('group_size', $tourPackage->group_size) }}" disabled>
                            @error('group_size')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="accommodation" class="form-label">
                                <i class="bi bi-building text-success me-2"></i>Accommodation
                            </label>
                            <input type="text" class="form-control @error('accommodation') is-invalid @enderror"
                                id="accommodation" name="accommodation" placeholder="e.g., 0 (Not Included)"
                                value="{{ old('accommodation', $tourPackage->accommodation) }}" disabled>
                            @error('accommodation')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="transportation" class="form-label">
                                <i class="bi bi-car-front text-success me-2"></i>Transportation
                            </label>
                            <input type="text" class="form-control @error('transportation') is-invalid @enderror"
                                id="transportation" name="transportation" placeholder="e.g., A/C Vehicle"
                                value="{{ old('transportation', $tourPackage->transportation) }}" disabled>
                            @error('transportation')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="meals" class="form-label">
                                <i class="bi bi-cup-straw text-success me-2"></i>Meals
                            </label>
                            <input type="text" class="form-control @error('meals') is-invalid @enderror" id="meals"
                                name="meals" placeholder="e.g., 1 (Lunch/person)"
                                value="{{ old('meals', $tourPackage->meals) }}" disabled>
                            @error('meals')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="fitness_level" class="form-label">
                                <i class="bi bi-activity text-success me-2"></i>Fitness Level
                            </label>
                            <input type="text" class="form-control @error('fitness_level') is-invalid @enderror"
                                id="fitness_level" name="fitness_level" placeholder="e.g., Moderate"
                                value="{{ old('fitness_level', $tourPackage->fitness_level) }}" disabled>
                            @error('fitness_level')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="minimum_age" class="form-label">
                                <i class="bi bi-person text-success me-2"></i>Minimum Age
                            </label>
                            <input type="number" min="0" step="0.2"
                                class="form-control @error('minimum_age') is-invalid @enderror" id="minimum_age"
                                name="minimum_age" placeholder="e.g., 6"
                                value="{{ old('minimum_age', $tourPackage->minimum_age) }}" disabled>
                            @error('minimum_age')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="language" class="form-label">
                                <i class="bi bi-translate text-success me-2"></i>Language
                            </label>
                            <input type="text" class="form-control @error('language') is-invalid @enderror"
                                id="language" name="language" placeholder="e.g., English"
                                value="{{ old('language', $tourPackage->language ?? 'English') }}" disabled>
                            @error('language')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="best_season" class="form-label">
                                <i class="bi bi-sun text-success me-2"></i>Best Season
                            </label>
                            <input type="text" class="form-control @error('best_season') is-invalid @enderror"
                                id="best_season" name="best_season" placeholder="e.g., All Year Round"
                                value="{{ old('best_season', $tourPackage->best_season) }}" disabled>
                            @error('best_season')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="guiding_method" class="form-label">
                                <i class="bi bi-person-check text-success me-2"></i>Guiding Method
                            </label>
                            <input type="text" class="form-control @error('guiding_method') is-invalid @enderror"
                                id="guiding_method" name="guiding_method" placeholder="e.g., Full Time"
                                value="{{ old('guiding_method', $tourPackage->guiding_method) }}" disabled>
                            @error('guiding_method')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="location" class="form-label">
                                <i class="bi bi-geo-alt text-success me-2"></i>Location
                            </label>
                            <input type="text" class="form-control @error('location') is-invalid @enderror"
                                id="location" name="location" placeholder="e.g., New & Old Dhaka"
                                value="{{ old('location', $tourPackage->location) }}" disabled>
                            @error('location')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="travel_point_id" class="form-label">
                                <i class="bi bi-geo-alt-fill text-success me-2"></i>Select Destinations
                            </label>
                            <select class="form-control admin-select @error('travel_point_id') is-invalid @enderror"
                                id="travel_point_id" name="travel_point_id" disabled>
                                <option value="">Select Destination</option>
                                @foreach ($travelPoints as $point)
                                <option value="{{ $point->id }}" {{ old('travel_point_id', $tourPackage->
                                    travel_point_id) == $point->id ? 'selected' : '' }}>
                                    {{ $point->name }}
                                </option>
                                @endforeach
                            </select>
                            @error('travel_point_id')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="max_altitude" class="form-label">
                                <i class="bi bi-triangle text-success me-2"></i>Max Altitude
                            </label>
                            <input type="text" class="form-control @error('max_altitude') is-invalid @enderror"
                                id="max_altitude" name="max_altitude" placeholder="e.g., Not Applicable"
                                value="{{ old('max_altitude', $tourPackage->max_altitude) }}" disabled>
                            @error('max_altitude')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="arrival_on" class="form-label">
                                <i class="bi bi-airplane-engines text-success me-2"></i>Arrival On
                            </label>
                            <input type="text" class="form-control @error('arrival_on') is-invalid @enderror"
                                id="arrival_on" name="arrival_on" placeholder="e.g., Dhaka, Bangladesh"
                                value="{{ old('arrival_on', $tourPackage->arrival_on) }}" disabled>
                            @error('arrival_on')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="mb-3 form-group">
                            <label for="departure_from" class="form-label">
                                <i class="bi bi-airplane text-success me-2"></i>Departure From
                            </label>
                            <input type="text" class="form-control @error('departure_from') is-invalid @enderror"
                                id="departure_from" name="departure_from" placeholder="e.g., Dhaka, Bangladesh"
                                value="{{ old('departure_from', $tourPackage->departure_from) }}" disabled>
                            @error('departure_from')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>
            </div>

            <!-- Subtitle -->
            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <label for="sub_title" class="form-label">Subtitle</label>
                        <input type="text" class="form-control @error('sub_title') is-invalid @enderror" id="sub_title"
                            name="sub_title" placeholder="Enter package subtitle"
                            value="{{ old('sub_title', $tourPackage->sub_title) }}" disabled>
                        @error('sub_title')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <label for="packageIntro" class="form-label @error('intro') is-invalid @enderror">Intro</label>
                        <div id="packageIntroEditor" class="rich-text-editor">{!! old('intro', $tourPackage->intro) !!}
                        </div>
                        <textarea class="form-control d-none" id="packageIntro" name="intro" rows="4"
                            placeholder="Enter tour introduction">{{ old('intro', $tourPackage->intro) }}</textarea>
                        @error('intro')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>


            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <label for="tourHighlights"
                            class="form-label @error('tour_highlight') is-invalid @enderror">Tour Highlights</label>
                        <div id="tourHighlightsEditor" class="rich-text-editor">{!! old('tour_highlight',
                            $tourPackage->tour_highlight) !!}</div>
                        <textarea class="form-control d-none" id="tourHighlights" name="tour_highlight" rows="4"
                            placeholder="Enter tour highlights">{{ old('tour_highlight', $tourPackage->tour_highlight) }}</textarea>
                        @error('tour_highlight')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <label for="tourAttractions"
                            class="form-label @error('tour_attraction') is-invalid @enderror">Tour Attractions</label>
                        <div id="tourAttractionsEditor" class="rich-text-editor">{!! old('tour_attraction',
                            $tourPackage->tour_attraction) !!}</div>
                        <textarea class="form-control d-none" id="tourAttractions" name="tour_attraction" rows="4"
                            placeholder="Enter tour attractions">{{ old('tour_attraction', $tourPackage->tour_attraction) }}</textarea>
                        @error('tour_attraction')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- Dynamic Itinerary Section -->
            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <label class="form-label">Itinerary</label>

                        <!-- Itinerary Days Container -->
                        <div class="itinerary-container" id="itineraryContainer">
                            @php
                            $itineraryDays = old('itinerary_days', $itinerary_days);
                            // key count
                            $dayCount = count(array_keys($itineraryDays));
                            // dd($itineraryDays);
                            @endphp
                            @if ($dayCount == 0)
                            <div class="itinerary-day" data-day="1">
                                <div class="itinerary-day-header">
                                    <h6 class="itinerary-day-title">Day 1</h6>
                                    <button type="button" class="btn btn-sm btn-outline-danger remove-itinerary-day"
                                        onclick="removeItineraryDay(1)">
                                        <i class="bi bi-trash"></i>
                                    </button>
                                </div>
                                <div id="itineraryDay1Editor" class="rich-text-editor">
                                </div>
                                <textarea class="form-control d-none @error('itinerary_days.' . 1) is-invalid @enderror"
                                    name="itinerary_days[1]" rows="3"
                                    placeholder="Enter Day 1 itinerary details"></textarea>
                                @error('itinerary_days.' . 1)
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                            @else
                            @foreach ($itineraryDays as $day => $content)
                            {{ $loop->iteration }}
                            <div class="itinerary-day" data-day="{{ $loop->iteration }}" disabled>
                                <div class="itinerary-day-header">
                                    <h6 class="itinerary-day-title">Day {{ $loop->iteration }}</h6>
                                    @if ($day > 1)
                                    <button type="button" class="btn btn-sm btn-outline-danger remove-itinerary-day"
                                        onclick="removeItineraryDay({{ $loop->iteration }})">
                                        <i class="bi bi-trash"></i>
                                    </button>
                                    @endif
                                </div>
                                <div id="itineraryDay{{ $loop->iteration }}Editor" class="rich-text-editor">
                                    {!! $content !!}</div>
                                <textarea
                                    class="form-control d-none @error('itinerary_days.' . $loop->iteration) is-invalid @enderror"
                                    name="itinerary_days[{{ $loop->iteration }}]" rows="3"
                                    placeholder="Enter Day {{ $loop->iteration }} itinerary details">{!! $content !!}</textarea>
                                @error('itinerary_days.' . $loop->iteration)
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                            @endforeach
                            @endif
                        </div>

                    </div>
                </div>
            </div>

            <!-- Tour Map Image Upload -->
            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <label for="map_image" class="form-label">Tour Map Image</label>
                        <input type="file" class="form-control @error('map_image') is-invalid @enderror" id="map_image"
                            name="map_image" accept="image/*"
                            onchange="updatePreview(this, 'mapImgPreview', 'removeMapImg')">
                        <small class="form-text text-muted">Upload a single tour map image. Supported formats: JPG,
                            PNG, GIF</small>
                        <div class="mt-2 text-center" id="mapImgPreviewContainer">
                            <img id="mapImgPreview" src="https://via.placeholder.com/200"
                                style="display: none; width: 200px; height: 150px; object-fit: cover;" class="rounded"
                                alt="Feature Image Preview">
                            <button type="button" id="removeMapImg" class="mt-1 btn btn-sm btn-danger"
                                style="display: none;"
                                onclick="removeImage('mapImgPreview', 'removeMapImg', 'map_image')">
                                <i class="bi bi-trash"></i> Remove
                            </button>
                        </div>
                        @error('map_image')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror

                        {{--
                        <!-- Tour Map Image Preview -->
                        <div class="mt-3 tour-map-preview" id="tourMapPreview"
                            style="{{ $tourPackage->map_image ? '' : 'display: none;' }}" disabled>
                            <div class="tour-map-preview-item">
                                <img id="tourMapPreviewImg" src="{{ asset('storage/' . $tourPackage->map_image) }}"
                                    alt="Tour Map Preview"
                                    style="max-width: 300px; max-height: 200px; border-radius: 8px;">
                                <button type="button" class="mt-2 btn btn-sm btn-danger"
                                    onclick="removeTourMapPreview()">
                                    <i class="bi bi-trash"></i> Remove
                                </button>
                                <input type="hidden" name="existing_map_image" value="{{ $tourPackage->map_image }}" disabled>
                            </div>
                        </div> --}}
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <label for="trip_notes" class="form-label @error('trip_notes') is-invalid @enderror">Trip
                            Notes</label>
                        <div id="tripNotesEditor" class="rich-text-editor">{!! old('trip_notes',
                            $tourPackage->trip_notes) !!}</div>
                        <textarea class="form-control d-none" id="trip_notes" name="trip_notes" rows="4"
                            placeholder="Enter important trip notes">{{ old('trip_notes', $tourPackage->trip_notes) }}</textarea>
                        @error('trip_notes')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <label for="faq" class="form-label @error('faq') is-invalid @enderror">FAQ</label>
                        <div id="faqEditor" class="rich-text-editor">{!! old('faq', $tourPackage->faq) !!}</div>
                        <textarea class="form-control d-none" id="faq" name="faq" rows="6"
                            placeholder="Enter frequently asked questions and answers">{{ old('faq', $tourPackage->faq) }}</textarea>
                        @error('faq')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-12">
                    <div class="mb-3 form-group">
                        <label for="reviews" class="form-label @error('reviews') is-invalid @enderror">Reviews</label>
                        <div id="reviewsEditor" class="rich-text-editor">{!! old('reviews', $tourPackage->reviews) !!}
                        </div>
                        <textarea class="form-control d-none" id="reviews" name="reviews" rows="6"
                            placeholder="Enter customer reviews">{{ old('reviews', $tourPackage->reviews) }}</textarea>
                        @error('reviews')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>
            </div>

        </div>

        <!-- Pick up & Drop off Location Section -->
        <div class="form-section">
            <h4 class="section-subtitle">Pick up & Drop off Location:</h4>

            <div class="form-card">
                <div class="row">
                    <div class="col-md-6">
                        <div class="mb-3 form-group">
                            <label for="pickup_location" class="form-label">
                                <i class="bi bi-geo-alt text-success me-2"></i>Pick up Location
                            </label>
                            <input type="text" class="form-control @error('pickup_location') is-invalid @enderror"
                                id="pickup_location" name="pickup_location" placeholder="Enter pick up location"
                                value="{{ old('pickup_location', $tourPackage->pickup_location) }}" disabled>
                            @error('pickup_location')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                    <div class="mt-3 col-md-6 mt-md-0">
                        <div class="mb-3 form-group">
                            <label for="dropoff_location" class="form-label">
                                <i class="bi bi-geo-alt text-danger me-2"></i>Drop off Location
                            </label>
                            <input type="text" class="form-control @error('dropoff_location') is-invalid @enderror"
                                id="dropoff_location" name="dropoff_location" placeholder="Enter drop off location"
                                value="{{ old('dropoff_location', $tourPackage->dropoff_location) }}" disabled>
                            @error('dropoff_location')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>
            </div>
        </div>

        {{-- //features image --}}
        <div class="row">
            <div class="col-md-12">
                <div class="mb-3 form-group">
                    <label for="features_image" class="form-label">Features Image</label>
                    <input type="file" class="form-control @error('features_image') is-invalid @enderror"
                        id="features_image" name="features_image" accept="image/*"
                        onchange="updatePreview(this, 'featureImagePreview', 'removeFeature')">
                    <small class="form-text text-muted">Upload a single features image. Supported formats: JPG,
                        PNG, GIF</small>
                    <div class="mt-2 text-center" id="featureImagePreviewContainer">
                        <img id="featureImagePreview" src="https://via.placeholder.com/200"
                            style="display: none; width: 200px; height: 150px; object-fit: cover;" class="rounded"
                            alt="Feature Image Preview">
                        <button type="button" id="removeFeature" class="mt-1 btn btn-sm btn-danger"
                            style="display: none;"
                            onclick="removeImage('featureImagePreview', 'removeFeature', 'feature_image')">
                            <i class="bi bi-trash"></i> Remove
                        </button>
                    </div>
                    @error('features_image')
                    <div class="invalid-feedback">{{ $message }}</div>
                    @enderror

                    @if ($tourPackage->features_image)
                    <div class="mt-3">
                        <img src="{{ $tourPackage->features_image }}" alt="Features Image"
                            style="width: 300px; height: 200px; border-radius: 8px;">
                        <input type="hidden" name="existing_features_image" value="{{ $tourPackage->name }}" disabled>
                    </div>
                    @endif
                </div>
            </div>
        </div>

        <!-- Media Section -->
        <div class="form-section">
            <h4 class="section-subtitle">Media & Gallery:</h4>

            <!-- Featured Image Upload -->
            <div class="form-card">
                <h5 class="card-title">Featured Image</h5>
                <div class="row">
                    <div class="col-md-12">
                        <div class="mb-3 form-group">
                            <label for="feature_image" class="form-label">Upload Featured Image</label>
                            <input type="file" class="form-control @error('feature_image') is-invalid @enderror"
                                id="feature_image" name="feature_image" accept="image/*"
                                onchange="updatePreview(this, 'thumbnailImagePreview', 'removeThumbnail')">
                            <small class="form-text text-muted">Upload a single featured image. Supported formats: JPG,
                                PNG, GIF</small>

                            <div class="mt-2 text-center" id="thumbnailImagePreviewContainer">
                                <img id="thumbnailImagePreview" src="https://via.placeholder.com/200"
                                    style="display: none; width: 200px; height: 150px; object-fit: cover;"
                                    class="rounded" alt="Feature Image Preview">
                                <button type="button" id="removeThumbnail" class="mt-1 btn btn-sm btn-danger"
                                    style="display: none;"
                                    onclick="removeImage('thumbnailImagePreview', 'removeThumbnail', 'thumbnail')">
                                    <i class="bi bi-trash"></i> Remove
                                </button>
                            </div>

                            @if ($tourPackage->feature_image)
                                <div class="mt-3">
                                    <img src="{{ $tourPackage->feature_image }}" alt="Features Image"
                                        style="max-width: 300px; max-height: 200px; border-radius: 8px;">
                                    <input type="hidden" name="existing_feature_image" value="{{ $tourPackage->name }}" disabled>
                                </div>
                            @endif
                            @error('feature_image')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror

                            {{--
                            <!-- Featured Image Preview -->
                            <div class="mt-3 featured-image-preview" id="featuredImagePreview"
                                style="{{ $tourPackage->feature_image ? '' : 'display: none;' }}" disabled>
                                <div class="featured-image-preview-item">
                                    <img id="featuredImagePreviewImg" src="{{ $tourPackage->feature_image }}"
                                        alt="Featured Image Preview"
                                        style="max-width: 300px; max-height: 200px; border-radius: 8px;">
                                    <button type="button" class="mt-2 btn btn-sm btn-danger"
                                        onclick="removeFeaturedImagePreview()">
                                        <i class="bi bi-trash"></i> Remove
                                    </button>
                                    <input type="hidden" name="existing_feature_image"
                                        value="{{ $tourPackage->feature_image }}" disabled>
                                </div>
                            </div> --}}
                        </div>
                    </div>
                </div>
            </div>

            <!-- Thumbnail Image Upload -->
            <div class="form-card">
                <h5 class="card-title">Thumbnail Image</h5>
                <div class="row">
                    <div class="col-md-12">
                        <div class="mb-3 form-group">
                            <label for="thumbnail" class="form-label">Upload Thumbnail Image</label>
                            <input type="file" class="form-control @error('thumbnail') is-invalid @enderror"
                                id="thumbnail" name="thumbnail" accept="image/*"
                                onchange="updatePreview(this, 'thumbnailImagePreview', 'removeThumbnail')">
                            <small class="form-text text-muted">Upload a single thumbnail image. Supported formats:
                                JPG, PNG, GIF</small>
                            @error('thumbnail')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror


                            <div class="mt-2 text-center" id="thumbnailImagePreviewContainer">
                                <img id="thumbnailImagePreview" src="https://via.placeholder.com/200"
                                    style="display: none; width: 200px; height: 150px; object-fit: cover;"
                                    class="rounded" alt="Feature Image Preview">
                                <button type="button" id="removeThumbnail" class="mt-1 btn btn-sm btn-danger"
                                    style="display: none;"
                                    onclick="removeImage('thumbnailImagePreview', 'removeThumbnail', 'thumbnail')">
                                    <i class="bi bi-trash"></i> Remove
                                </button>
                            </div>

                            @if ($tourPackage->thumbnail)
                                <div class="mt-3">
                                    <img src="{{ $tourPackage->thumbnail }}" alt="Thumbnail Image"
                                        style="max-width: 300px; max-height: 200px; border-radius: 8px;">
                                    <input type="hidden" name="existing_thumbnail" value="{{ $tourPackage->name }}" disabled>
                                </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>

            <!-- Gallery Images Upload -->
            <div class="form-card">
                <h5 class="card-title">Gallery Images</h5>
                <div class="row">
                    <div class="col-md-12">
                        <div class="mb-3 form-group">
                            <label for="gallery_images" class="form-label">Upload Gallery Images</label>
                            <input type="file"
                                class="form-control @error('gallery_images') is-invalid @enderror @error('gallery_images.*') is-invalid @enderror"
                                id="gallery_images" name="gallery_images[]" multiple accept="image/*">
                            <small class="form-text text-muted">You can select multiple images. Supported formats: JPG,
                                PNG, GIF. Maximum 10 images.</small>
                            @error('gallery_images')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                            @error('gallery_images.*')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Image Preview Area -->
                        <div class="image-preview-container" id="imagePreviewContainer">
                            @php
                            $galleryImages = $tourPackage->galleryImages ?? [];
                            @endphp

                            @if (count($galleryImages) > 0)
                            @foreach ($galleryImages as $index => $image)
                            <div class="image-preview-item">
                                <img src="{{ asset('storage/' . $image) }}" alt="Gallery Image">
                                <button type="button" class="btn btn-danger btn-sm"
                                    onclick="removeExistingImage({{ $index }})">
                                    <i class="bi bi-x"></i>
                                </button>
                                <input type="hidden" name="existing_gallery[]" value="{{ $image }}" disabled>
                            </div>
                            @endforeach
                            @else
                            <div class="image-preview-placeholder">
                                <i class="bi bi-images" style="font-size: 3rem;"></i>
                                <p>No gallery images yet</p>
                            </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>

            <!-- Video Section -->
            <div class="form-card">
                <h5 class="card-title">Video</h5>
                <div class="row">
                    <div class="col-md-6">
                        <div class="mb-3 form-group">
                            <label for="video" class="form-label">Upload Video File</label>
                            <input type="file" class="form-control @error('video') is-invalid @enderror" id="video"
                                name="video" accept="video/*">
                            <small class="form-text text-muted">Supported formats: MP4, AVI, MOV. Maximum size:
                                50MB</small>
                            @error('video')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror

                            @if ($tourPackage->video)
                            <div class="mt-2">
                                <small>Current video: {{ $tourPackage->video }}</small>
                                <button type="button" class="btn btn-sm btn-outline-danger ms-2"
                                    onclick="removeVideoFile()">
                                    <i class="bi bi-trash"></i> Remove
                                </button>
                                <input type="hidden" name="remove_video" id="removeVideo" value="0">
                                <input type="hidden" name="existing_video" value="{{ $tourPackage->video }}" disabled>
                            </div>
                            @endif
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3 form-group">
                            <label for="video_url" class="form-label">Or Video URL</label>
                            <input type="url" class="form-control @error('video_url') is-invalid @enderror"
                                id="video_url" name="video_url" placeholder="Enter YouTube video URL"
                                value="{{ old('video_url', $tourPackage->video_url) }}" disabled>
                            <small class="form-text text-muted">Alternative to file upload</small>
                            @error('video_url')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="container my-5">
            <!-- Feedback Logs Section -->
            <div class="form-section">
                <h4 class="section-subtitle">  Feedback Logs:</h4>

                <!-- Activities Days Container -->
                <div class="activities-logs-container" id="activitiesLogsContainer">
                    @php
                    // Get existing days from old input or from the package data
                    $feedbackDays = old(
                    'feedback_days',
                    is_array($tourPackage->feedback_logs)
                    ? $tourPackage->feedback_logs
                    : json_decode($tourPackage->feedback_logs, true) ?? [1 => ['activities' => []]],
                    );
                    @endphp

                    @foreach($itineraries as $dayNumber => $day)
                    <div class="activities-log-day" data-day="{{ $dayNumber }}" disabled>
                        <h5>{{ $day['title'] }}</h5>
                        <div class="activities-list">
                            @foreach($day['activities'] as $index => $activity)
                            <div class="form-check activity-item">
                                <input class="form-check-input" type="checkbox"
                                    id="day{{ $dayNumber }}_custom{{ $index }}" name="day{{ $dayNumber }}_activities[]"
                                    value="{{ $activity }}" checked>
                                <label class="form-check-label" for="day{{ $dayNumber }}_custom{{ $index }}" disabled>
                                    <input type="text" class="form-control activity-input" value="{{ $activity }}"
                                        onchange="updateActivityValue(this)" disabled>
                                </label>
                                <button type="button" class="btn btn-sm btn-outline-danger ms-2"
                                    onclick="removeActivity(this)">
                                    <i class="bi bi-trash"></i>
                                </button>
                            </div>
                            @endforeach
                        </div>
                    </div>
                    @endforeach

                </div>
            </div>
        </div>
</div>


<script>
    document.getElementById('from_date').addEventListener('change', function() {
        const fromDate = this.value;
        const toDateInput = document.getElementById('to_date');

        if (fromDate) {
            toDateInput.min = fromDate;
        }
    });


    function removeItineraryDay(day) {
        const dayElement = document.querySelector(`.itinerary-day[data-day="${day}"]`);
        if (dayElement) {
            dayElement.remove();
        }
    }

    // Activities functionality
    document.getElementById('addActivitiesDay').addEventListener('click', function() {
        const container = document.getElementById('activitiesLogsContainer');
        const days = container.querySelectorAll('.feedback-log-day');
        const newDay = days.length + 1;

        const dayDiv = document.createElement('div');
        dayDiv.className = 'feedback-log-day';
        dayDiv.setAttribute('data-day', newDay);
        dayDiv.innerHTML = `
                <div class="activities-day-header">
                    <h5 class="activities-day-title">Day ${newDay}</h5>
                    <button type="button" class="btn btn-sm btn-outline-danger remove-activities-day" onclick="removeActivitiesDay(${newDay})">
                        <i class="bi bi-trash"></i>
                    </button>
                </div>
                <div class="activities-list">
                    <!-- Activities will be added here -->
                </div>
                <button type="button" class="mt-2 btn btn-outline-secondary btn-sm add-activity-item" data-day="${newDay}">
                    <i class="bi bi-plus-circle"></i> Add Feedback
                </button>
            `;

        container.appendChild(dayDiv);

    });

    function removeActivitiesDay(day) {
        const dayElement = document.querySelector(`.feedback-log-day[data-day="${day}"]`);
        if (dayElement) {
            dayElement.remove();
        }
    }



    function removeActivityItem(day, index) {
        const dayElement = document.querySelector(`.feedback-log-day[data-day="${day}"]`);
        const activityItems = dayElement.querySelectorAll('.activity-item');
        if (activityItems[index]) {
            activityItems[index].remove();

            // Renumber remaining activities
            const remainingItems = dayElement.querySelectorAll('.activity-item');
            remainingItems.forEach((item, newIndex) => {
                const titleElement = item.querySelector('.activity-item-title');
                titleElement.textContent = `Feedback #${newIndex + 1}`;

                // Update all input names with new index
                const inputs = item.querySelectorAll('input, textarea');
                inputs.forEach(input => {
                    const name = input.getAttribute('name');
                    if (name) {
                        input.setAttribute('name', name.replace(/\[activities\]\[\d+\]/,
                            `[activities][${newIndex}]`));
                    }
                });
            });
        }
    }


    // Image preview functionality
    document.getElementById('map_image').addEventListener('change', function(e) {
        const file = e.target.files[0];
        if (file) {
            const reader = new FileReader();
            reader.onload = function(e) {
                document.getElementById('tourMapPreviewImg').src = e.target.result;
                document.getElementById('tourMapPreview').style.display = 'block';
            }
            reader.readAsDataURL(file);
        }
    });

    function removeTourMapPreview() {
        document.getElementById('tourMapPreview').style.display = 'none';
        document.getElementById('map_image').value = '';
    }

    // Similar functions for other image previews would be implemented here
    function removeFeaturedImagePreview() {
        document.getElementById('featuredImagePreview').style.display = 'none';
        document.getElementById('feature_image').value = '';
        document.querySelector('input[name="existing_feature_image"]').value = '';
    }

    function removeThumbnailImagePreview() {
        document.getElementById('thumbnailImagePreview').style.display = 'none';
        document.getElementById('thumbnail').value = '';
        document.querySelector('input[name="existing_thumbnail"]').value = '';
    }

    function removeVideoFile() {
        document.getElementById('removeVideo').value = '1';
        document.querySelector('input[name="existing_video"]').value = '';
        alert('Video will be removed after form submission');
    }

    // Initialize rich text editors (simplified version)
    function initEditors() {
        // This is a simplified version - you would integrate with your preferred rich text editor
        const editors = document.querySelectorAll('.rich-text-editor');
        editors.forEach(editor => {
            editor.addEventListener('blur', function() {
                const textareaId = this.id.replace('Editor', '');
                document.getElementById(textareaId).value = this.innerHTML;
            });
        });
    }

    // Initialize on page load
    document.addEventListener('DOMContentLoaded', function() {
        initEditors();
    });
</script>


@endsection