Upload 3 files

app.py

@@ -0,0 +1,477 @@
+from flask import Flask, render_template, request
+import matplotlib
+
+matplotlib.use('Agg')
+import matplotlib.pyplot as plt
+import io
+import base64
+import pandas as pd
+import google.generativeai as genai
+import os
+from docx import Document
+import plotly.express as px
+import plotly.io as pio
+
+app = Flask(__name__)
+app.config['UPLOAD_FOLDER'] = 'uploads'
+app.config['MAX_CONTENT_LENGTH'] = 16 * 1024 * 1024  # 16MB max file size
+
+# Configure Gemini API
+GOOGLE_API_KEY = 'AIzaSyBLcWuSj6N1bkhQsTF4kt3_hFh4ibH11pQ'  # Replace with your actual API key
+genai.configure(api_key=GOOGLE_API_KEY)
+model = genai.GenerativeModel('gemini-2.0-flash')
+
+
+def ensure_upload_folder():
+    if not os.path.exists(app.config['UPLOAD_FOLDER']):
+        os.makedirs(app.config['UPLOAD_FOLDER'])
+
+
+def extract_text_from_docx(file_path):
+    doc = Document(file_path)
+    full_text = []
+    for paragraph in doc.paragraphs:
+        full_text.append(paragraph.text)
+    return '\n'.join(full_text)
+
+
+def extract_data_using_gemini(text):
+    prompt = """
+    Extract the event counts from the following table format in the text:
+
+    2022-2023
+    Cultural competitions/events: NUMBER
+    Sports competitions/events: NUMBER
+    Technical fest/Academic fest: NUMBER
+    Social activities/events: NUMBER
+    Any other events through Active clubs and forums: NUMBER
+
+    2021-2022
+    Cultural competitions/events: NUMBER
+    Sports competitions/events: NUMBER
+    Technical fest/Academic fest: NUMBER
+    Social activities/events: NUMBER
+    Any other events through Active clubs and forums: NUMBER
+
+    2020-2021
+    Cultural competitions/events: NUMBER
+    Sports competitions/events: NUMBER
+    Technical fest/Academic fest: NUMBER
+    Social activities/events: NUMBER
+    Any other events through Active clubs and forums: NUMBER
+
+    2019-2020
+    Cultural competitions/events: NUMBER
+    Sports competitions/events: NUMBER
+    Technical fest/Academic fest: NUMBER
+    Social activities/events: NUMBER
+    Any other events through Active clubs and forums: NUMBER
+
+    2018-2019
+    Cultural competitions/events: NUMBER
+    Sports competitions/events: NUMBER
+    Technical fest/Academic fest: NUMBER
+    Social activities/events: NUMBER
+    Any other events through Active clubs and forums: NUMBER
+
+    Look for these exact numbers in the text. The data appears in a table with years and categories.
+    For each year, find:
+    - Number of Cultural competitions/events
+    - Number of Sports competitions/events
+    - Number of Technical fest/Academic fest events
+    - Number of Social activities/events
+    - Number of "Any other events through Active clubs and forums"
+
+    Return the data in this exact Python dictionary format:
+    {
+        '2022-2023': {'Cultural': 11, 'Sports': 10, 'Technical': 29, 'Social': 15, 'Other': 20},
+        '2021-2022': {'Cultural': 7, 'Sports': 8, 'Technical': 13, 'Social': 12, 'Other': 15},
+        '2020-2021': {'Cultural': 7, 'Sports': 9, 'Technical': 15, 'Social': 10, 'Other': 17},
+        '2019-2020': {'Cultural': 12, 'Sports': 17, 'Technical': 21, 'Social': 14, 'Other': 11},
+        '2018-2019': {'Cultural': 8, 'Sports': 17, 'Technical': 15, 'Social': 11, 'Other': 9}
+    }
+
+    Important:
+    - Use the EXACT numbers from the document
+    - Include ALL years from 2018-2019 to 2022-2023
+    - Make sure to find the correct table in the document that has these numbers
+    - Return only the Python dictionary, no other text
+    """
+
+    try:
+        # Print the first part of the text for debugging
+        print("\nSearching in text:")
+        print("=" * 50)
+        # Look for specific patterns in text
+        import re
+        years = re.findall(r'(20\d{2}-20\d{2})', text)
+        print(f"Found years: {years}")
+
+        # Look for numbers near key terms
+        cultural = re.findall(r'Cultural competitions/events\s*(\d+)', text)
+        sports = re.findall(r'Sports competitions/events\s*(\d+)', text)
+        technical = re.findall(r'Technical fest/Academic fest\s*(\d+)', text)
+        other = re.findall(r'Any other events.*?(\d+)', text)
+        social = re.findall(r'Social activities/events\s*(\d+)', text)
+
+        print(f"Found cultural numbers: {cultural}")
+        print(f"Found sports numbers: {sports}")
+        print(f"Found technical numbers: {technical}")
+        print(f"Found other numbers: {other}")
+        print(f"Found social numbers: {social}")
+        print("=" * 50)
+
+        response = model.generate_content(text + "\n" + prompt)
+        response_text = response.text.strip()
+
+        # Debug print
+        print("Raw response:", response_text)
+
+        # Remove any markdown formatting
+        if '' in response_text:
+            response_text = response_text.split('')[1]
+            if 'python' in response_text.split('\n')[0]:
+                response_text = '\n'.join(response_text.split('\n')[1:])
+
+        # Clean the response text
+        response_text = response_text.strip()
+        print("Cleaned response:", response_text)
+
+        # Parse the response
+        try:
+            import ast
+            data = ast.literal_eval(response_text)
+        except:
+            # Fallback to JSON parsing if ast fails
+            response_text = response_text.replace("'", '"')
+            import json
+            data = json.loads(response_text)
+
+        # Validate data structure
+        if not isinstance(data, dict):
+            raise ValueError("Response is not a dictionary")
+
+        # Ensure all years are present
+        expected_years = ['2022-2023', '2021-2022', '2020-2021', '2019-2020', '2018-2019']
+        if not all(year in data for year in expected_years):
+            raise ValueError("Missing some years in the data")
+
+        # Ensure all categories are present for each year
+        required_categories = {'Cultural', 'Sports', 'Technical', 'Social', 'Other'}
+        for year in data:
+            if not all(cat in data[year] for cat in required_categories):
+                raise ValueError(f"Missing categories in year {year}")
+
+        return data
+
+    except Exception as e:
+        print(f"Error processing with Gemini: {str(e)}")
+        print(f"Response text was: {response_text if 'response_text' in locals() else 'No response text'}")
+        return None
+
+
+def get_graph_insights(data, plot_type):
+    """Generate detailed insights including SWOT analysis for different types of plots."""
+    df = pd.DataFrame(data).T
+
+    if plot_type == 'bar':
+        total_by_category = df.sum()
+        max_category = total_by_category.idxmax()
+        min_category = total_by_category.idxmin()
+        avg_events = total_by_category.mean()
+
+        insights = {
+            'main_insight': f"The most frequent event category overall is {max_category} with {int(total_by_category[max_category])} events, while {min_category} has the least with {int(total_by_category[min_category])} events.",
+            'swot': {
+                'strengths': [
+                    f"Strong performance in {max_category} events",
+                    f"Diverse range of events across categories",
+                    f"Average of {avg_events:.1f} events per category"
+                ],
+                'weaknesses': [
+                    f"Low participation in {min_category} events",
+                    f"Uneven distribution across categories",
+                    "Potential resource allocation issues"
+                ],
+                'opportunities': [
+                    f"Room for growth in {min_category} category",
+                    "Potential for cross-category events",
+                    "Scope for balanced development"
+                ],
+                'threats': [
+                    "Risk of over-dependence on dominant category",
+                    "Resource strain in peak periods",
+                    "Sustainability challenges"
+                ]
+            },
+            'recommendations': [
+                f"Consider boosting {min_category} events",
+                "Implement balanced resource allocation",
+                "Develop cross-category initiatives"
+            ]
+        }
+        return insights
+
+    elif plot_type == 'pie':
+        latest_year = '2022-2023'
+        year_data = data[latest_year]
+        total = sum(year_data.values())
+        max_cat = max(year_data.items(), key=lambda x: x[1])
+        min_cat = min(year_data.items(), key=lambda x: x[1])
+        percentage = (max_cat[1] / total) * 100
+
+        insights = {
+            'main_insight': f"In {latest_year}, {max_cat[0]} events dominated with {max_cat[1]} events ({percentage:.1f}% of total events).",
+            'swot': {
+                'strengths': [
+                    f"Strong presence in {max_cat[0]} category",
+                    "Clear category leadership",
+                    "Established event structure"
+                ],
+                'weaknesses': [
+                    f"Under-representation in {min_cat[0]} category",
+                    "Imbalanced distribution",
+                    "Resource concentration risks"
+                ],
+                'opportunities': [
+                    "Potential for category diversification",
+                    "Growth in underserved categories",
+                    "New event type development"
+                ],
+                'threats': [
+                    "Category saturation risk",
+                    "Resource allocation challenges",
+                    "Sustainability concerns"
+                ]
+            },
+            'recommendations': [
+                "Diversify event portfolio",
+                f"Strengthen {min_cat[0]} category",
+                "Implement balanced growth strategy"
+            ]
+        }
+        return insights
+
+    elif plot_type == 'line':
+        trend = "increasing" if df.iloc[-1].mean() > df.iloc[0].mean() else "decreasing"
+        growth_rate = ((df.iloc[-1].mean() - df.iloc[0].mean()) / df.iloc[0].mean() * 100)
+
+        insights = {
+            'main_insight': f"The overall trend shows a {trend} pattern with a {growth_rate:.1f}% change in event frequency over the years.",
+            'swot': {
+                'strengths': [
+                    f"Consistent {trend} trend",
+                    "Clear growth trajectory",
+                    "Established pattern"
+                ],
+                'weaknesses': [
+                    "Fluctuations in growth rate",
+                    "Periodic inconsistencies",
+                    "Resource scaling challenges"
+                ],
+                'opportunities': [
+                    "Growth optimization potential",
+                    "Pattern regularization",
+                    "Strategic planning possibilities"
+                ],
+                'threats': [
+                    "Sustainability of growth rate",
+                    "Resource management challenges",
+                    "Market saturation risks"
+                ]
+            },
+            'recommendations': [
+                "Develop sustainable growth plan",
+                "Implement resource scaling strategy",
+                "Monitor growth patterns"
+            ]
+        }
+        return insights
+
+    elif plot_type == 'growth':
+        growth_rates = df.pct_change() * 100
+        avg_growth = growth_rates.mean().mean()
+        max_growth = growth_rates.max().max()
+        min_growth = growth_rates.min().min()
+
+        insights = {
+            'main_insight': f"The average year-over-year growth rate is {avg_growth:.1f}%, with peaks of {max_growth:.1f}% and lows of {min_growth:.1f}%.",
+            'swot': {
+                'strengths': [
+                    "Positive average growth rate",
+                    "Strong peak performance periods",
+                    "Growth momentum"
+                ],
+                'weaknesses': [
+                    "Growth rate volatility",
+                    "Negative growth periods",
+                    "Inconsistent patterns"
+                ],
+                'opportunities': [
+                    "Growth stabilization potential",
+                    "Performance optimization",
+                    "Strategic growth planning"
+                ],
+                'threats': [
+                    "Growth sustainability",
+                    "Resource scaling challenges",
+                    "Market fluctuations"
+                ]
+            },
+            'recommendations': [
+                "Stabilize growth patterns",
+                "Develop contingency plans",
+                "Implement growth monitoring"
+            ]
+        }
+        return insights
+
+    elif plot_type == 'area':
+        total_growth = ((df.iloc[-1].sum() - df.iloc[0].sum()) / df.iloc[0].sum() * 100)
+        avg_yearly_growth = total_growth / (len(df) - 1)
+
+        insights = {
+            'main_insight': f"The cumulative events show a {total_growth:.1f}% total change, averaging {avg_yearly_growth:.1f}% yearly growth.",
+            'swot': {
+                'strengths': [
+                    "Consistent cumulative growth",
+                    "Strong overall trajectory",
+                    "Clear progress pattern"
+                ],
+                'weaknesses': [
+                    "Growth rate variations",
+                    "Resource scaling challenges",
+                    "Potential sustainability issues"
+                ],
+                'opportunities': [
+                    "Long-term growth potential",
+                    "Pattern optimization",
+                    "Strategic expansion"
+                ],
+                'threats': [
+                    "Scaling challenges",
+                    "Resource constraints",
+                    "Market saturation"
+                ]
+            },
+            'recommendations': [
+                "Develop long-term growth strategy",
+                "Implement resource planning",
+                "Monitor cumulative trends"
+            ]
+        }
+        return insights
+
+    return {
+        'main_insight': "No specific insights available for this visualization.",
+        'swot': {
+            'strengths': [],
+            'weaknesses': [],
+            'opportunities': [],
+            'threats': []
+        },
+        'recommendations': []
+    }
+
+
+def create_plots(data):
+    plots = {}
+    df = pd.DataFrame(data).T
+
+    # Bar Chart
+    fig1 = px.bar(df, barmode='group', title='Events Distribution Across Years')
+    plots['bar'] = {
+        'plot': pio.to_html(fig1, full_html=False),
+        'insight': get_graph_insights(data, 'bar')
+    }
+
+    # Pie Chart
+    latest_year = '2022-2023'
+    fig2 = px.pie(names=data[latest_year].keys(), values=data[latest_year].values(),
+                  title=f'Event Distribution for {latest_year}')
+    plots['pie'] = {
+        'plot': pio.to_html(fig2, full_html=False),
+        'insight': get_graph_insights(data, 'pie')
+    }
+
+    # Line Chart
+    fig3 = px.line(df, markers=True, title='Event Trends Over Years')
+    plots['line'] = {
+        'plot': pio.to_html(fig3, full_html=False),
+        'insight': get_graph_insights(data, 'line')
+    }
+
+    # Growth Rate Chart
+    growth_rates = df.pct_change() * 100
+    fig4 = px.bar(growth_rates, title='Year-over-Year Growth Rate by Category')
+    plots['growth'] = {
+        'plot': pio.to_html(fig4, full_html=False),
+        'insight': get_graph_insights(data, 'growth')
+    }
+
+    # Area Chart
+    fig5 = px.area(df, title='Cumulative Events Distribution')
+    plots['area'] = {
+        'plot': pio.to_html(fig5, full_html=False),
+        'insight': get_graph_insights(data, 'area')
+    }
+
+    # Statistical Analysis
+    stats = {
+        'total_events': df.sum().sum(),
+        'avg_events_per_year': df.sum(axis=1).mean().round(2),
+        'most_active_year': df.sum(axis=1).idxmax(),
+        'most_common_category': df.sum().idxmax(),
+        'growth_analysis': {
+            'total_growth': ((df.iloc[-1].sum() - df.iloc[0].sum()) / df.iloc[0].sum() * 100).round(2),
+            'category_growth': ((df.iloc[-1] - df.iloc[0]) / df.iloc[0] * 100).round(2).to_dict()
+        }
+    }
+    plots['stats'] = stats
+
+    return plots
+
+
+@app.route('/', methods=['GET', 'POST'])
+def index():
+    plots = None
+    error_message = None
+
+    if request.method == 'POST':
+        if 'document' not in request.files:
+            error_message = 'No file uploaded'
+            return render_template('index.html', error=error_message)
+
+        file = request.files['document']
+        if file.filename == '':
+            error_message = 'No file selected'
+            return render_template('index.html', error=error_message)
+
+        if file and file.filename.endswith('.docx'):
+            ensure_upload_folder()
+            file_path = os.path.join(app.config['UPLOAD_FOLDER'], file.filename)
+            file.save(file_path)
+
+            try:
+                text = extract_text_from_docx(file_path)
+                data = extract_data_using_gemini(text)
+                print("Extracted data:", data)
+
+                if data:
+                    plots = create_plots(data)
+                else:
+                    error_message = 'Could not extract data from document. Please check the document format.'
+
+                os.remove(file_path)
+
+            except Exception as e:
+                error_message = f'Error processing document: {str(e)}'
+                print(f"Full error: {str(e)}")
+        else:
+            error_message = 'Please upload a .docx file'
+
+    return render_template('index.html', plots=plots, error=error_message)
+
+
+if __name__ == '__main__':
+    app.run(debug=True, port=5001)

