<?php
$page_title    = 'Notificaciones';
$page_subtitle = 'Semáforo y rutinas del plan comercial';
require_once 'layout.php';
$db = getDB();

// ── Metas desde DB ────────────────────────────────────────────────
$m               = getMetas($db);
$meta_mes        = $m['rampa_2026_'.date('m')] ?? $m['rampa_2026_06'];
$clientes_mes    = $db->query("SELECT COUNT(*) FROM dimark_clientes WHERE DATE_FORMAT(fecha_inicio,'%Y-%m')='".date('Y-m')."'")->fetchColumn();
$dia_actual      = max(1, intval(date('j')));
$dias_mes        = intval(date('t'));
$proyeccion      = round(($clientes_mes / $dia_actual) * $dias_mes);
$pct_proy        = $meta_mes > 0 ? round($proyeccion / $meta_mes * 100) : 0;

if      ($pct_proy >= 100)                 $sema_com = ['color'=>'verde',   'icon'=>'🟢','label'=>'Verde — En meta',     'msg'=>"Proyección: {$proyeccion} clientes. Mantener ritmo."];
elseif  ($pct_proy >= $m['sema_amarillo']) $sema_com = ['color'=>'amarillo','icon'=>'🟡','label'=>'Amarillo — Alerta −20%','msg'=>"Proyección: {$proyeccion}/{$meta_mes} clientes. Revisar canal y mensaje."];
else                                        $sema_com = ['color'=>'rojo',    'icon'=>'🔴','label'=>'Rojo — Urgente −40%',  'msg'=>"Proyección: {$proyeccion}/{$meta_mes} clientes. Reunión de emergencia hoy."];

// ── Datos CRM para alertas ────────────────────────────────────────
$followups_vencidos   = $db->query("SELECT COUNT(*) FROM dimark_prospectos WHERE fecha_followup < CURDATE() AND estado NOT IN ('ganado','perdido')")->fetchColumn();
$followups_hoy        = $db->query("SELECT COUNT(*) FROM dimark_prospectos WHERE fecha_followup = CURDATE() AND estado NOT IN ('ganado','perdido')")->fetchColumn();
$en_negociacion       = $db->query("SELECT COUNT(*) FROM dimark_prospectos WHERE estado='negociacion' AND updated_at < DATE_SUB(NOW(),INTERVAL 5 DAY)")->fetchColumn();
$clientes_sin_checkin = $db->query("SELECT COUNT(*) FROM dimark_clientes WHERE DATEDIFF(CURDATE(),fecha_inicio) BETWEEN 10 AND 12")->fetchColumn();
$renovaciones_prox    = $db->query("SELECT COUNT(*) FROM dimark_clientes WHERE fecha_renovacion BETWEEN CURDATE() AND DATE_ADD(CURDATE(),INTERVAL 15 DAY)")->fetchColumn();
$clientes_sin_referido= $db->query("SELECT COUNT(*) FROM dimark_clientes WHERE DATEDIFF(CURDATE(),fecha_inicio) >= 14 AND id NOT IN (SELECT DISTINCT cliente_id FROM dimark_referidos)")->fetchColumn();

// ── Métricas de conversión (playbook) ────────────────────────────
$demos_semana   = $db->query("SELECT COUNT(*) FROM dimark_prospectos WHERE estado IN ('demo_agendada','demo_realizada') AND updated_at >= DATE_SUB(NOW(), INTERVAL 7 DAY)")->fetchColumn();
$total_demos    = $db->query("SELECT COUNT(*) FROM dimark_prospectos WHERE estado IN ('demo_realizada','negociacion','propuesta_enviada','ganado')")->fetchColumn();
$total_ganados  = $db->query("SELECT COUNT(*) FROM dimark_prospectos WHERE estado='ganado'")->fetchColumn();
$conv_demo      = $total_demos > 0 ? round($total_ganados / $total_demos * 100) : 0;
$total_pros     = $db->query("SELECT COUNT(*) FROM dimark_prospectos")->fetchColumn();
$respondieron   = $db->query("SELECT COUNT(*) FROM dimark_prospectos WHERE estado != 'prospecto'")->fetchColumn();
$tasa_resp      = $total_pros > 0 ? round($respondieron / $total_pros * 100) : 0;

