here are my project files : 


```
# f.py

from flask import render_template, redirect, url_for, flash, request
import os
import json
from werkzeug.utils import secure_filename
from datetime import datetime

def load_content():
    """Load content data from JSON file."""
    with open('data/content.json', 'r', encoding='utf-8') as f:
        return json.load(f)

def get_landing_page():
    """Render the landing page."""
    return render_template('index.html')

def get_health_page():
    """Render the 'صحة البيئة' page with its categories."""
    categories = ['عينات المياه', 'المرافق', 'الصرف', 'الخزانات']
    return render_template('health.html', categories=categories)

def get_occupational_page():
    """Render the 'السلامة المهنية' page with its categories."""
    # Replace with actual occupational categories
    categories = ['إدارة المخاطر', 'تدريب الموظفين', 'السلامة في المواقع', 'الصحة المهنية']
    return render_template('occupational.html', categories=categories)

def get_category_page(section, category):
    """
    Render a specific category page under health or occupational sections.
    
    Args:
        section (str): 'health' or 'occupational'
        category (str): Category name (e.g., 'عينات المياه')
    """
    return render_template('section.html', section=section, category=category)

def get_documents_page(section, category):
    """
    Render the 'المستندات' page for a given category.
    
    Args:
        section (str): 'health' or 'occupational'
        category (str): Category name
    """
    # Define document-specific buttons based on category
    if category == 'عينات المياه':
        document_buttons = ['الاورنيك', 'كشف التستيف', 'سجل العينات', 'نتائج العينات']
    else:
        document_buttons = ['المستندات الأخرى']  # Define for other categories
    
    return render_template('documents.html', section=section, category=category, document_buttons=document_buttons)

def get_records_page(section, category):
    """
    Render the 'السجلات' page for a given category.
    
    Args:
        section (str): 'health' or 'occupational'
        category (str): Category name
    """
    # Placeholder for records functionality
    return render_template('records.html', section=section, category=category)

def get_information_page(section, category):
    """Render the 'المعلومات' page with foldable sections."""
    content = load_content()
    section_content = content.get(category, {})
    return render_template('information.html', section=section, category=category, data=section_content)

def get_laws_page(section, category):
    """Render the 'القوانين والقرارات' page with law links."""
    # Placeholder for actual laws - Replace with dynamic data as needed
    laws = ['قانون السلامة 2023', 'قرار وزارة الصحة 2022', 'القانون البيئي 2021']
    return render_template('laws.html', section=section, category=category, laws=laws)

def get_ornich_page(section, category):
    """Render the 'الأورنيك' main page with its functionalities."""
    return render_template('ornich.html', section=section, category=category)

def get_ornich_empty_page(section, category):
    """Render the 'اورنيك فارغ' page with a PDF link."""
    # Ensure the PDF exists in static/pdfs/
    pdf_path = url_for('static', filename='pdfs/ornich_empty_template.pdf')
    return render_template('ornich_empty.html', section=section, category=category, pdf_path=pdf_path)

def get_ornich_edit_page(section, category):
    """Render the 'تعديل الأورنيك' page with a DOCX link."""
    # Ensure the DOCX exists in static/docs/
    docx_path = url_for('static', filename='docs/ornich_edit_template.docx')
    return render_template('ornich_edit.html', section=section, category=category, docx_path=docx_path)

def get_ornich_add_page(section, category):
    """Render the 'اضافة اورنيك' page."""
    return render_template('ornich_add.html', section=section, category=category)

def get_ornich_works_page(section, category):
    """Render the 'الأعمال' page displaying uploaded works."""
    # Path to the works directory for the category
    works_path = os.path.join('static', 'uploads', 'أعمال عينات المياه', 'أعمال الاورنيك')
    if not os.path.exists(works_path):
        os.makedirs(works_path)  # Create directory if it doesn't exist
    
    works_structure = {}
    for year in sorted(os.listdir(works_path)):
        year_path = os.path.join(works_path, year)
        if os.path.isdir(year_path):
            works_structure[year] = {}
            for month in sorted(os.listdir(year_path)):
                month_path = os.path.join(year_path, month)
                if os.path.isdir(month_path):
                    works_structure[year][month] = []
                    for day in sorted(os.listdir(month_path)):
                        day_path = os.path.join(month_path, day)
                        if os.path.isdir(day_path):
                            files = os.listdir(day_path)
                            file_urls = []
                            for filename in files:
                                # Construct the URL path for the file
                                file_url = url_for('static', filename=f'uploads/أعمال عينات المياه/أعمال الاورنيك/{year}/{month}/{day}/{filename}')
                                file_urls.append({'name': filename, 'url': file_url})
                            works_structure[year][month].append({'day': day, 'files': file_urls})
    
    return render_template('ornich_works.html', section=section, category=category, works=works_structure)







def handle_file_upload(request, section, category):
    """
    Handle the file upload process for 'اضافة اورنيك'.
    
    Args:
        request: The Flask request object.
        section (str): 'health' or 'occupational'
        category (str): The category name.
    """
    if 'file' not in request.files:
        flash('لا يوجد ملف مختار.')
        return redirect(request.url)
    
    file = request.files['file']
    if file.filename == '':
        flash('لم يتم اختيار ملف.')
        return redirect(request.url)
    
    if file:
        filename = secure_filename(file.filename)
        # Get the date from the form (expected format: YYYY-MM-DD)
        date_str = request.form.get('date')
        if not date_str:
            flash('لم يتم تحديد تاريخ.')
            return redirect(request.url)
        
        try:
            date_obj = datetime.strptime(date_str, '%Y-%m-%d')
            year = date_obj.strftime('%Y')
            month = date_obj.strftime('%B-%m')  # e.g., September-09
            day = date_obj.strftime('%d')
        except ValueError:
            flash('تنسيق التاريخ غير صالح.')
            return redirect(request.url)
        
        # Define the path based on date within static/uploads
        base_path = os.path.join('static', 'uploads', 'أعمال عينات المياه', 'أعمال الاورنيك', year, month, day)
        os.makedirs(base_path, exist_ok=True)  # Create directories if they don't exist
        
        file_path = os.path.join(base_path, filename)
        file.save(file_path)  # Save the file
        
        flash('تم رفع الملف بنجاح.')
        return redirect(url_for('ornich_works', section=section, category=category))
    
    flash('فشل رفع الملف.')
    return redirect(request.url)
```


