<?php /* views/layout.php */ ?>
<!DOCTYPE html>
<html lang="pt-BR" class="h-full" data-theme="light">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <meta name="color-scheme" content="light">
  <meta name="theme-color" content="#0b0f1a">
  <title><?= htmlspecialchars($title) ?> • <?= htmlspecialchars($appName) ?></title>

  <style>
    /* ===== Base sempre clara ===== */
    :root { color-scheme: light only; }
    html, body { background:#ffffff !important; color:#0b0f1a !important; }

    @media (prefers-color-scheme: dark) {
      html, body { background:#ffffff !important; color:#0b0f1a !important; }
      img, video, canvas, svg { filter:none !important; }
    }

    /* ===== Containers de card (não pega .rounded/.shadow/.btn) ===== */
    html[data-theme="light"] .card,
    html[data-theme="light"] .box,
    html[data-theme="light"] .panel,
    html[data-theme="light"] .widget,
    html[data-theme="light"] .tile,
    html[data-theme="light"] .stat {
      background:#ffffff !important;
      color:#0b0f1a !important;
      border:1px solid #e5e7eb;
    }

    /* Títulos e subtítulos dentro de cards */
    html[data-theme="light"] .card h1,
    html[data-theme="light"] .card h2,
    html[data-theme="light"] .card h3,
    html[data-theme="light"] .card h4,
    html[data-theme="light"] .panel h1,
    html[data-theme="light"] .panel h2,
    html[data-theme="light"] .panel h3,
    html[data-theme="light"] .panel h4,
    html[data-theme="light"] .text-muted,
    html[data-theme="light"] .subtitle { color:#0b0f1a !important; }

    /* Remapeia utilitárias muito claras do dark para tons legíveis no light */
    html[data-theme="light"] .text-gray-50,
    html[data-theme="light"] .text-slate-50,
    html[data-theme="light"] .text-zinc-50 { color:#0b0f1a !important; }
    html[data-theme="light"] .text-gray-100,
    html[data-theme="light"] .text-slate-100,
    html[data-theme="light"] .text-zinc-100 { color:#111827 !important; }
    html[data-theme="light"] .text-gray-200,
    html[data-theme="light"] .text-slate-200,
    html[data-theme="light"] .text-zinc-200 { color:#1f2937 !important; }
    html[data-theme="light"] .text-gray-300,
    html[data-theme="light"] .text-slate-300,
    html[data-theme="light"] .text-zinc-300 { color:#374151 !important; }
    html[data-theme="light"] .text-gray-400,
    html[data-theme="light"] .text-slate-400,
    html[data-theme="light"] .text-zinc-400 { color:#475569 !important; }

    /* Bordas escuras → clareia no light */
    html[data-theme="light"] .border-gray-800,
    html[data-theme="light"] .border-slate-800,
    html[data-theme="light"] .border-zinc-800 { border-color:#e5e7eb !important; }

    /* Fundos escuros comuns em "cards" → força branco no light */
    html[data-theme="light"] .bg-gray-900,
    html[data-theme="light"] .bg-slate-900,
    html[data-theme="light"] .bg-zinc-900,
    html[data-theme="light"] .bg-gray-800,
    html[data-theme="light"] .bg-slate-800,
    html[data-theme="light"] .bg-zinc-800 { background:#ffffff !important; }

    /* Placeholders e labels */
    html[data-theme="light"] ::placeholder { color:#64748b !important; opacity:1; }
    html[data-theme="light"] label,
    html[data-theme="light"] .help,
    html[data-theme="light"] .hint { color:#475569 !important; }

    /* Subtítulos/legendas */
    html[data-theme="light"] .text-muted,
    html[data-theme="light"] .subtitle,
    html[data-theme="light"] .muted,
    html[data-theme="light"] .prose small,
    html[data-theme="light"] .card .text-sm,
    html[data-theme="light"] .card .text-xs { color:#334155 !important; }
    html[data-theme="light"] .text-gray-500,
    html[data-theme="light"] .text-slate-500,
    html[data-theme="light"] .text-zinc-500 { color:#334155 !important; }
    html[data-theme="light"] .text-gray-600,
    html[data-theme="light"] .text-slate-600,
    html[data-theme="light"] .text-zinc-600 { color:#1f2937 !important; }

    html[data-theme="light"] .card [class*="opacity-"],
    html[data-theme="light"] .panel [class*="opacity-"] { opacity:1 !important; }

    html[data-theme="light"] .card h5,
    html[data-theme="light"] .card h6,
    html[data-theme="light"] .panel h5,
    html[data-theme="light"] .panel h6 { color:#0f172a !important; }

    /* ===== Tabelas ===== */
    html[data-theme="light"] table,
    html[data-theme="light"] .table { color:#0f172a !important; }
    html[data-theme="light"] thead th {
      color:#0f172a !important; font-weight:600 !important;
      border-bottom:1px solid #e5e7eb !important;
    }
    html[data-theme="light"] tbody td { color:#1f2937 !important; }
    html[data-theme="light"] tbody tr { border-top:1px solid #e5e7eb !important; }
    html[data-theme="light"] tbody tr:hover { background:#f8fafc !important; }
    html[data-theme="light"] tbody,
    html[data-theme="light"] tbody tr,
    html[data-theme="light"] tbody td { opacity:1 !important; }
    html[data-theme="light"] #leadRows td,
    html[data-theme="light"] #leadRows th { color:#1f2937 !important; }

    /* ===== Inputs neutros (não afeta botões coloridos) ===== */
    html[data-theme="light"] select,
    html[data-theme="light"] input[type="text"],
    html[data-theme="light"] input[type="number"],
    html[data-theme="light"] input[type="email"],
    html[data-theme="light"] input[type="password"],
    html[data-theme="light"] textarea {
      background:#ffffff !important;
      color:#0f172a !important;
      border-color:#e5e7eb !important;
    }
    html[data-theme="light"] select:disabled,
    html[data-theme="light"] input:disabled,
    html[data-theme="light"] button:disabled { color:#94a3b8 !important; }

    /* ===== Botões "sem classe de cor" (padrão básico) ===== */
    html[data-theme="light"] button:not([class*="bg-"]):not(.btn):not([class*="btn-"]):not(.tb-hamburger) {
      background:#f1f5f9 !important; color:#0f172a !important; border:1px solid #e5e7eb !important;
    }
    html[data-theme="light"] button:not([class*="bg-"]):not(.btn):not([class*="btn-"]):not(.tb-hamburger):hover {
      background:#e2e8f0 !important;
    }
    
    
    /* Restaura o estilo do botão "Selecionar leads…" */
html[data-theme="light"] #btnPickLeads {
  background:#1f2937 !important;   /* gray-800 */
  color:#ffffff !important;
  border-color:#1f2937 !important;
}
html[data-theme="light"] #btnPickLeads:hover {
  background:#374151 !important;   /* gray-700 */
}


    /* ===== Airbag contra dark:* quando SO estiver escuro ===== */
    @media (prefers-color-scheme: dark) {
      /* Neutraliza utilitárias dark:* se data-theme="light" */
      html[data-theme="light"] [class*="dark:bg-"]   { background:#ffffff !important; }
      html[data-theme="light"] [class*="dark:border-"] { border-color:#e5e7eb !important; }
      html[data-theme="light"] [class*="dark:text-"] { color:#0f172a !important; }

      /* Tons translúcidos comuns no dark */
      html[data-theme="light"] [class*="bg-black/"],
      html[data-theme="light"] [class*="bg-gray-900/"],
      html[data-theme="light"] [class*="bg-slate-900/"],
      html[data-theme="light"] [class*="bg-zinc-900/"] { background:#ffffff !important; }

      /* Tokens DaisyUI/base */
      html[data-theme="light"] .bg-base-200,
      html[data-theme="light"] .bg-base-300,
      html[data-theme="light"] .bg-neutral {
        background:#ffffff !important; color:#0f172a !important; border:1px solid #e5e7eb !important;
      }
    }
    
    /* ===== FIX CHATWOOT (ganha do seu button generic) ===== */
html[data-theme="light"] .woot-widget-bubble,
html[data-theme="light"] .woot-widget-bubble.woot-elements--right,
html[data-theme="light"] #cw-bubble-holder .woot-widget-bubble {
  background: #6D28D9 !important;
  border: none !important;
}

html[data-theme="light"] #cw-bubble-holder button.woot-widget-bubble {
  background: #6D28D9 !important;
}

html[data-theme="light"] #cw-bubble-holder button.woot-widget-bubble svg path {
  fill: #ffffff !important;
}

    /* ===== Ajuste de posição da bolinha do Chatwoot ===== */
html[data-theme="light"] .woot-widget-bubble,
html[data-theme="light"] .woot-widget-bubble.woot-elements--right {
  bottom: 70px !important; /* ajuste aqui */
}

    
  </style>

  <!-- Tailwind CDN: darkMode por classe -->
  <script>
    tailwind = {};
    tailwind.config = { darkMode: 'class' };
  </script>
  <script src="https://cdn.tailwindcss.com"></script>

  <!-- Garante modo claro sempre -->
  <script>
    document.documentElement.classList.remove('dark');
    localStorage.theme = 'light';
  </script>

  <!-- Seus estilos extras -->
  <link rel="icon" type="image/png" href="<?= BASE_URL ?>assets/brand/favicon.png">
  <link rel="apple-touch-icon" href="<?= BASE_URL ?>assets/brand/favicon.png">
  <link rel="stylesheet" href="/assets/css/custom.css">
  <!-- CSS RESPONSIVO -->
  <link rel="stylesheet" href="/assets/css/responsive.css">
</head>

<body class="h-full bg-white text-gray-900">
  <div class="min-h-full">
    <?php require __DIR__ . '/partials/sidebar.php'; ?>

    <!-- Overlay mobile (fecha sidebar ao clicar fora) -->
    <div class="sb-overlay" id="sbOverlay"></div>

    <div class="main-content pl-64 min-h-screen flex flex-col">
      <?php require __DIR__ . '/partials/topbar.php'; ?>

      <main class="flex-1 p-6">
        <?php require $contentView; ?>
      </main>

      <?php require __DIR__ . '/partials/footer.php'; ?>
    </div>
  </div>

  <script src="/assets/js/theme.js"></script>

  <!-- Controle da sidebar mobile -->
  <script>
  (function(){
    var btn     = document.getElementById('sbToggle');
    var sidebar = document.querySelector('.sb');
    var overlay = document.getElementById('sbOverlay');
    if (!btn || !sidebar || !overlay) return;

    function open(){
      sidebar.classList.add('is-mobile-open');
      overlay.classList.add('is-visible');
      document.body.style.overflow = 'hidden';
    }
    function close(){
      sidebar.classList.remove('is-mobile-open');
      overlay.classList.remove('is-visible');
      document.body.style.overflow = '';
    }

    btn.addEventListener('click', function(){
      sidebar.classList.contains('is-mobile-open') ? close() : open();
    });
    overlay.addEventListener('click', close);

    // Fecha ao clicar em qualquer link da sidebar
    sidebar.querySelectorAll('a[href]').forEach(function(a){
      a.addEventListener('click', function(){ close(); });
    });

    // Fecha com ESC
    document.addEventListener('keydown', function(e){
      if (e.key === 'Escape') close();
    });
  })();
  </script>



  
</body>
</html>