// ── Semáforo operacional ──────────────────────────────────────────
$urgentes   = intval($followups_vencidos) + intval($clientes_sin_checkin) + intval($renovaciones_prox);
$pendientes = intval($followups_hoy) + intval($en_negociacion) + intval($clientes_sin_referido);
?>

<!-- SEMÁFORO COMERCIAL (PLAYBOOK) -->
<div class="sema-com-notif sema-cn-<?=$sema_com['color']?>" style="margin-bottom:14px">
  <div style="display:flex;align-items:center;gap:12px;flex:1">
    <span style="font-size:24px"><?=$sema_com['icon']?></span>
    <div>
      <div style="font-family:'Syne',sans-serif;font-weight:800;font-size:14px"><?=$sema_com['label']?> — <?=$clientes_mes?>/<?=$meta_mes?> clientes este mes</div>
      <div style="font-size:12px;opacity:.75;margin-top:2px"><?=$sema_com['msg']?></div>
    </div>
  </div>
  <a href="dashboard.php" style="font-size:12px;text-decoration:underline;opacity:.7;flex-shrink:0">Ver dashboard →</a>
</div>

<!-- MÉTRICAS CLAVE PLAYBOOK -->
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px">

  <?php
  $dem_min  = $m['kpi_demos_semana_min'];
  $dem_c = $demos_semana>=$dem_min?'#0F6E56':($demos_semana>=intval($dem_min*0.6)?'#854F0B':'#A32D2D');
  $dem_b = $demos_semana>=$dem_min?'#E1F5EE':($demos_semana>=intval($dem_min*0.6)?'#FAEEDA':'#FCEBEB');
  $dem_icon = $demos_semana>=$dem_min?'ti-circle-check':($demos_semana>=intval($dem_min*0.6)?'ti-alert-triangle':'ti-circle-x');
  $kpi_cd = $m['kpi_conv_demo'];
  $conv_c = $conv_demo>=$kpi_cd?'#0F6E56':($conv_demo>=intval($kpi_cd/2)?'#854F0B':'#A32D2D');
  $conv_b = $conv_demo>=$kpi_cd?'#E1F5EE':($conv_demo>=intval($kpi_cd/2)?'#FAEEDA':'#FCEBEB');
  $conv_icon = $conv_demo>=$kpi_cd?'ti-circle-check':($conv_demo>=intval($kpi_cd/2)?'ti-alert-triangle':'ti-circle-x');
  $kpi_rr = $m['kpi_resp_rate'];
  $resp_c = $tasa_resp>=$kpi_rr?'#0F6E56':($tasa_resp>=intval($kpi_rr*0.7)?'#854F0B':'#A32D2D');
  $resp_b = $tasa_resp>=$kpi_rr?'#E1F5EE':($tasa_resp>=intval($kpi_rr*0.7)?'#FAEEDA':'#FCEBEB');
  $resp_icon = $tasa_resp>=$kpi_rr?'ti-circle-check':($tasa_resp>=intval($kpi_rr*0.7)?'ti-alert-triangle':'ti-circle-x');
  ?>

  <div style="background:<?=$dem_b?>;border-radius:10px;padding:12px 14px">
    <div style="display:flex;align-items:center;gap:6px;margin-bottom:4px">
      <i class="ti <?=$dem_icon?>" style="color:<?=$dem_c?>;font-size:14px"></i>
      <span style="font-size:11px;font-weight:500;color:<?=$dem_c?>;text-transform:uppercase;letter-spacing:.04em">Demos/semana</span>
    </div>
    <div style="font-family:'Syne',sans-serif;font-weight:800;font-size:1.5rem;color:<?=$dem_c?>;line-height:1"><?=$demos_semana?></div>
    <div style="font-size:11px;color:<?=$dem_c?>;opacity:.7;margin-top:3px">Meta: <?=$m['kpi_demos_semana_min']?>–<?=$m['kpi_demos_semana_max']?> demos</div>
  </div>

  <div style="background:<?=$conv_b?>;border-radius:10px;padding:12px 14px">
    <div style="display:flex;align-items:center;gap:6px;margin-bottom:4px">
      <i class="ti <?=$conv_icon?>" style="color:<?=$conv_c?>;font-size:14px"></i>
      <span style="font-size:11px;font-weight:500;color:<?=$conv_c?>;text-transform:uppercase;letter-spacing:.04em">Conversión demo</span>
    </div>
    <div style="font-family:'Syne',sans-serif;font-weight:800;font-size:1.5rem;color:<?=$conv_c?>;line-height:1"><?=$conv_demo?>%</div>
    <div style="font-size:11px;color:<?=$conv_c?>;opacity:.7;margin-top:3px">Meta: ≥<?=$m['kpi_conv_demo']?>%</div>
  </div>

  <div style="background:<?=$resp_b?>;border-radius:10px;padding:12px 14px">
    <div style="display:flex;align-items:center;gap:6px;margin-bottom:4px">
      <i class="ti <?=$resp_icon?>" style="color:<?=$resp_c?>;font-size:14px"></i>
      <span style="font-size:11px;font-weight:500;color:<?=$resp_c?>;text-transform:uppercase;letter-spacing:.04em">Tasa respuesta</span>
    </div>
    <div style="font-family:'Syne',sans-serif;font-weight:800;font-size:1.5rem;color:<?=$resp_c?>;line-height:1"><?=$tasa_resp?>%</div>
    <div style="font-size:11px;color:<?=$resp_c?>;opacity:.7;margin-top:3px">Meta: ≥<?=$m['kpi_resp_rate']?>%</div>
  </div>
