{{!
    This file is part of Moodle - http://moodle.org/

    Moodle is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Moodle is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
}}
{{!
    @template local_coursegen/activity_chat_footer

    Activity Chat Footer Template

    Template for the chat interface that appears in the modal footer.
    Contains form for activity AI generation with image options.

    Example context (json):
    {
        "languages": [
            {
                "code": "es",
                "name": "Spanish (ES)",
                "selected": true
            },
            {
                "code": "en",
                "name": "English (EN)",
                "selected": false
            }
        ]
    }
}}
<div class="col-lg-10">
    <div class="py-3 w-100" data-region="local_coursegen/activity/chat">
    <form class="local_coursegen_ai_input" novalidate data-region="local_coursegen/activity/form">
        
        <!-- Radios arriba -->
        <div style="gap: .8rem;" class="mb-2 d-flex align-items-center flex-wrap">
            <label style="gap: .3rem;" class="mb-0 d-flex align-items-center">
                <input type="radio" name="generate_images" value="0" checked>
                {{#str}} noimages, local_coursegen {{/str}}
            </label>
            <label style="gap: .3rem;" class="mb-0 d-flex align-items-center">
                <input type="radio" name="generate_images" value="1">
                {{#str}} yesimages, local_coursegen {{/str}}
            </label>
            <label class="mb-0 d-flex align-items-center" style="gap: .4rem;">
                <select class="custom-select custom-select-sm" data-region="local_coursegen/activity/lang" style="width: auto; min-width: 170px;">
                    {{#languages}}
                        <option value="{{code}}" {{#selected}}selected{{/selected}}>{{name}}</option>
                    {{/languages}}
                </select>
            </label>
        </div>

        <div class="mb-2" data-region="local_coursegen/activity/selectedfile" style="display: none;">
            <div class="d-flex align-items-center justify-content-between p-2 border rounded bg-light" style="gap: .5rem;">
                <div class="text-truncate" style="min-width: 0;">
                    <i class="fa fa-paperclip mr-1" aria-hidden="true"></i>
                    <span data-region="local_coursegen/activity/selectedfile_name"></span>
                </div>
                <button type="button" class="btn btn-link p-0" data-region="local_coursegen/activity/selectedfile_remove">
                    <i class="fa fa-times" aria-hidden="true"></i>
                </button>
            </div>
        </div>

        <!-- Barra de entrada estilo chat (textarea arriba, botones abajo) -->
        <label class="sr-only" for="local-coursegen-activity-prompt">{{#str}} addactivityai_label, local_coursegen {{/str}}</label>
        <div class="ai-prompt-container shadow-sm d-flex flex-column"
             style="background-color: var(--body-bg); border: 1px solid var(--border-color, #d1d5db); border-radius: 24px; padding: 10px; max-width: 100%;">

            <textarea
                id="local-coursegen-activity-prompt"
                class="form-control ai-prompt-textarea local_coursegen_ai_textarea"
                data-region="local_coursegen/activity/prompt"
                placeholder="{{#str}} addactivityai_placeholder, local_coursegen {{/str}}"
                rows="1"
                style="resize: none; border: none; box-shadow: none; padding: 0 10px; margin: 0; background: transparent; min-height: 24px; max-height: 6em; overflow-y: auto; line-height: 1.5; color: inherit; width: 100%;"></textarea>

            <div class="d-flex justify-content-between align-items-center">
                <button type="button" class="btn btn-light p-0 d-flex align-items-center justify-content-center rounded-circle"
                    data-region="local_coursegen/activity/upload"
                    style="width: 34px; height: 34px; flex-shrink: 0;">
                    <i class="fa fa-file text-primary" aria-hidden="true" style="font-size: 1.1rem;"></i>
                </button>

                <button class="btn btn-light p-0 d-flex align-items-center justify-content-center text-primary ai-btn-send local_coursegen_ai_send"
                    type="submit" title="{{#str}} send, local_coursegen {{/str}}"
                    data-region="local_coursegen/activity/send">
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="18" height="18" fill="currentColor">
                        <path d="M2 21l21-9L2 3v7l15 2-15 2v7z"/>
                    </svg>
                </button>
            </div>
        </div>
    </form>
    </div>
    <div class="w-100 text-center mt-2">
        <small class="text-muted">
            {{#str}}poweredby, local_coursegen{{/str}}
            <a href="https://datacurso.com/" target="_blank" rel="noopener">
                Data Curso LLC
            </a>
        </small>
    </div>
</div>
