@extends('layouts.header_auth', ['title' => 'Esqueci minha senha'])
@section('css')
<style type="text/css">
    .auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:url('/assets/images/unnamed333.jpg') center/cover no-repeat fixed;position:relative}
    .auth-page::before{content:"";position:fixed;inset:0;background:linear-gradient(180deg, rgba(8,10,20,.35), rgba(8,10,20,.45));pointer-events:none}
    .reset-card{max-width:440px;width:100%;border:1px solid rgba(255,255,255,.22);border-radius:16px;box-shadow:0 14px 38px rgba(10,20,30,.32);position:relative;z-index:1;background:rgba(255,255,255,.12);backdrop-filter:blur(14px) saturate(150%);padding:1.25rem}
    @media (min-width: 768px){.reset-card{padding:2rem}}
    .brand-logo{width:200px;margin:0 auto 8px auto;display:block}
    @media (max-width: 576px){.brand-logo{width:140px}}
    .auth-page .mb-3{margin-bottom:.7rem !important}
    .neo-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1rem;border-radius:10px;background:linear-gradient(90deg,#7b5cff,#00d4ff);border:none;color:#fff;box-shadow:0 4px 16px rgba(0,212,255,.2)}
    .reset-card, .reset-card label, .reset-card h4, .reset-card p{color:#0a0f1a}
    .reset-card .form-control{color:#0a0f1a}
    .reset-card .form-control::placeholder{color:#475569}
    .signup-prompt{color:#0a0f1a}
    .auth-link{background:linear-gradient(90deg,#7b5cff,#00d4ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-decoration:none;font-weight:700}
    .auth-link:hover{filter:brightness(1.1)}
    .subtitle-colored{background:linear-gradient(90deg,#7b5cff,#00d4ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:600}
</style>
@endsection
@section('content')
<div class="auth-page">
    <div class="card reset-card p-4 p-md-5">
        <img src="/logo.png" alt="logo" class="brand-logo">
        <h4 class="mb-1">Recuperar senha</h4>
        <p class="subtitle-colored mb-3">Informe seu email para receber o link.</p>
        <form method="POST" action="{{ route('reset.pass') }}">
            @csrf
            <div class="mb-3">
                <label class="form-label">Email</label>
                <input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email" autofocus>
                @error('email')
                <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                @enderror
            </div>
            @if(Session::has('error'))
            <div class="alert alert-danger">{{ Session::get('error') }}</div>
            @endif
            <button class="btn neo-btn w-100" type="submit"><i class="ri-send"></i> Redefinir senha</button>
        </form>
        <div class="text-center mt-3">
            <p class="signup-prompt"><a href="{{ route('login') }}" class="auth-link ms-1"><b><i class="ri-arrow-go-back-fill"></i> Voltar para login</b></a></p>
        </div>
    </div>
</div>
@endsection