</div>

<!-- SEMÁFORO OPERACIONAL -->
<div class="sema-row">
  <div class="sema-card verde">
    <div style="font-size:22px;margin-bottom:4px">🟢</div>
    <div class="sema-n"><?= max(0, 16 - $urgentes - $pendientes) ?></div>
    <div class="sema-l">Tareas al día</div>
  </div>
  <div class="sema-card amarillo">
    <div style="font-size:22px;margin-bottom:4px">🟡</div>
    <div class="sema-n"><?= $pendientes ?></div>
    <div class="sema-l">Pendientes hoy</div>
  </div>
  <div class="sema-card rojo">
    <div style="font-size:22px;margin-bottom:4px">🔴</div>
    <div class="sema-n"><?= $urgentes ?></div>
    <div class="sema-l">Urgentes / vencidas</div>
  </div>
</div>

<!-- TABS -->
<div style="display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap" id="notif-tabs">
  <button class="btn active-tab" onclick="filterNotif('todas',this)" style="font-size:12px;padding:5px 12px">Todas</button>
  <button class="btn" onclick="filterNotif('diaria',this)" style="font-size:12px;padding:5px 12px">Rutina diaria</button>
  <button class="btn" onclick="filterNotif('semanal',this)" style="font-size:12px;padding:5px 12px">Semanal</button>
  <button class="btn" onclick="filterNotif('mensual',this)" style="font-size:12px;padding:5px 12px">Mensual</button>
  <button class="btn" onclick="filterNotif('alerta',this)" style="font-size:12px;padding:5px 12px">Alertas CRM</button>
</div>

