Update src/App.jsx

src/App.jsx

@@ -47,10 +47,10 @@ const QRGeneratorTab = ({
     }, [qrStyles, drawQrCode, styleCanvasRefs]);
 
     return (
-        // Modified: Added lg:items-stretch to ensure children stretch vertically to match height
-        <div className="flex flex-col lg:flex-row p-4 md:p-6 space-y-6 lg:space-y-0 lg:space-x-6 flex-grow lg:items-stretch">
-            {/* Left Panel: Input and Controls - flex-grow to fill vertical space */}
-            <div className={`flex flex-col w-full lg:w-3/4 p-6 rounded-2xl border ${currentThemeClasses.glassBorder} ${currentThemeClasses.glassBg} shadow-2xl ${currentThemeClasses.shadow} transform transition-all duration-500 ease-in-out flex-grow`}>
+        // Modified: Changed lg:items-stretch to lg:items-start to allow independent heights
+        <div className="flex flex-col lg:flex-row p-4 md:p-6 space-y-6 lg:space-y-0 lg:space-x-6 flex-grow lg:items-start">
+            {/* Left Panel: Input and Controls - Removed flex-grow as it's not needed with items-start */}
+            <div className={`flex flex-col w-full lg:w-3/4 p-6 rounded-2xl border ${currentThemeClasses.glassBorder} ${currentThemeClasses.glassBg} shadow-2xl ${currentThemeClasses.shadow} transform transition-all duration-500 ease-in-out`}>
                 <label className={`mb-2 font-semibold ${currentThemeClasses.labelColor} font-inter`}>Enter Content:</label>
                 <textarea
                     className={
@@ -142,8 +142,8 @@ const QRGeneratorTab = ({
                 </div>
             </div>
 
-            {/* Right Panel: Style Selection - Removed max-h, added flex-grow */}
-            <div className={`w-full lg:w-1/4 p-6 rounded-2xl shadow-2xl border ${currentThemeClasses.glassBorder} ${currentThemeClasses.glassBg} ${currentThemeClasses.text} flex flex-col transform transition-all duration-500 ease-in-out flex-grow`}>
+            {/* Right Panel: Style Selection - Added max-h to align with QR preview, removed flex-grow */}
+            <div className={`w-full lg:w-1/4 p-6 rounded-2xl shadow-2xl border ${currentThemeClasses.glassBorder} ${currentThemeClasses.glassBg} ${currentThemeClasses.text} flex flex-col transform transition-all duration-500 ease-in-out max-h-[750px]`}>
                 <label className={`mb-4 font-semibold ${currentThemeClasses.labelColor} font-inter`}>Choose Style:</label>
                 {/* This inner div needs to scroll if content overflows. flex-grow and overflow-y-auto */}
                 <div className={`overflow-y-auto flex-grow rounded-xl p-2 ${currentThemeClasses.cardBg} custom-scrollbar`}> 
@@ -411,7 +411,7 @@ const App = () => {
         "💐🚚 Flower Shop Delivery",
         "🐾✂️ Pet Grooming Appointment",
         "🐶📞 Veterinarian Contact",
-        "🐾❤️ Animal Rescue Groups",
+        "🐾❤️ Animal Shelter Donation",
         "🐕🌳 Dog Park Location",
         "🐈☕ Cat Cafe Details",
         "🐦🌳 Bird Watching Spot",