{% extends '@MauticCore/Default/content.html.twig' %}

{% block headerTitle pageTitle %}

{% block content %}
    {% set isModal = isModal|default(false) %}

    <style>
        .dealflow-task-entry {
            background: var(--layer-02);
            border: 1px solid var(--border-subtle-01);
            border-radius: var(--border-radius-lg);
            overflow: visible;
        }

        .dealflow-task-entry--modal {
            border: 0;
            border-radius: var(--border-radius-md);
        }

        {% if isModal %}
        #MauticSharedModal .modal-header {
            display: none;
        }

        #MauticSharedModal .modal-body {
            padding: 0;
        }
        {% endif %}

        .dealflow-task-entry__header {
            background: linear-gradient(135deg, var(--layer-01) 0%, var(--layer-02) 100%);
            border-bottom: 1px solid var(--border-subtle-01);
            padding: 22px 26px;
        }

        .dealflow-task-entry__eyebrow {
            color: var(--text-secondary);
            display: block;
            font-size: 11px;
            font-weight: 700;
            letter-spacing: .12em;
            margin-bottom: 8px;
            text-transform: uppercase;
        }

        .dealflow-task-entry__title {
            color: var(--text-primary);
            font-size: 28px;
            font-weight: 700;
            letter-spacing: -.03em;
            line-height: 1.08;
            margin: 0 0 8px;
        }

        .dealflow-task-entry__copy {
            color: var(--text-secondary);
            margin: 0;
            max-width: 620px;
        }

        .dealflow-task-entry__body {
            display: flex;
            flex-direction: column;
            gap: 18px;
            padding: 24px 26px;
        }

        .dealflow-task-entry__body--modal {
            padding-top: 20px;
        }

        .dealflow-task-entry__card {
            background: var(--background);
            border: 1px solid var(--border-subtle-01);
            border-radius: var(--border-radius-md);
            overflow: visible;
        }

        .dealflow-task-entry__card-head {
            background: var(--layer-01);
            border-top-left-radius: inherit;
            border-top-right-radius: inherit;
            border-bottom: 1px solid var(--border-subtle-01);
            padding: 16px 18px 14px;
        }

        .dealflow-task-entry__card-title {
            color: var(--text-primary);
            font-size: 17px;
            font-weight: 700;
            margin: 0 0 4px;
        }

        .dealflow-task-entry__card-copy {
            color: var(--text-secondary);
            font-size: 13px;
            margin: 0;
        }

        .dealflow-task-entry__card-body {
            border-bottom-left-radius: inherit;
            border-bottom-right-radius: inherit;
            padding: 18px;
        }

        .dealflow-task-entry__actions {
            border-top: 1px solid var(--border-subtle-01);
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            padding: 18px 26px 22px;
        }

        .dealflow-task-entry__alert {
            margin-bottom: 0;
        }

        .dealflow-task-entry .form-control,
        .dealflow-task-entry .chosen-container-single .chosen-single,
        .dealflow-task-entry .chosen-container-multi .chosen-choices {
            background: var(--background);
            border: 1px solid var(--border-subtle-01);
            border-radius: var(--border-radius-sm);
            box-shadow: none;
            color: var(--text-primary);
            min-height: 42px;
        }

        .dealflow-task-entry .chosen-container {
            width: 100% !important;
        }

        .dealflow-task-entry .chosen-container-active {
            z-index: 40;
        }

        .dealflow-task-entry .chosen-drop {
            z-index: 45;
        }

        .dealflow-task-entry .form-control::placeholder {
            color: var(--text-secondary);
        }

        .dealflow-task-entry .form-control:focus,
        .dealflow-task-entry .chosen-container-active .chosen-single,
        .dealflow-task-entry .chosen-container-active .chosen-choices {
            border-color: var(--link-primary);
            box-shadow: 0 0 0 1px var(--link-primary);
        }

        .dealflow-task-entry textarea.form-control {
            min-height: 118px;
            resize: vertical;
        }

        .dealflow-task-entry .editor.form-control {
            min-height: auto;
        }
    </style>

    {{ form_start(form, {'action': formAction|default(null)}) }}
    <div class="dealflow-task-entry{{ isModal ? ' dealflow-task-entry--modal' : '' }}">
        {% if not isModal %}
            <div class="dealflow-task-entry__header">
                <span class="dealflow-task-entry__eyebrow">Keep execution moving</span>
                <h2 class="dealflow-task-entry__title">{{ pageTitle }}</h2>
                <p class="dealflow-task-entry__copy">Attach the task to the right open deal, assign ownership, and make the timing explicit so the queue stays actionable.</p>
            </div>
        {% endif %}

        <div class="dealflow-task-entry__body{{ isModal ? ' dealflow-task-entry__body--modal' : '' }}">
            {% if form.vars.errors|length > 0 %}
                <div class="alert alert-danger dealflow-task-entry__alert">
                    {{ form_errors(form) }}
                </div>
            {% endif %}

            {% if not canCreateTask %}
                <div class="alert alert-warning dealflow-task-entry__alert">
                    No editable open deals are available in this pipeline yet. Create or reopen a deal first, then add a task.
                </div>
            {% endif %}

            <section class="dealflow-task-entry__card">
                <div class="dealflow-task-entry__card-head">
                    <h3 class="dealflow-task-entry__card-title">Task details</h3>
                    <p class="dealflow-task-entry__card-copy">Start with the deal and the action itself, then set ownership and timing.</p>
                </div>
                <div class="dealflow-task-entry__card-body">
                    <div class="row">
                        <div class="col-md-12">{{ form_row(form.dealId) }}</div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">{{ form_row(form.title) }}</div>
                    </div>
                    <div class="row">
                        <div class="col-md-6">{{ form_row(form.priority) }}</div>
                        <div class="col-md-6">{{ form_row(form.ownerId) }}</div>
                    </div>
                    <div class="row">
                        <div class="col-md-6">{{ form_row(form.dueAt) }}</div>
                        <div class="col-md-6">{{ form_row(form.reminderAt) }}</div>
                    </div>
                    {{ form_row(form.description) }}
                </div>
            </section>
        </div>

        <div class="dealflow-task-entry__actions">
            <button class="btn btn-primary" type="submit" {% if not canCreateTask %}disabled{% endif %}>
                <i class="ri-check-line"></i>
                Create Task
            </button>
            {% if isModal %}
                <button class="btn btn-secondary" type="button" data-dismiss="modal">
                    <i class="ri-close-line"></i>
                    Cancel
                </button>
            {% else %}
                <a class="btn btn-secondary" href="{{ cancelUrl|default(path('mautic_dealflow_task_queue')) }}" data-toggle="ajax">
                    <i class="ri-close-line"></i>
                    Cancel
                </a>
            {% endif %}
        </div>
    </div>
    {{ form_end(form) }}
{% endblock %}
