diff --git a/app/Views/ticket_type_modal.php b/app/Views/ticket_type_modal.php
index 4a4728b1..6120833d 100644
--- a/app/Views/ticket_type_modal.php
+++ b/app/Views/ticket_type_modal.php
@@ -1,3 +1,54 @@
+<style>
+/* ----- Modal Size: 25% width + 25% height ----- */
+#New_Ticket_modal .modal-dialog {
+    width: 15%;
+    max-width: 15%;
+    height: 25%;
+    max-height: 25%;
+    margin: auto !important;
+}
+
+
+/* Make modal-content fill the dialog & allow flex layout */
+#New_Ticket_modal .modal-content {
+    height: 50%;
+    display: flex;
+    flex-direction: column;
+}
+
+/* Scroll only inside body */
+#New_Ticket_modal .modal-body {
+    flex: 1;
+    overflow-y: auto;
+    padding: 10px;
+}
+
+/* Footer visible always */
+#New_Ticket_modal .modal-footer {
+       position: sticky;
+        bottom: 0;
+        background: #fff;
+        padding: 10px;
+}
+
+/* ----- Small Height Screens Fix ----- */
+@media (max-height: 300px) {
+
+    /* Make modal usable but still centered */
+    #New_Ticket_modal .modal-dialog {
+        width: 50%;
+        max-width: 50%;
+        height: 70%;
+        max-height: 70%;
+    }
+
+    /* Adjust body scroll area */
+    #New_Ticket_modal .modal-body {
+        max-height: calc(80vh - 120px);
+    }
+}
+</style>
+
 <div class="modal fade" id="New_Ticket_modal" tabindex="-1" role="dialog" aria-hidden="true">
     <div class="modal-dialog modal-dialog-centered">
         <div class="modal-content">