fixing admin tables not beeing responsive

admin/backorders.php

@@ -88,6 +88,7 @@ foreach ($summaryRows as $row) {
     $summaryTotal += $row['quantity'];
 }
 
+$bodyClass = 'admin-page';
 include __DIR__ . '/../includes/header.php';
 ?>
 
@@ -127,6 +128,7 @@ include __DIR__ . '/../includes/header.php';
 <?php if (!empty($summaryRows)): ?>
     <div class="panel">
         <h3>Übersicht Vorbestellte Artikel</h3>
+        <div class="table-responsive">
         <table class="table-compact">
             <thead>
                 <tr>
@@ -145,6 +147,7 @@ include __DIR__ . '/../includes/header.php';
                 <?php endforeach; ?>
             </tbody>
         </table>
+        </div>
         <p class="mt-2"><strong>Gesamt:</strong> <?php echo (int)$summaryTotal; ?> Artikel</p>
     </div>
 <?php endif; ?>
@@ -154,19 +157,20 @@ include __DIR__ . '/../includes/header.php';
         <p>Keine Vorbestellungen gefunden.</p>
     </div>
 <?php else: ?>
-    <table>
-        <thead>
-            <tr>
-                <th>Bestellnummer</th>
-                <th>Kunde</th>
-                <th>E-Mail</th>
-                <th>Artikel</th>
-                <th>Erstellt</th>
-                <th>Status</th>
-                <th>Aktionen</th>
-            </tr>
-        </thead>
-        <tbody>
+    <div class="table-responsive">
+        <table>
+            <thead>
+                <tr>
+                    <th>Bestellnummer</th>
+                    <th>Kunde</th>
+                    <th>E-Mail</th>
+                    <th>Artikel</th>
+                    <th>Erstellt</th>
+                    <th>Status</th>
+                    <th>Aktionen</th>
+                </tr>
+            </thead>
+            <tbody>
             <?php foreach ($reservations as $reservation): ?>
                 <tr>
                     <td><strong><?php echo htmlspecialchars($reservation['id']); ?></strong></td>
@@ -202,8 +206,9 @@ include __DIR__ . '/../includes/header.php';
                     </td>
                 </tr>
             <?php endforeach; ?>
-        </tbody>
-    </table>
+            </tbody>
+        </table>
+    </div>
 <?php endif; ?>
 
 <!-- Details Modal -->

admin/index.php

@@ -44,6 +44,7 @@ $openPreorders = array_values(array_filter($backorderReservations, function($r)
 }));
 $openBackorders = count($openPreorders);
 
+$bodyClass = 'admin-page';
 include __DIR__ . '/../includes/header.php';
 ?>
 
@@ -92,40 +93,42 @@ if (empty($openReservationsList)):
 ?>
     <p>Keine offenen Reservierungen vorhanden.</p>
 <?php else: ?>
-    <table>
-        <thead>
-            <tr>
-                <th>Bestellnummer</th>
-                <th>Kunde</th>
-                <th>Erstellt</th>
-                <th>Status</th>
-                <th>Aktionen</th>
-            </tr>
-        </thead>
-        <tbody>
-            <?php foreach ($openReservationsList as $reservation): ?>
+    <div class="table-responsive">
+        <table>
+            <thead>
                 <tr>
-                    <td><strong><?php echo htmlspecialchars($reservation['id']); ?></strong></td>
-                    <td><?php echo htmlspecialchars($reservation['customer_name']); ?></td>
-                    <td><?php echo formatDate($reservation['created']); ?></td>
-                    <td>
-                        <?php
-                        if ($reservation['picked_up']) {
-                            echo '<span class="status status-picked">Abgeholt</span>';
-                        } elseif ($reservation['status'] === 'expired') {
-                            echo '<span class="status status-expired">Abgelaufen</span>';
-                        } else {
-                            echo '<span class="status status-open">Offen</span>';
-                        }
-                        ?>
-                    </td>
-                    <td>
-                        <a href="reservations.php?order_number=<?php echo urlencode($reservation['id']); ?>" class="btn btn-small">Details</a>
-                    </td>
+                    <th>Bestellnummer</th>
+                    <th>Kunde</th>
+                    <th>Erstellt</th>
+                    <th>Status</th>
+                    <th>Aktionen</th>
                 </tr>
