@extends('dashboard')

@section('page-title', 'Create AI Agent')

@section('content')
<div class="page-container ai-agent-create-page">
    <div class="page-header">
        <div class="header-actions">
            <h1>Create AI Agent</h1>
            <div class="buttons-container">
                <a href="{{ route('ai-agents.index') }}" class="btn btn-outline-primary">
                    <i class="fas fa-arrow-left"></i> Back to Agents
                </a>
            </div>
        </div>
        <div class="header-info">
            <p>Create a new AI agent to handle tasks, automate processes, or assist your users.</p>
        </div>
    </div>
    
    <div class="agent-builder-container">
        <ai-agent-builder></ai-agent-builder>
    </div>
</div>
@endsection

@push('styles')
<style>
    .agent-builder-container {
        height: calc(100vh - 250px);
        min-height: 600px;
    }
</style>
@endpush