fix(layout): pin copyright footer to bottom on blank pages and all screen sizes

app/Views/medical/dashboard.php

@@ -95,5 +95,5 @@
 </div>
 
 <section class="section">
-    <div id="medical-main" class="pt-1"></div>
+    <div id="medical-main" class="pt-1" style="min-height: calc(100vh - 160px);"></div>
 </section>

app/Views/welcome_message.php

@@ -36,6 +36,26 @@
     <link href="<?= base_url('assets/css/style.css') ?>" rel="stylesheet">
     <link href="<?= base_url('assets/css/custom-theme-dark-borders.css') ?>" rel="stylesheet">
 
+    <style>
+        /* Sticky footer layout: keeps footer pinned to the bottom on all screen sizes */
+        html, body {
+            height: 100%;
+        }
+        body {
+            min-height: 100vh;
+            display: flex;
+            flex-direction: column;
+        }
+        #main {
+            flex: 1 0 auto;
+            min-height: calc(100vh - 130px);
+        }
+        #footer {
+            margin-top: auto;
+            flex-shrink: 0;
+        }
+    </style>
+
     <script>
         (function() {
             var checkingSession = false;

public/assets/css/style.css

@@ -13,10 +13,18 @@
   scroll-behavior: smooth;
 }
 
+html,
+body {
+  height: 100%;
+}
+
 body {
   font-family: "Open Sans", sans-serif;
   background: #f6f9ff;
   color: #444444;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
 }
 
 a {
@@ -45,6 +53,8 @@ h6 {
   margin-top: 60px;
   padding: 20px 30px;
   transition: all 0.3s;
+  flex: 1 0 auto;
+  min-height: calc(100vh - 130px);
 }
 
 @media (max-width: 1199px) {
@@ -1233,6 +1243,8 @@ h6 {
   font-size: 14px;
   transition: all 0.3s;
   border-top: 1px solid #cddfff;
+  margin-top: auto;
+  flex-shrink: 0;
 }
 
 .footer .copyright {