<div id="notif-container">
<?php
$notifs = [
  // DIARIA
  ['tipo'=>'diaria','urg'=>'amarillo','icon'=>'ti-message-circle','iconbg'=>'#E1F5EE',
   'title'=>'Enviar 30–50 mensajes de apertura',
   'desc'=>'Outbound WhatsApp primero. Meta: 50 prospectos por asesor hoy.',
   'badges'=>['Diaria','WhatsApp']],

  ['tipo'=>'diaria','urg'=>'amarillo','icon'=>'ti-table','iconbg'=>'#E6F1FB',
   'title'=>'Registrar prospectos contactados en el CRM',
   'desc'=>'Actualizar canal, sector y estado de cada contacto del día.',
   'badges'=>['Diaria','CRM']],

  ['tipo'=>'diaria','urg'=>$followups_vencidos>0?'rojo':'verde','icon'=>'ti-clock','iconbg'=>$followups_vencidos>0?'#FCEBEB':'#E1F5EE',
   'title'=>'Follow-up día 3 y día 7 pendientes',
   'desc'=>$followups_vencidos>0 ? "{$followups_vencidos} prospectos con follow-up vencido. Acción inmediata." : "Sin follow-ups vencidos. Todo al día.",
   'badges'=>$followups_vencidos>0 ? ['Urgente',"{$followups_vencidos} vencidos"] : ['Verde','Al día']],

  ['tipo'=>'diaria','urg'=>'amarillo','icon'=>'ti-calendar','iconbg'=>'#FAEEDA',
   'title'=>'Confirmar demos del día siguiente',
   'desc'=>'WhatsApp de recordatorio 24h antes a todos los prospectos con demo agendada.',
   'badges'=>['Diaria','Recordatorio']],

  // SEMANAL
  ['tipo'=>'semanal','urg'=>$demos_semana<$m['kpi_demos_semana_min']?'rojo':'verde','icon'=>'ti-device-tv','iconbg'=>$demos_semana<$m['kpi_demos_semana_min']?'#FCEBEB':'#E1F5EE',
   'title'=>'Meta de demos semanales',
   'desc'=>$demos_semana>=$m['kpi_demos_semana_min'] ? "✓ {$demos_semana} demos esta semana. ¡En meta!" : "Solo {$demos_semana} demos esta semana. Meta: {$m['kpi_demos_semana_min']}–{$m['kpi_demos_semana_max']}. Agendar más urgente.",
   'badges'=>$demos_semana>=$m['kpi_demos_semana_min'] ? ['Verde','Meta cumplida'] : ['Urgente',"Solo {$demos_semana} demos"]],

  ['tipo'=>'semanal','urg'=>$conv_demo<$m['kpi_conv_demo']?'rojo':'verde','icon'=>'ti-trending-up','iconbg'=>$conv_demo<$m['kpi_conv_demo']?'#FCEBEB':'#E1F5EE',
   'title'=>'Conversión demo → cliente',
   'desc'=>$conv_demo>=$m['kpi_conv_demo'] ? "✓ Conversión en {$conv_demo}%. Mantener el proceso de cierre." : "Conversión en {$conv_demo}% (meta ≥{$m['kpi_conv_demo']}%). Revisar propuesta, objeciones y seguimiento post-demo.",
   'badges'=>$conv_demo>=$m['kpi_conv_demo'] ? ['Verde',"{$conv_demo}%"] : ['Urgente',"{$conv_demo}% / meta {$m['kpi_conv_demo']}%"]],

  ['tipo'=>'semanal','urg'=>$tasa_resp<$m['kpi_resp_rate']?'amarillo':'verde','icon'=>'ti-message-reply','iconbg'=>$tasa_resp<$m['kpi_resp_rate']?'#FAEEDA':'#E1F5EE',
   'title'=>'Tasa de respuesta por canal',
   'desc'=>$tasa_resp>=$m['kpi_resp_rate'] ? "✓ Tasa global {$tasa_resp}%. Por encima de la meta del playbook." : "Tasa global {$tasa_resp}% (meta ≥{$m['kpi_resp_rate']}%). Optimizar mensaje de apertura o cambiar canal prioritario.",
   'badges'=>$tasa_resp>=$m['kpi_resp_rate'] ? ['Verde',"{$tasa_resp}%"] : ['Atención',"{$tasa_resp}% / meta {$m['kpi_resp_rate']}%"]],

  ['tipo'=>'semanal','urg'=>'amarillo','icon'=>'ti-chart-bar','iconbg'=>'#E6F1FB',
   'title'=>'Revisar dashboard semanal (cada lunes)',
   'desc'=>'¿Cuántos contactados, demos y cierres? Comparar con meta mensual.',
   'badges'=>['Lunes','15 min']],

  ['tipo'=>'semanal','urg'=>$en_negociacion>0?'rojo':'verde','icon'=>'ti-users','iconbg'=>$en_negociacion>0?'#FAEEDA':'#E1F5EE',
   'title'=>'Push de cierre — prospectos en negociación',
   'desc'=>$en_negociacion>0 ? "{$en_negociacion} prospectos en negociación llevan más de 5 días sin avance." : "Sin prospectos estancados en negociación.",
   'badges'=>$en_negociacion>0 ? ['Urgente',"{$en_negociacion} estancados"] : ['Verde','Sin estancados']],

  ['tipo'=>'semanal','urg'=>$clientes_sin_referido>0?'amarillo':'verde','icon'=>'ti-gift','iconbg'=>'#EEEDFE',
   'title'=>'Activar referidos en clientes 2+ semanas',
   'desc'=>$clientes_sin_referido>0 ? "{$clientes_sin_referido} clientes llevan 2+ semanas activos sin propuesta de referidos." : "Todos los clientes activos han recibido la propuesta de referidos.",
   'badges'=>$clientes_sin_referido>0 ? ['Semanal',"{$clientes_sin_referido} pendientes"] : ['Verde','Al día']],

  // MENSUAL
  ['tipo'=>'mensual','urg'=>'amarillo','icon'=>'ti-report-analytics','iconbg'=>'#E1F5EE',
   'title'=>'Revisión mensual de meta (1er lunes del mes)',
   'desc'=>'45 minutos. ¿Se cumplió la meta? Análisis de causa raíz si no. Reasignar esfuerzo por sector.',
   'badges'=>['1er lunes','45 min']],

  ['tipo'=>'mensual','urg'=>'amarillo','icon'=>'ti-arrows-transfer-up','iconbg'=>'#FAEEDA',
   'title'=>'Reasignar esfuerzo al sector con mayor conversión',
   'desc'=>'El sector con mejor tasa de cierre recibe el 70% del esfuerzo el mes siguiente.',
   'badges'=>['Mensual','Estratégico']],

  ['tipo'=>'mensual','urg'=>'amarillo','icon'=>'ti-ad-2','iconbg'=>'#EEEDFE',
   'title'=>'Revisar y estandarizar mensaje de apertura top',
   'desc'=>'Estandarizar el mensaje con mejor conversión. Eliminar los que no funcionan.',
   'badges'=>['Mensual','Optimización']],

  // ALERTAS CRM
  ['tipo'=>'alerta','urg'=>$clientes_sin_checkin>0?'rojo':'verde','icon'=>'ti-user-check','iconbg'=>$clientes_sin_checkin>0?'#FCEBEB':'#E1F5EE',
   'title'=>'Check-in día 10 — clientes nuevos',
   'desc'=>$clientes_sin_checkin>0 ? "{$clientes_sin_checkin} cliente(s) llevan ~10 días activos. Hacer check-in proactivo ahora." : "Sin clientes nuevos que requieran check-in esta semana.",
   'badges'=>$clientes_sin_checkin>0 ? ['Urgente','Retención'] : ['Verde','Al día']],

  ['tipo'=>'alerta','urg'=>$renovaciones_prox>0?'rojo':'verde','icon'=>'ti-coin','iconbg'=>$renovaciones_prox>0?'#FAEEDA':'#E1F5EE',
   'title'=>'Renovaciones próximas — confirmar cobro',
   'desc'=>$renovaciones_prox>0 ? "{$renovaciones_prox} cliente(s) renuevan en los próximos 15 días. Confirmar cobro anticipado." : "Sin renovaciones en los próximos 15 días.",
   'badges'=>$renovaciones_prox>0 ? ['Urgente',"{$renovaciones_prox} clientes"] : ['Verde','Sin vencer']],

  ['tipo'=>'alerta','urg'=>'amarillo','icon'=>'ti-star','iconbg'=>'#FAEEDA',
   'title'=>'Reporte mensual de comisiones a influencers',
   'desc'=>'Enviar resumen por WhatsApp a cada influencer: clientes activos, monto y fecha de pago.',
   'badges'=>['Mensual','Influencers']],
];