```
# app.py

from flask import Flask, render_template, request, redirect, url_for, flash
from f import (
    get_landing_page,
    get_health_page,
    get_occupational_page,
    get_category_page,
    get_documents_page,
    get_records_page,
    get_information_page,
    get_laws_page,
    get_ornich_page,
    get_ornich_empty_page,
    get_ornich_edit_page,
    get_ornich_add_page,
    get_ornich_works_page,
    handle_file_upload
)
import os

app = Flask(__name__)
app.config['UPLOAD_FOLDER'] = 'uploads/'  # Directory to store uploads
app.secret_key = 'your_secret_key_here'   # Replace with a secure key

# Route: Landing Page
@app.route('/')
def home():
    """Render the landing page."""
    return get_landing_page()

# Route: "صحة البيئة" Main Page
@app.route('/health')
def health():
    """Render the 'صحة البيئة' main page."""
    return get_health_page()

# Route: "السلامة المهنية" Main Page
@app.route('/occupational')
def occupational():
    """Render the 'السلامة المهنية' main page."""
    return get_occupational_page()

# Route: Specific Category Page under Health or Occupational
@app.route('/<section>/<category>')
def category_page(section, category):
    """
    Render specific category pages under 'health' or 'occupational'.
    
    Args:
        section (str): 'health' or 'occupational'
        category (str): Category name (e.g., 'عينات المياه')
    """
    return get_category_page(section, category)

# Route: Actions within a Category (information, documents, laws)
@app.route('/<section>/<category>/<action>')
def section_action(section, category, action):
    """
    Handle actions ('information', 'documents', 'laws') within a category.
    
    Args:
        section (str): 'health' or 'occupational'
        category (str): Category name
        action (str): Action name ('information', 'documents', 'laws')
    """
    if action == 'information':
        return get_information_page(section, category)
    elif action == 'documents':
        return get_documents_page(section, category)
    elif action == 'laws':
        return get_laws_page(section, category)
    else:
        flash('الصفحة المطلوبة غير موجودة.')
        return redirect(url_for('home'))

# Route: Ornich Specific Pages under Documents
@app.route('/<section>/<category>/documents/ornich')
def ornich(section, category):
    """Render the 'الأورنيك' main page under 'المستندات'."""
    return get_ornich_page(section, category)

@app.route('/<section>/<category>/documents/ornich_empty')
def ornich_empty(section, category):
    """Render the 'اورنيك فارغ' page with a PDF link."""
    return get_ornich_empty_page(section, category)

@app.route('/<section>/<category>/documents/ornich_edit')
def ornich_edit(section, category):
    """Render the 'تعديل الأورنيك' page with a DOCX link."""
    return get_ornich_edit_page(section, category)

@app.route('/<section>/<category>/documents/ornich_add', methods=['GET', 'POST'])
def ornich_add(section, category):
    """Handle adding a new أورنيك file."""
    if request.method == 'POST':
        return handle_file_upload(request, section, category)
    return get_ornich_add_page(section, category)

@app.route('/<section>/<category>/documents/ornich_works')
def ornich_works(section, category):
    """Render the 'الأعمال' page displaying uploaded works."""
    return get_ornich_works_page(section, category)

# Route: Handle Form Submission for Reports (Placeholder)
@app.route('/submit_report', methods=['POST'])
def submit_report():
    """
    Handle submission of the reports form.
    
    For now, it redirects back with a success message.
    """
    # Extract form data here
    # Example:
    # report_title = request.form.get('report_title')
    # report_details = request.form.get('report_details')
    flash('تم إرسال التقرير بنجاح (هذه ميزة مؤقتة).')
    return redirect(request.referrer or url_for('home'))

if __name__ == '__main__':
    # Create upload directories if they don't exist
    os.makedirs(app.config['UPLOAD_FOLDER'], exist_ok=True)
    app.run(debug=True)
```



