Index: interfejs/store-employee.html
===================================================================
--- interfejs/store-employee.html	(revision 69f2a41cff81a4c7825abb68eb0f0eff6818e4e5)
+++ interfejs/store-employee.html	(revision 79fff4f76fca5f42403a3ec1f9b04e1e66fd372d)
@@ -18,4 +18,6 @@
             <li><a href="products.html">Products</a></li>
             <li><a href="#" id="dashboard-link" class="active">Employee</a></li>
+            <li><a href="change-password.html" class="change-password-btn">🔑 Change Password</a></li>
+            <li><a href="#" id="logout-link">Logout</a></li>
         </ul>
     </nav>
@@ -170,4 +172,5 @@
 </main>
 
+<!-- Respond to Request Modal -->
 <div id="respond-request-modal" class="modal" style="display: none;">
     <div class="modal-content">
@@ -176,10 +179,8 @@
         <form id="respond-request-form" class="form">
             <input type="hidden" id="respond-request-num">
-
             <div class="form-group">
                 <label for="request-response">Your Response</label>
                 <textarea id="request-response" rows="4" required></textarea>
             </div>
-
             <div class="form-group">
                 <label for="request-status">Update Status</label>
@@ -190,5 +191,4 @@
                 </select>
             </div>
-
             <button type="submit" class="btn-primary">Submit Response</button>
         </form>
@@ -196,4 +196,5 @@
 </div>
 
+<!-- Process Refund Modal -->
 <div id="process-refund-modal" class="modal" style="display: none;">
     <div class="modal-content">
@@ -202,5 +203,4 @@
         <form id="process-refund-form" class="form">
             <input type="hidden" id="process-refund-id">
-
             <div class="form-group">
                 <label for="refund-action">Action</label>
@@ -210,10 +210,8 @@
                 </select>
             </div>
-
             <div class="form-group">
                 <label for="refund-notes">Notes</label>
                 <textarea id="refund-notes" rows="3"></textarea>
             </div>
-
             <button type="submit" class="btn-primary">Process Refund</button>
         </form>
