From dd71130977068cc9d7e1854db973fa736dc80433 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= <valknar@pivoine.art>
Date: Wed, 25 Feb 2026 20:20:04 +0100
Subject: [PATCH] fix: conversion options styling

---
 components/media/ConversionOptions.tsx | 25 +++++--------------------
 components/media/FileConverter.tsx     |  2 +-
 2 files changed, 6 insertions(+), 21 deletions(-)

diff --git a/components/media/ConversionOptions.tsx b/components/media/ConversionOptions.tsx
index 5565d38..b086e0a 100644
--- a/components/media/ConversionOptions.tsx
+++ b/components/media/ConversionOptions.tsx
@@ -265,25 +265,10 @@ export function ConversionOptionsPanel({
   );
 
   return (
-    <Card className="p-4">
-      {/* Advanced Options Toggle */}
-      <button
-        onClick={() => setIsExpanded(!isExpanded)}
-        className="w-full flex items-center justify-between text-sm font-medium text-foreground hover:text-primary transition-colors"
-        disabled={disabled}
-      >
-        <span>Advanced Options</span>
-        {isExpanded ? <ChevronUp className="h-4 w-4" /> : <ChevronDown className="h-4 w-4" />}
-      </button>
-
-      {/* Advanced Options Panel */}
-      {isExpanded && (
-        <div className="pt-3 mt-3 border-t border-border">
-          {outputFormat.category === 'video' && renderVideoOptions()}
-          {outputFormat.category === 'audio' && renderAudioOptions()}
-          {outputFormat.category === 'image' && renderImageOptions()}
-        </div>
-      )}
-    </Card>
+    <>
+      {outputFormat.category === 'video' && renderVideoOptions()}
+      {outputFormat.category === 'audio' && renderAudioOptions()}
+      {outputFormat.category === 'image' && renderImageOptions()}
+    </>
   );
 }
diff --git a/components/media/FileConverter.tsx b/components/media/FileConverter.tsx
index e66559a..77637e4 100644
--- a/components/media/FileConverter.tsx
+++ b/components/media/FileConverter.tsx
@@ -392,7 +392,7 @@ export function FileConverter() {
             <CardContent className="space-y-6">
               {/* Output Format Select */}
               <div className="space-y-2">
-                <label className="text-sm font-medium text-foreground">Output Format</label>
+                <label className="text-sm font-medium text-foreground block">Output Format</label>
                 <Select
                   value={outputFormat?.id || ''}
                   onValueChange={(formatId) => {