import streamlit as st 

st.markdown(
    """
    <style>
    /* App Background */
    .stApp {
        background: linear-gradient(to right, #1e3c72, #2a5298); /* Subtle gradient with cool tones */
        color: #f0f0f0;
        padding: 20px;
    }
    /* Align content to the left */
    .block-container {
        text-align: left;
        padding: 2rem;
    }
    
    /* Header and Subheader Text */
    h1 {
        background: linear-gradient(to right, #ff7f50, #ffd700); /* Orange to yellow gradient */
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-family: 'Arial', sans-serif !important;
        font-weight: bold !important;
        text-align: center;
    }
    h2, h3, h4 {
        background: linear-gradient(to right, #ff7f50, #ffd700); /* Orange to yellow gradient */
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-family: 'Arial', sans-serif !important;
        font-weight: bold !important;
    }
    /* Paragraph Text */
    p {
        color: #f0f0f0 !important; /* Light gray for readability */
        font-family: 'Roboto', sans-serif !important;
        line-height: 1.6;
        font-size: 1.1rem;
    }
    
    /* List Styling */
    ul li {
        color: #f0f0f0;
        font-family: 'Roboto', sans-serif;
        font-size: 1.1rem;
        margin-bottom: 0.5rem;
    }
    </style>
    """,
    unsafe_allow_html=True
)

# App Content
st.markdown(
    """
    <h1>Natural Language Processing (NLP)</h1>
    <h3>Introduction to NLP</h3>
    <p>
        Natural Language Processing (NLP) is a fascinating field within Artificial Intelligence (AI) 
        that focuses on enabling machines to understand, interpret, and process human language.
        When dealing with textual data, we use NLP to bridge the gap between human communication 
        (natural language) and computer understanding.
    </p>
    <p>
        In the modern era, data isn't just limited to numbers, images, or videos—it also includes textual data. 
        To convert text into a format that machines can analyze and process, we use NLP.
        NLP goes beyond basic text processing; it is also capable of analyzing speech, extracting meaning, and 
        converting unstructured data into structured formats for better analysis.
    </p>
    <h3>Why is NLP Important?</h3>
    <p>
        NLP is used to guide machines to process and analyze natural language. By doing so, we enable a wide range of 
        applications like language translation, sentiment analysis, chatbots, and more.
    </p>
    <p>
        <b>Programming Note:</b> Programming languages (PL) like Python are used to build NLP models that help machines 
        understand natural language effectively.
    </p>
    """,
    unsafe_allow_html=True
)

st.markdown(
    """
    <h3>NLP Workflow</h3>
    <p>
        Here's a simplified view of how NLP works:
    </p>
    <ul>
        <li>Input: Natural language (text or speech)</li>
        <li>Processing: Converting text into machine-readable formats</li>
        <li>Output: Structured data or insights (e.g., sentiment, topics)</li>
    </ul>
    """,
    unsafe_allow_html=True
)