data/content.json 
```
{
    "عينات المياه": {
        "sections": [
            {
                "title": "القسم الأول",
                "questions": [
                    {
                        "question": "ما هي جودة المياه هنا؟",
                        "answer": "جودة المياه ممتازة."
                    },
                    {
                        "question": "كيف تتم معالجة المياه؟",
                        "answer": "تتم معالجة المياه باستخدام تقنيات متقدمة."
                    }
                ]
            },
            {
                "title": "القسم الثاني",
                "questions": [
                    {
                        "question": "كم عدد محطات المعالجة؟",
                        "answer": "هناك ثلاث محطات معالجة."
                    }
                ]
            }
        ]
    },
    "المرافق": {
        "sections": [
            {
                "title": "المرفق الأول",
                "questions": [
                    {
                        "question": "ما هي الأدوات المتاحة؟",
                        "answer": "هناك العديد من الأدوات المتاحة."
                    }
                ]
            }
        ]
    },
    "الصرف": {
        "sections": [
            {
                "title": "قسم الصرف",
                "questions": [
                    {
                        "question": "كيف يتم التعامل مع الصرف؟",
                        "answer": "يتم التعامل مع الصرف بواسطة نظام متكامل."
                    }
                ]
            }
        ]
    },
    "الخزانات": {
        "sections": [
            {
                "title": "خزانة المياه",
                "questions": [
                    {
                        "question": "ما هي سعة الخزانات؟",
                        "answer": "سعة الخزانات تصل إلى 1000 لتر."
                    }
                ]
            }
        ]
    },
    "إدارة المخاطر": {
        "sections": [
            {
                "title": "قسم إدارة المخاطر",
                "questions": [
                    {
                        "question": "ما هي الإجراءات المتبعة؟",
                        "answer": "نوفر تدريبات دورية ونقوم بتقييم المخاطر بشكل مستمر."
                    }
                ]
            }
        ]
    },
    "تدريب الموظفين": {
        "sections": [
            {
                "title": "قسم تدريب الموظفين",
                "questions": [
                    {
                        "question": "ما هي برامج التدريب المتاحة؟",
                        "answer": "نوفر برامج تدريبية متخصصة في السلامة والصحة المهنية."
                    }
                ]
            }
        ]
    },
    "السلامة في المواقع": {
        "sections": [
            {
                "title": "قسم السلامة في المواقع",
                "questions": [
                    {
                        "question": "كيف نضمن السلامة في المواقع؟",
                        "answer": "من خلال التفتيش الدوري وتوفير المعدات اللازمة."
                    }
                ]
            }
        ]
    },
    "الصحة المهنية": {
        "sections": [
            {
                "title": "قسم الصحة المهنية",
                "questions": [
                    {
                        "question": "ما هي المبادرات الصحية؟",
                        "answer": "نقدم برامج توعية ونظام دعم صحية للموظفين."
                    }
                ]
            }
        ]
    }
}
```





