Replace the plain erase icon with a styled Clear button for better visibility and affordance.

Co-authored-by: Cursor <cursoragent@cursor.com>

gramora/Utilities/AppTheme.swift

@@ -35,6 +35,13 @@ enum AppTheme {
 
     static let cardShadow = Color.black.opacity(0.06)
 
+    static let clearBackground = Color(red: 1.0, green: 0.95, blue: 0.94)
+    static let clearBackgroundHover = Color(red: 1.0, green: 0.91, blue: 0.90)
+    static let clearForeground = Color(red: 0.82, green: 0.32, blue: 0.36)
+    static let clearForegroundHover = Color(red: 0.72, green: 0.22, blue: 0.28)
+    static let clearBorder = Color(red: 0.94, green: 0.80, blue: 0.80)
+    static let clearShadow = Color(red: 0.82, green: 0.32, blue: 0.36).opacity(0.18)
+
     static var primaryGradient: LinearGradient {
         LinearGradient(
             colors: [gradientStart, gradientEnd],

gramora/Views/Components/GradientButton.swift

@@ -79,3 +79,41 @@ struct IconButton: View {
         .buttonStyle(.plain)
     }
 }
+
+struct ClearButton: View {
+    let action: () -> Void
+
+    @State private var isHovered = false
+
+    var body: some View {
+        Button(action: action) {
+            HStack(spacing: 6) {
+                Image(systemName: "eraser.fill")
+                    .font(.system(size: 12, weight: .semibold))
+                    .symbolRenderingMode(.hierarchical)
+
+                Text("Clear")
+                    .font(.system(size: 12, weight: .semibold))
+            }
+            .foregroundStyle(isHovered ? AppTheme.clearForegroundHover : AppTheme.clearForeground)
+            .padding(.horizontal, 12)
+            .padding(.vertical, 7)
+            .background(isHovered ? AppTheme.clearBackgroundHover : AppTheme.clearBackground)
+            .clipShape(RoundedRectangle(cornerRadius: 8))
+            .overlay(
+                RoundedRectangle(cornerRadius: 8)
+                    .stroke(isHovered ? AppTheme.clearForeground.opacity(0.35) : AppTheme.clearBorder, lineWidth: 1)
+            )
+            .shadow(
+                color: isHovered ? AppTheme.clearShadow : AppTheme.clearShadow.opacity(0.5),
+                radius: isHovered ? 6 : 3,
+                y: isHovered ? 3 : 1
+            )
+            .scaleEffect(isHovered ? 1.02 : 1.0)
+            .animation(.easeOut(duration: 0.15), value: isHovered)
+        }
+        .buttonStyle(.plain)
+        .onHover { isHovered = $0 }
+        .accessibilityLabel("Clear text")
+    }
+}

gramora/Views/GrammarCheckerView.swift

@@ -121,7 +121,7 @@ struct GrammarCheckerView: View {
 
                 Spacer()
 
-                IconButton(iconName: "eraser") {
+                ClearButton {
                     viewModel.clearText()
                 }
             }