@extends('partials.layout')

@section('title','Crear cara de estación')
@section('subtitle','Agregar un nuevo registro en caras_estacion')

@section('back')
    <a class="btn" href="{{ route('caras_estacion.index') }}">← Volver</a>
@endsection

@section('content')
    <form method="POST" action="{{ route('caras_estacion.store') }}">
        @csrf
        <div style="display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px">
            <div style="grid-column:1/-1">
                <label style="display:block;font-weight:700;margin-bottom:6px">Estación</label>
                <select name="id_estacion" required style="width:100%;padding:10px;border:1px solid #e2e8f0;border-radius:10px">
                    <option value="">-- Seleccione --</option>
                    @foreach($estaciones as $e)
                        <option value="{{ $e->id_estacion }}" {{ old('id_estacion')==$e->id_estacion?'selected':'' }}>
                            {{ $e->nombre }}
                        </option>
                    @endforeach
                </select>
            </div>

            <div>
                <label style="display:block;font-weight:700;margin-bottom:6px">Nombre</label>
                <input name="nombre" type="text" value="{{ old('nombre') }}" required style="width:100%;padding:10px;border:1px solid #e2e8f0;border-radius:10px">
            </div>
            <div style="grid-column:1/-1">
                <label style="display:block;font-weight:700;margin-bottom:6px">Estado</label>
                <div style="display:flex;align-items:center;gap:8px">
                    <input name="estado" type="checkbox" value="1" {{ old('estado', 1) == 1 ? 'checked' : '' }} style="width:20px;height:20px;cursor:pointer">
                    <span>Activo</span>
                </div>
            </div>
        </div>

        <div style="margin-top:14px;display:flex;gap:10px;flex-wrap:wrap">
            <button class="btn primary" type="submit">Guardar</button>
            <a class="btn" href="{{ route('caras_estacion.index') }}">Cancelar</a>
        </div>
    </form>
@endsection