```
/* static/css/styles.css */

/* General Styles */
body {
    font-family: Arial, sans-serif;
    background-color: #f4f4f4;
    margin: 0;
    padding: 0;
    direction: rtl; /* Right-to-Left for Arabic */
}

header {
    background-color: #333;
    color: #fff;
    padding: 10px 0;
    text-align: center;
}

header h1 {
    margin: 0;
}

nav a {
    color: #fff;
    margin: 0 15px;
    text-decoration: none;
}

nav a:hover {
    text-decoration: underline;
}

.main {
    padding: 20px;
}

footer {
    background-color: #333;
    color: #fff;
    text-align: center;
    padding: 10px 0;
    position: fixed;
    width: 100%;
    bottom: 0;
}

/* Button Styles */
.button-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 50px 0;
}

.btn {
    display: inline-block;
    background-color: #007BFF;
    color: #fff;
    padding: 15px 30px;
    margin: 10px;
    text-decoration: none;
    border-radius: 5px;
    text-align: center;
    width: 250px;
    transition: background-color 0.3s;
}

.btn:hover {
    background-color: #0056b3;
}

.back-btn {
    background-color: #6c757d;
}

.back-btn:hover {
    background-color: #5a6268;
}

/* Form Styles */
form {
    width: 60%;
    margin: 0 auto;
}

form label {
    display: block;
    margin-top: 15px;
    font-weight: bold;
}

form input, form textarea {
    width: 100%;
    padding: 10px;
    margin-top: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

form button {
    margin-top: 20px;
    padding: 10px 20px;
}

/* Flashed Messages */
.flashes {
    list-style-type: none;
    padding: 0;
    margin: 10px auto;
    width: 60%;
    text-align: center;
}

.flashes li {
    background-color: #d4edda;
    color: #155724;
    padding: 10px;
    margin-bottom: 5px;
    border: 1px solid #c3e6cb;
    border-radius: 4px;
}

/* Foldable Sections */
.foldable-btn {
    background-color: #e2e2e2;
    color: #444;
    cursor: pointer;
    padding: 10px;
    width: 100%;
    border: none;
    text-align: right;
    outline: none;
    font-size: 18px;
    transition: background-color 0.3s;
}

.foldable-btn.active {
    background-color: #ccc;
}

.foldable-content {
    padding: 0 15px;
    display: none;
    background-color: #fafafa;
}

.question-btn {
    background-color: #d9edf7;
    color: #31708f;
    cursor: pointer;
    padding: 8px;
    width: 100%;
    border: none;
    text-align: right;
    outline: none;
    font-size: 16px;
    transition: background-color 0.3s;
}

.question-btn.active {
    background-color: #bee5eb;
}

.answer {
    padding: 5px 20px;
    display: none;
    background-color: #f0f8ff;
    border-left: 3px solid #007BFF;
    margin-bottom: 10px;
}

/* PDF Viewer */
.pdf-viewer {
    margin-top: 20px;
}

/* Hierarchical Lists in Ornish Works */
.year-section {
    margin-bottom: 20px;
}

.year-section h3 {
    background-color: #f8f9fa;
    padding: 10px;
    border-left: 5px solid #007BFF;
}

.year-section ul {
    list-style-type: none;
    padding-left: 20px;
}

.year-section ul li {
    margin: 5px 0;
}

.year-section ul li a {
    color: #007BFF;
    text-decoration: none;
}

.year-section ul li a:hover {
    text-decoration: underline;
}

/* Responsive Design */
@media (max-width: 768px) {
    .button-container {
        flex-direction: column;
    }

    form {
        width: 90%;
    }

    .flashes {
        width: 90%;
    }
}
```