$badge_class = ['Urgente'=>'b-red','Verde'=>'b-green','Al día'=>'b-green','Atención'=>'b-amber','Diaria'=>'b-blue','Semanal'=>'b-blue','Mensual'=>'b-blue','Lunes'=>'b-blue','1er lunes'=>'b-blue','WhatsApp'=>'b-green','CRM'=>'b-blue','Retención'=>'b-red','Estratégico'=>'b-purple','Optimización'=>'b-purple','Recordatorio'=>'b-amber','15 min'=>'b-gray','45 min'=>'b-gray','Influencers'=>'b-purple','Meta cumplida'=>'b-green'];

foreach($notifs as $n):
  $urg_icon  = $n['urg']==='rojo' ? 'ti-circle-x' : ($n['urg']==='amarillo' ? 'ti-alert-triangle' : 'ti-circle-check');
  $urg_color = $n['urg']==='rojo' ? '#A32D2D' : ($n['urg']==='amarillo' ? '#854F0B' : '#0F6E56');
?>
<div class="notif-item" data-tipo="<?=$n['tipo']?>" data-urg="<?=$n['urg']?>">
  <div class="notif-icon" style="background:<?=$n['iconbg']?>"><i class="ti <?=$n['icon']?>"></i></div>
  <div class="notif-body" style="flex:1">
    <h4><?=htmlspecialchars($n['title'])?></h4>
    <p><?=htmlspecialchars($n['desc'])?></p>
    <div class="notif-badges">
      <span class="badge" style="background:<?=$n['urg']==='rojo'?'#FCEBEB':($n['urg']==='amarillo'?'#FAEEDA':'#E1F5EE')?>;color:<?=$urg_color?>">
        <i class="ti <?=$urg_icon?>" style="font-size:10px"></i> <?=ucfirst($n['urg'])?>
      </span>
      <?php foreach($n['badges'] as $b):
        $bc = $badge_class[$b] ?? 'b-gray'; ?>
        <span class="badge <?=$bc?>"><?=htmlspecialchars($b)?></span>
      <?php endforeach; ?>
    </div>
  </div>
