diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.scss b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.scss
index 28a3960b..af4cb109 100644
--- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.scss
+++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/pre-join/pre-join.component.scss
@@ -285,50 +285,61 @@
 
 	// Mobile Layout Optimization
 	.prejoin-container.mobile {
+		all: unset;
 		padding: 0;
-		align-items: stretch;
+		display: content;
+		height: 100vh;
+		min-height: 100vh;
+		max-height: 100vh;
+		overflow: hidden;
 
 		.prejoin-content {
-			max-width: none;
-			height: 100vh;
+			height: 100%;
+			display: flex;
+			flex-direction: column;
 
 			.prejoin-main {
 				width: 100%;
-				height: 100vh;
 				border-radius: 0;
+				flex: 1;
 				display: flex;
 				flex-direction: column;
 
 				.video-preview-section {
-					// Video section takes remaining space after configuration
-					flex: 1;
-					min-height: 0; // Allow flexbox to shrink
+					// Video takes all remaining space
+					flex: 1 1 auto;
+					min-height: 0;
+					overflow: hidden;
 
 					.video-preview-container {
 						width: 100%;
 						height: 100%;
-						aspect-ratio: unset;
 						border-radius: 0;
 					}
 				}
 
 				.configuration-section {
-					// Configuration section adapts to content
 					flex: 0 0 auto;
 					padding: 16px;
 					gap: 16px;
+					background: var(--ov-surface-color, #ffffff);
 
-					// Ensure minimum usable space but allow growth
-					min-height: fit-content;
-					max-height: 40vh; // Prevent taking too much space
-					overflow-y: auto; // Scroll if content is too tall
+					// Ensure content is displayed in column
+					display: flex;
+					flex-direction: column;
+
+					.join-section .join-button {
+						height: 48px;
+						min-height: 48px;
+					}
 				}
 
 				.vb-container {
-					// Virtual background panel also adapts to content
+					// Virtual background panel - also adapts to content
 					flex: 0 0 auto;
-					max-height: 40vh;
+					max-height: 60vh;
 					overflow-y: auto;
+					background: var(--ov-surface-color, #ffffff);
 				}
 			}
 		}
diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/settings/participant-name-input/participant-name-input.component.scss b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/settings/participant-name-input/participant-name-input.component.scss
index 85881adc..618cb1f4 100644
--- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/settings/participant-name-input/participant-name-input.component.scss
+++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/settings/participant-name-input/participant-name-input.component.scss
@@ -41,7 +41,7 @@
 				padding: 0 16px;
 				border: none;
 				outline: none;
-				background: transparent;
+				background: var(--ov-input-background, #f8f9fa);
 				font-size: 16px;
 				font-weight: 500;
 				color: var(--ov-text-surface-color, #666);