@extends('layouts.app')

@section('title', 'Veriqo - Analysis Detail')

@section('content')

    <!-- main content -->
    <main class="page-content">
        
        <!-- Loading Overlay -->
        <div id="loadingOverlay" class="container text-center p-5" style="display: none;">
            <h3 class="mt-3">Loading analysis...</h3>
            <p>Please wait while we fetch your analysis data.</p>
        </div>
        
        <!-- Error Message -->
        <div id="errorMessage" class="container text-center p-5" style="display: none;">
            <p id="errorText"></p>
            <a href="./strategic-analysis.html" class="btn primary_btn mt-3">Create New Analysis</a>
        </div>
        
        <!-- Processing Message -->
        <div id="processingMessage" class="container text-center p-5" style="display: none;">
            <h3 class="mt-3">Analysis in progress...</h3>
            <p>This may take few seconds. Please wait.</p>
            <p class="text-muted">We will automatically refresh when the analysis is complete.</p>
        </div>
        
        <!-- Main Content Sections (hidden initially) -->
        <div id="mainContent" style="display: none;">

        <!-- page banner -->
        <section class="page_banner animate__animated animate__fadeInLeft animate__delay-0.5s">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-md-10">
                        <div class="page_banner_content">
                            <h1>Should we acquire TechCorp's AI Division?</h1>
                            <p>M&A | $127M | Analyzed 2 hours ago</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <!-- summary -->
        <section class="summary">
            <div class="container">
                <div class="summary_info">
                    <div class="summary_title animate-on-scroll" data-animation="fadeInLeft">
                        <h3>Executive Summary</h3>
                        <p>The acquisition presents moderate upside with manageable risk. Key legal and financial due diligence is advised before final commitment. The technology assets are valuable but require integration planning.</p>
                    </div>
                    <div class="caution animate-on-scroll" data-animation="fadeInRight">
                        <h3>Proceed with Caution</h3>
                        <label>Confidence: <strong>8/10</strong></label>
                    </div>
                    <div class="summary_list animate-on-scroll" data-animation="fadeInUp">
                        <div class="summary_list_item">
                            <h3>Strengths</h3>
                            <ul>
                                <li>
                                    <p>Strong IP portfolio with 12 patents</p>
                                </li>
                                <li>
                                    <p>Complementary technology stack</p>
                                </li>
                                <li>
                                    <p>High customer retention rate (92%)</p>
                                </li>
                            </ul>
                        </div>
                        <div class="summary_list_item">
                            <h3>Risks</h3>
                            <ul>
                                <li>
                                    <p>Regulatory hurdles in EU jurisdiction</p>
                                </li>
                                <li>
                                    <p>Integration complexity with legacy systems</p>
                                </li>
                                <li>
                                    <p>Key talent retention uncertainty</p>
                                </li>
                            </ul>
                        </div>
                        <div class="summary_list_item">
                            <h3>Cautions</h3>
                            <ul>
                                <li>
                                    <p>Negotiate earn-out structure tied to EBITDA milestones</p>
                                </li>
                                <li>
                                    <p>Conduct deeper IP audit before signing</p>
                                </li>
                                <li>
                                    <p>Plan 6-month integration roadmap</p>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <!-- board Analysis -->
        <section class="board_analysis page_sec animate-on-scroll" data-animation="fadeInUp">
            <div class="container">
                <div class="board_analysis_info">
                    <h2>Board Perspective Analysis</h2>
                    <div class="board_analysis_list">
                        <div class="board_analysis_item">
                            <div class="board_analysis_header">
                                <h3>Research Director</h3>
                                <span class="sucess_point">7/10</span>
                            </div>
                            <div class="board_analysis_content">
                                <h3>Key Concerns:</h3>
                                <ul>
                                    <li>
                                        <p>ROI positive at 22% over 3 years</p>
                                    </li>
                                    <li>
                                        <p>Capital allocation efficient</p>
                                    </li>
                                    <li>
                                        <p>Suggest earn-out structure</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="board_analysis_item">
                            <div class="board_analysis_header">
                                <h3>CFO</h3>
                                <span class="sucess_point">7/10</span>
                            </div>
                            <div class="board_analysis_content">
                                <h3>Key Concerns:</h3>
                                <ul>
                                    <li>
                                        <p>Revenue synergy potential: +15%</p>
                                    </li>
                                    <li>
                                        <p>Customer overlap requires repositioning</p>
                                    </li>
                                    <li>
                                        <p>Competitive response likely</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="board_analysis_item">
                            <div class="board_analysis_header">
                                <h3>Legal</h3>
                                <span class="sucess_point">9/10</span>
                            </div>
                            <div class="board_analysis_content">
                                <h3>Key Concerns:</h3>
                                <ul>
                                    <li>
                                        <p>Technology lead of 9-12 months</p>
                                    </li>
                                    <li>
                                        <p>Strong engineering team</p>
                                    </li>
                                    <li>
                                        <p>Architecture compatible with our stack</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="board_analysis_item">
                            <div class="board_analysis_header">
                                <h3>Strategy</h3>
                                <span class="sucess_point">8/10</span>
                            </div>
                            <div class="board_analysis_content">
                                <h3>Key Concerns:</h3>
                                <ul>
                                    <li>
                                        <p>Brand alignment strong</p>
                                    </li>
                                    <li>
                                        <p>Marketing synergy potential</p>
                                    </li>
                                    <li>
                                        <p>Need unified messaging strategy</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="board_analysis_item">
                            <div class="board_analysis_header">
                                <h3>Risk</h3>
                                <span class="danger_point">6/10</span>
                            </div>
                            <div class="board_analysis_content">
                                <h3>Key Concerns:</h3>
                                <ul>
                                    <li>
                                        <p>IP ownership unclear in target’s contracts</p>
                                    </li>
                                    <li>
                                        <p>High litigation risk in EU</p>
                                    </li>
                                    <li>
                                        <p>Recommend holdback clause</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="board_analysis_item">
                            <div class="board_analysis_header">
                                <h3>Final Board</h3>
                                <span class="yellow_point">6/10</span>
                            </div>
                            <div class="board_analysis_content">
                                <h3>Key Concerns:</h3>
                                <ul>
                                    <li>
                                        <p>Integration complexity high</p>
                                    </li>
                                    <li>
                                        <p>Operational disruption risk</p>
                                    </li>
                                    <li>
                                        <p>Requires dedicated integration team</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        
        <!-- key factors -->
        <section class="key_factor animate-on-scroll" data-animation="fadeInRight">
            <div class="container">
                <div class="key_factor_info">
                    <div class="key_factor_inr">
                        <h3>Key Decision Factors</h3>
                        <div class="key_factor_list">
                            <div class="key_factor_item">
                                <h3>Strengths</h3>
                                <ul>
                                    <li>
                                        <p>Strong IP portfolio</p>
                                    </li>
                                    <li>
                                        <p>Complementary tech</p>
                                    </li>
                                    <li>
                                        <p>High customer retention</p>
                                    </li>
                                </ul>
                            </div>
                            <div class="key_factor_item">
                                <h3>Risks</h3>
                                <ul>
                                    <li>
                                        <p>Regulatory hurdles</p>
                                    </li>
                                    <li>
                                        <p>Integration complexity</p>
                                    </li>
                                    <li>
                                        <p>Talent retention</p>
                                    </li>
                                </ul>
                            </div>
                            <div class="key_factor_item">
                                <h3>Next Steps</h3>
                                <ul>
                                    <li>
                                        <p>Negotiate earn-out structure</p>
                                    </li>
                                    <li>
                                        <p>Conduct IP audit</p>
                                    </li>
                                    <li>
                                        <p>Develop integration roadmap</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="export_btn">
                        <button class="btn primary_btn">
                            <img src="assets/image/download.png" width="20" alt="" srcset="">
                            Export
                        </button>
                    </div>
                </div>
            </div>
        </section>
        
        </div>
        <!-- End of Main Content Sections -->
    </main>

