CSRF token mismatch from backend on live server to localhost SPA

I have an laravel application held on shared hosting. and i have frontend on locahost. both are communication through api. i am using laravel sanctum for authentication, the spa is working fine in deployment. and there is no issue in frontend authentication and all.

but i want to run frontend on localhost so that i can fix all minor ui issues while communicating with my backend.

so when i try to login on localhost. the backend is giving me csrf token and larvel_session token. but both are being rejected in my browser. in the console. it comes written

this is my session.php config file

<?php

use Illuminate\Support\Str;

return [

    'driver' => env('SESSION_DRIVER', 'file'),

    'lifetime' => env('SESSION_LIFETIME', 525600),

    'expire_on_close' => false,


    'encrypt' => false,


    'files' => storage_path('framework/sessions'),

    'connection' => env('SESSION_CONNECTION', null),



    'table' => 'sessions',

  
    'store' => env('SESSION_STORE', null),

    'lottery' => [2, 100],


    'cookie' => env(
        'SESSION_COOKIE',
        Str::slug(env('APP_NAME', 'laravel'), '_').'_session'
    ),

 

    'path' => '/',


    'domain' => env('SESSION_DOMAIN', null),


    'secure' => env('SESSION_SECURE_COOKIE'),


    'http_only' => true,


    'same_site' => 'lax',

];