@extends('layouts.app')

@section('title', 'Registrar')

@section('content')
<div class="register-login-container ">
    <div class="custom-card">
        <h2 class="text-center mb-3 color-primary">Registrar Conta</h2>

        @if($errors->any())
            <div class="alert alert-danger">
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        <form action="{{ route('register') }}" method="POST" enctype="multipart/form-data">
            @csrf
            <div class="mb-3">
                <label for="name" class="form-label">Nome</label>
                <input 
                    type="text" 
                    class="form-control" 
                    id="name" 
                    name="name" 
                    value="{{ old('name') }}" 
                    required 
                    placeholder="Nome"
                >
                @error('name')
                    <div class="text-danger">{{ $message }}</div>
                @enderror
            </div>
            <div class="mb-3">
                <label for="email" class="form-label">E-mail</label>
                <input 
                    type="email" 
                    class="form-control" 
                    id="email" 
                    name="email" 
                    value="{{ old('email') }}" 
                    required 
                    placeholder="Digite seu e-mail"
                >
                @error('email')
                    <div class="text-danger">{{ $message }}</div>
                @enderror
            </div>
            <div class="mb-3">
                <label for="password" class="form-label">Senha</label>
                <div class="input-group">
                    <input 
                        type="password" 
                        class="form-control" 
                        id="password" 
                        name="password" 
                        required 
                        placeholder="Digite sua senha"
                    >
                    <span class="input-group-text toggle-password" data-target="password">
                        <i class="fa-solid fa-eye"></i>
                    </span>
                </div>
                @error('password')
                    <div class="text-danger">{{ $message }}</div>
                @enderror
            </div>
            <div class="mb-3">
                <label for="password_confirmation" class="form-label">Confirmar Senha</label>
                <div class="input-group">
                    <input 
                        type="password" 
                        class="form-control" 
                        id="password_confirmation" 
                        name="password_confirmation" 
                        required 
                        placeholder="Confirme sua senha"
                    >
                    <span class="input-group-text toggle-password" data-target="password_confirmation">
                        <i class="fa-solid fa-eye"></i>
                    </span>
                </div>
                @error('password_confirmation')
                    <div class="text-danger">{{ $message }}</div>
                @enderror
            </div>
            <div class="mb-3 form-check">
                <input 
                    type="checkbox"
                    class="form-check-input"
                    name="terms"
                    id="terms"
                    {{ old('terms') ? 'checked' : '' }}
                    required>
                <label class="form-check-label" for="terms">
                    <span style="font-size: 0.9rem; color: #fff;">
                        Concordo com os
                        <a href="{{ url('/terms') }}" target="_blank" style="color: #E9B258; text-decoration: underline; font-size: 0.8rem;">
                            Termos de Política e Privacidade
                        </a>
                    </span>
                </label>
                @error('terms')
                    <div class="text-danger">{{ $message }}</div>
                @enderror
            </div>
            
            <button type="submit" class="btn btn-primary btn-block">Registrar</button>
        </form>
    </div>
</div>
@endsection