refactor: mobile-first AI toolbar layout

src/components/ai-toolbar.tsx

@@ -78,7 +78,8 @@ export const AIToolbar = ({
 				{/* AI command — only shown when authenticated */}
 				{isAuthenticated ? (
 					<>
-						<div className="flex items-start gap-3">
+						{/* Textarea fills full width; action icons sit below on mobile, to the right on sm+ */}
+						<div className="flex flex-col gap-2 sm:flex-row sm:items-start sm:gap-3">
 							<div className="flex-1 space-y-2">
 								<div className="flex items-center gap-2 mb-1.5">
 									<Sparkles className="h-3.5 w-3.5 text-primary shrink-0" />
@@ -121,7 +122,9 @@ export const AIToolbar = ({
 									)}
 								</AnimatePresence>
 							</div>
-							<div className="flex flex-col gap-1.5 pt-6">
+
+							{/* On mobile: horizontal row below textarea. On sm+: vertical column beside textarea */}
+							<div className="flex flex-row gap-1.5 sm:flex-col sm:pt-6">
 								<ImagePicker
 									onFileSelect={onImageSelect}
 									disabled={aiLoading}
@@ -158,6 +161,9 @@ export const AIToolbar = ({
 				)}
 
 				{/* Action buttons — always visible */}
+				{/* On mobile: two rows — actions top, meta (badge + summarize) below */}
+				{/* On sm+: single row with meta pushed to the right */}
+				<div className="flex flex-col gap-2 sm:flex-row sm:items-center sm:flex-wrap">
 					<div className="flex items-center gap-2 flex-wrap">
 						<Button size="sm" onClick={onAddEvent} className="text-xs">
 							<CalendarPlus className="h-3.5 w-3.5" />
@@ -196,8 +202,9 @@ export const AIToolbar = ({
 								</Button>
 							</>
 						)}
+					</div>
 
-					<div className="ml-auto flex items-center gap-3">
+					<div className="flex items-center gap-3 sm:ml-auto">
 						{events.length > 0 && (
 							<Badge variant="secondary" className="text-xs">
 								{events.length} event{events.length !== 1 ? "s" : ""}
@@ -211,7 +218,7 @@ export const AIToolbar = ({
 								disabled={aiLoading}
 								className="text-xs h-7"
 							>
-								<Bot className="h-3 w-3 mr-1.5" />
+								<Bot className="h-3 w-3" />
 								{aiLoading ? "Summarizing..." : "Summarize"}
 							</Button>
 						)}