@extends('layouts.admin')

@section('title', 'Nueva Tarjeta')

@section('content')
<div class="container">
    <h2>Nueva Tarjeta</h2>
    <form method="POST" action="{{ route('tarjetas.store') }}" enctype="multipart/form-data">
        @csrf
        @include('tarjetas.form')
        <button type="submit" class="btn btn-success">Guardar</button>
    </form>
</div>
@endsection

@push('js')
<script>
    document.getElementById('logo-input').addEventListener('change', function (e) {
        const preview = document.getElementById('logo-preview');
        const file = e.target.files[0];

        if (file && file.type.startsWith('image/')) {
            const reader = new FileReader();
            reader.onload = function (e) {
                preview.src = e.target.result;
                preview.style.display = 'block';
            };
            reader.readAsDataURL(file);
        } else {
            preview.src = '';
            preview.style.display = 'none';
        }
    });
</script>
@endpush