@@ -244,4 +242,5 @@
     document.addEventListener('DOMContentLoaded', async () => {
         const user = await loadUserData();
+
         if (!user || user.userType !== 'store_employee') {
             window.location.href = 'index.html';
@@ -250,4 +249,10 @@
 
         document.getElementById('employee-name').textContent = `${user.firstName} ${user.lastName || ''}`;
+
+        // Logout functionality
+        document.getElementById('logout-link').addEventListener('click', async (e) => {
+            e.preventDefault();
+            await logout();
+        });
 
         // Load stores
@@ -277,4 +282,5 @@
                 document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
                 document.querySelectorAll('.tab-content').forEach(c => c.classList.remove('active'));
+
                 btn.classList.add('active');
                 document.getElementById(`${btn.dataset.tab}-tab`).classList.add('active');
@@ -316,4 +322,5 @@
                 // Display tasks
                 const tasksList = document.getElementById('tasks-list');
+
                 if (data.tasks.pending_orders.length > 0 || data.tasks.pending_requests.length > 0 || data.tasks.pending_refunds.length > 0) {
                     let tasksHtml = '<div class="task-items">';
@@ -323,9 +330,9 @@
                         data.tasks.pending_orders.forEach(order => {
                             tasksHtml += `
-                                    <div class="task-item">
-                                        <p><strong>Order #${order.order_num}</strong> - ${order.first_name} ${order.last_name}</p>
-                                        <button class="btn-small" onclick="updateOrderStatus('${order.order_num}')">Update Status</button>
-                                    </div>
-                                `;
+                                <div class="task-item">
+                                    <p><strong>Order #${order.order_num}</strong> - ${order.first_name} ${order.last_name}</p>
+                                    <button class="btn-small" onclick="updateOrderStatus('${order.order_num}')">Update Status</button>
+                                </div>
+                            `;
                         });
                     }
@@ -335,10 +342,10 @@
                         data.tasks.pending_requests.forEach(request => {
                             tasksHtml += `
-                                    <div class="task-item">
-                                        <p><strong>Request #${request.request_num}</strong> - ${request.first_name} ${request.last_name}</p>
-                                        <p>${request.problem.substring(0, 50)}${request.problem.length > 50 ? '...' : ''}</p>
-                                        <button class="btn-small" onclick="respondToRequest('${request.request_num}')">Respond</button>
-                                    </div>
-                                `;
+                                <div class="task-item">
+                                    <p><strong>Request #${request.request_num}</strong> - ${request.first_name} ${request.last_name}</p>
+                                    <p>${request.problem.substring(0, 50)}${request.problem.length > 50 ? '...' : ''}</p>
+                                    <button class="btn-small" onclick="respondToRequest('${request.request_num}')">Respond</button>
+                                </div>
+                            `;
                         });
                     }
@@ -348,10 +355,10 @@
                         data.tasks.pending_refunds.forEach(refund => {
                             tasksHtml += `
-                                    <div class="task-item">
-                                        <p><strong>Refund #${refund.refund_id}</strong> - Order #${refund.order_num}</p>
-                                        <p>Amount: $${parseFloat(refund.amount).toFixed(2)}</p>
-                                        <button class="btn-small" onclick="processRefund('${refund.refund_id}')">Process</button>
-                                    </div>
-                                `;
+                                <div class="task-item">
+                                    <p><strong>Refund #${refund.refund_id}</strong> - Order #${refund.order_num}</p>
+                                    <p>Amount: $${parseFloat(refund.amount).toFixed(2)}</p>
+                                    <button class="btn-small" onclick="processRefund('${refund.refund_id}')">Process</button>
+                                </div>
+                            `;
                         });
                     }
@@ -374,21 +381,23 @@
 
             const tbody = document.getElementById('orders-list');
+
             if (data.success && data.orders.length > 0) {
                 tbody.innerHTML = data.orders.map(order => {
                     const total = order.items ? order.items.reduce((sum, item) =>
                         sum + (item.price * item.quantity), 0) : 0;
+
                     return `
-                            <tr>
-                                <td>${order.order_num}</td>
-                                <td>${order.first_name} ${order.last_name}</td>
-                                <td>${new Date(order.order_date).toLocaleDateString()}</td>
-                                <td><span class="status-badge status-${order.status}">${order.status}</span></td>
-                                <td>$${total.toFixed(2)}</td>
-                                <td>
-                                    <button class="btn-small" onclick="updateOrderStatus('${order.order_num}')">Update</button>
-                                    <button class="btn-small" onclick="viewOrderDetails('${order.order_num}')">View</button>
-                                </td>
-                            </tr>
-                        `;
+                        <tr>
+                            <td>${order.order_num}</td>
+                            <td>${order.first_name} ${order.last_name}</td>
+                            <td>${new Date(order.order_date).toLocaleDateString()}</td>
+                            <td><span class="status-badge status-${order.status}">${order.status}</span></td>
+                            <td>$${total.toFixed(2)}</td>
+                            <td>
+                                <button class="btn-small" onclick="updateOrderStatus('${order.order_num}')">Update</button>
+                                <button class="btn-small" onclick="viewOrderDetails('${order.order_num}')">View</button>
+                            </td>
+                        </tr>
+                    `;
                 }).join('');
             } else {
@@ -417,16 +426,17 @@
 
             const tbody = document.getElementById('products-list');
+
             if (data.success && data.products.length > 0) {
                 tbody.innerHTML = data.products.map(product => `
-                        <tr>
-                            <td>${product.code}</td>
-                            <td>${product.description.substring(0, 30)}${product.description.length > 30 ? '...' : ''}</td>
-                            <td>$${parseFloat(product.price).toFixed(2)}</td>
-                            <td>${product.availability}</td>
-                            <td>
-                                <button class="btn-small" onclick="viewProduct('${product.code}')">View</button>
-                            </td>
-                        </tr>
-                    `).join('');
+                    <tr>
+                        <td>${product.code}</td>
+                        <td>${product.description.substring(0, 30)}${product.description.length > 30 ? '...' : ''}</td>
+                        <td>$${parseFloat(product.price).toFixed(2)}</td>
+                        <td>${product.availability}</td>
+                        <td>
+                            <button class="btn-small" onclick="viewProduct('${product.code}')">View</button>
+                        </td>
+                    </tr>
+                `).join('');
             } else {
                 tbody.innerHTML = '<tr><td colspan="5">No products found</td></tr>';
