@extends('layouts.master')

@section('content')
@push('styles')
<style>
  /* --- Glass wrapper --- */
  .glass-container {
    max-width: 900px;
    margin: 2rem auto;
    backdrop-filter: blur(12px);
    background: rgba(255,255,255,0.8);
    border: 1px solid rgba(255,255,255,0.5);
    border-radius: 16px;
    padding: 1.5rem;
    transition: background .3s, border-color .3s;
  }
  body.dark-mode .glass-container {
    background: rgba(30,30,40,0.7);
    border-color: rgba(255,255,255,0.15);
  }

  /* --- Table styling --- */
  .glass-container .table {
    background: transparent;
  }
  .glass-container .table th {
    background: #e3f2fd;
    color: #0d47a1;
    transition: background .3s, color .3s;
  }
  body.dark-mode .glass-container .table th {
    background: #2a2a2a;
    color: #bbdefb;
  }
  .glass-container .table td {
    transition: background .3s, color .3s;
  }
  body.dark-mode .glass-container .table td {
    background: #1f1f1f;
    color: #f1f1f1;
  }
  .glass-container .table-hover tbody tr:hover {
    background: #d6e4ff;
  }
  body.dark-mode .glass-container .table-hover tbody tr:hover {
    background: #2c3e50;
  }

  /* --- Buttons adapt --- */
  .glass-container .btn {
    transition: background .3s, border-color .3s, color .3s;
  }
  body.dark-mode .btn-primary {
    background: #90caf9 !important;
    border-color: #90caf9 !important;
    color: #000 !important;
  }
  body.dark-mode .btn-warning {
    background: #ffc107 !important;
    border-color: #ffc107 !important;
    color: #000 !important;
  }
  body.dark-mode .btn-danger {
    background: #d32f2f !important;
    border-color: #d32f2f !important;
    color: #fff !important;
  }
  body.dark-mode .btn-secondary {
    background: #6c757d !important;
    border-color: #6c757d !important;
    color: #fff !important;
  }
</style>
@endpush

<div class="glass-container">
  <div class="d-flex justify-content-between align-items-center mb-4">
    <h2 class="mb-0">Firmy</h2>
    <a href="{{ route('admin.companies.create') }}" class="btn btn-primary">
      ➕ Nowa firma
    </a>
  </div>

  @if(session('success'))
    <div class="alert alert-success">{{ session('success') }}</div>
  @endif

  <div class="table-responsive">
    <table class="table table-hover text-center mb-0">
      <thead>
        <tr>
          <th>ID</th>
          <th>Nazwa</th>
          <th>Agencja</th>
          <th>Czynności</th>
        </tr>
      </thead>
      <tbody>
        @forelse($companies as $company)
          <tr>
            <td>{{ $company->id }}</td>
            <td>{{ $company->name }}</td>
            <td>{{ $company->agency }}</td>
            <td class="d-flex gap-2 justify-content-center">
              <a href="{{ route('admin.companies.edit', $company) }}"
                 class="btn btn-sm btn-warning">Edytuj</a>
              <form action="{{ route('admin.companies.destroy', $company) }}"
                    method="POST"
                    onsubmit="return confirm('Usunąć firmę?')"
                    class="d-inline">
                @csrf @method('DELETE')
                <button class="btn btn-sm btn-danger">Usuń</button>
              </form>
            </td>
          </tr>
        @empty
          <tr>
            <td colspan="4" class="text-muted">Brak firm.</td>
          </tr>
        @endforelse
      </tbody>
    </table>
  </div>

  <div class="mt-4 d-flex justify-content-center">
    {{ $companies->links() }}
  </div>
</div>
@endsection