-            <?php endforeach; ?>
-        </tbody>
-    </table>
+            </thead>
+            <tbody>
+                <?php foreach ($openReservationsList as $reservation): ?>
+                    <tr>
+                        <td><strong><?php echo htmlspecialchars($reservation['id']); ?></strong></td>
+                        <td><?php echo htmlspecialchars($reservation['customer_name']); ?></td>
+                        <td><?php echo formatDate($reservation['created']); ?></td>
+                        <td>
+                            <?php
+                            if ($reservation['picked_up']) {
+                                echo '<span class="status status-picked">Abgeholt</span>';
+                            } elseif ($reservation['status'] === 'expired') {
+                                echo '<span class="status status-expired">Abgelaufen</span>';
+                            } else {
+                                echo '<span class="status status-open">Offen</span>';
+                            }
+                            ?>
+                        </td>
+                        <td>
+                            <a href="reservations.php?order_number=<?php echo urlencode($reservation['id']); ?>" class="btn btn-small">Details</a>
+                        </td>
+                    </tr>
+                <?php endforeach; ?>
+            </tbody>
+        </table>
+    </div>
 <?php endif; ?>
 
 <h3 style="margin-top: 2rem;">Offene Vorbestellungen</h3>
@@ -135,38 +138,40 @@ if (empty($openPreordersList)):
 ?>
     <p>Keine offenen Vorbestellungen vorhanden.</p>
 <?php else: ?>
-    <table>
-        <thead>
-            <tr>
-                <th>Bestellnummer</th>
-                <th>Kunde</th>
-                <th>Erstellt</th>
-                <th>Status</th>
-                <th>Aktionen</th>
-            </tr>
-        </thead>
-        <tbody>
-            <?php foreach ($openPreordersList as $reservation): ?>
+    <div class="table-responsive">
+        <table>
+            <thead>
                 <tr>
-                    <td><strong><?php echo htmlspecialchars($reservation['id']); ?></strong></td>
-                    <td><?php echo htmlspecialchars($reservation['customer_name']); ?></td>
-                    <td><?php echo formatDate($reservation['created']); ?></td>
-                    <td>
-                        <?php
-                        if (isset($reservation['backorder_status']) && $reservation['backorder_status'] === 'notified') {
-                            echo '<span class="status status-notified">Informiert</span>';
-                        } else {
-                            echo '<span class="status status-open">Offen</span>';
-                        }
-                        ?>
-                    </td>
-                    <td>
-                        <a href="backorders.php?order_number=<?php echo urlencode($reservation['id']); ?>" class="btn btn-small">Details</a>
-                    </td>
+                    <th>Bestellnummer</th>
+                    <th>Kunde</th>
+                    <th>Erstellt</th>
+                    <th>Status</th>
+                    <th>Aktionen</th>
                 </tr>
-            <?php endforeach; ?>
-        </tbody>
-    </table>
+            </thead>
+            <tbody>
+                <?php foreach ($openPreordersList as $reservation): ?>
+                    <tr>
+                        <td><strong><?php echo htmlspecialchars($reservation['id']); ?></strong></td>
+                        <td><?php echo htmlspecialchars($reservation['customer_name']); ?></td>
+                        <td><?php echo formatDate($reservation['created']); ?></td>
+                        <td>
+                            <?php
+                            if (isset($reservation['backorder_status']) && $reservation['backorder_status'] === 'notified') {
+                                echo '<span class="status status-notified">Informiert</span>';
+                            } else {
+                                echo '<span class="status status-open">Offen</span>';
+                            }
+                            ?>
+                        </td>
+                        <td>
+                            <a href="backorders.php?order_number=<?php echo urlencode($reservation['id']); ?>" class="btn btn-small">Details</a>
+                        </td>
+                    </tr>
+                <?php endforeach; ?>
+            </tbody>
+        </table>
+    </div>
 <?php endif; ?>
 
 <?php include __DIR__ . '/../includes/footer.php'; ?>

