@extends('admin.layout')
@section('title', isset($coupon->id) ? "Edit Coupon" : 'New Coupon')
@section('page-title', isset($coupon->id) ? 'EDIT COUPON' : 'NEW COUPON')

@section('content')
<form method="POST" action="{{ isset($coupon->id) ? route('admin.coupons.update', $coupon) : route('admin.coupons.store') }}">
  @csrf
  @if(isset($coupon->id)) @method('PUT') @endif

  <div style="display:grid;grid-template-columns:1fr 300px;gap:20px">
    <div class="card">
      <div class="card-title" style="margin-bottom:20px">COUPON DETAILS</div>

      <div class="form-grid">
        <div class="form-group">
          <label class="form-label">Coupon Code*</label>
          <input type="text" name="code" class="form-input" value="{{ old('code', $coupon->code ?? '') }}" required placeholder="SUMMER20" style="text-transform:uppercase;letter-spacing:.08em;font-weight:700"/>
          <div class="form-hint">Alphanumeric & underscores only. Auto-uppercased.</div>
        </div>
        <div class="form-group">
          <label class="form-label">Description</label>
          <input type="text" name="description" class="form-input" value="{{ old('description', $coupon->description ?? '') }}" placeholder="Summer sale 20% off"/>
        </div>
      </div>

      <div class="form-grid">
        <div class="form-group">
          <label class="form-label">Discount Type*</label>
          <select name="type" class="form-input" id="typeSelect" onchange="updateLabel(this.value)">
            <option value="percent" {{ old('type', $coupon->type ?? 'percent') === 'percent' ? 'selected' : '' }}>Percent (%)</option>
            <option value="fixed" {{ old('type', $coupon->type ?? '') === 'fixed' ? 'selected' : '' }}>Fixed Amount (₹)</option>
          </select>
        </div>
        <div class="form-group">
          <label class="form-label" id="valueLabel">Discount Value*</label>
          <input type="number" name="value" class="form-input" value="{{ old('value', $coupon->value ?? '') }}" required min="0" step="0.01" placeholder="20"/>
        </div>
      </div>

      <div class="form-grid">
        <div class="form-group">
          <label class="form-label">Min Order Amount (₹)</label>
          <input type="number" name="min_order" class="form-input" value="{{ old('min_order', $coupon->min_order ?? 0) }}" min="0" step="0.01" placeholder="499"/>
          <div class="form-hint">Coupon applies only if cart ≥ this value. 0 = no minimum.</div>
        </div>
        <div class="form-group">
          <label class="form-label">Max Uses</label>
          <input type="number" name="max_uses" class="form-input" value="{{ old('max_uses', $coupon->max_uses ?? '') }}" min="1" placeholder="Unlimited"/>
          <div class="form-hint">Leave blank for unlimited uses.</div>
        </div>
      </div>

      <div class="form-group">
        <label class="form-label">Expiry Date</label>
        <input type="date" name="expires_at" class="form-input" value="{{ old('expires_at', $coupon->expires_at ? $coupon->expires_at->format('Y-m-d') : '') }}"/>
        <div class="form-hint">Leave blank = never expires.</div>
      </div>

      <label class="form-check" style="margin-top:8px">
        <input type="checkbox" name="active" value="1" {{ old('active', $coupon->active ?? true) ? 'checked' : '' }}/>
        <span>Coupon is Active</span>
      </label>
    </div>

    <div>
      @if(isset($coupon->id))
      <div class="card" style="margin-bottom:16px">
        <div class="card-title" style="margin-bottom:12px">STATS</div>
        <div style="display:flex;flex-direction:column;gap:10px;font-size:.85rem">
          <div style="display:flex;justify-content:space-between"><span style="color:var(--muted)">Times Used</span><strong>{{ $coupon->used_count }}</strong></div>
          <div style="display:flex;justify-content:space-between"><span style="color:var(--muted)">Max Uses</span><strong>{{ $coupon->max_uses ?? '∞' }}</strong></div>
          <div style="display:flex;justify-content:space-between"><span style="color:var(--muted)">Status</span>
            <span class="badge {{ $coupon->active ? 'badge-active' : 'badge-cancelled' }}">{{ $coupon->active ? 'Active' : 'Off' }}</span>
          </div>
        </div>
      </div>
      @endif
      <div class="card" style="position:sticky;top:80px">
        <div class="card-title" style="margin-bottom:16px">PUBLISH</div>
        <button type="submit" class="btn btn-primary" style="width:100%;justify-content:center;padding:13px;margin-bottom:10px">
          {{ isset($coupon->id) ? '💾 Save Changes' : '🎟️ Create Coupon' }}
        </button>
        <a href="{{ route('admin.coupons') }}" class="btn btn-ghost" style="width:100%;justify-content:center">Cancel</a>
      </div>
    </div>
  </div>
</form>
@endsection

@push('scripts')
<script>
function updateLabel(type) {
  document.getElementById('valueLabel').textContent = type === 'percent' ? 'Discount % *' : 'Discount Amount (₹) *';
}
updateLabel(document.getElementById('typeSelect').value);
</script>
@endpush