templates/index.html

@@ -0,0 +1,969 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Event Analysis Dashboard</title>
+    <!-- Bootstrap CSS -->
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <!-- Custom CSS -->
+    <style>
+       /* Dynamic Animations */
+        @keyframes float {
+            0%, 100% { transform: translateY(0px); }
+            50% { transform: translateY(-10px); }
+        }
+
+        @keyframes glow {
+            0%, 100% { box-shadow: 0 0 20px rgba(147, 51, 234, 0.4); }
+            50% { box-shadow: 0 0 40px rgba(147, 51, 234, 0.8), 0 0 60px rgba(147, 51, 234, 0.4); }
+        }
+
+        @keyframes slideIn {
+            0% { transform: translateX(-100%); opacity: 0; }
+            100% { transform: translateX(0); opacity: 1; }
+        }
+
+        @keyframes pulse {
+            0% { transform: scale(1); }
+            50% { transform: scale(1.05); }
+            100% { transform: scale(1); }
+        }
+
+        @keyframes shimmer {
+            0% { background-position: -200% 0; }
+            100% { background-position: 200% 0; }
+        }
+
+        @keyframes rotate {
+            0% { transform: rotate(0deg); }
+            100% { transform: rotate(360deg); }
+        }
+
+        /* Base Styles */
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #f5576c 75%, #4facfe 100%);
+            background-size: 400% 400%;
+            animation: gradientShift 15s ease infinite;
+            font-family: 'Arial', sans-serif;
+            padding-top: 2rem;
+            min-height: 100vh;
+            position: relative;
+            overflow-x: hidden;
+        }
+
+        @keyframes gradientShift {
+            0% { background-position: 0% 50%; }
+            50% { background-position: 100% 50%; }
+            100% { background-position: 0% 50%; }
+        }
+
+        /* Floating particles background */
+        body::before {
+            content: '';
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background:
+                radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
+                radial-gradient(circle at 80% 80%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
+                radial-gradient(circle at 40% 60%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
+            animation: float 8s ease-in-out infinite;
+            pointer-events: none;
+            z-index: -1;
+        }
+
+        /* Chart Container */
+        .chart-container {
+            background: rgba(255, 255, 255, 0.95);
+            backdrop-filter: blur(20px);
+            border-radius: 20px;
+            border: 2px solid rgba(255, 255, 255, 0.3);
+            box-shadow:
+                0 20px 40px rgba(0, 0, 0, 0.1),
+                0 10px 20px rgba(0, 0, 0, 0.05),
+                inset 0 1px 0 rgba(255, 255, 255, 0.8);
+            padding: 30px;
+            margin-bottom: 30px;
+            position: relative;
+            overflow: hidden;
+            animation: slideIn 0.8s ease-out;
+            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+        }
+
+        .chart-container::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: -100%;
+            width: 100%;
+            height: 100%;
+            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
+            animation: shimmer 3s infinite;
+        }
+
+        .chart-container:hover {
+            transform: translateY(-10px) scale(1.02);
+            box-shadow:
+                0 30px 60px rgba(0, 0, 0, 0.15),
+                0 15px 30px rgba(0, 0, 0, 0.1),
+                inset 0 1px 0 rgba(255, 255, 255, 0.9);
+        }
+
+        /* Stats Card */
+        .stats-card {
+            height: 100%;
+            background: linear-gradient(135deg, #ff6b6b 0%, #ee5a24 100%);
+            color: white;
+            border-radius: 15px;
+            padding: 20px;
+            position: relative;
+            overflow: hidden;
+            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+            animation: pulse 3s ease-in-out infinite;
+        }
+
+        .stats-card::before {
+            content: '';
+            position: absolute;
+            top: -50%;
+            left: -50%;
+            width: 200%;
+            height: 200%;
+            background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
+            animation: rotate 10s linear infinite;
+        }
+
+        .stats-card:hover {
+            transform: translateY(-15px) rotate(2deg);
+            box-shadow:
+                0 25px 50px rgba(238, 90, 36, 0.4),
+                0 12px 24px rgba(238, 90, 36, 0.2);
+            animation: glow 2s ease-in-out infinite;
+        }
+
+        .stats-card:nth-child(even) {
+            background: linear-gradient(135deg, #4ecdc4 0%, #44a08d 100%);
+        }
+
+        .stats-card:nth-child(3n) {
+            background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
+            color: #333;
+        }
+
+        /* Upload Section */
+        .upload-section {
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
+            background-size: 300% 300%;
+            animation: gradientShift 8s ease infinite;
+            color: white;
+            padding: 4rem 0;
+            margin-bottom: 2rem;
+            position: relative;
+            overflow: hidden;
+        }
+
+        .upload-section::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            background:
+                radial-gradient(circle at 25% 25%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
+                radial-gradient(circle at 75% 75%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
+            animation: float 6s ease-in-out infinite reverse;
+        }
+
+        /* Drop Zone */
+        .drop-zone {
+            border: 3px dashed rgba(255, 255, 255, 0.6);
+            border-radius: 20px;
+            padding: 3rem;
+            text-align: center;
+            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+            background: rgba(255, 255, 255, 0.1);
+            backdrop-filter: blur(10px);
+            cursor: pointer;
+            position: relative;
+            overflow: hidden;
+            animation: pulse 4s ease-in-out infinite;
+        }
+
+        .drop-zone::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            background: linear-gradient(45deg, transparent 30%, rgba(255, 255, 255, 0.1) 50%, transparent 70%);
+            transform: translateX(-100%);
+            transition: transform 0.6s ease;
+        }
+
+        .drop-zone:hover::before {
+            transform: translateX(100%);
+        }
+
+        .drop-zone:hover {
+            transform: scale(1.05);
+            background: rgba(255, 255, 255, 0.2);
+            border-color: rgba(255, 255, 255, 0.9);
+            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
+        }
+
+        .drop-zone.dragover {
+            background: rgba(255, 255, 255, 0.3);
+            border-color: #fff;
+            transform: scale(1.1);
+            animation: glow 1s ease-in-out infinite;
+        }
+
+        .drop-zone-content {
+            color: white;
+            position: relative;
+            z-index: 2;
+            font-weight: 600;
+            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
+        }
+
+        .upload-icon {
+            width: 60px;
+            height: 60px;
+            filter: invert(1) drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
+            animation: float 3s ease-in-out infinite;
+            margin-bottom: 1rem;
+        }
+
+        .selected-file {
+            margin-top: 1rem;
+            color: #fff;
+            font-weight: bold;
+            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
+            animation: slideIn 0.5s ease-out;
+        }
+
+        /* Print Button */
+        .print-btn {
+            position: fixed;
+            bottom: 30px;
+            right: 30px;
+            z-index: 1000;
+            background: linear-gradient(135deg, #ff6b6b 0%, #ee5a24 50%, #ff9ff3 100%);
+            background-size: 200% 200%;
+            animation: gradientShift 3s ease infinite;
+            color: white;
+            border: none;
+            padding: 15px 30px;
+            border-radius: 50px;
+            box-shadow:
+                0 10px 30px rgba(238, 90, 36, 0.4),
+                0 5px 15px rgba(238, 90, 36, 0.2);
+            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+            font-weight: 600;
+            font-size: 16px;
+            text-transform: uppercase;
+            letter-spacing: 1px;
+            cursor: pointer;
+            position: relative;
+            overflow: hidden;
+        }
+
+        .print-btn::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: -100%;
+            width: 100%;
+            height: 100%;
+            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
+            transition: left 0.5s ease;
+        }
+
+        .print-btn:hover::before {
+            left: 100%;
+        }
+
+        .print-btn:hover {
+            transform: translateY(-5px) scale(1.05);
+            box-shadow:
+                0 20px 50px rgba(238, 90, 36, 0.5),
+                0 10px 25px rgba(238, 90, 36, 0.3);
+            animation: glow 2s ease-in-out infinite;
+        }
+
+        .print-btn:active {
+            transform: translateY(-2px) scale(0.98);
+        }
+
+        /* Additional Enhancements */
+        .neon-text {
+            color: #fff;
+            text-shadow:
+                0 0 5px currentColor,
+                0 0 10px currentColor,
+                0 0 15px currentColor,
+                0 0 20px #ff6b6b,
+                0 0 35px #ff6b6b,
+                0 0 40px #ff6b6b;
+            animation: pulse 2s ease-in-out infinite alternate;
+        }
+
+        .glass-effect {
+            background: rgba(255, 255, 255, 0.25);
+            backdrop-filter: blur(20px);
+            border: 1px solid rgba(255, 255, 255, 0.18);
+            box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
+        }
+
+        /* Mobile Responsiveness */
+        @media (max-width: 768px) {
+            .chart-container {
+                padding: 20px;
+                margin-bottom: 20px;
+            }
+
+            .upload-section {
+                padding: 2rem 0;
+            }
+
+            .drop-zone {
+                padding: 2rem;
+            }
+
+            .print-btn {
+                bottom: 20px;
+                right: 20px;
+                padding: 12px 24px;
+            }
+        }
+
+        /* Demo Content */
+        .demo-content {
+            max-width: 1200px;
+            margin: 0 auto;
+            padding: 20px;
+        }
+
+        .demo-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+            gap: 20px;
+            margin-top: 20px;
+        }
+
+        .demo-title {
+            text-align: center;
+            font-size: 2.5rem;
+            font-weight: bold;
+            margin-bottom: 2rem;
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            background-clip: text;
+        }
+    </style>
+</head>
+<body>
+    <!-- Header Section -->
+    <div class="upload-section">
+        <div class="container">
+            <h1 class="text-center mb-4">Event Analysis Dashboard</h1>
+            <div class="row justify-content-center">
+                <div class="col-md-6">
+                    <form method="POST" enctype="multipart/form-data" class="text-center">
+                        <div class="mb-3">
+                            <div class="drop-zone" id="dropZone">
+                                <div class="drop-zone-content">
+                                    <img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1MCIgaGVpZ2h0PSI1MCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0yMSAxNXY0YTIgMiAwIDAgMS0yIDJINWEyIDIgMCAwIDEtMi0ydi00Ij48L3BhdGg+PHBvbHlsaW5lIHBvaW50cz0iMTcgOCAxMiAzIDcgOCI+PC9wb2x5bGluZT48bGluZSB4MT0iMTIiIHkxPSIzIiB4Mj0iMTIiIHkyPSIxNSI+PC9saW5lPjwvc3ZnPg==" alt="Upload icon" class="upload-icon mb-2">
+                                    <p class="mb-0">Drag & drop your DOCX file here</p>
+                                    <p class="text-muted">or</p>
+                                    <label for="document" class="btn btn-light">Browse Files</label>
+                                </div>
+                                <input type="file" class="form-control d-none" id="document" name="document" accept=".docx">
+                            </div>
+                        </div>
+                        <button type="submit" class="btn btn-light" id="submitBtn" disabled>Analyze Document</button>
+                    </form>
+                    {% if error %}
+                    <div class="alert alert-danger mt-3" role="alert">
+                        {{ error }}
+                    </div>
+                    {% endif %}
+                </div>
+            </div>
+        </div>
+    </div>
+
+    {% if plots %}
+    <div class="container">
+        <!-- Statistics Cards -->
+        <div class="row mb-4">
+            <div class="col-md-3">
+                <div class="card stats-card">
+                    <div class="card-body">
+                        <h5 class="card-title">Total Events</h5>
+                        <p class="card-text display-6">{{ plots.stats.total_events }}</p>
+                    </div>
+                </div>
+            </div>
+            <div class="col-md-3">
+                <div class="card stats-card">
+                    <div class="card-body">
+                        <h5 class="card-title">Avg Events/Year</h5>
+                        <p class="card-text display-6">{{ plots.stats.avg_events_per_year }}</p>
+                    </div>
+                </div>
+            </div>
+            <div class="col-md-3">
+                <div class="card stats-card">
+                    <div class="card-body">
+                        <h5 class="card-title">Most Active Year</h5>
+                        <p class="card-text display-6">{{ plots.stats.most_active_year }}</p>
+                    </div>
+                </div>
+            </div>
+            <div class="col-md-3">
+                <div class="card stats-card">
+                    <div class="card-body">
+                        <h5 class="card-title">Top Category</h5>
+                        <p class="card-text display-6">{{ plots.stats.most_common_category }}</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Charts Section -->
+        <div class="row">
+            <!-- Bar Chart -->
+            <div class="col-md-6 mb-4">
+                <div class="chart-container">
+                    <h3 class="text-center mb-3">Events Distribution</h3>
+                    {{ plots.bar.plot|safe }}
+                    <div class="mt-4">
+                        <h5>Key Insight:</h5>
+                        <p>{{ plots.bar.insight.main_insight }}</p>
+
+                        <h5>SWOT Analysis:</h5>
+                        <div class="row">
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-success text-white">
+                                        <h6 class="mb-0">Strengths</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for strength in plots.bar.insight.swot.strengths %}
+                                            <li>• {{ strength }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-danger text-white">
+                                        <h6 class="mb-0">Weaknesses</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for weakness in plots.bar.insight.swot.weaknesses %}
+                                            <li>• {{ weakness }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-primary text-white">
+                                        <h6 class="mb-0">Opportunities</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for opportunity in plots.bar.insight.swot.opportunities %}
+                                            <li>• {{ opportunity }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-warning">
+                                        <h6 class="mb-0">Threats</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for threat in plots.bar.insight.swot.threats %}
+                                            <li>• {{ threat }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <h5>Recommendations:</h5>
+                        <ul>
+                            {% for recommendation in plots.bar.insight.recommendations %}
+                            <li>{{ recommendation }}</li>
+                            {% endfor %}
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <!-- Pie Chart -->
+            <div class="col-md-6 mb-4">
+                <div class="chart-container">
+                    <h3 class="text-center mb-3">Current Year Distribution</h3>
+                    {{ plots.pie.plot|safe }}
+                    <div class="mt-4">
+                        <h5>Key Insight:</h5>
+                        <p>{{ plots.pie.insight.main_insight }}</p>
+
+                        <h5>SWOT Analysis:</h5>
+                        <div class="row">
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-success text-white">
+                                        <h6 class="mb-0">Strengths</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for strength in plots.pie.insight.swot.strengths %}
+                                            <li>• {{ strength }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-danger text-white">
+                                        <h6 class="mb-0">Weaknesses</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for weakness in plots.pie.insight.swot.weaknesses %}
+                                            <li>• {{ weakness }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-primary text-white">
+                                        <h6 class="mb-0">Opportunities</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for opportunity in plots.pie.insight.swot.opportunities %}
+                                            <li>• {{ opportunity }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-warning">
+                                        <h6 class="mb-0">Threats</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for threat in plots.pie.insight.swot.threats %}
+                                            <li>• {{ threat }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <h5>Recommendations:</h5>
+                        <ul>
+                            {% for recommendation in plots.pie.insight.recommendations %}
+                            <li>{{ recommendation }}</li>
+                            {% endfor %}
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <!-- Line Chart -->
+            <div class="col-md-6 mb-4">
+                <div class="chart-container">
+                    <h3 class="text-center mb-3">Event Trends</h3>
+                    {{ plots.line.plot|safe }}
+                    <div class="mt-4">
+                        <h5>Key Insight:</h5>
+                        <p>{{ plots.line.insight.main_insight }}</p>
+
+                        <h5>SWOT Analysis:</h5>
+                        <div class="row">
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-success text-white">
+                                        <h6 class="mb-0">Strengths</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for strength in plots.line.insight.swot.strengths %}
+                                            <li>• {{ strength }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-danger text-white">
+                                        <h6 class="mb-0">Weaknesses</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for weakness in plots.line.insight.swot.weaknesses %}
+                                            <li>• {{ weakness }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-primary text-white">
+                                        <h6 class="mb-0">Opportunities</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for opportunity in plots.line.insight.swot.opportunities %}
+                                            <li>• {{ opportunity }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-warning">
+                                        <h6 class="mb-0">Threats</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for threat in plots.line.insight.swot.threats %}
+                                            <li>• {{ threat }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <h5>Recommendations:</h5>
+                        <ul>
+                            {% for recommendation in plots.line.insight.recommendations %}
+                            <li>{{ recommendation }}</li>
+                            {% endfor %}
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <!-- Growth Rate Chart -->
+            <div class="col-md-6 mb-4">
+                <div class="chart-container">
+                    <h3 class="text-center mb-3">Year-over-Year Growth</h3>
+                    {{ plots.growth.plot|safe }}
+                    <div class="mt-4">
+                        <h5>Key Insight:</h5>
+                        <p>{{ plots.growth.insight.main_insight }}</p>
+
+                        <h5>SWOT Analysis:</h5>
+                        <div class="row">
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-success text-white">
+                                        <h6 class="mb-0">Strengths</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for strength in plots.growth.insight.swot.strengths %}
+                                            <li>• {{ strength }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-danger text-white">
+                                        <h6 class="mb-0">Weaknesses</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for weakness in plots.growth.insight.swot.weaknesses %}
+                                            <li>• {{ weakness }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-primary text-white">
+                                        <h6 class="mb-0">Opportunities</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for opportunity in plots.growth.insight.swot.opportunities %}
+                                            <li>• {{ opportunity }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-warning">
+                                        <h6 class="mb-0">Threats</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for threat in plots.growth.insight.swot.threats %}
+                                            <li>• {{ threat }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <h5>Recommendations:</h5>
+                        <ul>
+                            {% for recommendation in plots.growth.insight.recommendations %}
+                            <li>{{ recommendation }}</li>
+                            {% endfor %}
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <!-- Area Chart -->
+            <div class="col-md-12 mb-4">
+                <div class="chart-container">
+                    <h3 class="text-center mb-3">Cumulative Events</h3>
+                    {{ plots.area.plot|safe }}
+                    <div class="mt-4">
+                        <h5>Key Insight:</h5>
+                        <p>{{ plots.area.insight.main_insight }}</p>
+
+                        <h5>SWOT Analysis:</h5>
+                        <div class="row">
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-success text-white">
+                                        <h6 class="mb-0">Strengths</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for strength in plots.area.insight.swot.strengths %}
+                                            <li>• {{ strength }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-danger text-white">
+                                        <h6 class="mb-0">Weaknesses</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for weakness in plots.area.insight.swot.weaknesses %}
+                                            <li>• {{ weakness }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-primary text-white">
+                                        <h6 class="mb-0">Opportunities</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for opportunity in plots.area.insight.swot.opportunities %}
+                                            <li>• {{ opportunity }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="card mb-3">
+                                    <div class="card-header bg-warning">
+                                        <h6 class="mb-0">Threats</h6>
+                                    </div>
+                                    <div class="card-body">
+                                        <ul class="list-unstyled mb-0">
+                                            {% for threat in plots.area.insight.swot.threats %}
+                                            <li>• {{ threat }}</li>
+                                            {% endfor %}
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <h5>Recommendations:</h5>
+                        <ul>
+                            {% for recommendation in plots.area.insight.recommendations %}
+                            <li>{{ recommendation }}</li>
+                            {% endfor %}
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Growth Analysis Section -->
+        <div class="row mb-4">
+            <div class="col-12">
+                <div class="card">
+                    <div class="card-body">
+                        <h3 class="card-title">Growth Analysis</h3>
+                        <p class="card-text">Total Growth: {{ plots.stats.growth_analysis.total_growth }}%</p>
+                        <h5>Category-wise Growth:</h5>
+                        <ul class="list-group">
+                            {% for category, growth in plots.stats.growth_analysis.category_growth.items() %}
+                            <li class="list-group-item d-flex justify-content-between align-items-center">
+                                {{ category }}
+                                <span class="badge bg-{{ 'success' if growth > 0 else 'danger' }} rounded-pill">
+                                    {{ growth }}%
+                                </span>
+                            </li>
+                            {% endfor %}
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    {% endif %}
+
+    <button class="btn btn-primary print-btn" id="printPageBtn">Print Page</button>
+    <!-- Bootstrap JS and Popper.js -->
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+    <script>
+    document.addEventListener('DOMContentLoaded', function() {
+            document.getElementById('printPageBtn').addEventListener('click', function() {
+                window.print();
+            });
+        });
+        document.addEventListener('DOMContentLoaded', function() {
+            const dropZone = document.getElementById('dropZone');
+            const fileInput = document.getElementById('document');
+            const submitBtn = document.getElementById('submitBtn');
+
+            // Prevent default drag behaviors
+            ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
+                dropZone.addEventListener(eventName, preventDefaults, false);
+                document.body.addEventListener(eventName, preventDefaults, false);
+            });
+
+            // Highlight drop zone when dragging over it
+            ['dragenter', 'dragover'].forEach(eventName => {
+                dropZone.addEventListener(eventName, highlight, false);
+            });
+
+            ['dragleave', 'drop'].forEach(eventName => {
+                dropZone.addEventListener(eventName, unhighlight, false);
+            });
+
+            // Handle dropped files
+            dropZone.addEventListener('drop', handleDrop, false);
+
+            // Handle clicked files
+            fileInput.addEventListener('change', handleFiles, false);
+
+            // Click handling for the drop zone
+            dropZone.addEventListener('click', (e) => {
+                // Prevent click if clicking on the Browse Files button
+                if (e.target.tagName === 'LABEL') {
+                    return;
+                }
+                fileInput.click();
+            });
+
+            function preventDefaults(e) {
+                e.preventDefault();
+                e.stopPropagation();
+            }
+
+            function highlight(e) {
+                dropZone.classList.add('dragover');
+            }
+
+            function unhighlight(e) {
+                dropZone.classList.remove('dragover');
+            }
+
+            function handleDrop(e) {
+                const dt = e.dataTransfer;
+                const files = dt.files;
+
+                if (files.length) {
+                    fileInput.files = files; // Set the files to the input
+                    handleFiles(files[0]);
+                }
+            }
+
+            function handleFiles(e) {
+                const file = e.target ? e.target.files[0] : e; // Handle both event and direct file
+
+                if (file) {
+                    if (file.name.endsWith('.docx')) {
+                        updateDropZoneContent(file.name);
+                        submitBtn.disabled = false;
+                    } else {
+                        alert('Please upload a .docx file');
+                        fileInput.value = '';
+                        submitBtn.disabled = true;
+                        resetDropZoneContent();
+                    }
+                }
+            }
+
+            function updateDropZoneContent(fileName) {
+                const content = dropZone.querySelector('.drop-zone-content');
+                content.innerHTML = `
+                    <img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1MCIgaGVpZ2h0PSI1MCIgdmlld0JveG0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0yMSAxNXY0YTIgMiAwIDAgMS0yIDJINWEyIDIgMCAwIDEtMi0ydi00Ij48L3BhdGg+PHBvbHlsaW5lIHBvaW50cz0iMTcgOCAxMiAzIDcgOCI+PC9wb2x5bGluZT48bGluZSB4MT0iMTIiIHkxPSIzIiB4Mj0iMTIiIHkyPSIxNSI+PC9saW5lPjwvc3ZnPg==" alt="Upload icon" class="upload-icon mb-2">
+                    <p class="selected-file">${fileName}</p>
+                    <p class="text-muted">Click or drag to change file</p>
+                `;
+            }
+
+            function resetDropZoneContent() {
+                const content = dropZone.querySelector('.drop-zone-content');
+                content.innerHTML = `
+                    <img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1MCIgaGVpZ2h0PSI1MCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0yMSAxNXY0YTIgMiAwIDAgMS0yIDJINWEyIDIgMCAwIDEtMi0ydi00Ij48L3BhdGg+PHBvbHlsaW5lIHBvaW50cz0iMTcgOCAxMiAzIDcgOCI+PC9wb2x5bGluZT48bGluZSB4MT0iMTIiIHkxPSIzIiB4Mj0iMTIiIHkyPSIxNSI+PC9saW5lPjwvc3ZnPg==" alt="Upload icon" class="upload-icon mb-2">
+                    <p class="mb-0">Drag & drop your DOCX file here</p>
+                    <p class="text-muted">or</p>
+                    <label for="document" class="btn btn-light">Browse Files</label>
+                `;
+            }
+        });
+    </script>
+</body>
+</html>

