@extends('layouts.app')
@section('title',$product->name)
@section('page-title',$product->name)
@section('breadcrumb')
  <a href="{{ route('products.index') }}">Produits</a>
  <span class="breadcrumb-sep">/</span>
  <span class="breadcrumb-current">{{ $product->name }}</span>
@endsection
@section('topbar-actions')
  @if(auth()->user()->isAdmin())
    <a href="{{ route('products.edit',$product) }}" class="btn btn-outline btn-sm">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>
      Modifier
    </a>
  @endif
@endsection
@section('content')
<div style="display:grid;grid-template-columns:1fr 280px;gap:20px;margin-bottom:20px">
  <div class="card">
    <div class="card-header">
      <div class="card-title">Informations produit</div>
      <span class="badge badge-gray">{{ $product->category }}</span>
    </div>
    <div class="card-body">
      <div class="detail-grid">
        <div class="detail-item"><label>Référence</label><span class="code-tag">{{ $product->reference }}</span></div>
        <div class="detail-item"><label>Fournisseur</label><span>{{ $product->supplier ?? '—' }}</span></div>
        <div class="detail-item"><label>Prix d'achat</label><span>{{ number_format($product->purchase_price,0,',',' ') }} XAF</span></div>
        <div class="detail-item"><label>Prix de vente</label><span style="font-weight:700">{{ number_format($product->selling_price,0,',',' ') }} XAF</span></div>
        <div class="detail-item"><label>Marge brute</label><span style="color:var(--success);font-weight:700">{{ number_format($product->margin,1) }}%</span></div>
        <div class="detail-item"><label>Créé le</label><span>{{ $product->created_at->format('d/m/Y') }}</span></div>
      </div>
    </div>
  </div>

  <div class="card">
    <div class="card-header"><div class="card-title">État du stock</div></div>
    <div class="card-body" style="text-align:center">
      <div style="font-size:48px;font-weight:900;color:{{ $product->isCritical() ? 'var(--error)' : ($product->isLowStock() ? 'var(--warning)' : 'var(--success)') }};line-height:1;margin:12px 0">
        {{ $product->stock }}
      </div>
      <div style="font-size:12px;color:var(--gray-400);margin-bottom:16px">unités en stock</div>
      <div style="display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px">
        <div style="background:var(--warning-bg);border-radius:var(--radius-sm);padding:10px;text-align:center">
          <div style="font-size:18px;font-weight:700;color:var(--warning)">{{ $product->alert_stock }}</div>
          <div style="font-size:10px;color:var(--gray-400);margin-top:2px">Seuil alerte</div>
        </div>
        <div style="background:var(--error-bg);border-radius:var(--radius-sm);padding:10px;text-align:center">
          <div style="font-size:18px;font-weight:700;color:var(--error)">{{ $product->min_stock }}</div>
          <div style="font-size:10px;color:var(--gray-400);margin-top:2px">Stock min.</div>
        </div>
      </div>
      <div style="background:var(--gray-50);border-radius:var(--radius-sm);padding:10px;font-size:12px;color:var(--gray-600)">
        Valeur stock : <strong>{{ number_format($product->stock * $product->purchase_price,0,',',' ') }} XAF</strong>
      </div>
      @if($product->isCritical())
        <div class="alert alert-error" style="margin-top:12px;font-size:12px;padding:8px 12px">Stock critique — approvisionnement urgent</div>
      @elseif($product->isLowStock())
        <div class="alert alert-warning" style="margin-top:12px;font-size:12px;padding:8px 12px">Stock bas — pensez à réapprovisionner</div>
      @endif
    </div>
  </div>
</div>

{{-- Widget GED ──────────────────────────────────────────────────────────}}
<div style="margin-bottom:20px">
  @include('ged._widget', [
    'entiteType' => \App\Models\Product::class,
    'entiteId'   => $product->id,
    'entiteNom'  => $product->reference . ' — ' . $product->name,
  ])
</div>

<div class="card">
  <div class="card-header">
    <div class="card-title">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="15" height="15"><polyline points="17 1 21 5 17 9"/><path d="M3 11V9a4 4 0 0 1 4-4h14"/><polyline points="7 23 3 19 7 15"/><path d="M21 13v2a4 4 0 0 1-4 4H3"/></svg>
      Historique des mouvements
    </div>
    <a href="{{ route('stock.index') }}" class="btn btn-primary btn-sm">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
      Nouveau mouvement
    </a>
  </div>
  <div class="table-container">
    <table class="data-table">
      <thead><tr><th>Type</th><th>Quantité</th><th>Raison</th><th>Par</th><th>Date</th></tr></thead>
      <tbody>
        @forelse($movements as $mv)
        <tr>
          <td><span class="badge badge-{{ $mv->type_color }}">{{ $mv->type_label }}</span></td>
          <td style="font-weight:700;color:{{ $mv->type==='out' ? 'var(--error)' : 'var(--success)' }}">{{ $mv->type==='out' ? '-' : '+' }}{{ $mv->quantity }}</td>
          <td class="td-muted">{{ $mv->reason ?? '—' }}</td>
          <td style="font-size:12.5px">{{ $mv->user?->name ?? '—' }}</td>
          <td class="td-muted">{{ $mv->created_at->format('d/m/Y H:i') }}</td>
        </tr>
        @empty
        <tr><td colspan="5"><div class="empty-state" style="padding:24px 0"><h3>Aucun mouvement enregistré</h3></div></td></tr>
        @endforelse
      </tbody>
    </table>
  </div>
</div>
@endsection