@extends('layouts.ownerLayout')

@section('title', 'Cotizador')

@section('content')
<div class="d-flex align-items-center justify-content-between flex-wrap gap-2 mb-4">
  <div>
    <h4 class="mb-1">Cotizador interno</h4>
    <p class="mb-0 text-body-secondary">Calcula costo final según servicio, extras y transporte por reglas configurables.</p>
  </div>
  <a href="{{ route('owner.settings.quote-rules') }}" class="btn btn-label-primary">
    <i class="icon-base ti tabler-settings icon-xs me-1"></i>Configurar reglas
  </a>
</div>

<div class="row g-4">
  <div class="col-12 col-xl-7">
    <div class="card">
      <div class="card-header border-bottom">
        <h5 class="card-title mb-0">Datos de cotización</h5>
      </div>
      <div class="card-body">
        <form method="POST" action="{{ route('owner.quotes.calculator.calculate') }}" class="row g-3">
          @csrf
          <div class="col-md-6">
            <label class="form-label">Ciudad</label>
            <input type="text" name="city" class="form-control" list="cityOptions" value="{{ old('city', $result['city'] ?? '') }}" placeholder="Bogotá" required>
            <datalist id="cityOptions">
              @foreach($cities as $city)
                <option value="{{ $city }}"></option>
              @endforeach
            </datalist>
          </div>
          <div class="col-md-6">
            <label class="form-label">Barrio / zona</label>
            <input type="text" name="zone" class="form-control" value="{{ old('zone', $result['zone'] ?? '') }}" placeholder="Suba, Chía, etc.">
          </div>
          <div class="col-md-6">
            <label class="form-label">Paquete (opcional)</label>
            <select name="package_id" class="form-select">
              <option value="">Sin paquete</option>
              @foreach($packages as $package)
                <option value="{{ $package->id }}" @selected((string) old('package_id') === (string) $package->id)>
                  {{ $package->name }} · {{ $package->city }} · ${{ number_format($package->base_price, 0, ',', '.') }}
                </option>
              @endforeach
            </select>
          </div>
          <div class="col-md-4">
            <label class="form-label">Distancia (km)</label>
            <input type="number" step="0.1" min="0" name="distance_km" class="form-control" value="{{ old('distance_km', $result['distance_km'] ?? 0) }}">
          </div>
          <div class="col-md-4">
            <label class="form-label">Base servicio (COP)</label>
            <input type="number" step="1000" min="0" name="base_service" class="form-control" value="{{ old('base_service', $result['base_service'] ?? 0) }}" required>
          </div>
          <div class="col-md-4">
            <label class="form-label">Extras (COP)</label>
            <input type="number" step="1000" min="0" name="extras" class="form-control" value="{{ old('extras', $result['extras'] ?? 0) }}">
          </div>
          <div class="col-md-4">
            <label class="form-label">Descuento (COP)</label>
            <input type="number" step="1000" min="0" name="discount" class="form-control" value="{{ old('discount', $result['discount'] ?? 0) }}">
          </div>
          <div class="col-md-8">
            <label class="form-label">Forzar regla de transporte (opcional)</label>
            <select name="transport_rule_id" class="form-select">
              <option value="">Auto detectar</option>
              @foreach($rules as $rule)
                <option value="{{ $rule->id }}" @selected((string) old('transport_rule_id') === (string) $rule->id)>
                  {{ $rule->name }} | {{ $rule->city }} | {{ $rule->pricing_mode === 'km' ? 'Por km' : 'Fija' }}
                </option>
              @endforeach
            </select>
          </div>
          <div class="col-12 d-flex gap-2 pt-2">
            <button type="submit" class="btn btn-primary">Calcular</button>
            <a href="{{ route('owner.quotes.calculator') }}" class="btn btn-label-secondary">Limpiar</a>
          </div>
        </form>
      </div>
    </div>
  </div>
  <div class="col-12 col-xl-5">
    <div class="card">
      <div class="card-header border-bottom">
        <h5 class="card-title mb-0">Resultado</h5>
      </div>
      <div class="card-body">
        @if($result)
          @if(!empty($result['package']))
            <div class="mb-2"><span class="text-body-secondary">Paquete:</span> <strong>{{ $result['package']->name }}</strong></div>
          @endif
          <div class="mb-2"><span class="text-body-secondary">Regla aplicada:</span> <strong>{{ $result['rule']->name ?? 'Sin regla' }}</strong></div>
          <div class="mb-2"><span class="text-body-secondary">Fórmula transporte:</span> {{ $result['transport_formula'] }}</div>
          <hr>
          <div class="d-flex justify-content-between mb-2">
            <span>Base servicio</span><strong>${{ number_format($result['base_service'], 0, ',', '.') }}</strong>
          </div>
          <div class="d-flex justify-content-between mb-2">
            <span>Extras</span><strong>${{ number_format($result['extras'], 0, ',', '.') }}</strong>
          </div>
          <div class="d-flex justify-content-between mb-2">
            <span>Transporte</span><strong>${{ number_format($result['transport_amount'], 0, ',', '.') }}</strong>
          </div>
          <div class="d-flex justify-content-between mb-2">
            <span>Descuento</span><strong>- ${{ number_format($result['discount'], 0, ',', '.') }}</strong>
          </div>
          <hr>
          <div class="d-flex justify-content-between">
            <h5 class="mb-0">Total cotizado</h5>
            <h5 class="mb-0 text-primary">${{ number_format($result['total'], 0, ',', '.') }}</h5>
          </div>
        @else
          <p class="text-body-secondary mb-0">Aún no hay cálculo. Completa los datos y presiona <strong>Calcular</strong>.</p>
        @endif
      </div>
    </div>
  </div>
</div>
@endsection