@extends('admin.layouts.app')

@section('content')
<div class="container-fluid px-4">
    <x-admin.page-header title="Brands" subtitle="Multi-brand management" icon="fas fa-tags"
        :buttons="[['label' => 'New Brand', 'route' => route('admin.brands.create'), 'icon' => 'fas fa-plus', 'color' => 'primary', 'permission' => 'create brands']]" />

    <x-admin.card>
        <x-admin.data-table id="brandsTable" :records-url="route('api.admin.brands.records')">
            <th>ID</th><th>Name</th><th>Domain</th><th>Theme</th><th>Default</th><th>Status</th><th>Clients</th>
            <th class="text-end pe-4">{{ __('admin/common.actions') }}</th>
        </x-admin.data-table>
    </x-admin.card>
</div>
@endsection

@push('scripts')
<script>
window.permissions = { brands: { view: {{ json_encode(Auth::user()->can('view brands')) }}, update: {{ json_encode(Auth::user()->can('update brands')) }}, delete: {{ json_encode(Auth::user()->can('delete brands')) }} } };
window.brandsConfig = {
    routes: { edit: '{{ route("admin.brands.edit", ":id") }}', destroy: '{{ route("api.admin.brands.destroy", ":id") }}' },
    translations: { confirm_delete: '{{ __("admin/common.confirm_delete") }}' }
};
</script>
@vite('resources/js/admin/brands/index.js')
@endpush
