diff --git a/frontend/src/lib/components/apps/components/inputs/AppFileInput.svelte b/frontend/src/lib/components/apps/components/inputs/AppFileInput.svelte
index fa43c39482..093fd74fe1 100644
--- a/frontend/src/lib/components/apps/components/inputs/AppFileInput.svelte
+++ b/frontend/src/lib/components/apps/components/inputs/AppFileInput.svelte
@@ -11,7 +11,7 @@
 
 	export let id: string
 	export let configuration: RichConfigurations
-	export let customCss: ComponentCustomCSS<'containercomponent'> | undefined = undefined
+	export let customCss: ComponentCustomCSS<'fileinputcomponent'> | undefined = undefined
 	export let render: boolean
 
 	const { app, worldStore } = getContext<AppViewerContext>('AppViewerContext')
@@ -33,7 +33,6 @@
 				return { name: file.name, data }
 			})
 		}
-
 		outputs?.result.set(files)
 	}
 
diff --git a/frontend/src/lib/components/apps/components/layout/AppConditionalWrapper.svelte b/frontend/src/lib/components/apps/components/layout/AppConditionalWrapper.svelte
index 32700164e9..f3a148ffff 100644
--- a/frontend/src/lib/components/apps/components/layout/AppConditionalWrapper.svelte
+++ b/frontend/src/lib/components/apps/components/layout/AppConditionalWrapper.svelte
@@ -11,7 +11,7 @@
 
 	export let id: string
 	export let componentContainerHeight: number
-	export let customCss: ComponentCustomCSS<'containercomponent'> | undefined = undefined
+	export let customCss: ComponentCustomCSS<'conditionalwrapper'> | undefined = undefined
 	export let render: boolean
 	export let conditions: RichConfiguration[]
 
@@ -30,7 +30,7 @@
 		}
 	}
 
-	let css = initCss($app.css?.containercomponent, customCss)
+	let css = initCss($app.css?.conditionalwrapper, customCss)
 
 	let resolvedConditions: boolean[] = []
 	let selectedConditionIndex = 0
diff --git a/frontend/src/lib/components/apps/components/layout/AppList.svelte b/frontend/src/lib/components/apps/components/layout/AppList.svelte
index 42dc6ac607..5f36761bd0 100644
--- a/frontend/src/lib/components/apps/components/layout/AppList.svelte
+++ b/frontend/src/lib/components/apps/components/layout/AppList.svelte
@@ -45,7 +45,7 @@
 		}
 	}
 
-	let css = initCss($app.css?.containercomponent, customCss)
+	let css = initCss($app.css?.listcomponent, customCss)
 	let result: any[] | undefined = undefined
 
 	$: isCard = resolvedConfig.width?.selected == 'card'
diff --git a/frontend/src/lib/components/common/fileInput/FileInput.svelte b/frontend/src/lib/components/common/fileInput/FileInput.svelte
index 4837b5d709..8349f50fd7 100644
--- a/frontend/src/lib/components/common/fileInput/FileInput.svelte
+++ b/frontend/src/lib/components/common/fileInput/FileInput.svelte
@@ -32,8 +32,15 @@
 		}
 		for (let i = 0; i < fileList.length; i++) {
 			const file = fileList.item(i)
-			if (file) files.push(file)
+			if (file && isAcceptedFileType(file)) {
+				files.push(file)
+			}
 		}
+
+		if (!files.length) {
+			files = undefined
+		}
+
 		// Needs to be reset so the same file can be selected
 		// multiple times in a row
 		input.value = ''
@@ -41,6 +48,14 @@
 		dispatchChange()
 	}
 
+	function isAcceptedFileType(file: File): boolean {
+		const acceptedTypes = accept?.split(',').map((type) => type.trim()) ?? []
+		return (
+			acceptedTypes.includes(file.type) ||
+			acceptedTypes.includes(`.${file?.name?.split('.').pop()}`)
+		)
+	}
+
 	async function convertFile(file: File): Promise<string | ArrayBuffer | null> {
 		return new Promise((resolve) => {
 			if (!convertTo) {