@endsection
  
  <script src="./assets/js/jquery.min.js"></script>
  <script src="./assets/js/bs.min.js"></script>
  <script src="./assets/js/custom.js"></script>
  <script src="./assets/js/modal-utils.js"></script>
  <script>
    // Backend API base URL - Update this when deploying to production
    const API_BASE_URL = 'https://veriqo.xceltec.in/';
    
    $(document).ready(function() {
      // Initialize session expiry check (checks immediately and sets up periodic check)
      var expiryCheckInterval = initSessionExpiryCheck('sessionExpiredModal');
      
      // If session expired, stop execution (redirect will happen automatically)
      if (expiryCheckInterval === null) {
        return;
      }
      
      console.log('Analysis Detail page loaded');
      
      // Replace profile images with user initial
      function updateProfileInitial() {
        try {
          // Get user data from localStorage or sessionStorage
          var userDataStr = localStorage.getItem('user');
          if (!userDataStr) {
            return; // No user data available
          }
          
          var userData = JSON.parse(userDataStr);
          var fullName = userData.full_name || '';
          
          // Get first alphabet letter (A-Z), ignoring all non-alphabet characters (Google-like behavior)
          var firstLetter = '';
          if (fullName && fullName.trim().length > 0) {
            var trimmedName = fullName.trim();
            // Find first A-Z letter (case-insensitive), skip hyphens, symbols, numbers, etc.
            var match = trimmedName.match(/[a-zA-Z]/);
            if (match) {
              firstLetter = match[0].toUpperCase();
            } else {
              firstLetter = '?'; // No letters found (e.g., "---", "@#$")
            }
          } else {
            firstLetter = '?'; // Fallback if no name
          }
          
          // Replace all profile images with initial div
          $('.profile img[src*="/profile.png"]').each(function() {
            $(this).replaceWith('<div class="profile-initial">' + firstLetter + '</div>');
          });
          
          // Add click handler for profile initial to toggle dropdown
          $('.profile-initial').on('click', function(e) {
            e.stopPropagation();
            // Get the closest profile container and find its dropdown
            var $profileContainer = $(this).closest('.profile');
            var $dropdown = $profileContainer.find('.profile_dropdown');
            // Toggle the dropdown with slide animation (same as custom.js)
            $dropdown.slideToggle(200);
          });
        } catch (error) {
          console.error('Error updating profile initial:', error);
        }
      }
      
      // Call function to update profile initial
      updateProfileInitial();
      
      // 1. Extract analysis_id from URL query parameter
      var urlParams = new URLSearchParams(window.location.search);
      var analysisId = urlParams.get('analysis_id');
      
      // If no analysis_id in URL, try localStorage (from strategic-analysis.html)
      if (!analysisId) {
        analysisId = localStorage.getItem('last_analysis_id');
      }
      
      if (!analysisId) {
        showErrorState('No analysis ID provided. Please select an analysis to view.');
        return;
      }
      
      console.log('Analysis ID:', analysisId);
      
      // 2. Check authentication
      var accessToken = localStorage.getItem('access_token');
      if (!accessToken || accessToken.trim() === '') {
        console.log('No access token found, redirecting to login');
        window.location.href = './index.html';
        return;
      }
      
      accessToken = accessToken.trim();
      console.log('Access token found');
      
      // 3. Show loading state
      showLoadingState();
      
      // 4. Fetch analysis data
      loadAnalysisData(analysisId, accessToken);
    });
    
    // Function to show loading state
    function showLoadingState() {
      $('#mainContent').hide();
      $('#errorMessage').hide();
      $('#processingMessage').hide();
      $('#loadingOverlay').show();
    }
    
    // Function to show processing state with polling
    function showProcessingState(analysisId, accessToken) {
      $('#mainContent').hide();
      $('#errorMessage').hide();
      $('#loadingOverlay').hide();
      $('#processingMessage').show();
      
      // Poll every 5 seconds
      var pollInterval = setInterval(function() {
        checkAnalysisStatus(analysisId, accessToken, function(status) {
          // Normalize status to lowercase for comparison (database uses capitalized)
          var normalizedStatus = (status || '').toLowerCase();
          if (normalizedStatus === 'completed') {
            clearInterval(pollInterval);
            loadAnalysisData(analysisId, accessToken); // Reload full data
          } else if (normalizedStatus === 'failed') {
            clearInterval(pollInterval);
            showErrorState('Analysis failed. Please try creating a new analysis.');
          }
        });
      }, 5000);
      
      // Stop polling after 5 minutes (300 seconds)
      setTimeout(function() {
        clearInterval(pollInterval);
        showErrorState('Analysis is taking longer than expected. Please refresh the page or try again.');
      }, 300000);
    }
    
    // Function to check analysis status (for polling)
    function checkAnalysisStatus(analysisId, accessToken, callback) {
      $.ajax({
        url: API_BASE_URL + '/api/shadow-board/status/' + analysisId,
        method: 'GET',
        headers: {
          'Authorization': 'Bearer ' + accessToken,
          'Content-Type': 'application/json'
        },
        success: function(response) {
          callback(response.status);
        },
        error: function(xhr) {
          console.error('Failed to check status:', xhr);
          if (xhr.status === 404) {
            callback('failed');
          }
        }
      });
    }
    
    // Function to show error state
    function showErrorState(message) {
      $('#mainContent').hide();
      $('#loadingOverlay').hide();
      $('#processingMessage').hide();
      $('#errorText').text(message);
      $('#errorMessage').show();
    }
    
    // Function to load analysis data from API
    function loadAnalysisData(analysisId, accessToken) {
      $.ajax({
        url: API_BASE_URL + '/api/shadow-board/' + analysisId,
        method: 'GET',
        headers: {
          'Authorization': 'Bearer ' + accessToken,
          'Content-Type': 'application/json'
        },
        success: function(analysis) {
          console.log('=== ANALYSIS DATA RECEIVED ===');
          console.log('Full analysis object:', analysis);
          console.log('analysis_status:', analysis.analysis_status);
          console.log('parsed_data_json type:', typeof analysis.parsed_data_json);
          console.log('parsed_data_json value:', analysis.parsed_data_json);
          console.log('summary:', analysis.summary);
          console.log('confidence_score:', analysis.confidence_score);
          console.log('recommendation:', analysis.recommendation);
          console.log('=== END ANALYSIS DATA ===');
          
          // Normalize status to lowercase for comparison (database uses capitalized: Pending, Processing, Completed, Failed)
          var status = (analysis.analysis_status || '').toLowerCase();
          
          // Check status and handle accordingly (case-insensitive)
          if (status === 'completed') {
            populateAnalysisData(analysis);
          } else if (status === 'processing' || status === 'pending') {
            showProcessingState(analysisId, accessToken);
          } else if (status === 'failed') {
            showErrorState(analysis.error_message || 'Analysis failed. Please try creating a new analysis.');
          } else {
            showErrorState('Unknown analysis status: ' + analysis.analysis_status);
          }
        },
        error: function(xhr) {
          console.error('Failed to load analysis:', xhr);
          if (xhr.status === 404) {
            showErrorState('Analysis not found. Please check the analysis ID.');
          } else if (xhr.status === 401) {
            alert('Session expired. Please login again.');
            localStorage.removeItem('access_token');
            localStorage.removeItem('refresh_token');
            localStorage.removeItem('remember_me_used'); // Clear Remember Me flag
            sessionStorage.removeItem('access_token');
            sessionStorage.removeItem('refresh_token');
            window.location.href = './index.html';
          } else {
            showErrorState('Failed to load analysis. Please try again later.');
          }
        }
      });
    }
    
    // Function to populate all HTML sections with analysis data
    function populateAnalysisData(analysis) {
      // Debug: Log raw parsed_data_json
      console.log('=== PARSED_DATA_JSON DEBUG ===');
      console.log('Raw parsed_data_json type:', typeof analysis.parsed_data_json);
      console.log('Raw parsed_data_json value:', analysis.parsed_data_json);
      console.log('Is null?', analysis.parsed_data_json === null);
      console.log('Is undefined?', analysis.parsed_data_json === undefined);
      console.log('Is empty string?', analysis.parsed_data_json === '');
      
      // Parse parsed_data_json (if it's a string, parse it; if object, use directly)
      var parsedData = null;
      if (analysis.parsed_data_json) {
        try {
          parsedData = typeof analysis.parsed_data_json === 'string' 
            ? JSON.parse(analysis.parsed_data_json) 
            : analysis.parsed_data_json;
          console.log('✓ Successfully parsed parsed_data_json');
        } catch (e) {
          console.error('✗ Failed to parse parsed_data_json:', e);
          console.error('Error details:', e.message);
          parsedData = null;
        }
      } else {
        console.warn('⚠ parsed_data_json is null, undefined, or empty');
      }
      
      // Debug: Log parsed data structure
      console.log('=== PARSED DATA STRUCTURE ===');
      console.log('Parsed data object:', parsedData);
      if (parsedData) {
        console.log('Has strengths?', parsedData.strengths ? 'YES (' + parsedData.strengths.length + ' items)' : 'NO');
        console.log('Has risks?', parsedData.risks ? 'YES (' + parsedData.risks.length + ' items)' : 'NO');
        console.log('Has cautions?', parsedData.cautions ? 'YES (' + parsedData.cautions.length + ' items)' : 'NO');
        console.log('Has board_perspectives?', parsedData.board_perspectives ? 'YES (' + parsedData.board_perspectives.length + ' items)' : 'NO');
        console.log('Has key_decision_factors?', parsedData.key_decision_factors ? 'YES' : 'NO');
        if (parsedData.key_decision_factors) {
          console.log('  - key_decision_factors.strengths:', parsedData.key_decision_factors.strengths ? 'YES (' + parsedData.key_decision_factors.strengths.length + ' items)' : 'NO');
          console.log('  - key_decision_factors.risks:', parsedData.key_decision_factors.risks ? 'YES (' + parsedData.key_decision_factors.risks.length + ' items)' : 'NO');
          console.log('  - key_decision_factors.next_steps:', parsedData.key_decision_factors.next_steps ? 'YES (' + parsedData.key_decision_factors.next_steps.length + ' items)' : 'NO');
        }
        console.log('Full parsed_data_json keys:', Object.keys(parsedData));
      }
      console.log('=== END DEBUG ===');
      
      // Hide loading/error/processing messages and show main content
      $('#loadingOverlay').hide();
      $('#errorMessage').hide();
      $('#processingMessage').hide();
      $('#mainContent').show();
      
      // A. Populate Page Banner (Lines 111-112)
      $('.page_banner_content h1').text(analysis.title || 'Analysis');
      
      // Hide the banner paragraph (category and time info)
      $('.page_banner_content p').hide();
      
      // B. Populate Executive Summary (Lines 123-130)
      $('.summary_title p').text(analysis.summary || 'No summary available.');
      
      // Recommendation badge
      var recText = '';
      if (analysis.recommendation === 'proceed') {
        recText = 'Proceed';
      } else if (analysis.recommendation === 'proceed_with_conditions') {
        recText = 'Proceed with Caution';
      } else if (analysis.recommendation === 'decline') {
        recText = 'Decline';
      } else {
        recText = 'Review Required';
      }
      $('.caution h3').text(recText);
      
      // Confidence score
      var confidenceScore = analysis.confidence_score || 0;
      $('.caution label strong').text(confidenceScore + '/10');
      
      // C. Populate Summary Lists - Strengths, Risks, Cautions (Lines 132-174)
      // Strengths
      var strengthsList = $('.summary_list_item:first-child ul');
      strengthsList.empty();
      console.log('Populating Strengths - parsedData:', parsedData, 'strengths:', parsedData ? parsedData.strengths : 'N/A');
      if (parsedData && parsedData.strengths && parsedData.strengths.length > 0) {
        console.log('✓ Found', parsedData.strengths.length, 'strengths');
        parsedData.strengths.forEach(function(strength) {
          strengthsList.append('<li><p>' + escapeHtml(strength) + '</p></li>');
        });
      } else {
        console.warn('✗ No strengths found in parsedData');
        strengthsList.append('<li><p>No specific strengths identified.</p></li>');
      }
      
      // Risks
      var risksList = $('.summary_list_item:nth-child(2) ul');
      risksList.empty();
      console.log('Populating Risks - risks:', parsedData ? parsedData.risks : 'N/A');
      if (parsedData && parsedData.risks && parsedData.risks.length > 0) {
        console.log('✓ Found', parsedData.risks.length, 'risks');
        parsedData.risks.forEach(function(risk) {
          risksList.append('<li><p>' + escapeHtml(risk) + '</p></li>');
        });
      } else {
        console.warn('✗ No risks found in parsedData');
        risksList.append('<li><p>No specific risks identified.</p></li>');
      }
      
      // Cautions
      var cautionsList = $('.summary_list_item:nth-child(3) ul');
      cautionsList.empty();
      console.log('Populating Cautions - cautions:', parsedData ? parsedData.cautions : 'N/A');
      if (parsedData && parsedData.cautions && parsedData.cautions.length > 0) {
        console.log('✓ Found', parsedData.cautions.length, 'cautions');
        parsedData.cautions.forEach(function(caution) {
          cautionsList.append('<li><p>' + escapeHtml(caution) + '</p></li>');
        });
      } else {
        console.warn('✗ No cautions found in parsedData');
        cautionsList.append('<li><p>No specific cautions identified.</p></li>');
      }
      
      // D. Populate Board Perspective Analysis (Lines 185-304)
      var boardPerspectives = (parsedData && parsedData.board_perspectives) ? parsedData.board_perspectives : [];
      var roleOrder = ['Research Director', 'CFO', 'Legal', 'Strategy', 'Risk', 'Final Board'];
      
      roleOrder.forEach(function(roleName, index) {
        var perspective = boardPerspectives.length > 0 ? boardPerspectives.find(function(p) { return p.role === roleName; }) : null;
        if (!perspective) {
          console.warn('Perspective not found for role:', roleName);
          // Still show the role name even if no data
          var $item = $('.board_analysis_item').eq(index);
          if ($item.length > 0) {
            $item.find('.board_analysis_header h3').text(roleName);
            $item.find('.board_analysis_content ul').html('<li><p>Analysis data not available for this perspective.</p></li>');
          }
          return;
        }
        
        var $item = $('.board_analysis_item').eq(index);
        if ($item.length === 0) {
          console.warn('Board analysis item not found at index:', index);
          return;
        }
        
        // Update role name
        $item.find('.board_analysis_header h3').text(perspective.role);
        
        // Update score with appropriate class
        var score = perspective.score || 0;
        var $scoreSpan = $item.find('.board_analysis_header span');
        $scoreSpan.text(score + '/10');
        $scoreSpan.removeClass('sucess_point danger_point yellow_point');
        if (score >= 7) {
          $scoreSpan.addClass('sucess_point');
        } else if (score >= 5) {
          $scoreSpan.addClass('yellow_point');
        } else {
          $scoreSpan.addClass('danger_point');
        }
        
        // Update bullet points
        var $bulletList = $item.find('.board_analysis_content ul');
        $bulletList.empty();
        if (perspective.bullet_points && perspective.bullet_points.length > 0) {
          perspective.bullet_points.forEach(function(point) {
            $bulletList.append('<li><p>' + escapeHtml(point) + '</p></li>');
          });
        } else {
          $bulletList.append('<li><p>No analysis available for this perspective.</p></li>');
        }
      });
      
      // E. Populate Key Decision Factors (Lines 317-358)
      var keyFactors = (parsedData && parsedData.key_decision_factors) ? parsedData.key_decision_factors : {};
      console.log('Populating Key Decision Factors - keyFactors:', keyFactors);
      console.log('Key factors keys:', Object.keys(keyFactors));
      
      // Strengths
      var $strengthsList = $('.key_factor_item:first-child ul');
      $strengthsList.empty();
      console.log('Key Factors Strengths:', keyFactors.strengths);
      if (keyFactors.strengths && keyFactors.strengths.length > 0) {
        console.log('✓ Found', keyFactors.strengths.length, 'key factor strengths');
        keyFactors.strengths.forEach(function(strength) {
          $strengthsList.append('<li><p>' + escapeHtml(strength) + '</p></li>');
        });
      } else {
        console.warn('✗ No key factor strengths found');
        $strengthsList.append('<li><p>No strengths identified.</p></li>');
      }
      
      // Risks
      var $risksList = $('.key_factor_item:nth-child(2) ul');
      $risksList.empty();
      console.log('Key Factors Risks:', keyFactors.risks);
      if (keyFactors.risks && keyFactors.risks.length > 0) {
        console.log('✓ Found', keyFactors.risks.length, 'key factor risks');
        keyFactors.risks.forEach(function(risk) {
          $risksList.append('<li><p>' + escapeHtml(risk) + '</p></li>');
        });
      } else {
        console.warn('✗ No key factor risks found');
        $risksList.append('<li><p>No risks identified.</p></li>');
      }
      
      // Next Steps
      var $nextStepsList = $('.key_factor_item:nth-child(3) ul');
      $nextStepsList.empty();
      console.log('Key Factors Next Steps:', keyFactors.next_steps);
      if (keyFactors.next_steps && keyFactors.next_steps.length > 0) {
        console.log('✓ Found', keyFactors.next_steps.length, 'key factor next steps');
        keyFactors.next_steps.forEach(function(step) {
          $nextStepsList.append('<li><p>' + escapeHtml(step) + '</p></li>');
        });
      } else {
        console.warn('✗ No key factor next steps found');
        $nextStepsList.append('<li><p>No next steps identified.</p></li>');
      }
      
      console.log('Analysis data populated successfully');
    }
    
    // Utility function to escape HTML
    function escapeHtml(text) {
      if (!text) return '';
      var map = {
        '&': '&amp;',
        '<': '&lt;',
        '>': '&gt;',
        '"': '&quot;',
        "'": '&#039;'
      };
      return text.toString().replace(/[&<>"']/g, function(m) { return map[m]; });
    }
    
    // Utility function to format currency
    function formatCurrency(amount) {
      if (!amount) return '0';
      return new Intl.NumberFormat('en-US', {
        style: 'currency',
        currency: 'USD',
        minimumFractionDigits: 0,
        maximumFractionDigits: 0
      }).format(amount).replace('$', '');
    }
    
    // Utility function to format time ago
    function formatTimeAgo(dateString) {
      if (!dateString) return 'recently';
      
      try {
        var date = new Date(dateString);
        var now = new Date();
        var diffMs = now - date;
        var diffMins = Math.floor(diffMs / 60000);
        var diffHours = Math.floor(diffMs / 3600000);
        var diffDays = Math.floor(diffMs / 86400000);
        
        if (diffMins < 1) {
          return 'just now';
        } else if (diffMins < 60) {
          return diffMins + ' minute' + (diffMins > 1 ? 's' : '') + ' ago';
        } else if (diffHours < 24) {
          return diffHours + ' hour' + (diffHours > 1 ? 's' : '') + ' ago';
        } else if (diffDays < 7) {
          return diffDays + ' day' + (diffDays > 1 ? 's' : '') + ' ago';
        } else {
          return date.toLocaleDateString();
        }
      } catch (e) {
        return 'recently';
      }
    }
      $('#logoutBtn, .logout-btn').on('click', function (e) {
          e.preventDefault();
          handleLogout();
        });

        function showConfirmationModal(message, onConfirm, onCancel) {
          $('#confirmationMessage').text(message);
          $('#confirmationModal').fadeIn(300);

          // Remove any existing handlers to prevent duplicates
          $('#confirmationYesBtn, #confirmationNoBtn').off('click');

          // Yes button handler
          $('#confirmationYesBtn').on('click', function () {
            $('#confirmationModal').fadeOut(300);
            if (onConfirm) {
              onConfirm();
            }
          });

          // No button handler
          $('#confirmationNoBtn').on('click', function () {
            $('#confirmationModal').fadeOut(300);
            if (onCancel) {
              onCancel();
            }
          });

          // Close on overlay click (optional - you can remove this if you don't want it)
          $('#confirmationModal').on('click', function (e) {
            if ($(e.target).hasClass('confirmation-modal')) {
              $('#confirmationModal').fadeOut(300);
              if (onCancel) {
                onCancel();
              }
            }
          });
        }

        function handleLogout() {
          showConfirmationModal('Are you sure you want to logout?', function () {
            // User confirmed - proceed with logout
            // Clear all authentication data from localStorage and sessionStorage
            localStorage.removeItem('access_token');
            localStorage.removeItem('user');
            localStorage.removeItem('remember_me_used'); // Clear Remember Me flag
            sessionStorage.removeItem('access_token');
            sessionStorage.removeItem('user');

            // Note: We keep remembered_email and remembered_password in localStorage
            // so they persist after logout (only cleared if Remember Me was unchecked)

            // Redirect to index.html (refresh page to show sign in button)
            window.location.href = './index.html';
          });
        }

  </script>
</body>
</html>