E:\Setting_New_workspace\static\docs\ornich_edit_template.docx
E:\Setting_New_workspace\static\pdfs\ornich_empty_template.pdf


```
// static/js/scripts.js

document.addEventListener('DOMContentLoaded', function() {
    // Handle foldable sections
    const foldableButtons = document.querySelectorAll('.foldable-btn');
    foldableButtons.forEach(button => {
        button.addEventListener('click', function() {
            this.classList.toggle('active');
            const content = this.nextElementSibling;
            if (content.style.display === "block") {
                content.style.display = "none";
            } else {
                content.style.display = "block";
            }
        });
    });

    // Handle question-answer toggles
    const questionButtons = document.querySelectorAll('.question-btn');
    questionButtons.forEach(button => {
        button.addEventListener('click', function() {
            this.classList.toggle('active');
            const answer = this.nextElementSibling;
            if (answer.style.display === "block") {
                answer.style.display = "none";
            } else {
                answer.style.display = "block";
            }
        });
    });
});
```




```
<!-- templates/occupational.html -->
{% extends "base.html" %}

{% block title %}السلامة المهنية{% endblock %}

{% block content %}
<h2>السلامة المهنية</h2>
<div class="button-container">
    {% for category in categories %}
        <a href="{{ url_for('category_page', section='occupational', category=category) }}" class="btn">{{ category }}</a>
    {% endfor %}
</div>
<a href="{{ url_for('home') }}" class="btn back-btn">عودة</a>
{% endblock %}
```




```
<!-- templates/ornich.html -->
{% extends "base.html" %}

{% block title %}الأورنيك - {{ category }}{% endblock %}

{% block content %}
<h2>الأورنيك - {{ category }}</h2>
<div class="button-container">
    <a href="{{ url_for('ornich_works', section=section, category=category) }}" class="btn">الأعمال</a>
    <a href="{{ url_for('ornich_empty', section=section, category=category) }}" class="btn">اورنيك فارغ</a>
    <a href="{{ url_for('ornich_edit', section=section, category=category) }}" class="btn">تعديل الأورنيك</a>
    <a href="{{ url_for('ornich_add', section=section, category=category) }}" class="btn">اضافة أورنيك</a>
</div>
<!-- Corrected Back Button -->
<a href="{{ url_for('section_action', section=section, category=category, action='documents') }}" class="btn back-btn">عودة</a>
{% endblock %}
```




```
<!-- templates/ornich_add.html -->
{% extends "base.html" %}

{% block title %}اضافة أورنيك - {{ category }}{% endblock %}

{% block content %}
<h2>اضافة أورنيك - {{ category }}</h2>
<form action="{{ url_for('ornich_add', section=section, category=category) }}" method="POST" enctype="multipart/form-data">
    <label for="file">اختر ملف:</label>
    <input type="file" id="file" name="file" required>
    
    <label for="date">اختر تاريخ:</label>
    <input type="date" id="date" name="date" required>
    
    <button type="submit" class="btn">رفع الملف</button>
</form>
<a href="{{ url_for('ornich', section=section, category=category) }}" class="btn back-btn">عودة</a>
{% endblock %}
```




```
<!-- templates/ornich_edit.html -->
{% extends "base.html" %}

{% block title %}تعديل الأورنيك - {{ category }}{% endblock %}

{% block content %}
<h2>تعديل الأورنيك - {{ category }}</h2>

<!-- Link to download the DOCX file -->
<a href="{{ docx_path }}" class="btn" download>تحميل ملف تعديل الأورنيك (.docx)</a>

<a href="{{ url_for('ornich', section=section, category=category) }}" class="btn back-btn">عودة</a>
{% endblock %}
```




```
<!-- templates/ornich_empty.html -->
{% extends "base.html" %}

{% block title %}اورنيك فارغ - {{ category }}{% endblock %}

{% block content %}
<h2>اورنيك فارغ - {{ category }}</h2>

<!-- Link to open PDF in a new tab -->
<a href="{{ pdf_path }}" target="_blank" class="btn">عرض PDF</a>

<!-- Embedding PDF within the page -->
<div class="pdf-viewer">
    <iframe src="{{ pdf_path }}" width="100%" height="600px">
        هذا المتصفح لا يدعم عرض ملفات PDF. يرجى تحميل الملف لعرضه: <a href="{{ pdf_path }}">تحميل PDF</a>.
    </iframe>
</div>

<a href="{{ url_for('ornich', section=section, category=category) }}" class="btn back-btn">عودة</a>
{% endblock %}
```




