@extends('layouts.app')

@section('title', 'Crear mi matrimonio')

@section('content')
<div class="container py-4">
    <h1 class="h3 mb-3">Crea tu Planner de Matrimonio</h1>
    <p class="text-muted mb-4">
        Cuéntanos algunos detalles y te ayudaremos a organizar todo paso a paso.
    </p>

    <form action="{{ route('planner.matrimonio.store') }}" method="POST" class="card shadow-sm p-4">
        @csrf

        <div class="mb-3">
            <label class="form-label">Nombre de la pareja (opcional)</label>
            <input type="text" name="nombre_pareja" class="form-control @error('nombre_pareja') is-invalid @enderror"
                   value="{{ old('nombre_pareja') }}" placeholder="Ej: Fran & Nico">
            @error('nombre_pareja')
            <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <div class="row g-3">
            <div class="col-md-4">
                <label class="form-label">Fecha del matrimonio (estimada)</label>
                <input type="date" name="fecha_matrimonio" class="form-control @error('fecha_matrimonio') is-invalid @enderror"
                       value="{{ old('fecha_matrimonio') }}">
                @error('fecha_matrimonio')
                <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-4">
                <label class="form-label">Ciudad</label>
                <input type="text" name="ciudad" class="form-control @error('ciudad') is-invalid @enderror"
                       value="{{ old('ciudad') }}" placeholder="Ej: Santiago, La Serena...">
                @error('ciudad')
                <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-4">
                <label class="form-label">Lugar (opcional)</label>
                <input type="text" name="lugar" class="form-control @error('lugar') is-invalid @enderror"
                       value="{{ old('lugar') }}" placeholder="Salón, parcela, playa...">
                @error('lugar')
                <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
        </div>

        <div class="row g-3 mt-1">
            <div class="col-md-4">
                <label class="form-label">Tipo de matrimonio</label>
                <select name="tipo_matrimonio" class="form-select @error('tipo_matrimonio') is-invalid @enderror">
                    <option value="">Selecciona una opción</option>
                    <option value="civil" {{ old('tipo_matrimonio') == 'civil' ? 'selected' : '' }}>Civil</option>
                    <option value="religioso" {{ old('tipo_matrimonio') == 'religioso' ? 'selected' : '' }}>Religioso</option>
                    <option value="simbólico" {{ old('tipo_matrimonio') == 'simbólico' ? 'selected' : '' }}>Simbólico</option>
                </select>
                @error('tipo_matrimonio')
                <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-4">
                <label class="form-label">Estilo (opcional)</label>
                <input type="text" name="estilo" class="form-control @error('estilo') is-invalid @enderror"
                       value="{{ old('estilo') }}" placeholder="Clásico, boho, playa, rústico...">
                @error('estilo')
                <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>

            <div class="col-md-4">
                <label class="form-label">Invitados estimados</label>
                <input type="number" name="invitados_estimados" class="form-control @error('invitados_estimados') is-invalid @enderror"
                       value="{{ old('invitados_estimados') }}" min="1">
                @error('invitados_estimados')
                <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>
        </div>

        <div class="mt-3 mb-4">
            <label class="form-label">Presupuesto total aproximado</label>
            <div class="input-group">
                <span class="input-group-text">$</span>
                <input type="number" name="presupuesto_total" class="form-control @error('presupuesto_total') is-invalid @enderror"
                       value="{{ old('presupuesto_total') }}" min="0" step="10000" placeholder="Ej: 8000000">
                @error('presupuesto_total')
                <div class="invalid-feedback d-block">{{ $message }}</div>
                @enderror
            </div>
            <small class="text-muted">No te preocupes si no es exacto, solo nos ayuda a darte un mejor orden.</small>
        </div>

        <div class="d-flex justify-content-end">
            <button type="submit" class="btn btn-primary">
                Guardar y continuar al Planner
            </button>
        </div>
    </form>
</div>
@endsection