templates/result.html

@@ -0,0 +1,438 @@
+
+<!-- Results Template -->
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Analysis Results - Advanced Data Analysis Tool</title>
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
+    <style>
+        body {
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+            min-height: 100vh;
+            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+        }
+        .main-container {
+            background: rgba(255, 255, 255, 0.95);
+            border-radius: 20px;
+            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
+            backdrop-filter: blur(10px);
+            margin: 30px auto;
+            max-width: 1400px;
+            padding: 30px;
+        }
+        .stats-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+            gap: 20px;
+            margin: 30px 0;
+        }
+        .stat-card {
+            background: linear-gradient(45deg, #667eea, #764ba2);
+            color: white;
+            padding: 25px;
+            border-radius: 15px;
+            text-align: center;
+            transition: all 0.3s ease;
+        }
+        .stat-card:hover {
+            transform: scale(1.05);
+        }
+        .analysis-section {
+            background: white;
+            border-radius: 15px;
+            padding: 30px;
+            margin: 20px 0;
+            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
+        }
+        .plot-container {
+            text-align: center;
+            margin: 20px 0;
+        }
+        .plot-container img {
+            max-width: 100%;
+            border-radius: 10px;
+            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+        }
+        .swot-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+            gap: 20px;
+            margin: 20px 0;
+        }
+        .swot-card {
+            padding: 25px;
+            border-radius: 15px;
+            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+        }
+        .swot-strengths { background: linear-gradient(45deg, #4CAF50, #45a049); color: white; }
+        .swot-weaknesses { background: linear-gradient(45deg, #f44336, #d32f2f); color: white; }
+        .swot-opportunities { background: linear-gradient(45deg, #2196F3, #1976D2); color: white; }
+        .swot-threats { background: linear-gradient(45deg, #FF9800, #F57C00); color: white; }
+        .insights-text {
+            background: #f8f9fa;
+            border-left: 4px solid #667eea;
+            padding: 20px;
+            border-radius: 5px;
+            margin: 20px 0;
+            white-space: pre-wrap;
+        }
+        .btn-primary {
+            background: linear-gradient(45deg, #667eea, #764ba2);
+            border: none;
+            padding: 12px 30px;
+            border-radius: 25px;
+            font-weight: 600;
+            transition: all 0.3s ease;
+        }
+        .btn-primary:hover {
+            transform: translateY(-2px);
+            box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);
+        }
+        .nav-tabs .nav-link {
+            border: none;
+            border-radius: 25px;
+            margin: 0 5px;
+            padding: 10px 20px;
+            transition: all 0.3s ease;
+        }
+        .nav-tabs .nav-link.active {
+            background: linear-gradient(45deg, #667eea, #764ba2);
+            color: white;
+        }
+        .table-responsive {
+            border-radius: 10px;
+            overflow: hidden;
+        }
+        .table {
+            margin: 0;
+        }
+        .table th {
+            background: linear-gradient(45deg, #667eea, #764ba2);
+            color: white;
+            border: none;
+        }
+        .insights-card {
+            background: linear-gradient(45deg, #f8f9fa, #e9ecef);
+            border-radius: 15px;
+            padding: 25px;
+            margin: 20px 0;
+            border-left: 5px solid #667eea;
+        }
+        .correlation-matrix {
+            overflow-x: auto;
+        }
+        .section-header {
+            background: linear-gradient(45deg, #667eea, #764ba2);
+            color: white;
+            padding: 15px 25px;
+            border-radius: 10px;
+            margin: 20px 0 10px 0;
+        }
+    </style>
+</head>
+<body>
+    <div class="container-fluid">
+        <div class="main-container">
+            <!-- Header -->
+            <div class="text-center mb-4">
+                <h1 class="display-5 text-primary">
+                    <i class="fas fa-chart-line me-3"></i>
+                    Data Analysis Results
+                </h1>
+                <p class="lead">Comprehensive analysis of: <strong>{{ results.dataset_info.filename }}</strong></p>
+                <small class="text-muted">Analysis completed on: {{ results.dataset_info.upload_time }}</small>
+            </div>
+
+            <!-- Quick Stats -->
+            <div class="stats-grid">
+                <div class="stat-card">
+                    <i class="fas fa-table fa-2x mb-2"></i>
+                    <h3>{{ results.dataset_info.rows }}</h3>
+                    <p>Total Rows</p>
+                </div>
+                <div class="stat-card">
+                    <i class="fas fa-columns fa-2x mb-2"></i>
+                    <h3>{{ results.dataset_info.columns }}</h3>
+                    <p>Total Columns</p>
+                </div>
+                <div class="stat-card">
+                    <i class="fas fa-memory fa-2x mb-2"></i>
+                    <h3>{{ results.dataset_info.memory_usage }}</h3>
+                    <p>Memory Usage</p>
+                </div>
+                <div class="stat-card">
+                    <i class="fas fa-exclamation-triangle fa-2x mb-2"></i>
+                    <h3>{{ results.dataset_info.missing_values_total }}</h3>
+                    <p>Missing Values</p>
+                </div>
+            </div>
+
+            <!-- Navigation Tabs -->
+            <ul class="nav nav-tabs" id="analysisTab" role="tablist">
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link active" id="overview-tab" data-bs-toggle="tab" data-bs-target="#overview" type="button" role="tab">
+                        <i class="fas fa-info-circle me-2"></i>Overview
+                    </button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link" id="visualizations-tab" data-bs-toggle="tab" data-bs-target="#visualizations" type="button" role="tab">
+                        <i class="fas fa-chart-bar me-2"></i>Visualizations
+                    </button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link" id="insights-tab" data-bs-toggle="tab" data-bs-target="#insights" type="button" role="tab">
+                        <i class="fas fa-brain me-2"></i>AI Insights
+                    </button>
+                </li>
+                <li class="nav-item" role="presentation">
+                    <button class="nav-link" id="swot-tab" data-bs-toggle="tab" data-bs-target="#swot" type="button" role="tab">
+                        <i class="fas fa-crosshairs me-2"></i>SWOT Analysis
+                    </button>
+                </li>
+            </ul>
+
+            <!-- Tab Content -->
+            <div class="tab-content" id="analysisTabContent">
+                <!-- Overview Tab -->
+                <div class="tab-pane fade show active" id="overview" role="tabpanel">
+                    <div class="analysis-section">
+                        <h3 class="section-header">
+                            <i class="fas fa-info-circle me-2"></i>Dataset Overview
+                        </h3>
+
+                        <!-- Column Information -->
+                        <div class="row">
+                            <div class="col-md-6">
+                                <h5>Column Information</h5>
+                                <div class="table-responsive">
+                                    <table class="table table-striped">
+                                        <thead>
+                                            <tr>
+                                                <th>Column</th>
+                                                <th>Data Type</th>
+                                                <th>Missing Values</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            {% for column in results.basic_stats.columns %}
+                                            <tr>
+                                                <td>{{ column }}</td>
+                                                <td>{{ results.basic_stats.dtypes[column] }}</td>
+                                                <td>{{ results.basic_stats.missing_values[column] }}</td>
+                                            </tr>
+                                            {% endfor %}
+                                        </tbody>
+                                    </table>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <h5>Data Quality Summary</h5>
+                                <div class="insights-card">
+                                    <p><strong>Total Records:</strong> {{ results.dataset_info.rows }}</p>
+                                    <p><strong>Features:</strong> {{ results.dataset_info.columns }}</p>
+                                    <p><strong>Duplicate Rows:</strong> {{ results.dataset_info.duplicate_rows }}</p>
+                                    <p><strong>Memory Usage:</strong> {{ results.dataset_info.memory_usage }}</p>
+                                    <p><strong>Missing Values:</strong> {{ results.dataset_info.missing_values_total }}</p>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Numerical Insights -->
+                        {% if results.numerical_insights %}
+                        <h5 class="mt-4">Numerical Columns Analysis</h5>
+                        <div class="table-responsive">
+                            <table class="table table-striped">
+                                <thead>
+                                    <tr>
+                                        <th>Column</th>
+                                        <th>Mean</th>
+                                        <th>Median</th>
+                                        <th>Std Dev</th>
+                                        <th>Min</th>
+                                        <th>Max</th>
+                                        <th>Outliers</th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    {% for column, stats in results.numerical_insights.items() %}
+                                    <tr>
+                                        <td>{{ column }}</td>
+                                        <td>{{ "%.2f"|format(stats.mean) }}</td>
+                                        <td>{{ "%.2f"|format(stats.median) }}</td>
+                                        <td>{{ "%.2f"|format(stats.std) }}</td>
+                                        <td>{{ "%.2f"|format(stats.min) }}</td>
+                                        <td>{{ "%.2f"|format(stats.max) }}</td>
+                                        <td>{{ stats.outliers }}</td>
+                                    </tr>
+                                    {% endfor %}
+                                </tbody>
+                            </table>
+                        </div>
+                        {% endif %}
+
+                        <!-- Categorical Insights -->
+                        {% if results.categorical_insights %}
+                        <h5 class="mt-4">Categorical Columns Analysis</h5>
+                        <div class="row">
+                            {% for column, stats in results.categorical_insights.items() %}
+                            <div class="col-md-6 mb-3">
+                                <div class="insights-card">
+                                    <h6>{{ column }}</h6>
+                                    <p><strong>Unique Values:</strong> {{ stats.unique_count }}</p>
+                                    <p><strong>Most Common:</strong> {{ stats.mode }}</p>
+                                    <p><strong>Top Categories:</strong></p>
+                                    <ul>
+                                        {% for category, count in stats.top_categories.items() %}
+                                        <li>{{ category }}: {{ count }}</li>
+                                        {% endfor %}
+                                    </ul>
+                                </div>
+                            </div>
+                            {% endfor %}
+                        </div>
+                        {% endif %}
+                    </div>
+                </div>
+
+                <!-- Visualizations Tab -->
+                <div class="tab-pane fade" id="visualizations" role="tabpanel">
+                    <div class="analysis-section">
+                        <h3 class="section-header">
+                            <i class="fas fa-chart-bar me-2"></i>Data Visualizations
+                        </h3>
+
+                        {% if results.plot_images %}
+                        <div class="row">
+                            {% for plot in results.plot_images %}
+                            <div class="col-lg-6 col-md-12 mb-4">
+                                <div class="plot-container">
+                                    <img src="data:image/png;base64,{{ plot }}" alt="Data Visualization" class="img-fluid">
+                                </div>
+                            </div>
+                            {% endfor %}
+                        </div>
+                        {% else %}
+                        <p>No visualizations available for this dataset.</p>
+                        {% endif %}
+                    </div>
+                </div>
+
+                <!-- AI Insights Tab -->
+                <div class="tab-pane fade" id="insights" role="tabpanel">
+                    <div class="analysis-section">
+                        <h3 class="section-header">
+                            <i class="fas fa-brain me-2"></i>AI-Powered Insights
+                        </h3>
+
+                        <div class="insights-text">
+                            {{ results.ai_insights }}
+                        </div>
+
+                        <!-- Correlation Matrix -->
+                        {% if results.correlation_matrix %}
+                        <h5 class="mt-4">Correlation Analysis</h5>
+                        <div class="correlation-matrix">
+                            <div class="table-responsive">
+                                <table class="table table-striped">
+                                    <thead>
+                                        <tr>
+                                            <th>Feature</th>
+                                            {% for col in results.correlation_matrix.keys() %}
+                                            <th>{{ col }}</th>
+                                            {% endfor %}
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        {% for row_col, row_data in results.correlation_matrix.items() %}
+                                        <tr>
+                                            <td><strong>{{ row_col }}</strong></td>
+                                            {% for col, value in row_data.items() %}
+                                            <td>{{ "%.3f"|format(value) }}</td>
+                                            {% endfor %}
+                                        </tr>
+                                        {% endfor %}
+                                    </tbody>
+                                </table>
+                            </div>
+                        </div>
+                        {% endif %}
+                    </div>
+                </div>
+
+                <!-- SWOT Analysis Tab -->
+                <div class="tab-pane fade" id="swot" role="tabpanel">
+                    <div class="analysis-section">
+                        <h3 class="section-header">
+                            <i class="fas fa-crosshairs me-2"></i>SWOT Analysis
+                        </h3>
+
+                        <div class="swot-grid">
+                            <!-- Strengths -->
+                            <div class="swot-card swot-strengths">
+                                <h5><i class="fas fa-thumbs-up me-2"></i>Strengths</h5>
+                                <ul>
+                                    {% for strength in results.swot_analysis.strengths %}
+                                    <li>{{ strength }}</li>
+                                    {% endfor %}
+                                </ul>
+                            </div>
+
+                            <!-- Weaknesses -->
+                            <div class="swot-card swot-weaknesses">
+                                <h5><i class="fas fa-thumbs-down me-2"></i>Weaknesses</h5>
+                                <ul>
+                                    {% for weakness in results.swot_analysis.weaknesses %}
+                                    <li>{{ weakness }}</li>
+                                    {% endfor %}
+                                </ul>
+                            </div>
+
+                            <!-- Opportunities -->
+                            <div class="swot-card swot-opportunities">
+                                <h5><i class="fas fa-lightbulb me-2"></i>Opportunities</h5>
+                                <ul>
+                                    {% for opportunity in results.swot_analysis.opportunities %}
+                                    <li>{{ opportunity }}</li>
+                                    {% endfor %}
+                                </ul>
+                            </div>
+
+                            <!-- Threats -->
+                            <div class="swot-card swot-threats">
+                                <h5><i class="fas fa-exclamation-triangle me-2"></i>Threats</h5>
+                                <ul>
+                                    {% for threat in results.swot_analysis.threats %}
+                                    <li>{{ threat }}</li>
+                                    {% endfor %}
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Action Buttons -->
+            <div class="text-center mt-4">
+                <a href="/" class="btn btn-primary">
+                    <i class="fas fa-upload me-2"></i>Analyze Another File
+                </a>
+                <button class="btn btn-secondary" onclick="window.print()">
+                    <i class="fas fa-print me-2"></i>Print Report
+                </button>
+            </div>
+        </div>
+    </div>
+
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
+    <script>
+        // Initialize tooltips
+        var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
+        var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
+            return new bootstrap.Tooltip(tooltipTriggerEl);
+        });
+    </script>
+</body>
+</html>