```
<!-- templates/ornich_works.html -->
{% extends "base.html" %}

{% block title %}الأعمال - {{ category }}{% endblock %}

{% block content %}
<h2>الأعمال - {{ category }}</h2>

{% if works %}
    {% for year, months in works.items() %}
        <!-- Year Foldable Section -->
        <button class="foldable-btn">{{ year }}</button>
        <div class="foldable-content">
            {% for month, days in months.items() %}
                <!-- Month Foldable Section -->
                <button class="foldable-btn month-btn">{{ month }}</button>
                <div class="foldable-content">
                    <ul>
                        {% for day_info in days %}
                            <li>
                                {{ day_info.day }}
                                {% if day_info.files %}
                                    <ul>
                                        {% for file in day_info.files %}
                                            <li>
                                                <a href="{{ file.url }}" target="_blank">{{ file.name }}</a>
                                            </li>
                                        {% endfor %}
                                    </ul>
                                {% else %}
                                    <p>لا توجد ملفات.</p>
                                {% endif %}
                            </li>
                        {% endfor %}
                    </ul>
                </div>
            {% endfor %}
        </div>
    {% endfor %}
{% else %}
    <p>لا توجد أعمال مرفوعة بعد.</p>
{% endif %}

<!-- Back Button -->
<a href="{{ url_for('ornich', section=section, category=category) }}" class="btn back-btn">عودة</a>
{% endblock %}
```




```
<!-- templates/records.html -->
{% extends "base.html" %}

{% block title %}السجلات - {{ category }}{% endblock %}

{% block content %}
<h2>السجلات - {{ category }}</h2>
<p>هنا سيتم عرض السجلات الخاصة بالفئة المحددة.</p>
<a href="{{ url_for('section_action', section=section, category=category, action='reports') }}" class="btn back-btn">عودة</a>
{% endblock %}
```




```
<!-- templates/reports.html -->
{% extends "base.html" %}

{% block title %}التقارير - {{ category }}{% endblock %}

{% block content %}
<h2>التقارير - {{ category }}</h2>
<form action="{{ url_for('submit_report') }}" method="POST">
    <label for="report_title">عنوان التقرير:</label>
    <input type="text" id="report_title" name="report_title" required>

    <label for="report_details">تفاصيل التقرير:</label>
    <textarea id="report_details" name="report_details" rows="4" required></textarea>

    <button type="submit" class="btn">إرسال</button>
</form>
<a href="{{ url_for('section_action', section=section, category=category, action='reports') }}" class="btn back-btn">عودة</a>
{% endblock %}
```





```
<!-- templates/section.html -->
{% extends "base.html" %}

{% block title %}{{ category }}{% endblock %}

{% block content %}
<h2>{{ category }}</h2>
<div class="button-container">
    <a href="{{ url_for('section_action', section=section, category=category, action='documents') }}" class="btn">المستندات</a>
    <a href="{{ url_for('section_action', section=section, category=category, action='information') }}" class="btn">المعلومات</a>
    <a href="{{ url_for('section_action', section=section, category=category, action='laws') }}" class="btn">القوانين والقرارات</a>
</div>
<a href="{{ url_for('category_page', section=section, category=category) }}" class="btn back-btn">عودة</a>
{% endblock %}
```



```
<!-- templates/404.html -->
{% extends "base.html" %}

{% block title %}صفحة غير موجودة{% endblock %}

{% block content %}
<h2>عذرًا، الصفحة غير موجودة.</h2>
<a href="{{ url_for('home') }}" class="btn back-btn">العودة إلى الصفحة الرئيسية</a>
{% endblock %}
```



