ui(backlog): melhor espaçamento no header (empresa, período, exportar CSV) com wrapper flex responsivo

src/components/reports/backlog-report.tsx

@@ -105,6 +105,7 @@ export function BacklogReport() {
             Acompanhe a evolução dos tickets pelas fases do fluxo de atendimento.
           </CardDescription>
           <CardAction>
+            <div className="flex flex-wrap items-center justify-end gap-2 md:gap-3">
               <Select value={companyId} onValueChange={setCompanyId}>
                 <SelectTrigger className="hidden w-56 md:flex">
                   <SelectValue placeholder="Todas as empresas" />
@@ -116,11 +117,7 @@ export function BacklogReport() {
                   ))}
                 </SelectContent>
               </Select>
-            <Button asChild size="sm" variant="outline">
-              <a href={`/api/reports/backlog.csv?range=${timeRange}${companyId !== "all" ? `&companyId=${companyId}` : ""}`} download>
-                Exportar CSV
-              </a>
-            </Button>
+
               <ToggleGroup
                 type="single"
                 value={timeRange}
@@ -132,6 +129,13 @@ export function BacklogReport() {
                 <ToggleGroupItem value="30d">30 dias</ToggleGroupItem>
                 <ToggleGroupItem value="7d">7 dias</ToggleGroupItem>
               </ToggleGroup>
+
+              <Button asChild size="sm" variant="outline">
+                <a href={`/api/reports/backlog.csv?range=${timeRange}${companyId !== "all" ? `&companyId=${companyId}` : ""}`} download>
+                  Exportar CSV
+                </a>
+              </Button>
+            </div>
           </CardAction>
         </CardHeader>
         <CardContent>