admin/reservations.php

@@ -57,6 +57,7 @@ if ($searchOrderNumber) {
 
 $reservations = array_reverse($reservations); // Newest first
 
+$bodyClass = 'admin-page';
 include __DIR__ . '/../includes/header.php';
 ?>
 
@@ -100,20 +101,21 @@ include __DIR__ . '/../includes/header.php';
         <p>Keine Reservierungen gefunden.</p>
     </div>
 <?php else: ?>
-    <table>
-        <thead>
-            <tr>
-                <th>Bestellnummer</th>
-                <th>Kunde</th>
-                <th>E-Mail</th>
-                <th>Artikel</th>
-                <th>Erstellt</th>
-                <th>Gültig bis</th>
-                <th>Status</th>
-                <th>Aktionen</th>
-            </tr>
-        </thead>
-        <tbody>
+    <div class="table-responsive">
+        <table>
+            <thead>
+                <tr>
+                    <th>Bestellnummer</th>
+                    <th>Kunde</th>
+                    <th>E-Mail</th>
+                    <th>Artikel</th>
+                    <th>Erstellt</th>
+                    <th>Gültig bis</th>
+                    <th>Status</th>
+                    <th>Aktionen</th>
+                </tr>
+            </thead>
+            <tbody>
             <?php foreach ($reservations as $reservation): ?>
                 <tr>
                     <td><strong><?php echo htmlspecialchars($reservation['id']); ?></strong></td>
@@ -152,8 +154,9 @@ include __DIR__ . '/../includes/header.php';
                     </td>
                 </tr>
             <?php endforeach; ?>
-        </tbody>
-    </table>
+            </tbody>
+        </table>
+    </div>
 <?php endif; ?>
 
 <!-- Details Modal -->

assets/css/style.css

@@ -296,6 +296,32 @@ table tr:hover {
     background-color: var(--brand-surface-alt);
 }
 
+/* Responsive table wrapper: full width, horizontal scroll when needed, cell wrapping */
+.table-responsive {
+    width: 100%;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+    margin-bottom: 1.5rem;
+}
+
+.table-responsive table {
+    width: 100%;
+}
+
+.table-responsive th,
+.table-responsive td {
+    word-break: break-word;
+    overflow-wrap: break-word;
+    white-space: normal;
+}
+
+/* Admin: use more horizontal space so tables fit */
+body.admin-page .container {
+    max-width: none;
+    padding-left: 1rem;
+    padding-right: 1rem;
+}
+
 /* Alerts */
 .alert {
     padding: 1rem;
@@ -600,6 +626,18 @@ footer {
     .admin-stats {
         grid-template-columns: 1fr;
     }
+    
+    /* Admin tables: use full width, allow buttons to wrap */
+    body.admin-page .table-responsive {
+        margin-left: -1rem;
+        margin-right: -1rem;
+        padding-left: 1rem;
+        padding-right: 1rem;
+    }
+    
+    .table-responsive .btn {
+        white-space: normal;
+    }
 }
 
 @media (max-width: 480px) {
@@ -623,6 +661,11 @@ footer {
         grid-template-columns: 1fr;
         gap: 1rem;
     }
+    
+    /* Very narrow: admin tables scroll so columns stay readable */
+    .table-responsive table {
+        min-width: 520px;
+    }
 }
 
 /* Utility Classes */

includes/header.php

@@ -6,7 +6,7 @@
     <title><?php echo isset($pageTitle) ? $pageTitle . ' - ' : ''; ?><?php echo SITE_NAME; ?></title>
     <link rel="stylesheet" href="<?php echo SITE_URL; ?>/assets/css/style.css">
 </head>
-<body>
+<body class="<?php echo isset($bodyClass) ? htmlspecialchars($bodyClass) : ''; ?>">
     <header class="site-header">
         <div class="container header-inner">
             <a class="brand" href="<?php echo SITE_URL; ?>/index.php">