diff --git a/components/MonitorPasien/ticketCard.vue b/components/MonitorPasien/ticketCard.vue
index 51098bd..d98d857 100644
--- a/components/MonitorPasien/ticketCard.vue
+++ b/components/MonitorPasien/ticketCard.vue
@@ -1,6 +1,6 @@
 <template>
     <v-card 
-        class="pa-4 rounded-lg elevation-2 d-flex flex-column" 
+        class="pa-4 rounded-lg elevation-2 d-flex flex-column ticket-card" 
         color="white" 
         style="border-top: 8px solid #FFB95F;" 
         height="100%" 
@@ -12,7 +12,7 @@
 
         <v-divider class="mb-4"></v-divider>
         
-        <div class="timeline-scroll-container"> 
+        <div class="timeline-scroll-container flex-grow-1"> 
             <v-timeline density="compact" align="start" line-inset="12" line-color="#FFB95F">
                 <v-timeline-item
                     v-for="(step, index) in steps"
@@ -43,7 +43,7 @@
             size="large" 
             variant="tonal" 
             color="#FFA532" 
-            class="mt-auto font-weight-bold" 
+            class="mt-auto font-weight-bold reprint-button" 
             prepend-icon="mdi-printer"
             block
         >
@@ -91,8 +91,10 @@ const getStepColor = (index) => {
 /* SCROLLABLE TIMELINE STYLES (Menggunakan Tinggi Tetap) */
 /* =============================================== */
 .timeline-scroll-container {
-    /* Tinggi Tetap: Memastikan tinggi card konsisten di semua skenario responsive */
-    height: 320px;
+    /* Flex grow untuk mengisi ruang yang tersedia */
+    flex: 1 1 auto;
+    min-height: 200px;
+    max-height: 400px;
     
     /* Membuat konten scrollable di sumbu Y jika melebihi height */
     overflow-y: auto;
@@ -127,4 +129,26 @@ const getStepColor = (index) => {
 .v-timeline-item :deep(.v-timeline-item__opposite) {
     display: none;
 }
+
+/* =============================================== */
+/* TICKET CARD - FIXED HEIGHT */
+/* =============================================== */
+.ticket-card {
+    min-height: 550px !important;
+    display: flex !important;
+    flex-direction: column !important;
+}
+
+/* =============================================== */
+/* REPRINT BUTTON - FIXED SIZE */
+/* =============================================== */
+.reprint-button {
+    min-height: 48px !important;
+    height: 48px !important;
+    max-height: 48px !important;
+    font-size: 14px !important;
+    letter-spacing: 0.5px;
+    flex-shrink: 0 !important;
+    margin-top: auto !important;
+}
 </style>
\ No newline at end of file
diff --git a/nuxt.config.ts b/nuxt.config.ts
index e9c394a..c4bbda4 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -95,8 +95,8 @@ export default defineNuxtConfig({
   ],
 
   devServer: {
-    port: 3001,
-    host: 'localhost'
+    port: 3000,
+    host: '0.0.0.0'
   },
 
   vite: {
diff --git a/package.json b/package.json
index 48be317..17338bd 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,7 @@
     "_command_dev": "nuxt dev -o --host --port 3000",
     "_command_dev2": "nuxt dev -o --port 3000",
     "dev": "nuxt dev -o",
-    "dev:https": "nuxt dev -o --host localhost --port 3000",
+    "dev:https": "nuxt dev -o --host 0.0.0.0 --port 3000",
     "generate": "nuxt generate",
     "preview": "nuxt preview",
     "postinstall": "nuxt prepare"
diff --git a/pages/MonitoringPasien/pasien/[id].vue b/pages/MonitoringPasien/pasien/[id].vue
index 0955d28..37f006b 100644
--- a/pages/MonitoringPasien/pasien/[id].vue
+++ b/pages/MonitoringPasien/pasien/[id].vue
@@ -102,7 +102,7 @@
             cols="12" 
             sm="6"    
             md="4"   
-            lg="3"
+            lg="4"
         >
           <MonitorPasienTicketCard 
             :title="ticket.title" 
diff --git a/server/api/auth/keycloak-callback.get.ts b/server/api/auth/keycloak-callback.get.ts
index f9f1b1f..691c085 100644
--- a/server/api/auth/keycloak-callback.get.ts
+++ b/server/api/auth/keycloak-callback.get.ts
@@ -1,11 +1,12 @@
 // server/api/auth/keycloak-callback.ts - EXTENDED SESSION FIX
 
 // Add this at the top of the file (after imports)
-const SESSION_DURATION = 1 * 60 * 60; // 7 days in seconds (customize as needed)
+const SESSION_DURATION = 1 * 60 * 60; // 1 hour in seconds (3600 seconds)
 // Or use one of these alternatives:
 // const SESSION_DURATION = 24 * 60 * 60;        // 1 day
 // const SESSION_DURATION = 30 * 24 * 60 * 60;   // 30 days
 // const SESSION_DURATION = 12 * 60 * 60;        // 12 hours
+// const SESSION_DURATION = 7 * 24 * 60 * 60;   // 7 days
 
 export default defineEventHandler(async (event) => {
     try {
diff --git a/server/api/auth/logout.post.ts b/server/api/auth/logout.post.ts
index 85cf8cf..18c9dbc 100644
--- a/server/api/auth/logout.post.ts
+++ b/server/api/auth/logout.post.ts
@@ -37,21 +37,31 @@ export default defineEventHandler(async (event) => {
     console.log('✅ Session cleared successfully');
 
     // Construct the Keycloak logout URL with proper parameters
+    // IMPORTANT: The post_logout_redirect_uri must be registered in Keycloak client settings
     const logoutUrl = new URL(`${config.keycloakIssuer}/protocol/openid-connect/logout`);
     
-    // Add required parameters for proper Keycloak logout - REDIRECT TO LOGIN PAGE
+    // Debug: Log the authUrl being used
+    console.log('🔧 Using authUrl from config:', config.public.authUrl);
+    
+    // Build the redirect URI - must match what's configured in Keycloak
+    const postLogoutRedirectUri = `${config.public.authUrl}/LoginPage?logout=success`;
+    
+    // Add required parameters for proper Keycloak logout
     logoutUrl.searchParams.set('client_id', config.keycloakClientId);
-    logoutUrl.searchParams.set('post_logout_redirect_uri', `${config.public.authUrl}/LoginPage?logout=success`);
+    logoutUrl.searchParams.set('post_logout_redirect_uri', postLogoutRedirectUri);
     
     // If we have an ID token, add it for proper session termination
+    // This ensures Keycloak properly terminates the SSO session
     if (idToken) {
       logoutUrl.searchParams.set('id_token_hint', idToken);
       console.log('🔑 Added id_token_hint to logout URL');
     } else {
-      console.warn('⚠️ No ID token available for logout hint');
+      console.warn('⚠️ No ID token available for logout hint - logout may not fully terminate Keycloak session');
     }
     
     console.log('🔗 Keycloak logout URL constructed:', logoutUrl.toString());
+    console.log('📍 Post-logout redirect URI:', postLogoutRedirectUri);
+    console.log('⚠️ Make sure this redirect URI is configured in Keycloak client settings!');
     
     // Return the logout URL to the client for redirect
     // This approach gives better control to the client-side code
@@ -65,13 +75,18 @@ export default defineEventHandler(async (event) => {
     console.error('❌ Logout error:', error);
     console.error('❌ Error stack:', error.stack);
     
-    // Even if there's an error, try to provide a basic logout URL - REDIRECT TO LOGIN PAGE
+    // Even if there's an error, try to provide a basic logout URL
     const config = useRuntimeConfig();
-    const fallbackLogoutUrl = `${config.keycloakIssuer}/protocol/openid-connect/logout?client_id=${config.keycloakClientId}&post_logout_redirect_uri=${encodeURIComponent(config.public.authUrl + '/LoginPage?logout=success')}`;
+    const postLogoutRedirectUri = `${config.public.authUrl}/LoginPage?logout=success`;
+    const fallbackLogoutUrl = new URL(`${config.keycloakIssuer}/protocol/openid-connect/logout`);
+    fallbackLogoutUrl.searchParams.set('client_id', config.keycloakClientId);
+    fallbackLogoutUrl.searchParams.set('post_logout_redirect_uri', postLogoutRedirectUri);
+    
+    console.warn('⚠️ Using fallback logout URL due to error');
     
     return {
       success: false,
-      logoutUrl: fallbackLogoutUrl,
+      logoutUrl: fallbackLogoutUrl.toString(),
       error: 'Logout encountered an error, but providing fallback logout URL',
       message: error.message
     };