```
<!-- templates/base.html -->
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}تطبيق Flask{% endblock %}</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}">
    <script src="{{ url_for('static', filename='js/scripts.js') }}" defer></script>
</head>
<body>
    <header>
        <h1>اسم التطبيق</h1>
        <nav>
            <a href="{{ url_for('home') }}">الصفحة الرئيسية</a>
        </nav>
    </header>
    <main>
        {% with messages = get_flashed_messages() %}
            {% if messages %}
                <ul class="flashes">
                    {% for message in messages %}
                        <li>{{ message }}</li>
                    {% endfor %}
                </ul>
            {% endif %}
        {% endwith %}
        {% block content %}
        {% endblock %}
    </main>
    <footer>
        <p>&copy; 2024 شركتك</p>
    </footer>
</body>
</html>
```



```
<!-- templates/documents.html -->
{% extends "base.html" %}

{% block title %}المستندات - {{ category }}{% endblock %}

{% block content %}
<h2>المستندات - {{ category }}</h2>
<div class="button-container">
    {% for btn in document_buttons %}
        {% if btn == 'الاورنيك' %}
            <a href="{{ url_for('ornich', section=section, category=category) }}" class="btn">{{ btn }}</a>
        {% elif btn == 'كشف التستيف' %}
            <a href="#" class="btn">كشف التستيف</a> <!-- Placeholder link -->
        {% elif btn == 'سجل العينات' %}
            <a href="#" class="btn">سجل العينات</a> <!-- Placeholder link -->
        {% elif btn == 'نتائج العينات' %}
            <a href="#" class="btn">نتائج العينات</a> <!-- Placeholder link -->
        {% else %}
            <a href="#" class="btn">{{ btn }}</a> <!-- Generic buttons -->
        {% endif %}
    {% endfor %}
</div>
<!-- Corrected Back Button -->
<a href="{{ url_for('category_page', section=section, category=category) }}" class="btn back-btn">عودة</a>
{% endblock %}
```



```
<!-- templates/health.html -->
{% extends "base.html" %}

{% block title %}صحة البيئة{% endblock %}

{% block content %}
<h2>صحة البيئة</h2>
<div class="button-container">
    {% for category in categories %}
        <a href="{{ url_for('category_page', section='health', category=category) }}" class="btn">{{ category }}</a>
    {% endfor %}
</div>
<a href="{{ url_for('home') }}" class="btn back-btn">عودة</a>
{% endblock %}
```



```
<!-- templates/index.html -->
{% extends "base.html" %}

{% block title %}الصفحة الرئيسية{% endblock %}

{% block content %}
<div class="button-container">
    <a href="{{ url_for('health') }}" class="btn">صحة البيئة</a>
    <a href="{{ url_for('occupational') }}" class="btn">السلامة المهنية</a>
</div>
{% endblock %}
```



```
<!-- templates/information.html -->
{% extends "base.html" %}

{% block title %}معلومات عن {{ category }}{% endblock %}

{% block content %}
<h2>معلومات عن {{ category }}</h2>

{% for sec in data.sections %}
    <div class="foldable">
        <button class="foldable-btn">{{ sec.title }}</button>
        <div class="foldable-content">
            {% for q in sec.questions %}
                <div class="question">
                    <button class="question-btn">{{ q.question }}</button>
                    <div class="answer">
                        <p>{{ q.answer }}</p>
                    </div>
                </div>
            {% endfor %}
        </div>
    </div>
{% endfor %}

<a href="{{ url_for('section_action', section=section, category=category, action='information') }}" class="btn back-btn">عودة</a>
{% endblock %}
```



```
<!-- templates/laws.html -->
{% extends "base.html" %}

{% block title %}القوانين والقرارات - {{ category }}{% endblock %}

{% block content %}
<h2>القوانين والقرارات - {{ category }}</h2>
<ul>
    {% for law in laws %}
        <li>{{ law }}</li>
    {% endfor %}
</ul>
<a href="{{ url_for('section_action', section=section, category=category, action='laws') }}" class="btn back-btn">عودة</a>
{% endblock %}
```


