Facing issues downloading i pdf file i uploaded get 404

i cant download the file but i see that when it is stored goes to reports/filename but when trying to download looks in http://localhost:8000/storage/reports/ojnD2a9lfMKYoX4rl4ocj5UGFakWJ6U7wWY5P8fN.pdf and i get 404 error

my controller

<?php

namespace App\Http\Controllers;

use App\Models\Report;
use App\Http\Requests\StoreReportRequest;
use App\Http\Requests\UpdateReportRequest;
use Illuminate\Support\Facades\Storage;

class ReportController extends Controller
{
    /**
     * Display a listing of the resource.
     */
    public function index()
    {
        $reports = Report::all();
        return view('report.index' , compact('reports'));
    }

    /**
     * Show the form for creating a new resource.
     */
    public function create()
    {
        return view('report.create');
    }

    /**
     * Store a newly created resource in storage.
     */
    public function store(StoreReportRequest $request)
    {
        $directory = 'reports';

        // Check if the directory exists, if not, create it
        if (!Storage::exists($directory)) {
            Storage::makeDirectory($directory);
        }

        $file = $request->file('report');

        // Store the file with its original name in the reports directory
        $filePath = $file->storeAs($directory, $file->getClientOriginalName());

        Report::create([
            'description' => $request->description,
            'additional' => $request->additional,
            'report' => $filePath,
        ]);

        return redirect()->route('report.index')->with('success', 'Report created successfully!');
    }

    /**
     * Display the specified resource.
     */
    public function show(Report $report)
    {
        //
    }

    /**
     * Show the form for editing the specified resource.
     */
    public function edit(Report $report)
    {
        //
    }

    /**
     * Update the specified resource in storage.
     */
    public function update(UpdateReportRequest $request, Report $report)
    {
        //
    }

    /**
     * Remove the specified resource from storage.
     */
    public function destroy(Report $report)
    {
        //
    }
}

my index view

<x-layout>
    <div class="max-w-7xl max-auto p-8 mx-auto justify-center mb-5">
        <div class="flex space-x-2">
            <a href="{{ route('report.index') }}">
                <button
                    class="hover:bg-gray-200 hover:text-black transition w-28 bg-gray-800 rounded h-8 px-2 text-white">
                    All reports
                </button>
            </a>
            <a href="{{ route('report.create') }}">
                <button
                    class="hover:bg-gray-200 hover:text-black transition w-28 bg-gray-800 rounded h-8 px-2 text-white">
                    Create report
                </button>
            </a>
        </div>


        <div class="grid justify-center grid-cols-1 gap-4 mx-auto mt-8 md:grid-cols-2 lg:grid-cols-3">
            @foreach ($reports as $report)
                <div class="p-4 border border-gray-300 rounded-lg">
                    <p class="mb-2 text-xl font-bold text-gray-700 leading-none">Number: {{ $report->id }}</p>
                    <p class="mb-2 text-base font-medium leading-none text-gray-700">{{ $report->description }}</p>
                    <p class="mb-2 text-base leading-none text-gray-700">{{ $report->additional }}</p>
                    <a href="{{ Storage::url($report->report) }}" class="hover:bg-gray-200 hover:text-black transition w-full mt-4 bg-gray-800 rounded h-8 px-2 text-white flex items-center justify-center">
                        Download Report
                    </a>
                </div>
            @endforeach
        </div>

    </div>
</x-layout>