Update KPI cards styling and layout - custom HTML cards with purple gradient, responsive columns, fix deprecation warning

streamlit_app/app.py

@@ -0,0 +1,661 @@
+"""
+Main Streamlit Dashboard Application
+MySpace Ooty Data Analytics - Enhanced Interactive Dashboard
+"""
+
+import streamlit as st
+import pandas as pd
+import numpy as np
+import plotly.express as px
+import plotly.graph_objects as go
+from datetime import datetime, timedelta
+import sys
+from pathlib import Path
+import warnings
+warnings.filterwarnings('ignore')
+
+# Add project root to path
+project_root = Path(__file__).parent.parent
+sys.path.insert(0, str(project_root))
+
+from config.settings import *
+from src.generate_powerpoint_report import PowerPointReportGenerator
+
+# ═══════════════════════════════════════════════════════════════════════════
+# PAGE CONFIGURATION & STYLING
+# ═══════════════════════════════════════════════════════════════════════════
+
+# Load logo for page icon
+logo_file = project_root / "mypace-logo.png"
+
+st.set_page_config(
+    page_title="🏨 MySpace Ooty Analytics",
+    page_icon=str(logo_file) if logo_file.exists() else "🏨",
+    layout="wide",
+    initial_sidebar_state="expanded",
+)
+
+# Custom CSS for enhanced UI and responsive design
+st.markdown("""
+    <style>
+    /* Base styling */
+    .main { padding: 0px; }
+    .reportview-container { padding-top: 0px; }
+    
+    /* KPI Cards */
+    .kpi-card {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: white;
+        padding: 25px;
+        border-radius: 12px;
+        margin: 10px;
+        box-shadow: 0 4px 15px rgba(0,0,0,0.1);
+        text-align: center;
+    }
+    
+    .kpi-value {
+        font-size: 32px;
+        font-weight: bold;
+        margin: 10px 0;
+    }
+    
+    .kpi-label {
+        font-size: 14px;
+        opacity: 0.9;
+        text-transform: uppercase;
+        letter-spacing: 1px;
+    }
+    
+    /* Section Headers */
+    .section-header {
+        border-left: 5px solid #667eea;
+        padding: 15px;
+        margin: 20px 0;
+        background-color: #f5f5f5;
+        border-radius: 5px;
+    }
+    
+    /* Filter Box */
+    .filter-box {
+        background-color: #f0f2f6;
+        padding: 15px;
+        border-radius: 8px;
+        margin: 10px 0;
+    }
+    
+    /* Responsive Design for Mobile and Tablets */
+    @media only screen and (max-width: 768px) {
+        /* Mobile: Stack elements vertically */
+        .kpi-card {
+            margin: 5px 0;
+            padding: 15px;
+        }
+        
+        .kpi-value {
+            font-size: 24px;
+        }
+        
+        .kpi-label {
+            font-size: 12px;
+        }
+        
+        /* Adjust sidebar for mobile */
+        [data-testid="stSidebar"] {
+            width: 100% !important;
+        }
+        
+        /* Make charts responsive */
+        .js-plotly-plot {
+            width: 100% !important;
+            height: auto !important;
+        }
+        
+        /* Adjust table font size for mobile */
+        .dataframe {
+            font-size: 12px !important;
+        }
+        
+        /* Stack columns on mobile */
+        .row-widget.stHorizontal {
+            flex-direction: column !important;
+        }
+        
+        /* Footer text size */
+        .caption {
+            font-size: 10px !important;
+        }
+    }
+    
+    /* Tablet Design */
+    @media only screen and (min-width: 769px) and (max-width: 1024px) {
+        .kpi-card {
+            padding: 20px;
+        }
+        
+        .kpi-value {
+            font-size: 28px;
+        }
+        
+        /* Adjust sidebar width for tablets */
+        [data-testid="stSidebar"] {
+            width: 280px !important;
+        }
+    }
+    
+    /* Desktop Large Screens */
+    @media only screen and (min-width: 1025px) {
+        [data-testid="stSidebar"] {
+            width: 320px !important;
+        }
+    }
+    
+    /* Cross-browser compatibility */
+    /* Firefox */
+    @-moz-document url-prefix() {
+        .kpi-card {
+            -moz-border-radius: 12px;
+        }
+    }
+    
+    /* Safari and Chrome */
+    @supports (-webkit-appearance: none) {
+        .kpi-card {
+            -webkit-border-radius: 12px;
+        }
+    }
+    
+    /* Improve touch targets for mobile */
+    @media (hover: none) and (pointer: coarse) {
+        button, [role="button"], select, input {
+            min-height: 44px !important;
+            min-width: 44px !important;
+        }
+    }
+    
+    /* Ensure images are responsive */
+    img {
+        max-width: 100%;
+        height: auto;
+    }
+    
+    /* Make plots responsive */
+    .plot-container {
+        width: 100% !important;
+        height: auto !important;
+    }
+    
+    /* Streamlit specific responsive fixes */
+    .stPlotlyChart {
+        width: 100% !important;
+    }
+    
+    /* Improve readability on small screens */
+    @media only screen and (max-width: 480px) {
+        h1 { font-size: 24px !important; }
+        h2 { font-size: 20px !important; }
+        h3 { font-size: 18px !important; }
+        p, li { font-size: 14px !important; }
+    }
+    </style>
+    """, unsafe_allow_html=True)
+
+# ═══════════════════════════════════════════════════════════════════════════
+# DATA LOADING FUNCTION
+# ═══════════════════════════════════════════════════════════════════════════
+
+@st.cache_data(ttl=3600)
+def load_data():
+    """Load processed data from CSV"""
+    try:
+        file_path = Path(project_root) / "data" / "processed" / "data_cleaned_with_kpi.csv"
+        if file_path.exists():
+            df = pd.read_csv(file_path)
+            # Convert date columns
+            date_cols = ['Year', 'Month', 'Quarter', 'Week', 'Day']
+            for col in date_cols:
+                if col in df.columns:
+                    if col == 'Month_Name':
+                        df[col] = df[col].astype(str)
+            return df
+        else:
+            return None
+    except Exception as e:
+        st.error(f"Error loading data: {e}")
+        return None
+
+@st.cache_data
+def load_kpi_summary():
+    """Load KPI summary"""
+    try:
+        file_path = Path(project_root) / "data" / "processed" / "kpi_summary.csv"
+        if file_path.exists():
+            return pd.read_csv(file_path)
+        return None
+    except:
+        return None
+
+# ═══════════════════════════════════════════════════════════════════════════
+# SIDEBAR - FILTERS & NAVIGATION
+# ═══════════════════════════════════════════════════════════════════════════
+
+with st.sidebar:
+    # Display logo
+    try:
+        logo_path = Path(project_root) / "mypace-logo.png"
+        if logo_path.exists():
+            from PIL import Image
+            logo_img = Image.open(logo_path)
+            st.image(logo_img, use_container_width=True)
+        else:
+            # Fallback to unicode emoji logo
+            st.markdown("<h1 style='text-align: center; font-size: 80px;'>🏨</h1>", unsafe_allow_html=True)
+    except Exception as e:
+        st.markdown("<h1 style='text-align: center; font-size: 80px;'>🏨</h1>", unsafe_allow_html=True)
+    
+    st.title("🏨 MySpace Ooty Holiday Inn")
+    st.markdown("📊 Data Analytics Dashboard")
+    st.markdown("---")
+    
+    # Navigation
+    page = st.radio(
+        "📍 Navigation",
+        ["📊 Overview", "📈 KPIs & Metrics", "🔍 Data Exploration", 
+         "📉 Trends & Analysis", "🎯 Custom Reports"]
+    )
+    
+    st.markdown("---")
+    
+    # Load data
+    df = load_data()
+    
+    if df is not None:
+        st.success("✓ Data Loaded Successfully!")
+        st.metric("Records", f"{len(df):,}")
+        
+        st.markdown("---")
+        st.subheader("🔧 Filters")
+        
+        # Date range filter
+        if 'Year' in df.columns and 'Month' in df.columns:
+            year_options = sorted([y for y in df['Year'].unique() if pd.notna(y)])
+            selected_year = st.multiselect(
+                "📅 Select Year(s)",
+                year_options,
+                default=year_options if year_options else [],
+                help="Filter by booking year"
+            )
+            
+            month_options = sorted([m for m in df['Month'].unique() if pd.notna(m)])
+            selected_month = st.multiselect(
+                "📆 Select Month(s)",
+                month_options,
+                default=month_options if month_options else [],
+                help="Filter by booking month (1-12)"
+            )
+        else:
+            selected_year = []
+            selected_month = []
+        
+        # Filter by booking status
+        if 'Booking_Status' in df.columns:
+            status_options = [s for s in df['Booking_Status'].unique() if pd.notna(s)]
+            selected_status = st.multiselect(
+                "✅ Select Booking Status",
+                status_options,
+                default=status_options if status_options else [],
+                help="Filter by booking status"
+            )
+        else:
+            selected_status = [None]
+        
+        # Apply filters
+        df_filtered = df.copy()
+        if 'Year' in df.columns and selected_year:
+            df_filtered = df_filtered[df_filtered['Year'].isin(selected_year)]
+        if 'Month' in df.columns and selected_month:
+            df_filtered = df_filtered[df_filtered['Month'].isin(selected_month)]
+        if 'Booking_Status' in df_filtered.columns and selected_status and len(selected_status) > 0:
+            df_filtered = df_filtered[df_filtered['Booking_Status'].isin(selected_status)]
+        
+        st.metric("Filtered Records", f"{len(df_filtered):,}")
+        
+    else:
+        st.warning("⚠ No data found. Please run the EDA notebook first.")
+        df_filtered = None
+    
+    st.markdown("---")
+    st.info("💡 Tip: Use filters to customize your analysis")
+
+# ═══════════════════════════════════════════════════════════════════════════
+# MAIN CONTENT - PAGE ROUTING
+# ═══════════════════════════════════════════════════════════════════════════
+
+if df_filtered is None or len(df_filtered) == 0:
+    st.error("🚨 No data available. Please ensure the data file exists at `data/processed/data_cleaned_with_kpi.csv`")
+    st.stop()
+
+# PAGE 1: OVERVIEW
+if page == "📊 Overview":
+    st.title("📊 Dashboard Overview")
+    st.markdown("Get a quick summary of your business metrics")
+    
+    # Expandable filters section
+    with st.expander("🔧 Active Filters", expanded=True):
+        col1, col2, col3 = st.columns(3)
+        with col1:
+            st.metric("Years Selected", len(selected_year))
+        with col2:
+            st.metric("Months Selected", len(selected_month))
+        with col3:
+            st.metric("Status Selected", len(selected_status))
+        st.info(f"📊 Showing {len(df_filtered):,} records out of {len(df):,} total")
+    
+    # Load KPI summary
+    kpi_summary = load_kpi_summary()
+    
+    if kpi_summary is not None:
+        kpis_dict = dict(zip(kpi_summary['Metric'], kpi_summary['Value']))
+    else:
+        kpis_dict = {}
+    
+    # KPI Cards with Custom Styling
+    st.markdown("### 📈 Key Performance Indicators")
+    
+    # Calculate KPI values
+    total_bookings = len(df_filtered)
+    total_revenue = df_filtered[[col for col in df_filtered.columns if 'amount' in col.lower() or 'revenue' in col.lower()]].sum().sum()
+    
+    # Calculate average length of stay
+    if 'No. Nights' in df_filtered.columns:
+        avg_los = df_filtered['No. Nights'].fillna(0).astype(float).mean()
+    elif 'Room_Nights' in df_filtered.columns:
+        avg_los = df_filtered['Room_Nights'].fillna(0).astype(float).mean()
+    else:
+        nights_col = [col for col in df_filtered.columns if 'night' in col.lower()]
+        avg_los = df_filtered[nights_col[0]].fillna(0).astype(float).mean() if nights_col else 0
+    
+    avg_revenue = total_revenue / total_bookings if total_bookings > 0 else 0
+    
+    # Display KPI cards using columns
+    kpi_col1, kpi_col2, kpi_col3, kpi_col4 = st.columns([0.8, 1.1, 1.1, 1.1], gap="small")
+    
+    with kpi_col1:
+        st.markdown(f"""
+        <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 25px; border-radius: 12px; text-align: center; color: white; box-shadow: 0 4px 15px rgba(0,0,0,0.1);">
+            <div style="font-size: 12px; font-weight: 600; letter-spacing: 1px; opacity: 0.9; margin-bottom: 10px;">TOTAL RECORDS</div>
+            <div style="font-size: 32px; font-weight: bold;">{total_bookings:,}</div>
+        </div>
+        """, unsafe_allow_html=True)
+    
+    with kpi_col2:
+        st.markdown(f"""
+        <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 25px; border-radius: 12px; text-align: center; color: white; box-shadow: 0 4px 15px rgba(0,0,0,0.1);">
+            <div style="font-size: 12px; font-weight: 600; letter-spacing: 1px; opacity: 0.9; margin-bottom: 10px;">TOTAL REVENUE</div>
+            <div style="font-size: 32px; font-weight: bold;">₹{total_revenue:,.0f}</div>
+        </div>
+        """, unsafe_allow_html=True)
+    
+    with kpi_col3:
+        st.markdown(f"""
+        <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 25px; border-radius: 12px; text-align: center; color: white; box-shadow: 0 4px 15px rgba(0,0,0,0.1);">
+            <div style="font-size: 12px; font-weight: 600; letter-spacing: 1px; opacity: 0.9; margin-bottom: 10px;">AVG. LENGTH OF STAY</div>
+            <div style="font-size: 32px; font-weight: bold;">{avg_los:.1f} <span style="font-size: 14px; font-weight: 500;">nights</span></div>
+        </div>
+        """, unsafe_allow_html=True)
+    
+    with kpi_col4:
+        st.markdown(f"""
+        <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 25px; border-radius: 12px; text-align: center; color: white; box-shadow: 0 4px 15px rgba(0,0,0,0.1);">
+            <div style="font-size: 12px; font-weight: 600; letter-spacing: 1px; opacity: 0.9; margin-bottom: 10px;">REVENUE PER BOOKING</div>
+            <div style="font-size: 32px; font-weight: bold;">₹{avg_revenue:,.0f}</div>
+        </div>
+        """, unsafe_allow_html=True)
+    
+
+    # Charts Row 1
+    st.markdown("---")
+    st.markdown("### 📊 Analytics")
+    
+    col1, col2 = st.columns(2)
+    
+    with col1:
+        st.subheader("Bookings by Month")
+        if 'Month' in df_filtered.columns:
+            monthly_data = df_filtered.groupby('Month').size().reset_index(name='Bookings')
+            fig = px.bar(monthly_data, x='Month', y='Bookings', 
+                        title="Monthly Booking Distribution",
+                        color='Bookings', color_continuous_scale='Blues')
+            fig.update_layout(height=400, showlegend=False)
+            st.plotly_chart(fig, use_container_width=True)
+    
+    with col2:
+        st.subheader("Revenue Distribution")
+        revenue_col = next((col for col in df_filtered.columns if 'amount' in col.lower() or 'total' in col.lower()), None)
+        if revenue_col:
+            fig = px.histogram(df_filtered, x=revenue_col, nbins=30,
+                             title="Revenue Distribution",
+                             color_discrete_sequence=['#636EFA'])
+            fig.update_layout(height=400)
+            st.plotly_chart(fig, use_container_width=True)
+    
+    # Charts Row 2
+    col1, col2 = st.columns(2)
+    
+    with col1:
+        st.subheader("Bookings by Day of Week")
+        if 'Day_of_Week' in df_filtered.columns:
+            dow_order = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']
+            dow_data = df_filtered['Day_of_Week'].value_counts().reindex(
+                [d for d in dow_order if d in df_filtered['Day_of_Week'].values]
+            ).reset_index(name='Bookings')
+            dow_data.columns = ['Day', 'Bookings']
+            fig = px.bar(dow_data, x='Day', y='Bookings',
+                        title="Bookings by Day of Week",
+                        color='Bookings', color_continuous_scale='Greens')
+            fig.update_layout(height=400)
+            st.plotly_chart(fig, use_container_width=True)
+    
+    with col2:
+        st.subheader("Holiday vs Regular Season")
+        if 'Is_Holiday_Season' in df_filtered.columns:
+            season_data = df_filtered['Is_Holiday_Season'].map({1: 'Holiday Season', 0: 'Regular Season'}).value_counts()
+            fig = px.pie(values=season_data.values, names=season_data.index,
+                        title="Booking Distribution by Season",
+                        color_discrete_sequence=['#FF6B6B', '#4ECDC4'])
+            fig.update_layout(height=400)
+            st.plotly_chart(fig, use_container_width=True)
+
+# PAGE 2: KPIs & METRICS
+elif page == "📈 KPIs & Metrics":
+    st.title("📈 Key Performance Indicators")
+    st.markdown("Detailed business metrics and performance indicators")
+    
+    kpi_summary = load_kpi_summary()
+    
+    if kpi_summary is not None:
+        # Display KPI table
+        st.subheader("Summary Metrics")
+        st.dataframe(
+            kpi_summary.head(15),
+            use_container_width=True,
+            height=400
+        )
+    
+    # Calculate additional metrics
+    st.markdown("---")
+    st.subheader("Performance Analysis")
+    
+    col1, col2, col3 = st.columns(3)
+    
+    with col1:
+        total_bookings = len(df_filtered)
+        st.info(f"📊 Total Bookings\n\n**{total_bookings:,}** bookings")
+    
+    with col2:
+        if 'Is_Weekend' in df_filtered.columns:
+            weekend_bookings = (df_filtered['Is_Weekend'] == 1).sum()
+            pct = (weekend_bookings / len(df_filtered) * 100) if len(df_filtered) > 0 else 0
+            st.info(f"🎉 Weekend Bookings\n\n**{pct:.1f}%** of total")
+    
+    with col3:
+        if 'Is_Holiday_Season' in df_filtered.columns:
+            holiday_bookings = (df_filtered['Is_Holiday_Season'] == 1).sum()
+            pct = (holiday_bookings / len(df_filtered) * 100) if len(df_filtered) > 0 else 0
+            st.info(f"🎄 Holiday Season\n\n**{pct:.1f}%** of bookings")
+
+# PAGE 3: DATA EXPLORATION
+elif page == "🔍 Data Exploration":
+    st.title("🔍 Exploratory Data Analysis")
+    
+    # Data Overview
+    st.subheader("Dataset Overview")
+    
+    col1, col2, col3, col4 = st.columns(4)
+    with col1:
+        st.metric("Rows", f"{len(df_filtered):,}")
+    with col2:
+        st.metric("Columns", df_filtered.shape[1])
+    with col3:
+        st.metric("Missing Values", f"{df_filtered.isnull().sum().sum():,}")
+    with col4:
+        st.metric("Duplicates", "0")
+    
+    # Display data
+    st.subheader("Data Sample")
+    st.dataframe(df_filtered.head(10), use_container_width=True)
+    
+    # Column statistics
+    st.subheader("Column Statistics")
+    numeric_cols = df_filtered.select_dtypes(include=[np.number]).columns.tolist()
+    
+    if numeric_cols:
+        selected_cols = st.multiselect("Select columns to analyze", numeric_cols, default=numeric_cols[:5])
+        st.dataframe(
+            df_filtered[selected_cols].describe().round(2),
+            use_container_width=True
+        )
+
+# PAGE 4: TRENDS & ANALYSIS
+elif page == "📉 Trends & Analysis":
+    st.title("📉 Trends & Statistical Analysis")
+    
+    # Monthly Trend
+    st.subheader("Monthly Trends")
+    if 'Month' in df_filtered.columns:
+        monthly_bookings = df_filtered.groupby('Month').size()
+        fig = px.line(x=monthly_bookings.index, y=monthly_bookings.values,
+                     labels={'x': 'Month', 'y': 'Bookings'},
+                     title="Booking Trend Over Months",
+                     markers=True)
+        fig.update_traces(line=dict(color='#FF6B6B', width=3), marker=dict(size=10))
+        st.plotly_chart(fig, use_container_width=True)
+    
+    # Revenue Trends
+    st.markdown("---")
+    st.subheader("Revenue Trends")
+    
+    revenue_cols = [col for col in df_filtered.columns if any(kw in col.lower() for kw in ['amount', 'revenue', 'total'])]
+    if revenue_cols and 'Month' in df_filtered.columns:
+        revenue_col = revenue_cols[0]
+        monthly_revenue = df_filtered.groupby('Month')[revenue_col].sum()
+        fig = px.line(x=monthly_revenue.index, y=monthly_revenue.values,
+                     labels={'x': 'Month', 'y': 'Revenue (₹)'},
+                     title="Revenue Trend Over Months",
+                     markers=True)
+        fig.update_traces(line=dict(color='#00CC96', width=3), marker=dict(size=10))
+        st.plotly_chart(fig, use_container_width=True)
+
+# PAGE 5: CUSTOM REPORTS
+elif page == "🎯 Custom Reports":
+    st.title("🎯 Custom Reports & Export")
+    st.markdown("Generate personalized reports with selected filters")
+    
+    # Report options
+    st.subheader("Report Configuration")
+    
+    col1, col2 = st.columns(2)
+    
+    with col1:
+        report_type = st.selectbox(
+            "Report Type",
+            ["Summary Report", "Detailed Analysis", "Executive Summary", "Seasonal Analysis"]
+        )
+    
+    with col2:
+        export_format = st.selectbox(
+            "Export Format",
+            ["CSV", "Excel", "PDF (Coming Soon)"]
+        )
+    
+    # Report preview
+    st.subheader("Report Preview")
+    st.info(f"📄 {report_type} - {len(df_filtered):,} records")
+    st.dataframe(df_filtered.head(20), use_container_width=True)
+    
+    # Export button
+    col1, col2, col3 = st.columns(3)
+    
+    with col1:
+        if st.button("📥 Download CSV", key="csv"):
+            csv = df_filtered.to_csv(index=False)
+            st.download_button(
+                label="CSV Report",
+                data=csv,
+                file_name=f"myspace_report_{datetime.now().strftime('%Y%m%d_%H%M%S')}.csv",
+                mime="text/csv"
+            )
+    
+    with col2:
+        if st.button("📊 Download Excel", key="excel"):
+            excel_buffer = pd.ExcelWriter('/tmp/report.xlsx', engine='openpyxl')
+            df_filtered.to_excel(excel_buffer, index=False)
+            excel_buffer.close()
+            with open('/tmp/report.xlsx', 'rb') as f:
+                st.download_button(
+                    label="Excel Report",
+                    data=f.read(),
+                    file_name=f"myspace_report_{datetime.now().strftime('%Y%m%d_%H%M%S')}.xlsx",
+                    mime="application/vnd.ms-excel"
+                )
+    
+    with col3:
+        if st.button("📊 Generate PowerPoint", key="ppt"):
+            with st.spinner("🔄 Generating PowerPoint presentation..."):
+                try:
+                    # Generate PowerPoint report
+                    generator = PowerPointReportGenerator()
+                    ppt_path = generator.generate_report()
+                    
+                    # Read the file and provide download
+                    with open(ppt_path, 'rb') as f:
+                        st.download_button(
+                            label="📥 Download PowerPoint",
+                            data=f.read(),
+                            file_name=f"MySpace_Ooty_Report_{datetime.now().strftime('%Y%m%d_%H%M%S')}.pptx",
+                            mime="application/vnd.openxmlformats-officedocument.presentationml.presentation"
+                        )
+                    st.success("✅ PowerPoint report generated successfully!")
+                except Exception as e:
+                    st.error(f"❌ Error generating PowerPoint: {str(e)}")
+
+# Footer
+st.markdown("---")
+st.markdown("")
+with st.container():
+    st.markdown("<h4 style='text-align: center; color: #193264;'>🏨 MySpace Holiday Inn - Ooty</h4>", unsafe_allow_html=True)
+    
+    col1, col2, col3 = st.columns([1, 2, 1])
+    with col2:
+        st.markdown("""
+        <div style='text-align: center; font-size: 12px;'>
+            <p><b>📍 HEAD OFFICE</b><br/>Kotagiri – 643217</p>
+            <p><b>📞 CONTACT US</b><br/>
+            +91 82206 62206 | +91-6369052954 | +91-6369973006<br/>
+            📧 myspaceholidayinn@gmail.com<br/>
+            📱 +916381911228</p>
+            <p><b>🕐 TIMINGS</b><br/>
+            Check-In: 12:00 PM | Check-Out: 10:00 AM</p>
+        </div>
+        """, unsafe_allow_html=True)
+    
+    st.caption(f"📊 Data Analytics Dashboard | Last Updated: {datetime.now().strftime('%Y-%m-%d %H:%M:%S')}")