and here is the working solution of pdf viewer cause the current one does not work and there are a lot of solutions to it , but this one is the best 
```
<!-- pdf_viewer.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Dynamic PDF Viewer</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
            background-color: #f2f2f2;
        }
        .container {
            background-color: #fff;
            padding: 30px;
            border-radius: 8px;
            max-width: 800px;
            margin: auto;
            box-shadow: 0 2px 8px rgba(0,0,0,0.2);
        }
        h1 {
            text-align: center;
            color: #333;
        }
        input[type="file"] {
            display: block;
            margin: 20px auto;
        }
        .pdf-container {
            width: 100%;
            height: 800px;
            border: 1px solid #ccc;
            margin-top: 20px;
        }
        .hidden {
            display: none;
        }
        label {
            display: block;
            text-align: center;
            margin-top: 10px;
            color: #555;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Upload and View Your PDF</h1>
        
        <!-- File Input -->
        <input type="file" id="pdf-upload" accept="application/pdf">
        
        <!-- PDF Viewer -->
        <canvas id="pdf-render" class="pdf-container hidden"></canvas>
        <embed id="embed-viewer" class="pdf-container hidden" type="application/pdf">
        
        <!-- Fallback Message -->
        <label id="message"></label>
    </div>
    
    <!-- Include PDF.js Library (Optional for Enhanced Functionality) -->
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.15.349/pdf.min.js"></script> -->
    
    <script>
        const pdfUpload = document.getElementById('pdf-upload');
        const embedViewer = document.getElementById('embed-viewer');
        const pdfRender = document.getElementById('pdf-render');
        const messageLabel = document.getElementById('message');
        
        pdfUpload.addEventListener('change', function(event) {
            const file = event.target.files[0];
            
            if (file && file.type === 'application/pdf') {
                const fileURL = URL.createObjectURL(file);
                
                // Option 1: Using <embed> tag
                embedViewer.src = fileURL;
                embedViewer.classList.remove('hidden');
                pdfRender.classList.add('hidden');
                messageLabel.textContent = '';
                
                // Option 2: Using PDF.js for enhanced functionality
                // Uncomment the PDF.js related code below if you prefer using PDF.js
                
                /*
                embedViewer.classList.add('hidden');
                pdfRender.classList.remove('hidden');
                messageLabel.textContent = 'Rendering PDF with PDF.js...';
                
                const pdfjsLib = window['pdfjs-dist/build/pdf'];
                pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.15.349/pdf.worker.min.js';
                
                const loadingTask = pdfjsLib.getDocument(fileURL);
                loadingTask.promise.then(function(pdf) {
                    console.log('PDF loaded');
                    
                    // Fetch the first page
                    const pageNumber = 1;
                    pdf.getPage(pageNumber).then(function(page) {
                        console.log('Page loaded');
                        
                        const scale = 1.5;
                        const viewport = page.getViewport({ scale: scale });
                        
                        // Prepare canvas using PDF page dimensions
                        const context = pdfRender.getContext('2d');
                        pdfRender.height = viewport.height;
                        pdfRender.width = viewport.width;
                        
                        // Render PDF page into canvas context
                        const renderContext = {
                            canvasContext: context,
                            viewport: viewport
                        };
                        const renderTask = page.render(renderContext);
                        renderTask.promise.then(function () {
                            console.log('Page rendered');
                            messageLabel.textContent = '';
                        });
                    });
                }, function (reason) {
                    // PDF loading error
                    console.error(reason);
                    messageLabel.textContent = 'Error loading PDF.';
                });
                */
                
            } else {
                alert('Please select a valid PDF file.');
                embedViewer.classList.add('hidden');
                pdfRender.classList.add('hidden');
                messageLabel.textContent = '';
            }
        });
    </script>
</body>
</html>
```


solution.py
```
import os
import webbrowser
import sys

def open_pdf_viewer():
    # Get the current script directory
    script_dir = os.path.dirname(os.path.abspath(__file__))
    
    # Path to the HTML file
    html_file = os.path.join(script_dir, 'pdf_viewer.html')
    
    # Check if the HTML file exists
    if not os.path.isfile(html_file):
        print(f"Error: '{html_file}' does not exist.")
        sys.exit(1)
    
    # Create a file URL
    file_url = f'file://{html_file}'
    
    # Open the HTML file in the default web browser
    webbrowser.open(file_url)

if __name__ == "__main__":
    open_pdf_viewer()
```


please use the new solution i provided here to preview the pdf files whenver it appears at any place in this project 
if you change or edit a code in a certain file, please provide that file whole new code full, not just a snippet 
if you did not change or edit a code in a certain file, please only mention the file name and say it was not chhanged 
thank you