<template>
    <div
        class="fmt-modal__panel"
        role="tabpanel"
        aria-labelledby="fmt-tab-advanced"
        id="fmt-panel-advanced"
    >
                                <div class="fmt-setting">
                                    <span>{{
                                        __("Custom CSS", "formatrica")
                                    }}</span>
                                    <textarea
                                        rows="6"
                                        v-model="local.custom_css"
                                        spellcheck="false"
                                    ></textarea>
                                    <small class="fmt-setting__hint">
                                        {{
                                            __(
                                                "CSS is scoped to the form wrapper and injected inline on render.",
                                                "formatrica",
                                            )
                                        }}
                                    </small>
                                </div>
        
    </div>
</template>

<script setup>
import { inject } from "vue";
import { __ } from "@/utils/i18n";

const ctx = inject("formSettingsContext");

if (!ctx) {
    throw new Error("Form settings context not provided");
}

const { local } = ctx;
</script>
