<!doctype html>
<html lang="pt">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, viewport-fit=cover, user-scalable=no"
    />
    <title>EssenciaLab - Saúde Preventiva e Desenvolvimento Pessoal</title>

    <!-- PWA Meta Tags -->
    <!-- theme-color será atualizado dinamicamente pelo useTheme hook -->
    <meta name="theme-color" content="#ffffff" />
    <meta
      name="theme-color"
      media="(prefers-color-scheme: light)"
      content="#ffffff"
    />
    <meta
      name="theme-color"
      media="(prefers-color-scheme: dark)"
      content="#0f1724"
    />
    <meta
      name="description"
      content="Análise facial saúde preventiva e desenvolvimento pessoal"
    />
    <link rel="apple-touch-icon" href="/icons/apple-touch-icon.png" />
    <link rel="manifest" href="/manifest.json" />

    <!-- iOS Status Bar -->
    <!-- apple-mobile-web-app-status-bar-style será atualizado dinamicamente -->
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="default" />

    <!-- Android Chrome -->
    <meta name="mobile-web-app-capable" content="yes" />

    <!-- MediaPipe Asset Loading Configuration -->
    <script>
      // Configure MediaPipe asset loading
      window.Module = {
        locateFile: function (path, prefix) {
          console.log("[MediaPipe locateFile] path:", path, "prefix:", prefix);

          // Remove barras iniciais do path
          const cleanPath = path.replace(/^\/+/, "");

          // Detecta se está no Capacitor (Android/iOS)
          const isCapacitor = window.Capacitor?.isNativePlatform?.() || false;
          const baseUrl = isCapacitor ? "https://localhost" : "";

          // Constrói o caminho completo sem barras duplas
          const fullPath = `${baseUrl}/mediapipe/wasm/${cleanPath}`;

          console.log("[MediaPipe locateFile] result:", fullPath);
          return fullPath;
        },
      };
    </script>

    <!-- Scripts de análise 3D (devem estar disponíveis antes do React montar) -->
    <!-- Query parameter ?v= força atualização do cache quando versão muda -->
    <!-- Otimizações mobile -->
    <script src="/essencialab/mobile-optimization.js?v=3.9.6"></script>
    <!-- Análise de sinais vitais e emoções -->
    <script src="/essencialab/heartbeat3d.js?v=3.9.6"></script>
    <script src="/essencialab/emotionAnalysis3d.js?v=3.9.6"></script>
    <script src="/essencialab/organAnalysis3d.js?v=3.9.6"></script>
    <!-- Métricas faciais 3D -->
    <script src="/essencialab/facialMetrics3d.js?v=3.9.6"></script>
    <!-- Análise de idade biológica da pele 3D -->
    <script src="/essencialab/skinAnalysis3d.js?v=3.9.6"></script>
    <!-- Processamento de onda de pulso -->
    <script src="/essencialab/pulseWaveProcessor3d.js?v=3.9.6"></script>
    <script type="module" crossorigin src="/assets/index-B3d2UD2b.js"></script>
    <link rel="stylesheet" crossorigin href="/assets/index-NiWgSsds.css">
  <link rel="manifest" href="/manifest.json"></head>
  <body>
    <div id="root">
      <!-- Loading fallback -->
      <div
        style="
          display: flex;
          justify-content: center;
          align-items: center;
          height: 100vh;
          font-family:
            system-ui,
            -apple-system,
            sans-serif;
          background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
          color: white;
        "
      >
        <div style="text-align: center">
          <div
            style="
              width: 50px;
              height: 50px;
              border: 3px solid rgba(255, 255, 255, 0.3);
              border-top: 3px solid white;
              border-radius: 50%;
              animation: spin 1s linear infinite;
              margin: 0 auto 20px;
            "
          ></div>
          <h2>EssenciaLab</h2>
          <p>Carregando arquivos...</p>
        </div>
      </div>
      <style>
        @keyframes spin {
          0% {
            transform: rotate(0deg);
          }
          100% {
            transform: rotate(360deg);
          }
        }
      </style>
    </div>

    <!-- Camera Permission Management -->
    <script>
      // Enhanced camera permission handling
      (function () {
        let permissionAttempts = 0;
        const maxAttempts = 3;

        function checkCameraPermissions() {
          // Check if we're in an iframe
          if (window !== window.top) {
            console.warn(
              "EssenciaLab: Aplicação rodando em iframe - permissões de câmera podem ser limitadas"
            );
          }

          // Check for Permissions Policy
          if ("permissions" in navigator) {
            navigator.permissions
              .query({ name: "camera" })
              .then(function (result) {
                console.log("Camera permission status:", result.state);
                if (result.state === "denied") {
                  console.warn(
                    "EssenciaLab: Permissão de câmera negada pelo usuário"
                  );
                }
              })
              .catch(function (err) {
                console.log("Permissions API not fully supported:", err);
              });
          }

          // Check Content Security Policy
          const metaCSP = document.querySelector(
            'meta[http-equiv="Content-Security-Policy"]'
          );
          if (metaCSP && !metaCSP.content.includes("camera")) {
            console.warn(
              "EssenciaLab: CSP pode estar bloqueando acesso à câmera"
            );
          }
        }

        function requestCameraAccess() {
          if (permissionAttempts >= maxAttempts) {
            console.error(
              "EssenciaLab: Máximo de tentativas de acesso à câmera excedido"
            );
            return Promise.reject(
              new Error("Max camera access attempts exceeded")
            );
          }

          permissionAttempts++;

          return navigator.mediaDevices
            .getUserMedia({
              video: {
                width: { ideal: 1280 },
                height: { ideal: 720 },
                facingMode: "user",
              },
            })
            .then(function (stream) {
              console.log("EssenciaLab: Acesso à câmera concedido");
              // Stop the stream immediately as this is just a permission check
              stream.getTracks().forEach((track) => track.stop());
              return stream;
            })
            .catch(function (err) {
              console.error(
                "EssenciaLab: Erro ao acessar câmera:",
                err.name,
                err.message
              );

              if (err.name === "NotAllowedError") {
                console.warn("EssenciaLab: Usuário negou permissão de câmera");
              } else if (err.name === "NotFoundError") {
                console.warn("EssenciaLab: Nenhuma câmera encontrada");
              } else if (err.name === "NotReadableError") {
                console.warn("EssenciaLab: Câmera em uso por outro aplicativo");
              }

              throw err;
            });
        }

        // Initialize camera permission check when DOM is ready
        if (document.readyState === "loading") {
          document.addEventListener("DOMContentLoaded", checkCameraPermissions);
        } else {
          checkCameraPermissions();
        }

        // Expose camera access function globally
        window.EssenciaLab = window.EssenciaLab || {};
        window.EssenciaLab.requestCameraAccess = requestCameraAccess;
      })();
    </script>

  <script>
  if (window.location.href.includes('/reset-password')) {
    const code = new URLSearchParams(window.location.search).get('code');
    const type = new URLSearchParams(window.location.search).get('type');
    
    if (code && type) {
      window.location.href = '/auth?type=recovery&code=' + code;
    } else {
      window.location.href = '/auth';
    }
  }
</script></body>
</html>
