{# Panneau de paramètres de l'activité #}
<div class="activity-settings-panel" id="activitySettingsPanel">
    <div class="activity-settings-panel__overlay" data-action="click->moodia--modals#closeActivitySettings"></div>
    <div class="activity-settings-panel__content">
        <div class="activity-settings-panel__header">
            <h3 class="activity-settings-panel__title">
                <svg width="20" height="20" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path class="svg-secondary" d="M9.95455 0H8.04545C6.99109 0 6.13635 0.805888 6.13635 1.8C6.13635 2.93761 4.91917 3.66087 3.92 3.11697L3.81852 3.06172C2.90541 2.56467 1.73782 2.85964 1.21064 3.72057L0.256091 5.27942C-0.271092 6.14034 0.0417618 7.24121 0.954869 7.73826C1.95451 8.28242 1.95451 9.71758 0.954868 10.2617C0.0417603 10.7588 -0.271093 11.8597 0.256089 12.7206L1.21064 14.2794C1.73782 15.1404 2.90541 15.4353 3.81851 14.9383L3.92 14.883C4.91917 14.3391 6.13635 15.0624 6.13635 16.2C6.13635 17.1941 6.99109 18 8.04545 18H9.95455C11.0089 18 11.8636 17.1941 11.8636 16.2C11.8636 15.0624 13.0808 14.3391 14.08 14.883L14.1815 14.9383C15.0946 15.4353 16.2622 15.1403 16.7894 14.2794L17.7439 12.7206C18.2711 11.8596 17.9582 10.7588 17.0451 10.2617C16.0455 9.71757 16.0455 8.28243 17.0451 7.73828C17.9582 7.24122 18.2711 6.14036 17.7439 5.27943L16.7894 3.72058C16.2622 2.85966 15.0946 2.56468 14.1815 3.06174L14.08 3.11698C13.0808 3.66088 11.8636 2.93762 11.8636 1.8C11.8636 0.805887 11.0089 0 9.95455 0Z" fill="currentColor"/>
                    <circle class="svg-primary" cx="9" cy="9" r="3" fill="currentColor"/>
                </svg>
                Paramètres · <span id="activityTypeName"></span>
            </h3>
            <button
                type="button"
                class="activity-settings-panel__close"
                data-action="click->moodia--modals#closeActivitySettings"
                title="Fermer"
            >
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <line x1="18" y1="6" x2="6" y2="18"></line>
                    <line x1="6" y1="6" x2="18" y2="18"></line>
                </svg>
            </button>
        </div>
        <div class="activity-settings-panel__body">
            {# Paramètre : Suivi de progression #}
            <label class="activity-setting" for="settingTrackable">
                <div class="activity-setting__content">
                    <div class="activity-setting__icon">
                        📊
                    </div>
                    <div class="activity-setting__info">
                        <h4 class="activity-setting__title">Suivi de progression</h4>
                        <p class="activity-setting__description">
                            Voulez-vous suivre la progression du stagiaire sur cette activité ?
                        </p>
                    </div>
                </div>
                <div class="activity-setting__control">
                    <input
                        type="checkbox"
                        class="activity-setting__toggle"
                        id="settingTrackable"
                        data-action="change->moodia--modals#toggleTrackable"
                    >
                    <span class="activity-setting__toggle-label"></span>
                </div>
            </label>

            {# Zone pour futurs paramètres #}
            <div class="activity-setting activity-setting--placeholder">
                <div class="activity-setting__placeholder">
                    <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                        <circle cx="12" cy="12" r="10"></circle>
                        <line x1="12" y1="8" x2="12" y2="12"></line>
                        <line x1="12" y1="16" x2="12.01" y2="16"></line>
                    </svg>
                    <p>D'autres paramètres seront ajoutés prochainement</p>
                </div>
            </div>
        </div>
        <div class="activity-settings-panel__footer">
            <button
                type="button"
                class="activity-settings-panel__btn activity-settings-panel__btn--close"
                data-action="click->moodia--modals#closeActivitySettings"
            >
                Fermer
            </button>
        </div>
    </div>
</div>