1. Fix(CSS): Styles improved across all pages. \n 2. Fix(SQL): User authentication correction for demo account with user role.

static/css/layouts/table-main.css

@@ -1,8 +1,13 @@
 
+#formFilters {
+    padding: 0.5vh 1vw;
+    margin-top: 1vh;
+}
+
 #tableMain {
     overflow-x: auto;
-    padding: 1vh;
-    max-width: 95vw; /* min(calc(1vh * 80), calc(1vw * 90)); */
+    padding: 1vh 1vw;
+    max-width: 88vw; /* min(calc(1vh * 80), calc(1vw * 90)); */
     width: min-content;
     align-items: normal;
     justify-content: normal;
@@ -12,13 +17,21 @@
     padding: 0.25vh 0.5vh;
 }
 
-#tableMain tbody{
-    max-height: 53vh;
+#tableMain thead {
+    max-height: 4vh;
+    overflow-y: visible;
+}
+
+#tableMain tbody {
+    max-height: 60vh;
     overflow-y: auto;
     min-width: fit-content;
     max-width: fit-content;
     overflow-x: visible;
 }
+#tableMain tbody.is_collapsed {
+    display: block;
+}
 #tableMain:has(tbody > div) tbody {
 }
 #tableMain tbody > div {
@@ -33,7 +46,7 @@
     align-self: center;
     position: relative;
     display: block;
-    width: 90vh;
+    width: min(calc(90vh), calc(70vw));
 }
 
 #tableMain select, 
@@ -97,4 +110,21 @@
 
 #container-template-elements {
     display: none;
+}
+
+
+@media screen and (max-width: 850px) {
+}
+@media screen and (max-width: 400px) {
+    #formFilters input[type="text"],
+    #formFilters select {
+        width: 15vh;
+        /* height: 3vh; */
+    }
+    #tableMain {
+        max-height: 60vh;
+    }
+    #tableMain tbody {
+        max-height: 53vh;
+    }
 }