Improve mobile responsiveness - touch targets, better grids, smaller screens

resources/views/videos/show.blade.php

@@ -492,3 +492,33 @@
         });
     </script>
 @endsection
+
+    <!-- Extra Mobile Styles -->
+    <style>
+        @media (max-width: 400px) {
+            .video-layout-container {
+                padding: 0 !important;
+            }
+            .video-title {
+                font-size: 15px !important;
+                padding: 0 4px;
+            }
+            .video-stats-left {
+                font-size: 12px;
+            }
+            .video-description-box {
+                margin: 12px 4px;
+                padding: 10px !important;
+            }
+            .comments-section {
+                margin-top: 16px;
+                padding: 12px 4px;
+            }
+            .comment-form {
+                flex-direction: column;
+            }
+            .comment-form > img {
+                display: none;
+            }
+        }
+    </style>