{{-- resources/views/pricing/promotions.blade.php --}}
@extends('layouts.app')
@section('title', 'Promotions')
@section('page_title', 'Promotions')
@section('page_subtitle', 'Promo codes, discounts and special offers')

@section('content')

<div class="d-flex gap-2 mb-3">
    <a href="{{ tenant_route('pricing.index') }}"
       class="btn btn-sm btn-outline-secondary">← Pricing</a>
</div>

<div class="row g-3">

    {{-- Promotions List --}}
    <div class="col-xl-8">
        <div class="card">
            <div class="card-header">
                <span class="card-title">
                    <i class="bi bi-percent me-2"
                       style="color:var(--clay)"></i>
                    Promotions
                    <span style="font-size:.75rem;font-weight:400;
                                 color:var(--muted);margin-left:6px;">
                        {{ $promotions->count() }} total
                    </span>
                </span>
            </div>

            @if($promotions->isEmpty())
                <div class="card-body text-center py-5">
                    <i class="bi bi-percent"
                       style="font-size:2.5rem;color:var(--muted)"></i>
                    <p class="fw-semibold mt-3 mb-1">No promotions yet</p>
                    <p class="text-muted" style="font-size:.82rem;">
                        Create promo codes and special offers
                    </p>
                </div>
            @else
                <div class="card-body" style="padding:0;">
                    @foreach($promotions as $promo)
                        @php
                            $isActive = $promo->is_active
                                && now()->between($promo->valid_from, $promo->valid_to);
                            $isExpired = now()->gt($promo->valid_to);
                        @endphp
                        <div style="padding:16px 18px;
                                    border-bottom:1px solid var(--border);
                                    {{ !$isActive ? 'opacity:.65;' : '' }}">
                            <div style="display:flex;align-items:flex-start;
                                        justify-content:space-between;gap:12px;
                                        flex-wrap:wrap;">
                                <div style="flex:1;">
                                    <div style="display:flex;align-items:center;
                                                gap:8px;flex-wrap:wrap;
                                                margin-bottom:5px;">
                                        <span class="fw-bold"
                                              style="font-size:.88rem;">
                                            {{ $promo->name }}
                                        </span>
                                        @if($promo->code)
                                            <span style="font-size:.72rem;font-weight:700;
                                                         letter-spacing:.05em;
                                                         background:{{ $isActive ? 'var(--clay-light)' : '#f1f5f9' }};
                                                         color:{{ $isActive ? 'var(--clay)' : 'var(--muted)' }};
                                                         padding:2px 8px;border-radius:4px;
                                                         font-family:monospace;">
                                                {{ $promo->code }}
                                            </span>
                                        @endif
                                        @if($isExpired)
                                            <span style="font-size:.68rem;background:#fee2e2;
                                                         color:#991b1b;padding:2px 7px;
                                                         border-radius:4px;">
                                                Expired
                                            </span>
                                        @elseif(!$promo->is_active)
                                            <span style="font-size:.68rem;background:#f1f5f9;
                                                         color:var(--muted);padding:2px 7px;
                                                         border-radius:4px;">
                                                Inactive
                                            </span>
                                        @else
                                            <span style="font-size:.68rem;background:#d1fae5;
                                                         color:#065f46;padding:2px 7px;
                                                         border-radius:4px;">
                                                Active
                                            </span>
                                        @endif
                                    </div>

                                    <div style="display:flex;gap:16px;flex-wrap:wrap;
                                                font-size:.73rem;color:var(--muted);">
                                        {{-- Discount --}}
                                        <span style="font-weight:600;
                                                     color:{{ $isActive ? 'var(--success)' : 'var(--muted)' }};">
                                            @if($promo->discount_type === 'percentage')
                                                {{ $promo->discount_value }}% off
                                            @elseif($promo->discount_type === 'fixed')
                                                ${{ number_format($promo->discount_value, 2) }} off
                                            @else
                                                Override: ${{ number_format($promo->discount_value, 2) }}
                                            @endif
                                        </span>

                                        {{-- Validity --}}
                                        <span>
                                            <i class="bi bi-calendar3 me-1"></i>
                                            {{ $promo->valid_from->format('d M') }}
                                            –
                                            {{ $promo->valid_to->format('d M Y') }}
                                        </span>

                                        @if($promo->min_stay_nights)
                                            <span>
                                                <i class="bi bi-moon me-1"></i>
                                                Min {{ $promo->min_stay_nights }} nights
                                            </span>
                                        @endif

                                        {{-- Usage --}}
                                        @if($promo->max_uses)
                                            <span>
                                                <i class="bi bi-person me-1"></i>
                                                {{ $promo->use_count ?? 0 }} / {{ $promo->max_uses }} used
                                            </span>
                                        @else
                                            <span>
                                                <i class="bi bi-person me-1"></i>
                                                {{ $promo->use_count ?? 0 }} used
                                            </span>
                                        @endif

                                        {{-- Applies to --}}
                                        @if($promo->roomCategory)
                                            <span>
                                                {{ $promo->roomCategory->name }} only
                                            </span>
                                        @endif
                                        @if($promo->ratePlan)
                                            <span>
                                                {{ $promo->ratePlan->code }} plan only
                                            </span>
                                        @endif
                                    </div>

                                    @if($promo->description)
                                        <div style="font-size:.72rem;color:var(--muted);
                                                    margin-top:5px;">
                                            {{ $promo->description }}
                                        </div>
                                    @endif
                                </div>

                                <div style="display:flex;gap:6px;flex-shrink:0;">
                                    <button class="btn btn-xs btn-outline-secondary"
                                            data-bs-toggle="modal"
                                            data-bs-target="#editPromoModal"
                                            data-id="{{ $promo->id }}"
                                            data-name="{{ $promo->name }}"
                                            data-discount-type="{{ $promo->discount_type }}"
                                            data-discount-value="{{ $promo->discount_value }}"
                                            data-valid-from="{{ $promo->valid_from->toDateString() }}"
                                            data-valid-to="{{ $promo->valid_to->toDateString() }}"
                                            data-min-stay="{{ $promo->min_stay_nights }}"
                                            data-max-uses="{{ $promo->max_uses }}"
                                            data-is-active="{{ $promo->is_active ? 1 : 0 }}"
                                            data-description="{{ $promo->description }}">
                                        <i class="bi bi-pencil"></i>
                                    </button>
                                    <form method="POST"
                                          action="{{ tenant_route('pricing.promotions.destroy', ['promo' => $promo->id]) }}"
                                          onsubmit="return confirm('Delete this promotion?')">
                                        @csrf @method('DELETE')
                                        <button class="btn btn-xs btn-outline-danger"
                                                type="submit">
                                            <i class="bi bi-trash"></i>
                                        </button>
                                    </form>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            @endif
        </div>
    </div>

    {{-- Add Promotion --}}
    <div class="col-xl-4">
        <div class="card">
            <div class="card-header">
                <span class="card-title">Create Promotion</span>
            </div>
            <div class="card-body">
                <form method="POST"
                      action="{{ tenant_route('pricing.promotions.store') }}">
                    @csrf

                    <div class="mb-3">
                        <label class="form-label fw-semibold">
                            Name <span class="text-danger">*</span>
                        </label>
                        <input type="text" name="name"
                               class="form-control @error('name') is-invalid @enderror"
                               value="{{ old('name') }}"
                               placeholder="e.g. Early Bird 20% Off"
                               required>
                        @error('name')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-semibold">
                            Promo Code
                        </label>
                        <input type="text" name="code"
                               class="form-control @error('code') is-invalid @enderror"
                               value="{{ old('code') }}"
                               placeholder="e.g. EARLYBIRD20"
                               style="text-transform:uppercase;"
                               maxlength="30">
                        <div style="font-size:.68rem;color:var(--muted);margin-top:3px;">
                            Leave empty for automatic discount (no code required)
                        </div>
                        @error('code')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-semibold">
                            Discount Type <span class="text-danger">*</span>
                        </label>
                        <select name="discount_type"
                                class="form-select" required>
                            <option value="percentage"
                                    {{ old('discount_type', 'percentage') === 'percentage' ? 'selected' : '' }}>
                                Percentage (%)
                            </option>
                            <option value="fixed"
                                    {{ old('discount_type') === 'fixed' ? 'selected' : '' }}>
                                Fixed Amount ($)
                            </option>
                            <option value="override"
                                    {{ old('discount_type') === 'override' ? 'selected' : '' }}>
                                Override Rate
                            </option>
                        </select>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-semibold">
                            Discount Value <span class="text-danger">*</span>
                        </label>
                        <input type="number" name="discount_value"
                               class="form-control @error('discount_value') is-invalid @enderror"
                               value="{{ old('discount_value', 10) }}"
                               min="0" step="0.01" required>
                        @error('discount_value')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="row g-2 mb-3">
                        <div class="col-6">
                            <label class="form-label fw-semibold">
                                Valid From <span class="text-danger">*</span>
                            </label>
                            <input type="date" name="valid_from"
                                   class="form-control @error('valid_from') is-invalid @enderror"
                                   value="{{ old('valid_from', today()->toDateString()) }}"
                                   required>
                            @error('valid_from')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-6">
                            <label class="form-label fw-semibold">
                                Valid To <span class="text-danger">*</span>
                            </label>
                            <input type="date" name="valid_to"
                                   class="form-control @error('valid_to') is-invalid @enderror"
                                   value="{{ old('valid_to', today()->addMonth()->toDateString()) }}"
                                   required>
                            @error('valid_to')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-semibold">
                            Applies To
                        </label>
                        <select name="rate_plan_id"
                                class="form-select form-select-sm mb-2">
                            <option value="">All rate plans</option>
                            @foreach($ratePlans as $plan)
                                <option value="{{ $plan->id }}"
                                        {{ old('rate_plan_id') == $plan->id ? 'selected' : '' }}>
                                    {{ $plan->name }} ({{ $plan->code }})
                                </option>
                            @endforeach
                        </select>
                        <select name="room_category_id"
                                class="form-select form-select-sm">
                            <option value="">All room categories</option>
                            @foreach($categories as $cat)
                                <option value="{{ $cat->id }}"
                                        {{ old('room_category_id') == $cat->id ? 'selected' : '' }}>
                                    {{ $cat->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="row g-2 mb-3">
                        <div class="col-6">
                            <label class="form-label fw-semibold"
                                   style="font-size:.75rem;">
                                Min Stay
                            </label>
                            <div class="input-group input-group-sm">
                                <input type="number" name="min_stay_nights"
                                       class="form-control"
                                       min="1"
                                       value="{{ old('min_stay_nights') }}"
                                       placeholder="Any">
                                <span class="input-group-text"
                                      style="font-size:.7rem;">nts</span>
                            </div>
                        </div>
                        <div class="col-6">
                            <label class="form-label fw-semibold"
                                   style="font-size:.75rem;">
                                Max Uses
                            </label>
                            <input type="number" name="max_uses"
                                   class="form-control form-control-sm"
                                   min="1"
                                   value="{{ old('max_uses') }}"
                                   placeholder="Unlimited">
                        </div>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-semibold">Description</label>
                        <textarea name="description" rows="2"
                                  class="form-control form-control-sm"
                                  placeholder="Guest-facing description">{{ old('description') }}</textarea>
                    </div>

                    <button type="submit"
                            class="btn btn-primary btn-sm w-100">
                        <i class="bi bi-percent me-1"></i>Create Promotion
                    </button>
                </form>
            </div>
        </div>
    </div>

</div>

{{-- Edit Promotion Modal --}}
<div class="modal fade" id="editPromoModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <form method="POST" id="editPromoForm">
                @csrf @method('PUT')
                <div class="modal-header">
                    <h5 class="modal-title"
                        style="font-size:.9rem;font-weight:700;">
                        Edit Promotion
                    </h5>
                    <button type="button" class="btn-close"
                            data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="row g-3">
                        <div class="col-12">
                            <label class="form-label fw-semibold">Name</label>
                            <input type="text" name="name" id="editPromoName"
                                   class="form-control" required>
                        </div>
                        <div class="col-6">
                            <label class="form-label fw-semibold">
                                Discount Type
                            </label>
                            <select name="discount_type"
                                    id="editPromoType"
                                    class="form-select">
                                <option value="percentage">Percentage</option>
                                <option value="fixed">Fixed Amount</option>
                                <option value="override">Override</option>
                            </select>
                        </div>
                        <div class="col-6">
                            <label class="form-label fw-semibold">Value</label>
                            <input type="number" name="discount_value"
                                   id="editPromoValue"
                                   class="form-control"
                                   min="0" step="0.01" required>
                        </div>
                        <div class="col-6">
                            <label class="form-label fw-semibold">Valid From</label>
                            <input type="date" name="valid_from"
                                   id="editPromoFrom"
                                   class="form-control" required>
                        </div>
                        <div class="col-6">
                            <label class="form-label fw-semibold">Valid To</label>
                            <input type="date" name="valid_to"
                                   id="editPromoTo"
                                   class="form-control" required>
                        </div>
                        <div class="col-6">
                            <label class="form-label fw-semibold">Min Stay</label>
                            <input type="number" name="min_stay_nights"
                                   id="editPromoMinStay"
                                   class="form-control" min="1">
                        </div>
                        <div class="col-6">
                            <label class="form-label fw-semibold">Max Uses</label>
                            <input type="number" name="max_uses"
                                   id="editPromoMaxUses"
                                   class="form-control" min="1">
                        </div>
                        <div class="col-12">
                            <label class="form-label fw-semibold">Description</label>
                            <textarea name="description" rows="2"
                                      id="editPromoDesc"
                                      class="form-control"></textarea>
                        </div>
                        <div class="col-12">
                            <div class="form-check form-switch">
                                <input type="checkbox" name="is_active"
                                       value="1" id="editPromoActive"
                                       class="form-check-input">
                                <label class="form-check-label"
                                       for="editPromoActive"
                                       style="font-size:.8rem;">Active</label>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button"
                            class="btn btn-outline-secondary btn-sm"
                            data-bs-dismiss="modal">Cancel</button>
                    <button type="submit"
                            class="btn btn-primary btn-sm">
                        Save Changes
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

@endsection

@push('scripts')
<script>
document.getElementById('editPromoModal')
    .addEventListener('show.bs.modal', function(e) {
        const btn = e.relatedTarget;
        const id  = btn.dataset.id;

        document.getElementById('editPromoName').value    = btn.dataset.name;
        document.getElementById('editPromoType').value    = btn.dataset.discountType;
        document.getElementById('editPromoValue').value   = btn.dataset.discountValue;
        document.getElementById('editPromoFrom').value    = btn.dataset.validFrom;
        document.getElementById('editPromoTo').value      = btn.dataset.validTo;
        document.getElementById('editPromoMinStay').value = btn.dataset.minStay || '';
        document.getElementById('editPromoMaxUses').value = btn.dataset.maxUses || '';
        document.getElementById('editPromoDesc').value    = btn.dataset.description || '';
        document.getElementById('editPromoActive').checked = btn.dataset.isActive === '1';

        document.getElementById('editPromoForm').action =
            '{{ tenant_route('pricing.promotions.store') }}'
            .replace('/promotions', '/promotions/' + id);

        document.getElementById('editPromoForm')
            .querySelector('[name="_method"]').value = 'PUT';
    });
</script>
@endpush