Blocks

Forms

Sign-in, settings and multi-column form layouts wired for Livewire.
Sign-in card sign-in-card
Centered authentication card with validation-ready fields.
{{--
    Sign-in card — centered auth form ready for Livewire / Fortify wiring.
--}}
<section class="border-b border-dashed border-edge">
    <neura::container size="md" class="py-16 lg:py-20">
        <div class="mx-auto max-w-md">
            <div class="mb-8 text-center">
                <neura::brand href="#" name="Neura" class="justify-center" />
                <neura::heading level="h1" size="2xl" align="center" class="mt-6 tracking-tight">
                    {{ __('Sign in to your account') }}
                </neura::heading>
                <neura::text size="sm" align="center" class="mt-2 text-fg-secondary">
                    {{ __('Welcome back. Enter your credentials to continue.') }}
                </neura::text>
            </div>

            <neura::card class="p-6 sm:p-8">
                <form class="space-y-5" action="#" method="POST" onsubmit="return false;">
                    <neura::field>
                        <neura::label for="email">{{ __('Email') }}</neura::label>
                        <neura::input id="email" type="email" name="email" autocomplete="username"
                            placeholder="you@company.com" />
                    </neura::field>

                    <neura::field>
                        <div class="flex items-center justify-between gap-3">
                            <neura::label for="password">{{ __('Password') }}</neura::label>
                            <a href="#forgot"
                                class="text-xs text-fg-muted transition-colors hover:text-fg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50 rounded">
                                {{ __('Forgot password?') }}
                            </a>
                        </div>
                        <neura::input id="password" type="password" name="password"
                            autocomplete="current-password" placeholder="••••••••" />
                    </neura::field>

                    <neura::checkbox name="remember" label="{{ __('Remember me') }}" />

                    <neura::button type="submit" variant="primary" class="w-full" size="lg">
                        {{ __('Sign in') }}
                    </neura::button>
                </form>

                <neura::separator class="my-6" />

                <neura::text size="sm" align="center" class="text-fg-secondary">
                    {{ __('No account yet?') }}
                    <a href="#register"
                        class="font-medium text-fg underline-offset-4 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50 rounded">
                        {{ __('Create one') }}
                    </a>
                </neura::text>
            </neura::card>
        </div>
    </neura::container>
</section>