webupdate

website/public/assets/css/modern-theme.css

@@ -370,10 +370,10 @@ body {
   transition: var(--transition-fast);
 }
 
-/* Mobile Navigation - Slide from Right (Half Screen) */
-@media (max-width: 992px) {
+/* Mobile Navigation - Slide from Right (all devices up to 1024px including iPads) */
+@media (max-width: 1024px) {
   .nav-mobile-toggle {
-    display: flex;
+    display: flex !important;
   }
   
   .nav-menu {
@@ -381,14 +381,13 @@ body {
     top: 0;
     right: 0;
     bottom: 0;
-    width: 50%;
-    min-width: 200px;
-    max-width: 300px;
+    width: 320px;
+    max-width: 80%;
     flex-direction: column;
     background: var(--bg-white);
     padding: 80px var(--spacing-lg) var(--spacing-xl);
     gap: var(--spacing-xs);
-    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.1);
+    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
     transform: translateX(100%);
     visibility: hidden;
     transition: transform 0.3s ease, visibility 0.3s ease;
@@ -402,9 +401,10 @@ body {
   
   .nav-link {
     width: 100%;
-    padding: var(--spacing-sm) var(--spacing-md);
+    padding: var(--spacing-md) var(--spacing-lg);
     text-align: left;
     border-radius: var(--radius-sm);
+    font-size: 1.1rem;
   }
   
   .nav-link:hover {
@@ -828,6 +828,9 @@ body {
 
 .product-info {
   padding: var(--spacing-lg);
+  flex: 1;
+  display: flex;
+  flex-direction: column;
 }
 
 .product-category {
@@ -883,6 +886,7 @@ body {
   justify-content: space-between;
   padding: var(--spacing-md) var(--spacing-lg);
   border-top: 1px solid var(--border-light);
+  margin-top: auto;
 }
 
 .product-stock {