  2026-02-17 19:46:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-02-17 19:46:05 App\Jobs\ProcesarEnvioJob ................. 46.01ms DONE
  2026-02-17 20:12:07 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-02-17 20:12:07 App\Jobs\ProcesarEnvioJob ................ 179.85ms DONE
  2026-02-17 20:31:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-02-17 20:31:04 App\Jobs\ProcesarEnvioJob ................ 152.24ms DONE
  2026-02-17 20:32:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-02-17 20:32:05 App\Jobs\ProcesarEnvioJob ................. 82.62ms DONE
  2026-02-17 20:36:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-02-17 20:36:05 App\Jobs\ProcesarEnvioJob ................ 260.19ms DONE
  2026-02-17 20:46:06 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-02-17 20:46:06 App\Jobs\ProcesarEnvioJob ................. 53.97ms DONE
  2026-02-17 20:57:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-02-17 20:57:06 App\Jobs\ProcesarEnvioJob ...................... 1s DONE
  2026-02-18 12:34:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-02-18 12:34:07 App\Jobs\ProcesarEnvioJob ...................... 1s DONE

   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))

  2026-03-05 13:04:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-05 13:04:05 App\Jobs\ProcesarEnvioJob ...................... 1s DONE
  2026-03-05 13:04:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-05 13:04:05 App\Jobs\ProcesarEnvioJob .................. 8.22ms DONE
  2026-03-05 17:18:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-05 17:18:04 App\Jobs\ProcesarEnvioJob ................. 72.63ms DONE
  2026-03-05 17:19:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-05 17:19:04 App\Jobs\ProcesarEnvioJob ................ 108.26ms DONE
  2026-03-05 17:25:05 App\Jobs\ProcesarRecordatorioJob ............... RUNNING
  2026-03-05 17:25:07 App\Jobs\ProcesarRecordatorioJob ............... 1s DONE
  2026-03-05 17:25:07 App\Jobs\ProcesarRecordatorioJob ............... RUNNING
  2026-03-05 17:25:07 App\Jobs\ProcesarRecordatorioJob ........... 7.27ms DONE
  2026-03-06 19:54:03 App\Jobs\ProcesarRecordatorioJob ............... RUNNING
  2026-03-06 19:54:05 App\Jobs\ProcesarRecordatorioJob ............... 1s DONE
  2026-03-06 19:54:05 App\Jobs\ProcesarRecordatorioJob ............... RUNNING
  2026-03-06 19:54:05 App\Jobs\ProcesarRecordatorioJob ........... 5.96ms DONE

   Illuminate\Database\QueryException 

  SQLSTATE[08004] [1040] Too many connections (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+37 vendor frames [22m

  38  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[08004] [1040] Too many connections (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+37 vendor frames [22m

  38  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[08004] [1040] Too many connections (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+37 vendor frames [22m

  38  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [1040] Too many connections (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+37 vendor frames [22m

  38  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))

  2026-03-23 17:50:06 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-23 17:50:06 App\Jobs\ProcesarEnvioJob ................. 92.67ms DONE
  2026-03-24 16:06:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:06:06 App\Jobs\ProcesarEnvioJob ...................... 1s FAIL
  2026-03-24 16:06:06 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:06:07 App\Jobs\ProcesarEnvioJob ...................... 1s FAIL
  2026-03-24 16:06:07 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:06:08 App\Jobs\ProcesarEnvioJob ...................... 1s FAIL
  2026-03-24 16:06:08 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:06:09 App\Jobs\ProcesarEnvioJob ................ 935.96ms FAIL
  2026-03-24 16:06:09 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:06:10 App\Jobs\ProcesarEnvioJob ................ 923.32ms FAIL
  2026-03-24 16:06:10 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:06:11 App\Jobs\ProcesarEnvioJob ................ 967.80ms FAIL
  2026-03-24 16:06:11 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:06:12 App\Jobs\ProcesarEnvioJob ................ 947.65ms FAIL
  2026-03-24 16:09:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:09:06 App\Jobs\ProcesarEnvioJob ...................... 1s FAIL
  2026-03-24 16:09:06 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:09:07 App\Jobs\ProcesarEnvioJob ................ 937.29ms FAIL
  2026-03-24 16:09:07 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:09:08 App\Jobs\ProcesarEnvioJob ................ 928.62ms FAIL
  2026-03-24 16:09:08 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:09:09 App\Jobs\ProcesarEnvioJob ................ 927.69ms FAIL
  2026-03-24 16:09:09 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:09:10 App\Jobs\ProcesarEnvioJob ................ 970.80ms FAIL
  2026-03-24 16:09:10 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:09:11 App\Jobs\ProcesarEnvioJob ................ 912.98ms FAIL
  2026-03-24 16:09:11 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-03-24 16:09:12 App\Jobs\ProcesarEnvioJob ................ 922.57ms FAIL

   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))

@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush
@extends('layouts.app')

@section('content')
<div class="container-fluid">

    <div class="mb-3">
        <h3 class="mb-0">Dashboard</h3>
        <small class="text-muted">
            {{ $empresa?->nombre ?? 'Sin empresa asignada' }} • Panel empresa_admin
        </small>
    </div>

    <div class="row g-3">
        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Usuarios en tu empresa</div>
                    <div class="fs-3 fw-bold">{{ $usuariosEmpresa ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Campañas este mes</div>
                    <div class="fs-3 fw-bold">{{ $campanasMes ?? 0 }}</div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="text-muted">Envíos este mes</div>
                    <div class="fs-3 fw-bold">{{ $enviosMes ?? 0 }}</div>
                </div>
            </div>
        </div>
    </div>

    {{-- Gráficas --}}
    <div class="row g-3 mt-1">
        <div class="col-lg-8">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Campañas vs Envíos (últimos 30 días)</h6>
                        <small class="text-muted">Serie diaria</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartCampanasEnvios"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card shadow-sm">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h6 class="fw-bold mb-0">Top campañas por envíos</h6>
                        <small class="text-muted">Top 8</small>
                    </div>
                    <div style="height: 320px;">
                        <canvas id="chartTopCampanas"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Accesos rápidos --}}
    <div class="card shadow-sm mt-3">
        <div class="card-body">
            <h6 class="fw-bold mb-2">Accesos rápidos</h6>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('empresa.campanas.index') }}" class="btn btn-outline-primary">Campañas</a>
                <a href="{{ route('empresa.contactos.index') }}" class="btn btn-outline-primary">Contactos</a>
                <a href="{{ route('empresa.tags.index') }}" class="btn btn-outline-primary">Segmentos</a>
                <a href="{{ route('empresa.plantillas.index') }}" class="btn btn-outline-primary">Plantillas</a>
                
            </div>
        </div>
    </div>

</div>
@endsection

@push('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<script>
    // Datos desde el backend
    const labels = @json($chartLabels ?? []);
    const campanas = @json($chartCampanas ?? []);
    const envios = @json($chartEnvios ?? []);

    const topLabels = @json($topCampanasLabels ?? []);
    const topEnvios  = @json($topCampanasEnvios ?? []);

    // Chart 1: líneas Campañas vs Envíos
    const ctx1 = document.getElementById('chartCampanasEnvios');
    if (ctx1) {
        new Chart(ctx1, {
            type: 'line',
            data: {
                labels,
                datasets: [
                    {
                        label: 'Campañas',
                        data: campanas,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    },
                    {
                        label: 'Envíos',
                        data: envios,
                        tension: 0.35,
                        borderWidth: 2,
                        pointRadius: 2
                    }
                ]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                interaction: { mode: 'index', intersect: false },
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }

    // Chart 2: barras Top campañas
    const ctx2 = document.getElementById('chartTopCampanas');
    if (ctx2) {
        new Chart(ctx2, {
            type: 'bar',
            data: {
                labels: topLabels,
                datasets: [{
                    label: 'Envíos',
                    data: topEnvios,
                    borderWidth: 1
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true }
                }
            }
        });
    }
</script>
@endpush

   Illuminate\Database\QueryException 

  SQLSTATE[08004] [1040] Too many connections (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+37 vendor frames [22m

  38  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[08004] [1040] Too many connections (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+37 vendor frames [22m

  38  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))

  2026-04-01 09:27:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-04-01 09:27:05 App\Jobs\ProcesarEnvioJob ................. 43.74ms FAIL
  2026-04-01 09:30:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-04-01 09:30:06 App\Jobs\ProcesarEnvioJob ................ 198.67ms FAIL
  2026-04-01 09:31:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
"entra" // app/Jobs/ProcesarEnvioJob.php:58
  2026-04-01 09:33:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-04-01 09:33:05 App\Jobs\ProcesarEnvioJob ................. 69.29ms FAIL
  2026-04-01 09:34:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
"entra" // app/Jobs/ProcesarEnvioJob.php:58
  2026-04-01 09:39:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-04-01 09:39:05 App\Jobs\ProcesarEnvioJob ................ 168.32ms FAIL
  2026-04-01 09:40:07 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-04-01 09:40:09 App\Jobs\ProcesarEnvioJob ...................... 1s FAIL
  2026-04-01 09:47:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-04-01 09:47:04 App\Jobs\ProcesarEnvioJob ................. 84.00ms DONE

   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))

  2026-04-06 17:23:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-04-06 17:23:07 App\Jobs\ProcesarEnvioJob ...................... 1s FAIL

   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [1040] Too many connections (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+37 vendor frames [22m

  38  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))

  2026-04-09 11:26:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-04-09 11:26:05 App\Jobs\ProcesarEnvioJob ...................... 1s FAIL
  2026-04-09 11:28:05 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-04-09 11:28:05 App\Jobs\ProcesarEnvioJob ................ 163.12ms DONE

   Illuminate\Database\QueryException 

  SQLSTATE[08004] [1040] Too many connections (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+37 vendor frames [22m

  38  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))

  2026-05-19 17:45:06 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-05-19 17:45:06 App\Jobs\ProcesarEnvioJob ................ 108.88ms DONE
  2026-05-19 17:50:04 App\Jobs\ProcesarEnvioJob ...................... RUNNING
  2026-05-19 17:50:05 App\Jobs\ProcesarEnvioJob ................ 103.47ms DONE

   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))


   Illuminate\Database\QueryException 

  SQLSTATE[HY000] [2002] Connection refused (Connection: mysql, Host: 127.0.0.1, Port: 3306, Database: ofertasv_mensajeando, SQL: select * from `cache` where `key` in (mensajeando-cache-illuminate:queue:restart))

  at vendor/laravel/framework/src/Illuminate/Database/Connection.php:838
    834▕             $exceptionType = $this->isUniqueConstraintError($e)
    835▕                 ? UniqueConstraintViolationException::class
    836▕                 : QueryException::class;
    837▕ 
  ➜ 838▕             throw new $exceptionType(
    839▕                 $this->getNameWithReadWriteType(),
    840▕                 $query,
    841▕                 $this->prepareBindings($bindings),
    842▕                 $e,

      [2m+40 vendor frames [22m

  41  artisan:16
      Illuminate\Foundation\Application::handleCommand(Object(Symfony\Component\Console\Input\ArgvInput))

