@extends('layouts.app')

@section('content')
    <div class="container-fluid">
        <h1 class="mb-4">Adicionar Novo Banner</h1>

        @if ($errors->any())
            <div class="alert alert-danger">
                <strong>Ops!</strong> Ocorreram alguns erros.<br><br>
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        <div class="card">
            <div class="card-body">
                <form action="{{ route('admin.banners.store') }}" method="POST" enctype="multipart/form-data">
                    @csrf

                    <div class="mb-3">
                        <label for="titulo" class="form-label">Título do Banner</label>
                        <input type="text" class="form-control" id="titulo" name="titulo" value="{{ old('titulo') }}" required>
                        <small class="form-text text-muted">Ex: "Promoção de Vitaminas"</small>
                    </div>

                    {{-- NOVO CAMPO ADICIONADO AQUI --}}
                    <div class="mb-3">
                        <label for="posicao" class="form-label">Posição</label>
                        <select name="posicao" id="posicao" class="form-select" required>
                            <option value="topo" {{ old('posicao') == 'topo' ? 'selected' : '' }}>Topo (Carrossel Principal)</option>
                            <option value="ofertas" {{ old('posicao') == 'ofertas' ? 'selected' : '' }}>Ofertas (Abaixo do Carrossel)</option>
                        </select>
                        <small class="form-text text-muted">Escolha onde este banner deve aparecer no site.</small>
                    </div>

                    <div class="mb-3">
                        <label for="link" class="form-label">Link (Opcional)</label>
                        <input type="url" class="form-control" id="link" name="link" value="{{ old('link') }}">
                        <small class="form-text text-muted">Para onde o cliente vai quando clica no banner. Ex: https://...</small>
                    </div>

                    <div class="mb-3">
                        <label for="imagem" class="form-label">Imagem</label>
                        <input class="form-control" type="file" id="imagem" name="imagem" required>
                        <small class="form-text text-muted">Para o Topo: 1200x400px. Para Ofertas: 600x600px (sugestão).</small>
                    </div>
                    
                    <div class="mb-3 form-check">
                        <input type="checkbox" class="form-check-input" id="ativo" name="ativo" value="1" checked>
                        <label class="form-check-label" for="ativo">Manter banner ativo?</label>
                    </div>

                    <button type="submit" class="btn btn-primary">Salvar Banner</button>
                    <a href="{{ route('admin.banners.index') }}" class="btn btn-secondary">Cancelar</a>
                </form>
            </div>
        </div>
    </div>
@endsection