diff --git a/src/components/custom/email-content-input.tsx b/src/components/custom/email-content-input.tsx
index a759076..264f1ad 100644
--- a/src/components/custom/email-content-input.tsx
+++ b/src/components/custom/email-content-input.tsx
@@ -12,6 +12,7 @@ import { Kbd, KbdGroup } from '@/components/ui/kbd';
 import { useHasKeyboard } from '@/hooks/use-has-keyboard';
 import { useModifierKeys } from '@/hooks/use-modifier-keys';
 import { sampleEmailHtml } from '@/lib/sample-email-html';
+import { cn } from '@/lib/utils';
 
 type EmailInputProps = {
   placeholder?: string;
@@ -87,9 +88,14 @@ export function EmailContentInput({ onChange, placeholder = 'Paste your HTML ema
             onClick={fillSample}
             tooltip="Fill input with sample email HTML for quick compatibility preview"
             aria-label="Fill input with sample email HTML for quick compatibility preview"
+            className={cn('space-x-0.5 transition-colors', isFocused && hasKeyboard && 'pl-1.5')}
           >
             {isFocused && hasKeyboard && (
-              <KbdGroup className="mr-2">
+              <KbdGroup
+                onClick={() => {
+                  return fillSample();
+                }}
+              >
                 <Kbd>{mod}</Kbd>
                 <Kbd>{shift}</Kbd>
                 <Kbd>E</Kbd>
@@ -111,13 +117,15 @@ export function EmailContentInput({ onChange, placeholder = 'Paste your HTML ema
           onFocus={() => {
             return setIsFocused(true);
           }}
-          onBlur={() => {
-            return setIsFocused(false);
-          }}
           style={{
             fontSize: '13px',
             height: '100%',
           }}
+          onBlur={() => {
+            return setTimeout(() => {
+              return setIsFocused(false);
+            }, 200);
+          }}
           basicSetup={{
             autocompletion: true,
             bracketMatching: true,
diff --git a/src/components/custom/tooltip-button.tsx b/src/components/custom/tooltip-button.tsx
index 1da40e1..d9138bd 100644
--- a/src/components/custom/tooltip-button.tsx
+++ b/src/components/custom/tooltip-button.tsx
@@ -11,11 +11,12 @@ type TooltipButtonProps = {
   tooltip: string;
   onClick: () => void;
   onMouseEnter?: () => void;
-} & Pick<ComponentProps<typeof Button>, 'variant' | 'size' | 'disabled' | 'aria-label'>;
+} & Pick<ComponentProps<typeof Button>, 'variant' | 'size' | 'disabled' | 'aria-label' | 'className'>;
 
 export function TooltipButton({
   'aria-label': ariaLabel = '',
   children,
+  className = '',
   delayDuration = 500,
   disabled = false,
   onClick,
@@ -28,7 +29,15 @@ export function TooltipButton({
   return (
     <Tooltip delayDuration={delayDuration}>
       <TooltipTrigger asChild onMouseEnter={onMouseEnter}>
-        <Button ref={ref} size={size} variant={variant} onClick={onClick} disabled={disabled} aria-label={ariaLabel}>
+        <Button
+          ref={ref}
+          size={size}
+          variant={variant}
+          onClick={onClick}
+          disabled={disabled}
+          className={className}
+          aria-label={ariaLabel}
+        >
           {children}
         </Button>
       </TooltipTrigger>