</div>
<?php endforeach; ?>
</div>

<style>
.sema-com-notif{display:flex;align-items:center;gap:12px;border-radius:12px;padding:13px 16px;border:0.5px solid}
.sema-cn-verde{background:#E1F5EE;border-color:#1D9E75;color:#085041}
.sema-cn-amarillo{background:#FAEEDA;border-color:#EF9F27;color:#633806}
.sema-cn-rojo{background:#FCEBEB;border-color:#E24B4A;color:#791F1F}
.active-tab{background:var(--black)!important;color:#fff!important;border-color:transparent!important}
.sema-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.sema-card{background:#fff;border:0.5px solid var(--border);border-radius:10px;padding:12px;text-align:center}
.sema-n{font-family:'Syne',sans-serif;font-weight:800;font-size:1.75rem;line-height:1}
.sema-l{font-size:11px;color:var(--muted);margin-top:3px}
.sema-card.verde .sema-n{color:#0F6E56}
.sema-card.amarillo .sema-n{color:#854F0B}
.sema-card.rojo .sema-n{color:#A32D2D}
</style>

<script>
function filterNotif(tipo,btn){
  document.querySelectorAll('#notif-tabs button').forEach(b=>b.classList.remove('active-tab'));
  btn.classList.add('active-tab');
  document.querySelectorAll('.notif-item').forEach(el=>{
    el.style.display=(tipo==='todas'||el.dataset.tipo===tipo)?'flex':'none';
  });
}
</script>

<?php require_once 'layout_end.php'; ?>
