diff --git a/apps/web/src/components/global-search.tsx b/apps/web/src/components/global-search.tsx
index b83035d..5cc11d4 100644
--- a/apps/web/src/components/global-search.tsx
+++ b/apps/web/src/components/global-search.tsx
@@ -136,48 +136,46 @@ export function GlobalSearch() {
 
   return (
     <div ref={containerRef} className="relative">
-      <button
-        onClick={() => {
-          setIsOpen(true);
-          setTimeout(() => inputRef.current?.focus(), 50);
-        }}
-        className={cn(
-          "flex items-center gap-2 px-3 py-2 rounded-xl border text-sm transition-all w-full",
-          isOpen
-            ? "border-primary bg-background"
-            : "border-border bg-secondary/50 text-muted-foreground hover:border-primary/50 hover:text-foreground"
-        )}
-      >
-        <Search className="w-4 h-4 flex-shrink-0" />
-        <span className="flex-1 text-left truncate">Rechercher...</span>
-        <kbd className="hidden md:inline-flex h-5 items-center gap-0.5 rounded border border-border bg-background px-1.5 text-[10px] font-medium text-muted-foreground">
-          Ctrl+K
-        </kbd>
-      </button>
+      {isOpen ? (
+        <div className="relative">
+          <Search className="pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground" />
+          <Input
+            ref={inputRef}
+            value={query}
+            onChange={(e) => setQuery(e.target.value)}
+            placeholder="Rechercher dans les tâches, journal, jalons..."
+            className="pl-9 pr-9 h-10 rounded-xl border-primary"
+          />
+          {query && (
+            <button
+              type="button"
+              onClick={() => setQuery("")}
+              aria-label="Effacer la recherche"
+              className="absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground"
+            >
+              <X className="w-4 h-4" />
+            </button>
+          )}
+        </div>
+      ) : (
+        <button
+          type="button"
+          onClick={() => {
+            setIsOpen(true);
+            setTimeout(() => inputRef.current?.focus(), 50);
+          }}
+          className="flex w-full items-center gap-2 rounded-xl border border-border bg-secondary/50 px-3 py-2 text-sm text-muted-foreground transition-all hover:border-primary/50 hover:text-foreground"
+        >
+          <Search className="w-4 h-4 flex-shrink-0" />
+          <span className="flex-1 text-left truncate">Rechercher...</span>
+          <kbd className="hidden md:inline-flex h-5 items-center gap-0.5 rounded border border-border bg-background px-1.5 text-[10px] font-medium text-muted-foreground">
+            Ctrl+K
+          </kbd>
+        </button>
+      )}
 
       {isOpen && (
         <div className="absolute left-0 right-0 top-full mt-2 z-50 rounded-2xl border border-border/50 bg-card/75 backdrop-blur-md shadow-xl overflow-hidden">
-          <div className="p-3 border-b border-border">
-            <div className="relative">
-              <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground" />
-              <Input
-                ref={inputRef}
-                value={query}
-                onChange={(e) => setQuery(e.target.value)}
-                placeholder="Rechercher dans les tâches, journal, jalons..."
-                className="pl-9 pr-9 h-10"
-              />
-              {query && (
-                <button
-                  onClick={() => setQuery("")}
-                  className="absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground"
-                >
-                  <X className="w-4 h-4" />
-                </button>
-              )}
-            </div>
-          </div>
-
           <div className="max-h-80 overflow-y-auto">
             {query.length < 2 ? (
               <div className="p-6 text-center text-sm text-muted-foreground">