@csrf

<div class="mb-3">
    <label class="form-label">Nom</label>
    <input type="text" name="name" class="form-control" value="{{ old('name', $hotel->name ?? '') }}" required>
</div>

<div class="mb-3">
    <label class="form-label">Description</label>
    <textarea name="description" class="form-control" rows="4">{{ old('description', $hotel->description ?? '') }}</textarea>
</div>

<div class="row">
    <div class="col-md-3 mb-3">
        <label class="form-label">Étoiles</label>
        <input type="number" name="stars" class="form-control" value="{{ old('stars', $hotel->stars ?? '') }}">
    </div>
    <div class="col-md-3 mb-3">
        <label class="form-label">Capacité</label>
        <input type="number" name="capacity" class="form-control"
            value="{{ old('capacity', $hotel->capacity ?? '') }}">
    </div>
    <div class="col-md-3 mb-3">
        <label class="form-label">Contingent</label>
        <input type="number" name="contingent" class="form-control"
            value="{{ old('contingent', $hotel->contingent ?? '') }}">
    </div>
    <div class="col-md-3 mb-3">
        <label class="form-label">Ordre</label>
        <input type="number" name="order_num" class="form-control"
            value="{{ old('order_num', $hotel->order_num ?? '') }}">
    </div>
</div>

<div class="row">
    <div class="col-md-3 mb-3">
        <label class="form-label">Prix 1</label>
        <input type="text" name="price_1" class="form-control" value="{{ old('price_1', $hotel->price_1 ?? '') }}">
    </div>
    <div class="col-md-3 mb-3">
        <label class="form-label">Prix 2</label>
        <input type="text" name="price_2" class="form-control" value="{{ old('price_2', $hotel->price_2 ?? '') }}">
    </div>
    <div class="col-md-3 mb-3">
        <label class="form-label">Label 1</label>
        <input type="text" name="label_1" class="form-control" value="{{ old('label_1', $hotel->label_1 ?? '') }}">
    </div>
    <div class="col-md-3 mb-3">
        <label class="form-label">Label 2</label>
        <input type="text" name="label_2" class="form-control" value="{{ old('label_2', $hotel->label_2 ?? '') }}">
    </div>
</div>

<div class="mb-3">
    <label class="form-label">Vignette (thumbnail)</label>
    <input type="file" name="thumbnail" class="form-control">
    @if (!empty($hotel->thumbnail ?? null))
        <div class="mt-2"><img src="{{ asset('storage/' . $hotel->thumbnail) }}" style="max-width:200px"></div>
    @endif
</div>

<div class="form-check mb-2">
    <input class="form-check-input" type="checkbox" name="can_book" id="can_book" value="1"
        {{ old('can_book', $hotel->can_book ?? false) ? 'checked' : '' }}>
    <label class="form-check-label" for="can_book">Peut réserver</label>
</div>

<div class="form-check mb-2">
    <input class="form-check-input" type="checkbox" name="booked" id="booked" value="1"
        {{ old('booked', $hotel->booked ?? false) ? 'checked' : '' }}>
    <label class="form-check-label" for="booked">Réservé</label>
</div>

<div class="form-check mb-2">
    <input class="form-check-input" type="checkbox" name="is_visible_fe" id="is_visible_fe" value="1"
        {{ old('is_visible_fe', $hotel->is_visible_fe ?? true) ? 'checked' : '' }}>
    <label class="form-check-label" for="is_visible_fe">Visible Frontend</label>
</div>

<div class="form-check mb-2">
    <input class="form-check-input" type="checkbox" name="is_visible_bo" id="is_visible_bo" value="1"
        {{ old('is_visible_bo', $hotel->is_visible_bo ?? true) ? 'checked' : '' }}>
    <label class="form-check-label" for="is_visible_bo">Visible Backoffice</label>
</div>

<hr>
<h5 class="mb-3">Règles de réduction enfant</h5>
<p class="text-muted small mb-3">
    Définissez les tranches d'âge et leur réduction. Ex : max_age=6, réduction=100% → enfants de moins de 6 ans sont gratuits.
    Les règles sont évaluées par âge croissant, la première règle dont max_age ≥ âge de l'enfant s'applique.
</p>

<div id="reduction-rules-container">
    @php $rules = old('child_reduction_rules', isset($hotel) ? $hotel->childReductionRules->toArray() : []); @endphp
    @foreach ($rules as $i => $rule)
        <div class="reduction-rule-row row mb-2 align-items-center">
            <div class="col-md-4">
                <input type="text" name="child_reduction_rules[{{ $i }}][label]"
                    class="form-control" placeholder="Libellé (ex: Moins de 6 ans)"
                    value="{{ $rule['label'] ?? '' }}">
            </div>
            <div class="col-md-3">
                <div class="input-group">
                    <span class="input-group-text">Âge max</span>
                    <input type="number" name="child_reduction_rules[{{ $i }}][max_age]"
                        class="form-control" min="0" max="17" placeholder="ex: 6"
                        value="{{ $rule['max_age'] ?? '' }}" required>
                    <span class="input-group-text">ans</span>
                </div>
            </div>
            <div class="col-md-3">
                <div class="input-group">
                    <span class="input-group-text">Réduction</span>
                    <input type="number" name="child_reduction_rules[{{ $i }}][discount_percent]"
                        class="form-control" min="0" max="100" placeholder="ex: 100"
                        value="{{ $rule['discount_percent'] ?? '' }}" required>
                    <span class="input-group-text">%</span>
                </div>
            </div>
            <div class="col-md-2">
                <button type="button" class="btn btn-outline-danger btn-sm remove-rule-btn">
                    <i class="fas fa-trash"></i> Supprimer
                </button>
            </div>
        </div>
    @endforeach
</div>

<button type="button" id="add-rule-btn" class="btn btn-outline-success btn-sm mt-1">
    <i class="fas fa-plus"></i> Ajouter une règle
</button>

<script>
    (function () {
        let ruleIndex = {{ count($rules) }};

        document.getElementById('add-rule-btn').addEventListener('click', function () {
            const container = document.getElementById('reduction-rules-container');
            const row = document.createElement('div');
            row.className = 'reduction-rule-row row mb-2 align-items-center';
            row.innerHTML = `
                <div class="col-md-4">
                    <input type="text" name="child_reduction_rules[${ruleIndex}][label]"
                        class="form-control" placeholder="Libellé (ex: Moins de 12 ans)">
                </div>
                <div class="col-md-3">
                    <div class="input-group">
                        <span class="input-group-text">Âge max</span>
                        <input type="number" name="child_reduction_rules[${ruleIndex}][max_age]"
                            class="form-control" min="0" max="17" placeholder="ex: 12" required>
                        <span class="input-group-text">ans</span>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="input-group">
                        <span class="input-group-text">Réduction</span>
                        <input type="number" name="child_reduction_rules[${ruleIndex}][discount_percent]"
                            class="form-control" min="0" max="100" placeholder="ex: 50" required>
                        <span class="input-group-text">%</span>
                    </div>
                </div>
                <div class="col-md-2">
                    <button type="button" class="btn btn-outline-danger btn-sm remove-rule-btn">
                        <i class="fas fa-trash"></i> Supprimer
                    </button>
                </div>`;
            container.appendChild(row);
            ruleIndex++;
            bindRemoveButtons();
        });

        function bindRemoveButtons() {
            document.querySelectorAll('.remove-rule-btn').forEach(function (btn) {
                btn.onclick = function () {
                    btn.closest('.reduction-rule-row').remove();
                };
            });
        }
        bindRemoveButtons();
    })();
</script>