@mohasinac/appkit 4.70.0 → 4.71.2

package/dist/features/admin/components/AdminSiteSettingsView.js

@@ -16,14 +16,13 @@ import { MediaUploadField } from "../../media/upload/MediaUploadField.js";
 import { useMediaUpload } from "../../media/hooks/useMedia.js";
 import { apiClient } from "../../../http/index.js";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints.js";
-import { ROUTES } from "../../../next/routing/route-map.js";
 import { NOTIFICATION_TYPE_TABS } from "../../../constants/notification-types.js";
-import { ALL_LISTING_TYPES, ALL_BROWSE_PAGES, } from "../../../_internal/shared/listing-types/feature-flags.js";
+import { ALL_LISTING_TYPES, ALL_BROWSE_PAGES, FLAG_CHOICE_OPTIONS, flagValueToChoice, choiceToFlagValue, } from "../../../_internal/shared/listing-types/feature-flags.js";
 import { pluginFor } from "../../../_internal/shared/listing-types/_registry.js";
 import { SITE_SETTINGS_TABS, isSiteSettingsTabId, } from "../constants/site-settings-tabs.js";
 import { ThemeManagerView, } from "../../site-settings/components/ThemeManagerView.js";
 import { DEFAULT_LIGHT_THEME, DEFAULT_DARK_THEME } from "../../../tokens/themes/index.js";
-import { DEFAULT_AUCTION_BID_INCREMENT_TIERS, } from "../../../_internal/shared/features/auctions/config.js";
+import { DEFAULT_COLLECTOR_DROP_BID_INCREMENT_TIERS, } from "../../../_internal/shared/features/collector-drops/config.js";
 import { validateGstEnablement } from "../../../_internal/shared/features/site-settings/gst-registration.js";
 /*
  * 🛑 The SAME constant the checkout page and the server-side gate read. An
@@ -32,9 +31,37 @@ import { validateGstEnablement } from "../../../_internal/shared/features/site-s
  */
 import { COD_MAX_ORDER_VALUE_FALLBACK } from "../schemas/firestore.js";
 import { siteSettingsFormSchema } from "../schemas/site-settings-form.js";
+import { siteSettingsBrandingFormSchema, } from "../schemas/site-settings-branding-form.js";
+import { siteSettingsAnnouncementFormSchema, } from "../schemas/site-settings-announcement-form.js";
+import { siteSettingsSeoFormSchema, } from "../schemas/site-settings-seo-form.js";
+import { siteSettingsContactFormSchema, } from "../schemas/site-settings-contact-form.js";
+import { siteSettingsWatermarkFormSchema, } from "../schemas/site-settings-watermark-form.js";
+import { siteSettingsFeesFormSchema, } from "../schemas/site-settings-fees-form.js";
+import { siteSettingsProcurementFormSchema, } from "../schemas/site-settings-procurement-form.js";
+import { siteSettingsLimitsFormSchema, } from "../schemas/site-settings-limits-form.js";
+import { siteSettingsNotificationsFormSchema, } from "../schemas/site-settings-notifications-form.js";
+import { siteSettingsShippingFormSchema, } from "../schemas/site-settings-shipping-form.js";
+import { siteSettingsGstFormSchema, } from "../schemas/site-settings-gst-form.js";
+import { siteSettingsEmiFormSchema, } from "../schemas/site-settings-emi-form.js";
+import { siteSettingsLegalFormSchema, LEGAL_PAGE_FIELDS, } from "../schemas/site-settings-legal-form.js";
+import { siteSettingsWhatsappFormSchema, } from "../schemas/site-settings-whatsapp-form.js";
+import { siteSettingsIntegrationsFormSchema, MASKED_CREDENTIAL_FIELDS, } from "../schemas/site-settings-integrations-form.js";
+import { siteSettingsCollectorDropFormSchema, } from "../schemas/site-settings-collector-drop-form.js";
+import { siteSettingsListingsFormSchema, } from "../schemas/site-settings-listings-form.js";
+import { siteSettingsAppearanceFormSchema, } from "../schemas/site-settings-appearance-form.js";
+import { siteSettingsAboutFormSchema, } from "../schemas/site-settings-about-form.js";
+import { Repeater } from "../../../ui/components/Repeater.js";
 import { FormErrorSummary } from "../../../ui/forms/FormErrorSummary.js";
 import { SectionForm } from "../../shell/SectionForm.js";
-import { useFormShellState, FormShellContext, applyZodIssues } from "../../../ui/forms/index.js";
+import { buildSectionsFromSchema, resolveFields } from "../../shell/build-sections.js";
+import { useFieldVisibility } from "../../shell/useFieldVisibility.js";
+import { swapFieldOrder } from "../../shell/field-ui-meta.js";
+import { useEditMode } from "../../../_internal/client/edit-mode/EditModeProvider.js";
+import { useFormShellState, FormShellContext, applyZodIssues, FieldInput, FieldTextarea } from "../../../ui/forms/index.js";
+import { FieldCheckbox } from "../../../ui/forms/FieldCheckbox.js";
+import { humaniseFieldName } from "../../shell/entity-form.js";
+import { getBrandName, getBrandDomain } from "../../../core/brand-resolver.js";
+import { AdminComposableRegion } from "../../dashboard/components/AdminComposableRegion.js";
 const __O = {
     hidden: "overflow-hidden",
 };
@@ -50,13 +77,39 @@ function MaskedInput({ label, value, onChange, placeholder, helperText, }) {
     const [revealed, setRevealed] = React.useState(false);
     return (_jsxs(Div, { className: "relative", children: [_jsx(Input, { label: label, value: value, onChange: (e) => onChange(e.target.value), type: revealed ? "text" : "password", placeholder: placeholder, helperText: helperText }), _jsx(Button, { type: "button", variant: "ghost", textSize: "xs", textColor: "faint", paddingX: "none", paddingY: "none", onClick: () => setRevealed((r) => !r), className: "absolute right-3 top-8", children: revealed ? "Hide" : "Reveal" })] }));
 }
-const NOTIF_CHANNEL_INDENT = "space-y-4 pl-4 border-l-2 border-[var(--appkit-color-border)]";
 const PRIORITY_OPTIONS = [
     { label: "Low (send all)", value: "low" },
     { label: "Normal", value: "normal" },
     { label: "High", value: "high" },
     { label: "Critical only", value: "critical" },
 ];
+/*
+ * Moved to module scope from inside the component body (2026-11-04,
+ * Shipping tab migration) — `buildSectionsFromSchema`'s `opts.options` is a
+ * plain object evaluated eagerly at the point the `useMemo` factory runs,
+ * unlike a `renderers` function value, so a component-scoped `const`
+ * declared textually AFTER that `useMemo` call would be a TDZ error at
+ * runtime. A module-level const has no such ordering constraint.
+ */
+const CARRIER_OPTIONS = [
+    { label: "Custom / Other", value: "custom" },
+    { label: "Shiprocket", value: "shiprocket" },
+    { label: "Delhivery", value: "delhivery" },
+    { label: "Bluedart", value: "bluedart" },
+    { label: "FedEx", value: "fedex" },
+];
+/*
+ * Shared by every gateway that has a sandbox/production split (PhonePe,
+ * Cashfree). Was `PHONEPE_ENVIRONMENT_OPTIONS`; renamed when the second
+ * gateway needed the identical two options, because a provider-named
+ * constant used by two providers is how a name stops meaning anything.
+ * Module scope for the same eager-evaluation reason as `CARRIER_OPTIONS`
+ * above (2026-11-04, Integrations tab migration).
+ */
+const GATEWAY_ENVIRONMENT_OPTIONS = [
+    { label: "Sandbox (test)", value: "sandbox" },
+    { label: "Production (live)", value: "production" },
+];
 /** Single persistent save action for the whole settings form — every tab writes
  * into the same combined payload, so one save covers whichever tabs were edited
  * regardless of which one is currently active. */
@@ -84,11 +137,47 @@ function SettingsTabForm({ id, label, children, }) {
  * on every render of a 20-tab page.
  */
 const EMPTY_TAB_VALUES = {};
+/** 1A-v (overhaul brief) — `ActionKind` display text, for the listing-type
+ * toggle grid's own label only; not reused anywhere a translated or
+ * buyer-facing string is needed. */
+const ACTION_KIND_LABELS = {
+    "buy-now": "Buy Now",
+    bid: "Bid",
+    reserve: "Reserve",
+    "enter-draw": "Enter Draw",
+    "make-offer": "Make Offer",
+};
+/**
+ * Reproduces the generator's default `kind: "toggle"` rendering
+ * (`FieldCheckbox`, see `build-sections.tsx`'s `renderField`), wrapped in an
+ * `id`-bearing anchor — fixed 2026-11-05. The old hand-written JSX carried
+ * 13 literal `id="setting-*"` attributes (`settings-preview-registry.ts`'s
+ * own header comment records the count), used by the dashboard's "jump to
+ * this setting" cards and the `?tab=X#setting-Y` search-index deep links.
+ * The generator has no per-field DOM-id mechanism, so the Universal Template
+ * System migration silently dropped all of them — flagged as a known gap in
+ * the Branding tab's own commit message at the time, and confirmed as a
+ * real regression by `audit-widget-descriptor-sync`/`audit-action-index`
+ * once the whole migration was gated.
+ *
+ * 🛑 A component taking `id` as a real JSX attribute, NOT a function
+ * returning a closure over a string parameter — `audit-widget-descriptor-sync`/
+ * `audit-action-index` both do a literal SOURCE-TEXT search for
+ * `id="setting-X"` (`adminSiteSettingsSrc.includes('id="${anchorId}"')`,
+ * not a DOM/runtime check), so `id={someVariable}` passes functionally but
+ * fails the audit textually. Writing `id="setting-x"` as a literal at each
+ * call site satisfies both. Not a generic `domId` mechanism on
+ * `FieldUiMeta` — adding one for 8 current call sites would be new
+ * infrastructure for a need that has not recurred beyond this list.
+ */
+function AnchoredToggle({ id, field, values, onChange, }) {
+    return (_jsx("div", { id: id, children: _jsx(FieldCheckbox, { name: field.name, label: field.meta.label ?? humaniseFieldName(field.name), hint: field.meta.help, checked: Boolean(values[field.name]), onChange: (v) => onChange({ [field.name]: v }) }) }));
+}
 function SaveAllBar({ isPending, onSave }) {
     return (_jsxs(_Fragment, { children: [_jsx(FormErrorSummary, {}), _jsx(FormActions, { align: "right", children: _jsx(Button, { type: "button", isLoading: isPending, disabled: isPending, onClick: onSave, children: isPending ? "Saving…" : "Save all changes" }) })] }));
 }
 // --- Component ---------------------------------------------------------------
-export function AdminSiteSettingsView({ labels = {}, ...rest }) {
+export function AdminSiteSettingsView({ labels = {}, pageRegionCards = [], ...rest }) {
     const queryClient = useQueryClient();
     const { showToast } = useToast();
     /*
@@ -116,295 +205,608 @@ export function AdminSiteSettingsView({ labels = {}, ...rest }) {
         },
     });
     const s = (data ?? {});
-    // ① Branding
-    const [siteName, setSiteName] = React.useState("");
-    const [tagline, setTagline] = React.useState("");
-    const [logoUrl, setLogoUrl] = React.useState("");
-    const [faviconUrl, setFaviconUrl] = React.useState("");
-    const [maintenanceMode, setMaintenanceMode] = React.useState(false);
-    const [maintenanceMessage, setMaintenanceMessage] = React.useState("");
-    // ② Appearance — background image/gradient/color/video (light + dark).
+    // ① Branding — first tab migrated to the Universal Template System
+    // (schema + buildSectionsFromSchema), 2026-11-04. One combined object
+    // instead of eight useState calls; `chatEnabled` defaults false (D9,
+    // opt-in) and `assistantEnabled` defaults true (kill switch on an
+    // already-shipped path, matching assertAssistantEnabled's server-side
+    // polarity) — same defaults the eight separate calls used.
+    const [brandingForm, setBrandingForm] = React.useState({
+        siteName: "", tagline: "", logoUrl: "", faviconUrl: "",
+        maintenanceMode: false, maintenanceMessage: "",
+        chatEnabled: false, assistantEnabled: true,
+    });
+    const { editMode } = useEditMode();
+    const { fields: brandingVisibilityFields, setVisible: setBrandingFieldVisible, fieldOrder: brandingFieldOrder, setFieldOrder: setBrandingFieldOrder, } = useFieldVisibility("admin-site-settings-branding");
+    const brandingSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsBrandingFormSchema, {
+        renderers: {
+            logoUrl: ({ values, onChange }) => (_jsx(ImageUpload, { label: "Logo", currentImage: values.logoUrl ?? "", onUpload: (file) => upload(file, "store"), onChange: (url) => onChange({ logoUrl: url }) })),
+            faviconUrl: ({ values, onChange }) => (_jsx(ImageUpload, { label: "Favicon", currentImage: values.faviconUrl ?? "", onUpload: (file) => upload(file, "store"), onChange: (url) => onChange({ faviconUrl: url }) })),
+        },
+        fieldVisibility: brandingVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setBrandingFieldVisible,
+        fieldOrder: brandingFieldOrder,
+        onMoveField: (fieldName, neighborName) => setBrandingFieldOrder(swapFieldOrder(brandingFieldOrder, resolveFields(siteSettingsBrandingFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [brandingVisibilityFields, editMode, setBrandingFieldVisible, brandingFieldOrder, setBrandingFieldOrder, upload]);
+    // ② Appearance — eighteenth tab migrated to the Universal Template
+    // System, 2026-11-04. Ten useState calls collapsed into two combined
+    // objects (`lightBg`/`darkBg`), each a structured value rather than a
+    // scalar — see site-settings-appearance-form.ts's header for why.
+    //
     // The old primaryColor/secondaryColor/accentColor/fontFamily/defaultTheme
     // fields here were dead (saved to Firestore, never read back anywhere —
     // redundant with the working Theme Manager tab below). Removed 2026-08-09.
-    const [lightBgType, setLightBgType] = React.useState("color");
-    const [lightBgValue, setLightBgValue] = React.useState("");
-    const [lightBgOverlayEnabled, setLightBgOverlayEnabled] = React.useState(false);
-    const [lightBgOverlayColor, setLightBgOverlayColor] = React.useState("#000000");
-    const [lightBgOverlayOpacity, setLightBgOverlayOpacity] = React.useState(30);
-    const [darkBgType, setDarkBgType] = React.useState("color");
-    const [darkBgValue, setDarkBgValue] = React.useState("");
-    const [darkBgOverlayEnabled, setDarkBgOverlayEnabled] = React.useState(false);
-    const [darkBgOverlayColor, setDarkBgOverlayColor] = React.useState("#000000");
-    const [darkBgOverlayOpacity, setDarkBgOverlayOpacity] = React.useState(30);
+    const [appearanceForm, setAppearanceForm] = React.useState({
+        lightBg: { type: "color", value: "", overlayEnabled: false, overlayColor: "#000000", overlayOpacity: 30 },
+        darkBg: { type: "color", value: "", overlayEnabled: false, overlayColor: "#000000", overlayOpacity: 30 },
+    });
+    const { fields: appearanceVisibilityFields, setVisible: setAppearanceFieldVisible, fieldOrder: appearanceFieldOrder, setFieldOrder: setAppearanceFieldOrder, } = useFieldVisibility("admin-site-settings-appearance");
+    /*
+     * Shared by both `lightBg` and `darkBg` — the original JSX was already
+     * byte-structurally identical for both modes apart from the default
+     * swatch color and the `<BackgroundRenderer mode>` prop, so this is the
+     * ONE renderer, parameterized, rather than two hand-written copies.
+     */
+    const buildBackgroundModeRenderer = React.useCallback((mode, defaultColor) => ({ values, onChange }) => {
+        const fieldName = mode === "light" ? "lightBg" : "darkBg";
+        const bg = values[fieldName];
+        const setBg = (patch) => onChange({ [fieldName]: { ...bg, ...patch } });
+        return (_jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "md", children: [_jsx(Text, { size: "sm", weight: "semibold", children: mode === "light" ? "Light mode" : "Dark mode" }), _jsx(Select, { label: "Type", options: BG_TYPE_OPTIONS, value: bg.type, onValueChange: (v) => setBg({ type: v }) }), bg.type === "color" ? (_jsx(Input, { type: "color", label: "Color", value: bg.value || defaultColor, onChange: (e) => setBg({ value: e.target.value }), className: "h-10 w-full cursor-pointer", bare: true }) /* audit-hex-tokens-ok: native color picker requires literal hex string fallback */) : bg.type === "gradient" ? (_jsx(Textarea, { label: "CSS gradient expression", rows: 2, value: bg.value, onChange: (e) => setBg({ value: e.target.value }), placeholder: "linear-gradient(...)" })) : (_jsx(MediaUploadField, { label: bg.type === "video" ? "Background video" : "Background image", kind: bg.type === "video" ? "video" : "image", value: bg.value, onChange: (v) => setBg({ value: v }), onUpload: (file) => upload(file, "store") })), _jsx(Toggle, { label: "Dim overlay", checked: bg.overlayEnabled, onChange: (v) => setBg({ overlayEnabled: v }) }), bg.overlayEnabled && (_jsxs(_Fragment, { children: [_jsx(Input, { type: "color", label: "Overlay color", value: bg.overlayColor, onChange: (e) => setBg({ overlayColor: e.target.value }), className: "h-10 w-full cursor-pointer", bare: true }), " ", _jsx(Slider, { label: "Overlay opacity", min: 0, max: 100, value: bg.overlayOpacity, onChange: (v) => setBg({ overlayOpacity: v }) })] })), _jsx(Text, { size: "xs", color: "muted", children: "Preview" }), _jsx(Div, { className: "relative h-24 w-full", overflow: "hidden", rounded: "md", border: "default", children: _jsx(BackgroundRenderer, { mode: mode, lightMode: mode === "light"
+                            ? { type: bg.type, value: bg.value, overlay: { enabled: bg.overlayEnabled, color: bg.overlayColor, opacity: bg.overlayOpacity / 100 } }
+                            : { type: "color", value: "" }, darkMode: mode === "dark"
+                            ? { type: bg.type, value: bg.value, overlay: { enabled: bg.overlayEnabled, color: bg.overlayColor, opacity: bg.overlayOpacity / 100 } }
+                            : { type: "color", value: "" } }) })] }));
+    }, [upload]);
+    const appearanceSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsAppearanceFormSchema, {
+        renderers: {
+            lightBg: buildBackgroundModeRenderer("light", "#ffffff"),
+            darkBg: buildBackgroundModeRenderer("dark", "#000000"),
+        },
+        fieldVisibility: appearanceVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setAppearanceFieldVisible,
+        fieldOrder: appearanceFieldOrder,
+        onMoveField: (fieldName, neighborName) => setAppearanceFieldOrder(swapFieldOrder(appearanceFieldOrder, resolveFields(siteSettingsAppearanceFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [appearanceVisibilityFields, editMode, setAppearanceFieldVisible, appearanceFieldOrder, setAppearanceFieldOrder, buildBackgroundModeRenderer]);
     // Theme registry (custom themes + default-light / default-dark pointers).
     const [themeRegistry, setThemeRegistry] = React.useState({
         themes: [],
         defaultLightThemeId: DEFAULT_LIGHT_THEME.id,
         defaultDarkThemeId: DEFAULT_DARK_THEME.id,
     });
-    // ③ Announcement
-    const [announcementEnabled, setAnnouncementEnabled] = React.useState(false);
-    const [announcementText, setAnnouncementText] = React.useState("");
-    const [announcementLink, setAnnouncementLink] = React.useState("");
-    const [announcementBg, setAnnouncementBg] = React.useState("");
-    // ④ SEO
-    const [seoTitle, setSeoTitle] = React.useState("");
-    const [seoDescription, setSeoDescription] = React.useState("");
-    const [seoOgImage, setSeoOgImage] = React.useState("");
-    const [seoNoIndex, setSeoNoIndex] = React.useState(false);
-    const [canonicalUrl, setCanonicalUrl] = React.useState("");
-    // ⑤ Contact & Social
-    const [supportEmail, setSupportEmail] = React.useState("");
-    const [supportPhone, setSupportPhone] = React.useState("");
-    const [supportAddress, setSupportAddress] = React.useState("");
-    const [supportHours, setSupportHours] = React.useState("");
-    const [instagram, setInstagram] = React.useState("");
-    const [twitter, setTwitter] = React.useState("");
-    const [facebook, setFacebook] = React.useState("");
-    const [youtube, setYoutube] = React.useState("");
-    const [whatsapp, setWhatsapp] = React.useState("");
-    /*
-     * 🛑 Load-bearing, and its absence was a live bug until 2026-10-19.
-     *
-     * `buildFullPayload()` writes the WHOLE `contact` group, so a key this
-     * component does not carry in state is erased on the next save of ANY tab.
-     * `contact.upiVpa` is the site-wide fallback `resolveDisplayedUpiId` uses
-     * when a seller has no UPI configured or the store is admin-owned — i.e.
-     * the VPA a manual-payment buyer is told to pay into. Saving the Watermark
-     * tab silently blanked it.
-     */
-    const [upiVpa, setUpiVpa] = React.useState("");
-    const [linkedin, setLinkedin] = React.useState("");
-    const [pinterest, setPinterest] = React.useState("");
-    // ⑥ Watermark
-    const [watermarkType, setWatermarkType] = React.useState("text");
-    const [watermarkText, setWatermarkText] = React.useState("letitrip.in");
-    const [watermarkImageUrl, setWatermarkImageUrl] = React.useState("");
-    const [watermarkSize, setWatermarkSize] = React.useState(10);
-    const [watermarkOpacity, setWatermarkOpacity] = React.useState(10);
-    // 4 corners + center are picked from the Select; "custom" is only ever set
-    // by the offset toggle below, never a 6th Select option (keeps the picker
-    // at 5 options — see PaginatedSelect rule for >5).
-    const [watermarkPosition, setWatermarkPosition] = React.useState("center");
-    const [watermarkUseCustomOffset, setWatermarkUseCustomOffset] = React.useState(false);
-    const [watermarkOffsetX, setWatermarkOffsetX] = React.useState(0);
-    const [watermarkOffsetY, setWatermarkOffsetY] = React.useState(0);
+    // ③ Announcement — second tab migrated to the Universal Template System,
+    // 2026-11-04. One combined object instead of four useState calls.
+    const [announcementForm, setAnnouncementForm] = React.useState({
+        announcementEnabled: false, announcementText: "", announcementLink: "", announcementBg: "",
+    });
+    const { fields: announcementVisibilityFields, setVisible: setAnnouncementFieldVisible, fieldOrder: announcementFieldOrder, setFieldOrder: setAnnouncementFieldOrder, } = useFieldVisibility("admin-site-settings-announcement");
+    const announcementSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsAnnouncementFormSchema, {
+        renderers: {
+            announcementBg: ({ values, onChange }) => (_jsxs(Stack, { gap: "none", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", className: "mb-1", children: "Background color" }), _jsx(Input, { type: "color", "aria-label": "Background color", value: values.announcementBg || "#1d4ed8", onChange: (e) => onChange({ announcementBg: e.target.value }), className: "h-10 w-32 cursor-pointer", bare: true }), " "] })),
+            announcementEnabled: (props) => _jsx(AnchoredToggle, { id: "setting-announcement-bar", ...props }),
+        },
+        fieldVisibility: announcementVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setAnnouncementFieldVisible,
+        fieldOrder: announcementFieldOrder,
+        onMoveField: (fieldName, neighborName) => setAnnouncementFieldOrder(swapFieldOrder(announcementFieldOrder, resolveFields(siteSettingsAnnouncementFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [announcementVisibilityFields, editMode, setAnnouncementFieldVisible, announcementFieldOrder, setAnnouncementFieldOrder]);
+    // ④ SEO — third tab migrated to the Universal Template System, 2026-11-04.
+    const [seoForm, setSeoForm] = React.useState({
+        seoTitle: "", seoDescription: "", seoOgImage: "", canonicalUrl: "", seoNoIndex: false,
+    });
+    const { fields: seoVisibilityFields, setVisible: setSeoFieldVisible, fieldOrder: seoFieldOrder, setFieldOrder: setSeoFieldOrder, } = useFieldVisibility("admin-site-settings-seo");
+    const seoSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsSeoFormSchema, {
+        renderers: {
+            seoOgImage: ({ values, onChange }) => (_jsx(ImageUpload, { label: "Default OG image", currentImage: values.seoOgImage ?? "", onUpload: (file) => upload(file, "store"), onChange: (url) => onChange({ seoOgImage: url }) })),
+            seoNoIndex: (props) => _jsx(AnchoredToggle, { id: "setting-robots-noindex", ...props }),
+        },
+        fieldVisibility: seoVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setSeoFieldVisible,
+        fieldOrder: seoFieldOrder,
+        onMoveField: (fieldName, neighborName) => setSeoFieldOrder(swapFieldOrder(seoFieldOrder, resolveFields(siteSettingsSeoFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [seoVisibilityFields, editMode, setSeoFieldVisible, seoFieldOrder, setSeoFieldOrder, upload]);
+    // ⑤ Contact & Social — fourth tab migrated to the Universal Template
+    // System, 2026-11-04. One combined object instead of twelve useState
+    // calls.
+    //
+    // 🛑 `upiVpa` specifically is load-bearing, and its absence from this
+    // object was a live bug until 2026-10-19 under the old per-field state.
+    // `buildFullPayload()` writes the WHOLE `contact` group, so a key this
+    // component does not carry is erased on the next save of ANY tab.
+    // `contact.upiVpa` is the site-wide fallback `resolveDisplayedUpiId` uses
+    // when a seller has no UPI configured or the store is admin-owned — i.e.
+    // the VPA a manual-payment buyer is told to pay into. Carried through
+    // unconditionally below, same as every other field in this object.
+    const [contactForm, setContactForm] = React.useState({
+        supportEmail: "", supportPhone: "", supportAddress: "", supportHours: "",
+        instagram: "", twitter: "", facebook: "", youtube: "", whatsapp: "",
+        upiVpa: "", linkedin: "", pinterest: "",
+    });
+    const { fields: contactVisibilityFields, setVisible: setContactFieldVisible, fieldOrder: contactFieldOrder, setFieldOrder: setContactFieldOrder, } = useFieldVisibility("admin-site-settings-contact");
+    const contactSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsContactFormSchema, {
+        fieldVisibility: contactVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setContactFieldVisible,
+        fieldOrder: contactFieldOrder,
+        onMoveField: (fieldName, neighborName) => setContactFieldOrder(swapFieldOrder(contactFieldOrder, resolveFields(siteSettingsContactFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [contactVisibilityFields, editMode, setContactFieldVisible, contactFieldOrder, setContactFieldOrder]);
+    // ⑥ Watermark — fifth tab migrated to the Universal Template System,
+    // 2026-11-04. One combined object instead of nine useState calls.
+    //
+    // "custom" is only ever set by the offset toggle, never a 6th Select
+    // option (keeps the picker at 5 options — see PaginatedSelect rule for >5)
+    // — `watermarkPosition` itself stays the 5-value enum; `buildFullPayload()`
+    // still substitutes "custom" for the SAVED `position` key when the offset
+    // toggle is on, exactly as the old single-field version did.
+    const [watermarkForm, setWatermarkForm] = React.useState({
+        watermarkType: "text", watermarkText: getBrandDomain(), watermarkImageUrl: "",
+        watermarkSize: 10, watermarkOpacity: 10, watermarkPosition: "center",
+        watermarkUseCustomOffset: false, watermarkOffsetX: 0, watermarkOffsetY: 0,
+    });
+    const { fields: watermarkVisibilityFields, setVisible: setWatermarkFieldVisible, fieldOrder: watermarkFieldOrder, setFieldOrder: setWatermarkFieldOrder, } = useFieldVisibility("admin-site-settings-watermark");
+    const watermarkSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsWatermarkFormSchema, {
+        renderers: {
+            watermarkImageUrl: ({ values, onChange }) => (_jsx(ImageUpload, { label: "Watermark image", currentImage: values.watermarkImageUrl ?? "", onUpload: (file) => upload(file, "store"), onChange: (url) => onChange({ watermarkImageUrl: url }) })),
+            watermarkSize: ({ values, onChange }) => (_jsx(Slider, { label: `Size — ${values.watermarkSize}% of image width`, value: values.watermarkSize, onChange: (v) => onChange({ watermarkSize: v }), min: 5, max: 100, step: 5 })),
+            watermarkOpacity: ({ values, onChange }) => (_jsx(Slider, { label: `Opacity — ${values.watermarkOpacity}%`, value: values.watermarkOpacity, onChange: (v) => onChange({ watermarkOpacity: v }), min: 5, max: 100, step: 5 })),
+            watermarkPosition: ({ values, onChange }) => (_jsx(Select, { label: "Position", options: [
+                    { label: "Center", value: "center" },
+                    { label: "Top left", value: "top-left" },
+                    { label: "Top right", value: "top-right" },
+                    { label: "Bottom left", value: "bottom-left" },
+                    { label: "Bottom right", value: "bottom-right" },
+                ], value: values.watermarkPosition, onValueChange: (v) => onChange({ watermarkPosition: v }), disabled: Boolean(values.watermarkUseCustomOffset) })),
+            watermarkOffsetX: ({ values, onChange }) => (_jsx(Input, { label: "X offset (%) \u2014 + right / \u2212 left of center", value: String(values.watermarkOffsetX), onChange: (e) => onChange({ watermarkOffsetX: Math.max(-45, Math.min(45, parseInt(e.target.value) || 0)) }), type: "number", min: -45, max: 45 })),
+            watermarkOffsetY: ({ values, onChange }) => (_jsx(Input, { label: "Y offset (%) \u2014 + down / \u2212 up from center", value: String(values.watermarkOffsetY), onChange: (e) => onChange({ watermarkOffsetY: Math.max(-45, Math.min(45, parseInt(e.target.value) || 0)) }), type: "number", min: -45, max: 45 })),
+        },
+        fieldVisibility: watermarkVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setWatermarkFieldVisible,
+        fieldOrder: watermarkFieldOrder,
+        onMoveField: (fieldName, neighborName) => setWatermarkFieldOrder(swapFieldOrder(watermarkFieldOrder, resolveFields(siteSettingsWatermarkFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [watermarkVisibilityFields, editMode, setWatermarkFieldVisible, watermarkFieldOrder, setWatermarkFieldOrder, upload]);
     const watermarkPreviewRef = React.useRef(null);
     React.useEffect(() => {
         const el = watermarkPreviewRef.current;
         if (!el)
             return;
-        el.style.fontSize = `${Math.max(10, watermarkSize / 5)}px`;
-        el.style.opacity = String(watermarkOpacity / 100);
-    }, [watermarkSize, watermarkOpacity]);
-    // ⑦ Fees — all read/written under commissions key
-    const [laborHourlyRate, setLaborHourlyRate] = React.useState(200);
-    const [laborMaxHoursPerDay, setLaborMaxHoursPerDay] = React.useState(6);
-    // ⑯ EMI — site-wide installment settings
-    const [emiEnabled, setEmiEnabled] = React.useState(false);
-    const [emiMinOrderValue, setEmiMinOrderValue] = React.useState(10000);
-    const [emiTenureOptionsText, setEmiTenureOptionsText] = React.useState("2,3,4,5,6");
-    const [emiTokenPercent, setEmiTokenPercent] = React.useState(20);
-    const [emiBillingDay, setEmiBillingDay] = React.useState(5);
-    const [emiSurchargePercentPerMonth, setEmiSurchargePercentPerMonth] = React.useState(2);
-    const [emiSurchargeSellerSharePercent, setEmiSurchargeSellerSharePercent] = React.useState(50);
-    // ⑰ GST — Indian tax compliance
-    const [gstEnabled, setGstEnabled] = React.useState(false);
-    const [gstin, setGstin] = React.useState("");
-    const [gstLegalName, setGstLegalName] = React.useState("");
-    const [gstAddress, setGstAddress] = React.useState("");
-    /*
-     * Shown inline, live, and ONLY while the toggle is on — the same rule the
-     * server enforces. `/api/admin/site` rejects the save, so without this the
-     * admin would get a generic "save failed" with no indication of which of the
-     * four fields it meant.
-     *
-     * Live rather than on-submit because the toggle is the action: an admin who
-     * flips it on sees immediately what else is needed, instead of discovering
-     * it after a round trip. Empty when the toggle is off, so an admin editing
-     * their address with GST disabled is never shown errors about it
-     * (Root Cause #74 — a summary that accuses before anything was attempted).
-     */
-    const gstProblems = React.useMemo(() => validateGstEnablement({
-        enabled: gstEnabled,
-        gstin,
-        legalName: gstLegalName,
-        address: gstAddress,
-    }), [gstEnabled, gstin, gstLegalName, gstAddress]);
-    const [platformFeePercent, setPlatformFeePercent] = React.useState(5);
-    const [gstPercent, setGstPercent] = React.useState(18);
-    const [minimumTransactionFee, setMinimumTransactionFee] = React.useState(0);
-    const [platformFeeMax, setPlatformFeeMax] = React.useState(10);
-    const [gatewayFeePercent, setGatewayFeePercent] = React.useState(2);
-    const [payoutHoldDays, setPayoutHoldDays] = React.useState(7);
-    const [minPayoutAmount, setMinPayoutAmount] = React.useState(100);
-    const [auctionListingFee, setAuctionListingFee] = React.useState(0);
-    const [preOrderListingFee, setPreOrderListingFee] = React.useState(0);
-    const [featuredSlotFee, setFeaturedSlotFee] = React.useState(999);
-    const [promotedSlotFee, setPromotedSlotFee] = React.useState(499);
-    const [whatsappNotifyFeeEnabled, setWhatsappNotifyFeeEnabled] = React.useState(false);
-    const [whatsappNotifyFee, setWhatsappNotifyFee] = React.useState(10);
-    const [giftWrapFeeEnabled, setGiftWrapFeeEnabled] = React.useState(false);
-    const [giftWrapFee, setGiftWrapFee] = React.useState(49);
-    const [shipmentProtectionFeeEnabled, setShipmentProtectionFeeEnabled] = React.useState(false);
-    /*
-     * 🛑 D13 — these five had NO state, NO field and NO control, while
-     * `updateSingleton` replaced the whole `commissions` map on every save. So
-     * the first save of any commissions field DELETED them: sale protection
-     * stopped being sold (a product we charge 3%, min ₹49 for) and COD handling
-     * silently reverted to code defaults, both with no error.
-     *
-     * The repository now writes dotted paths, so an omitted key survives — but
-     * the controls still have to exist, or CLAUDE.md's stated remediation
-     * ("enable them at Admin → Site Settings → Commissions") remains impossible.
-     * Defaults mirror the schema: sale protection ON at platform level, because
-     * the platform tier defaults true and the SELLER tier is the opt-in.
-     */
-    const [saleProtectionFeeEnabled, setSaleProtectionFeeEnabled] = React.useState(true);
-    const [saleProtectionFeePercent, setSaleProtectionFeePercent] = React.useState(3);
-    const [saleProtectionFeeMin, setSaleProtectionFeeMin] = React.useState(49);
-    const [codHandlingFeePercent, setCodHandlingFeePercent] = React.useState(10);
-    const [codHandlingFeeCap, setCodHandlingFeeCap] = React.useState(200);
-    const [shipmentProtectionFeePercent, setShipmentProtectionFeePercent] = React.useState(2);
-    const [shipmentProtectionFeeMin, setShipmentProtectionFeeMin] = React.useState(30);
-    const [codDepositPercent, setCodDepositPercent] = React.useState(10);
-    const [sellerShippingFixed, setSellerShippingFixed] = React.useState(0);
-    const [platformShippingPercent, setPlatformShippingPercent] = React.useState(10);
-    const [platformShippingFixedMin, setPlatformShippingFixedMin] = React.useState(0);
-    // ⑧ Integrations
-    const [razorpayKeyId, setRazorpayKeyId] = React.useState("");
-    const [razorpayKeySecret, setRazorpayKeySecret] = React.useState("");
-    const [razorpayWebhookSecret, setRazorpayWebhookSecret] = React.useState("");
-    const [phonepeClientId, setPhonepeClientId] = React.useState("");
-    const [phonepeClientSecret, setPhonepeClientSecret] = React.useState("");
-    const [phonepeClientVersion, setPhonepeClientVersion] = React.useState("1");
-    const [phonepeEnvironment, setPhonepeEnvironment] = React.useState("sandbox");
-    const [phonepeWebhookUsername, setPhonepeWebhookUsername] = React.useState("");
-    const [phonepeWebhookPassword, setPhonepeWebhookPassword] = React.useState("");
-    const [smtpHost, setSmtpHost] = React.useState("");
-    const [smtpPort, setSmtpPort] = React.useState("587");
-    const [smtpUser, setSmtpUser] = React.useState("");
-    const [smtpFrom, setSmtpFrom] = React.useState("");
-    const [googleMapsApiKey, setGoogleMapsApiKey] = React.useState("");
-    const [googlePlaceId, setGooglePlaceId] = React.useState("");
-    const [gaMeasurementId, setGaMeasurementId] = React.useState("");
-    const [fbPixelId, setFbPixelId] = React.useState("");
-    const [gtmContainerId, setGtmContainerId] = React.useState("");
-    // D7b — Microsoft Clarity. Blank keeps it OFF; there is no enable toggle, and
-    // the absence of an id IS the off state (the same shape as the other three).
-    const [clarityProjectId, setClarityProjectId] = React.useState("");
-    // Social platform API credentials (for Social Feed section)
-    const [metaPageAccessToken, setMetaPageAccessToken] = React.useState("");
-    const [metaPageId, setMetaPageId] = React.useState("");
-    const [tiktokClientKey, setTiktokClientKey] = React.useState("");
-    const [tiktokClientSecret, setTiktokClientSecret] = React.useState("");
-    const [tiktokAccessToken, setTiktokAccessToken] = React.useState("");
-    const [deviantartClientId, setDeviantartClientId] = React.useState("");
-    const [deviantartClientSecret, setDeviantartClientSecret] = React.useState("");
-    // ⑨ Shipping
-    const [freeShippingThreshold, setFreeShippingThreshold] = React.useState(999);
-    const [defaultCarrier, setDefaultCarrier] = React.useState("custom");
-    const [maxDeliveryRadius, setMaxDeliveryRadius] = React.useState(0);
-    // ⑨ Payment methods (siteSettings.payment — read by checkout for method eligibility)
-    const [razorpayEnabled, setRazorpayEnabled] = React.useState(false);
-    const [phonepeEnabled, setPhonepeEnabled] = React.useState(false);
-    const [upiManualEnabled, setUpiManualEnabled] = React.useState(true);
-    const [codEnabled, setCodEnabled] = React.useState(true);
-    const [otpCheckoutThreshold, setOtpCheckoutThreshold] = React.useState(5000);
-    const [codMaxOrderValue, setCodMaxOrderValue] = React.useState(COD_MAX_ORDER_VALUE_FALLBACK);
-    // Per-listing-type / per-category-type visibility flags.
-    const [listingTypeFlags, setListingTypeFlags] = React.useState({});
-    const [categoryTypeFlags, setCategoryTypeFlags] = React.useState({});
-    const [browsePageFlags, setBrowsePageFlags] = React.useState({});
-    // Per-channel notification-type allowlists — empty array means "all types".
-    const [notifEmailTypes, setNotifEmailTypes] = React.useState([]);
-    const [notifWhatsappTypes, setNotifWhatsappTypes] = React.useState([]);
-    // ⑩ Auction
-    const [bidIncrementTiers, setBidIncrementTiers] = React.useState(DEFAULT_AUCTION_BID_INCREMENT_TIERS);
-    const [autoExtendWindow, setAutoExtendWindow] = React.useState(5);
-    const [settlementGrace, setSettlementGrace] = React.useState(24);
-    // ⑪ Platform Limits
-    const [maxProductsPerStore, setMaxProductsPerStore] = React.useState(100);
-    const [maxCustomFields, setMaxCustomFields] = React.useState(50);
-    const [orderCancelWindow, setOrderCancelWindow] = React.useState(24);
-    // ⑫ Legal
-    const [termsHtml, setTermsHtml] = React.useState("");
-    const [privacyHtml, setPrivacyHtml] = React.useState("");
-    const [refundHtml, setRefundHtml] = React.useState("");
-    const [shippingPolicyHtml, setShippingPolicyHtml] = React.useState("");
-    const [cookieHtml, setCookieHtml] = React.useState("");
-    const [ethicsHtml, setEthicsHtml] = React.useState("");
-    const [conductHtml, setConductHtml] = React.useState("");
-    /*
-     * 🛑 D19 — `cancellation` and `grievance` are declared on
-     * `SiteSettingsDocument.legalPages` and were omitted from BOTH the load and
-     * the payload here. Under the old wholesale-map replace that meant an
-     * override written to either key was ERASED on the next Legal-tab save —
-     * the same cause as D13, one group over, which is the evidence that the
-     * repository fix (dotted paths) was the right level to fix it at.
-     *
-     * The grievance page in particular is a statutory channel, so an override
-     * silently reverting to the bundled default is a compliance problem rather
-     * than a content one.
-     */
-    const [cancellationHtml, setCancellationHtml] = React.useState("");
-    const [grievanceHtml, setGrievanceHtml] = React.useState("");
-    // ⑬ WhatsApp Business Cloud API (platform-level)
-    const [waPhoneNumberId, setWaPhoneNumberId] = React.useState("");
-    const [waCloudApiToken, setWaCloudApiToken] = React.useState("");
-    const [waAdminNotifyNumbers, setWaAdminNotifyNumbers] = React.useState("");
-    const [waTemplateLanguage, setWaTemplateLanguage] = React.useState("en");
-    const [waTemplateOrderPlaced, setWaTemplateOrderPlaced] = React.useState("");
-    const [waTemplateOrderConfirmed, setWaTemplateOrderConfirmed] = React.useState("");
-    const [waTemplateOrderShipped, setWaTemplateOrderShipped] = React.useState("");
-    const [waTemplateOrderDelivered, setWaTemplateOrderDelivered] = React.useState("");
-    const [waTemplateOrderCancelled, setWaTemplateOrderCancelled] = React.useState("");
-    const [waTemplateRefundInitiated, setWaTemplateRefundInitiated] = React.useState("");
-    // ⓪ About
-    const [aboutTitle, setAboutTitle] = React.useState("");
-    const [aboutSubtitle, setAboutSubtitle] = React.useState("");
-    const [aboutMissionTitle, setAboutMissionTitle] = React.useState("");
-    const [aboutMissionText, setAboutMissionText] = React.useState("");
-    const [aboutHowItWorksTitle, setAboutHowItWorksTitle] = React.useState("");
-    const [aboutHowItems, setAboutHowItems] = React.useState([]);
-    const [aboutValuesTitle, setAboutValuesTitle] = React.useState("");
-    const [aboutValuesSubtitle, setAboutValuesSubtitle] = React.useState("");
-    const [aboutValueItems, setAboutValueItems] = React.useState([]);
-    const [aboutMilestonesTitle, setAboutMilestonesTitle] = React.useState("");
-    const [aboutMilestones, setAboutMilestones] = React.useState([]);
-    const [aboutTeamTitle, setAboutTeamTitle] = React.useState("");
-    const [aboutTeamSubtitle, setAboutTeamSubtitle] = React.useState("");
-    const [aboutTeamMembers, setAboutTeamMembers] = React.useState([]);
-    const [aboutCtaTitle, setAboutCtaTitle] = React.useState("");
-    const [aboutCtaSell, setAboutCtaSell] = React.useState("");
-    const [aboutCtaShop, setAboutCtaShop] = React.useState("");
-    // ⑭ Notification channels
-    const [notifEmailEnabled, setNotifEmailEnabled] = React.useState(false);
-    const [notifEmailMinPriority, setNotifEmailMinPriority] = React.useState("normal");
-    const [notifWhatsappEnabled, setNotifWhatsappEnabled] = React.useState(false);
-    const [notifWhatsappMinPriority, setNotifWhatsappMinPriority] = React.useState("high");
-    const [notifWhatsappOtpEnabled, setNotifWhatsappOtpEnabled] = React.useState(false);
-    const [notifSmsEnabled, setNotifSmsEnabled] = React.useState(false);
-    const [notifSmsMinPriority, setNotifSmsMinPriority] = React.useState("high");
-    // Resend API key + sender identity (used by the email channel)
-    const [resendApiKey, setResendApiKey] = React.useState("");
-    const [notifFromEmail, setNotifFromEmail] = React.useState("");
-    const [notifFromName, setNotifFromName] = React.useState("");
-    // Daily ops digest — recipients are edited as one-per-line text, split on save.
-    const [digestEnabled, setDigestEnabled] = React.useState(false);
-    const [digestRecipients, setDigestRecipients] = React.useState("");
-    /*
-     * Outbound messaging: the kill switch and the daily ceiling.
-     *
-     * `emailEnabled` suppresses USER-facing mail only. Staff mail — the daily
-     * digest, the payout summary — keeps flowing regardless, because switching
-     * off customer email must never also blind the operator.
-     */
-    const [msgEmailEnabled, setMsgEmailEnabled] = React.useState(false);
-    const [msgWhatsappEnabled, setMsgWhatsappEnabled] = React.useState(false);
-    const [msgCeilingEmail, setMsgCeilingEmail] = React.useState(80);
-    const [msgCeilingWhatsapp, setMsgCeilingWhatsapp] = React.useState(200);
+        el.style.fontSize = `${Math.max(10, watermarkForm.watermarkSize / 5)}px`;
+        el.style.opacity = String(watermarkForm.watermarkOpacity / 100);
+    }, [watermarkForm.watermarkSize, watermarkForm.watermarkOpacity]);
+    // ⑮ Procurement — seventh tab migrated to the Universal Template System,
+    // 2026-11-04. Two useState calls collapsed into one combined object.
+    const [procurementForm, setProcurementForm] = React.useState({
+        laborHourlyRate: 200, laborMaxHoursPerDay: 6,
+    });
+    const { fields: procurementVisibilityFields, setVisible: setProcurementFieldVisible, fieldOrder: procurementFieldOrder, setFieldOrder: setProcurementFieldOrder, } = useFieldVisibility("admin-site-settings-procurement");
+    const procurementSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsProcurementFormSchema, {
+        fieldVisibility: procurementVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setProcurementFieldVisible,
+        fieldOrder: procurementFieldOrder,
+        onMoveField: (fieldName, neighborName) => setProcurementFieldOrder(swapFieldOrder(procurementFieldOrder, resolveFields(siteSettingsProcurementFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [procurementVisibilityFields, editMode, setProcurementFieldVisible, procurementFieldOrder, setProcurementFieldOrder]);
+    // ⑯ EMI — twelfth tab migrated to the Universal Template System,
+    // 2026-11-04. Seven useState calls collapsed into one combined object.
+    const [emiForm, setEmiForm] = React.useState({
+        emiEnabled: false, emiMinOrderValue: 10000, emiTenureOptionsText: "2,3,4,5,6",
+        emiTokenPercent: 20, emiBillingDay: 5,
+        emiSurchargePercentPerMonth: 2, emiSurchargeSellerSharePercent: 50,
+    });
+    const { fields: emiVisibilityFields, setVisible: setEmiFieldVisible, fieldOrder: emiFieldOrder, setFieldOrder: setEmiFieldOrder, } = useFieldVisibility("admin-site-settings-emi");
+    const emiSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsEmiFormSchema, {
+        fieldVisibility: emiVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setEmiFieldVisible,
+        fieldOrder: emiFieldOrder,
+        onMoveField: (fieldName, neighborName) => setEmiFieldOrder(swapFieldOrder(emiFieldOrder, resolveFields(siteSettingsEmiFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [emiVisibilityFields, editMode, setEmiFieldVisible, emiFieldOrder, setEmiFieldOrder]);
+    // ⑰ GST — eleventh tab migrated to the Universal Template System,
+    // 2026-11-04. Four useState calls collapsed into one combined object.
+    //
+    // `validateGstEnablement()` is shown inline, live, and ONLY while the
+    // toggle is on — the same rule the server enforces. `/api/admin/site`
+    // rejects the save, so without this the admin would get a generic "save
+    // failed" with no indication of which of the four fields it meant. Live
+    // rather than on-submit because the toggle is the action: an admin who
+    // flips it on sees immediately what else is needed, instead of
+    // discovering it after a round trip. Empty when the toggle is off, so an
+    // admin editing their address with GST disabled is never shown errors
+    // about it (Root Cause #74 — a summary that accuses before anything was
+    // attempted). Computed LIVE inside each custom renderer below, against
+    // that renderer's own `values` parameter, rather than a separate
+    // `useMemo` — simpler, and provably reactive to exactly what's on screen.
+    const [gstForm, setGstForm] = React.useState({
+        gstEnabled: false, gstin: "", gstLegalName: "", gstAddress: "",
+    });
+    const { fields: gstVisibilityFields, setVisible: setGstFieldVisible, fieldOrder: gstFieldOrder, setFieldOrder: setGstFieldOrder, } = useFieldVisibility("admin-site-settings-gst");
+    const gstSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsGstFormSchema, {
+        renderers: {
+            gstin: ({ values, onChange }) => {
+                const problems = validateGstEnablement({
+                    enabled: Boolean(values.gstEnabled),
+                    gstin: values.gstin,
+                    legalName: values.gstLegalName,
+                    address: values.gstAddress,
+                });
+                return (_jsx(FieldInput, { name: "gstin", label: "GSTIN", hint: "15-character GST Identification Number.", error: problems.gstin, value: values.gstin ?? "", onChange: (v) => onChange({ gstin: v }), placeholder: "29AAAAA0000A1Z5", maxLength: 15 }));
+            },
+            gstLegalName: ({ values, onChange }) => {
+                const problems = validateGstEnablement({
+                    enabled: Boolean(values.gstEnabled),
+                    gstin: values.gstin,
+                    legalName: values.gstLegalName,
+                    address: values.gstAddress,
+                });
+                return (_jsx(FieldInput, { name: "gstLegalName", label: "Legal name", hint: "Registered business name for invoices.", error: problems.legalName, value: values.gstLegalName ?? "", onChange: (v) => onChange({ gstLegalName: v }), placeholder: `${getBrandName()} Pvt Ltd` }));
+            },
+            gstAddress: ({ values, onChange }) => {
+                const problems = validateGstEnablement({
+                    enabled: Boolean(values.gstEnabled),
+                    gstin: values.gstin,
+                    legalName: values.gstLegalName,
+                    address: values.gstAddress,
+                });
+                return (_jsx(FieldTextarea, { name: "gstAddress", label: "Registered address", error: problems.address, value: values.gstAddress ?? "", onChange: (v) => onChange({ gstAddress: v }), placeholder: "Registered business address for GST invoices\u2026", rows: 3 }));
+            },
+        },
+        fieldVisibility: gstVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setGstFieldVisible,
+        fieldOrder: gstFieldOrder,
+        onMoveField: (fieldName, neighborName) => setGstFieldOrder(swapFieldOrder(gstFieldOrder, resolveFields(siteSettingsGstFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [gstVisibilityFields, editMode, setGstFieldVisible, gstFieldOrder, setGstFieldOrder]);
+    // ⑦ Fees & Commissions — sixth tab migrated to the Universal Template
+    // System, 2026-11-04. Twenty-four useState calls collapsed into one
+    // combined object. 🛑 D13 — `saleProtectionFee*`/`codHandlingFee*` had NO
+    // state, NO field and NO control at all until that fix, while
+    // `updateSingleton` replaced the whole `commissions` map on every save —
+    // so the first save of any commissions field silently deleted them (sale
+    // protection stopped being sold, COD handling reverted to code defaults).
+    // The repository now writes dotted paths, so an omitted key survives, but
+    // the controls still have to exist. `saleProtectionFeeEnabled` defaults
+    // true to match the platform-tier default (the SELLER tier is the opt-in).
+    const [feesForm, setFeesForm] = React.useState({
+        platformFeePercent: 5, gstPercent: 18, minimumTransactionFee: 0, platformFeeMax: 10,
+        gatewayFeePercent: 2, payoutHoldDays: 7, minPayoutAmount: 100,
+        collectorDropListingFee: 0, preOrderListingFee: 0, featuredSlotFee: 999, promotedSlotFee: 499,
+        codDepositPercent: 10,
+        whatsappNotifyFeeEnabled: false, whatsappNotifyFee: 10,
+        giftWrapFeeEnabled: false, giftWrapFee: 49,
+        shipmentProtectionFeeEnabled: false, shipmentProtectionFeePercent: 2, shipmentProtectionFeeMin: 30,
+        saleProtectionFeeEnabled: true, saleProtectionFeePercent: 3, saleProtectionFeeMin: 49,
+        codHandlingFeePercent: 10, codHandlingFeeCap: 200,
+    });
+    const { fields: feesVisibilityFields, setVisible: setFeesFieldVisible, fieldOrder: feesFieldOrder, setFieldOrder: setFeesFieldOrder, } = useFieldVisibility("admin-site-settings-fees");
+    const feesSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsFeesFormSchema, {
+        fieldVisibility: feesVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setFeesFieldVisible,
+        fieldOrder: feesFieldOrder,
+        onMoveField: (fieldName, neighborName) => setFeesFieldOrder(swapFieldOrder(feesFieldOrder, resolveFields(siteSettingsFeesFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [feesVisibilityFields, editMode, setFeesFieldVisible, feesFieldOrder, setFeesFieldOrder]);
+    // ⑧ Integrations — fifteenth tab migrated to the Universal Template
+    // System, 2026-11-04, and the largest by field count (30). Thirty
+    // useState calls collapsed into one combined object.
+    //
+    // D7b — Microsoft Clarity. Blank keeps it OFF; there is no enable toggle,
+    // and the absence of an id IS the off state (the same shape as the other
+    // three analytics fields).
+    const [integrationsForm, setIntegrationsForm] = React.useState({
+        razorpayKeyId: "", razorpayKeySecret: "", razorpayWebhookSecret: "",
+        cashfreeAppId: "", cashfreeSecretKey: "", cashfreeEnvironment: "sandbox",
+        phonepeClientId: "", phonepeClientSecret: "", phonepeClientVersion: "1",
+        phonepeEnvironment: "sandbox", phonepeWebhookUsername: "", phonepeWebhookPassword: "",
+        smtpHost: "", smtpPort: "587", smtpUser: "", smtpFrom: "",
+        googleMapsApiKey: "", googlePlaceId: "",
+        gaMeasurementId: "", fbPixelId: "", gtmContainerId: "", clarityProjectId: "",
+        metaPageAccessToken: "", metaPageId: "",
+        tiktokClientKey: "", tiktokClientSecret: "", tiktokAccessToken: "",
+        deviantartClientId: "", deviantartClientSecret: "",
+    });
+    const { fields: integrationsVisibilityFields, setVisible: setIntegrationsFieldVisible, fieldOrder: integrationsFieldOrder, setFieldOrder: setIntegrationsFieldOrder, } = useFieldVisibility("admin-site-settings-integrations");
+    const integrationsSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsIntegrationsFormSchema, {
+        renderers: {
+            ...Object.fromEntries(MASKED_CREDENTIAL_FIELDS.map(({ name, label, placeholder }) => [
+                name,
+                ({ values, onChange }) => (_jsx(MaskedInput, { label: label, value: values[name] ?? "", onChange: (v) => onChange({ [name]: v }), placeholder: placeholder })),
+            ])),
+        },
+        options: {
+            phonepeEnvironment: GATEWAY_ENVIRONMENT_OPTIONS,
+            cashfreeEnvironment: GATEWAY_ENVIRONMENT_OPTIONS,
+        },
+        fieldVisibility: integrationsVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setIntegrationsFieldVisible,
+        fieldOrder: integrationsFieldOrder,
+        onMoveField: (fieldName, neighborName) => setIntegrationsFieldOrder(swapFieldOrder(integrationsFieldOrder, resolveFields(siteSettingsIntegrationsFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [integrationsVisibilityFields, editMode, setIntegrationsFieldVisible, integrationsFieldOrder, setIntegrationsFieldOrder]);
+    // ⑨ Shipping (Payment methods + Shipping Defaults + Seller shipping charge
+    // defaults) — tenth tab migrated to the Universal Template System,
+    // 2026-11-04. Fourteen useState calls collapsed into one combined object,
+    // including the 3 `commissions.*` fields shared with the Fees tab (its
+    // buildFullPayload() spread now reads them from `shippingForm` instead of
+    // bare vars — see that schema's own header for the seam).
+    //
+    // 🛑 `platformStoreId` defaults to EMPTY, which means "every store is
+    // third-party" and therefore refuses online collection for every cart.
+    // That is the fail-closed direction and it must not be "helpfully"
+    // defaulted to a store id here — a wrong guess would authorise collecting
+    // another seller's money into the platform's own account (the RBI
+    // commingling), and it would present as a completely successful checkout.
+    const [shippingForm, setShippingForm] = React.useState({
+        razorpayEnabled: false, phonepeEnabled: false, cashfreeEnabled: false,
+        platformStoreId: "", upiManualEnabled: true, codEnabled: true,
+        freeShippingThreshold: 999, defaultCarrier: "custom", maxDeliveryRadius: 0,
+        codMaxOrderValue: COD_MAX_ORDER_VALUE_FALLBACK, otpCheckoutThreshold: 5000,
+        sellerShippingFixed: 0, platformShippingPercent: 10, platformShippingFixedMin: 0,
+    });
+    const { fields: shippingVisibilityFields, setVisible: setShippingFieldVisible, fieldOrder: shippingFieldOrder, setFieldOrder: setShippingFieldOrder, } = useFieldVisibility("admin-site-settings-shipping");
+    const shippingSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsShippingFormSchema, {
+        options: { defaultCarrier: CARRIER_OPTIONS },
+        renderers: {
+            phonepeEnabled: (props) => _jsx(AnchoredToggle, { id: "setting-phonepe-enabled", ...props }),
+            upiManualEnabled: (props) => _jsx(AnchoredToggle, { id: "setting-manual-payment-enabled", ...props }),
+            codEnabled: (props) => _jsx(AnchoredToggle, { id: "setting-cod-enabled", ...props }),
+        },
+        fieldVisibility: shippingVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setShippingFieldVisible,
+        fieldOrder: shippingFieldOrder,
+        onMoveField: (fieldName, neighborName) => setShippingFieldOrder(swapFieldOrder(shippingFieldOrder, resolveFields(siteSettingsShippingFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [shippingVisibilityFields, editMode, setShippingFieldVisible, shippingFieldOrder, setShippingFieldOrder]);
+    // ⑱ Listings — seventeenth tab migrated to the Universal Template
+    // System, 2026-11-04. Three Record<string, boolean> useState calls
+    // collapsed into one combined object. All three are DYNAMIC
+    // registry-driven toggle grids (keys come from LISTING_TYPE_KEYS/
+    // CATEGORY_TYPE_KEYS/BROWSE_PAGE_KEYS, declared further down this
+    // component body) rather than fixed scalar fields — see
+    // site-settings-listings-form.ts's header for why that's a Record field
+    // with a custom renderer rather than per-key schema fields.
+    const [listingsForm, setListingsForm] = React.useState({
+        listingTypeFlags: {}, categoryTypeFlags: {}, browsePageFlags: {},
+    });
+    const { fields: listingsVisibilityFields, setVisible: setListingsFieldVisible, fieldOrder: listingsFieldOrder, setFieldOrder: setListingsFieldOrder, } = useFieldVisibility("admin-site-settings-listings");
+    const listingsSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsListingsFormSchema, {
+        renderers: {
+            /*
+             * 🛑 A THREE-STATE SELECT, not a Toggle — all three grids.
+             *
+             * Every one of these axes stores `boolean | "unlisted"`, and
+             * `"unlisted"` is the state the owner asked for on 2026-11-07:
+             * *"do not show their links or filters or any way to jump to them,
+             * but do not 404 their pages."* A `Toggle` cannot carry it. Worse
+             * than cannot: a stored `"unlisted"` is a truthy STRING, so the
+             * toggle drew it fully ON — indistinguishable from "listed" — and
+             * flipping it wrote a boolean, destroying the state with no way to
+             * put it back from this screen. The only way to set it was editing
+             * Firestore by hand, which is precisely the "code change to flip a
+             * flag" the capability model exists to abolish.
+             *
+             * Labels come from `FLAG_CHOICE_OPTIONS` and say what each state
+             * DOES, because the one thing an admin must not get wrong here is
+             * that "unlisted" keeps serving the page and "off" 404s it.
+             */
+            listingTypeFlags: ({ values, onChange }) => {
+                const flags = values.listingTypeFlags ?? {};
+                return (_jsx(Grid, { cols: 2, gap: "sm", children: LISTING_TYPE_KEYS.map((key) => (_jsx(Select, { 
+                        // The plugin's own display label, not the raw key — the
+                        // literal version rendered "pre-order" and
+                        // "digital-code" at an admin. 1A-v — the primary action
+                        // kind appended so an admin can tell at a glance what
+                        // disabling this type actually turns off (bid/reserve/
+                        // offer, not just "buy").
+                        label: `${pluginFor(key).typeLabel} — ${ACTION_KIND_LABELS[pluginFor(key).primaryActionKind]}`, value: flagValueToChoice(flags[key]), options: [...FLAG_CHOICE_OPTIONS], onValueChange: (choice) => onChange({
+                            listingTypeFlags: {
+                                ...flags,
+                                [key]: choiceToFlagValue(choice),
+                            },
+                        }) }, key))) }));
+            },
+            categoryTypeFlags: ({ values, onChange }) => {
+                const flags = values.categoryTypeFlags ?? {};
+                return (_jsx(Grid, { cols: 2, gap: "sm", children: CATEGORY_TYPE_KEYS.map((key) => (_jsx(Select, { label: key, value: flagValueToChoice(flags[key]), options: [...FLAG_CHOICE_OPTIONS], onValueChange: (choice) => onChange({
+                            categoryTypeFlags: {
+                                ...flags,
+                                [key]: choiceToFlagValue(choice),
+                            },
+                        }) }, key))) }));
+            },
+            browsePageFlags: ({ values, onChange }) => {
+                const flags = values.browsePageFlags ?? {};
+                return (_jsx(Grid, { cols: 2, gap: "sm", children: BROWSE_PAGE_KEYS.map((key) => (_jsxs(Stack, { gap: "xs", children: [_jsx(Select, { label: BROWSE_PAGE_META[key]?.label ?? key, value: flagValueToChoice(flags[key]), options: [...FLAG_CHOICE_OPTIONS], onValueChange: (choice) => onChange({
+                                    browsePageFlags: {
+                                        ...flags,
+                                        [key]: choiceToFlagValue(choice),
+                                    },
+                                }) }), _jsx(Text, { size: "xs", color: "muted", children: BROWSE_PAGE_META[key]?.hint })] }, key))) }));
+            },
+        },
+        fieldVisibility: listingsVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setListingsFieldVisible,
+        fieldOrder: listingsFieldOrder,
+        onMoveField: (fieldName, neighborName) => setListingsFieldOrder(swapFieldOrder(listingsFieldOrder, resolveFields(siteSettingsListingsFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [listingsVisibilityFields, editMode, setListingsFieldVisible, listingsFieldOrder, setListingsFieldOrder]);
+    // ⑩ Collector Drop — sixteenth tab migrated to the Universal Template
+    // System, 2026-11-04. Three useState calls collapsed into one combined
+    // object. `bidIncrementTiers` keeps its original hand-written add/remove
+    // UI as a custom renderer — see site-settings-collector-drop-form.ts's
+    // header for why it does not fit the generic `<Repeater>` primitive.
+    const [collectorDropForm, setCollectorDropForm] = React.useState({
+        bidIncrementTiers: DEFAULT_COLLECTOR_DROP_BID_INCREMENT_TIERS,
+        autoExtendWindow: 5, settlementGrace: 24,
+    });
+    const { fields: collectorDropVisibilityFields, setVisible: setCollectorDropFieldVisible, fieldOrder: collectorDropFieldOrder, setFieldOrder: setCollectorDropFieldOrder, } = useFieldVisibility("admin-site-settings-collector-drop");
+    const collectorDropSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsCollectorDropFormSchema, {
+        renderers: {
+            bidIncrementTiers: ({ values, onChange }) => {
+                const tiers = values.bidIncrementTiers ?? [];
+                const setTiers = (next) => onChange({ bidIncrementTiers: next });
+                return (_jsxs(Stack, { gap: "sm", children: [tiers.map((tier, i) => {
+                            const isLast = i === tiers.length - 1;
+                            return (_jsxs(Grid, { align: "end", gap: "xs", className: "grid-cols-12", children: [_jsx(Div, { className: "col-span-5", children: isLast ? (_jsxs(_Fragment, { children: [_jsx(Text, { size: "xs", weight: "medium", className: "mb-1", children: "Up to (\u20B9)" }), _jsx(Text, { size: "sm", color: "muted", children: "and above" })] })) : (_jsx(Input, { label: "Up to (\u20B9)", type: "number", min: 1, value: String(tier.upTo ?? ""), onChange: (e) => setTiers(tiers.map((t, j) => (j === i ? { ...t, upTo: parseInt(e.target.value) || 0 } : t))) })) }), _jsx(Div, { className: "col-span-5", children: _jsx(Input, { label: "Increment (\u20B9)", type: "number", min: 1, value: String(tier.increment), onChange: (e) => setTiers(tiers.map((t, j) => (j === i ? { ...t, increment: parseInt(e.target.value) || 0 } : t))) }) }), _jsx(Row, { centered: true, className: "col-span-2", padding: "b-xs", children: _jsx(Button, { variant: "ghost", type: "button", disabled: tiers.length <= 1, onClick: () => setTiers(tiers.filter((_, j) => j !== i)), "aria-label": "Remove tier", children: "\u00D7" }) })] }, i));
+                        }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setTiers([
+                                ...tiers.slice(0, -1),
+                                { upTo: 100, increment: 10 },
+                                tiers[tiers.length - 1] ?? { upTo: null, increment: 1000 },
+                            ]), children: "+ Add tier" })] }));
+            },
+        },
+        fieldVisibility: collectorDropVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setCollectorDropFieldVisible,
+        fieldOrder: collectorDropFieldOrder,
+        onMoveField: (fieldName, neighborName) => setCollectorDropFieldOrder(swapFieldOrder(collectorDropFieldOrder, resolveFields(siteSettingsCollectorDropFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [collectorDropVisibilityFields, editMode, setCollectorDropFieldVisible, collectorDropFieldOrder, setCollectorDropFieldOrder]);
+    // ⑪ Platform Limits — eighth tab migrated to the Universal Template
+    // System, 2026-11-04. Three useState calls collapsed into one combined
+    // object.
+    const [limitsForm, setLimitsForm] = React.useState({
+        maxProductsPerStore: 100, maxCustomFields: 50, orderCancelWindow: 24,
+    });
+    const { fields: limitsVisibilityFields, setVisible: setLimitsFieldVisible, fieldOrder: limitsFieldOrder, setFieldOrder: setLimitsFieldOrder, } = useFieldVisibility("admin-site-settings-limits");
+    const limitsSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsLimitsFormSchema, {
+        fieldVisibility: limitsVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setLimitsFieldVisible,
+        fieldOrder: limitsFieldOrder,
+        onMoveField: (fieldName, neighborName) => setLimitsFieldOrder(swapFieldOrder(limitsFieldOrder, resolveFields(siteSettingsLimitsFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [limitsVisibilityFields, editMode, setLimitsFieldVisible, limitsFieldOrder, setLimitsFieldOrder]);
+    // ⑫ Legal — thirteenth tab migrated to the Universal Template System,
+    // 2026-11-04. Nine useState calls collapsed into one combined object.
+    //
+    // 🛑 D19 — `cancellation` and `grievance` are declared on
+    // `SiteSettingsDocument.legalPages` and were once omitted from BOTH the
+    // load and the payload here. Under the old wholesale-map replace that
+    // meant an override written to either key was ERASED on the next
+    // Legal-tab save — the same cause as D13, one group over, which is the
+    // evidence that the repository fix (dotted paths) was the right level to
+    // fix it at. The grievance page in particular is a statutory channel, so
+    // an override silently reverting to the bundled default is a compliance
+    // problem rather than a content one. Both are carried unconditionally
+    // below, same as every other field.
+    const [legalForm, setLegalForm] = React.useState({
+        termsHtml: "", privacyHtml: "", refundHtml: "", shippingPolicyHtml: "",
+        cookieHtml: "", ethicsHtml: "", conductHtml: "", cancellationHtml: "", grievanceHtml: "",
+    });
+    const { fields: legalVisibilityFields, setVisible: setLegalFieldVisible, fieldOrder: legalFieldOrder, setFieldOrder: setLegalFieldOrder, } = useFieldVisibility("admin-site-settings-legal");
+    const legalSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsLegalFormSchema, {
+        renderers: Object.fromEntries(LEGAL_PAGE_FIELDS.map(({ name, label }) => [
+            name,
+            ({ values, onChange }) => (_jsx(Textarea, { label: label, value: values[name] ?? "", onChange: (e) => onChange({ [name]: e.target.value }), placeholder: `Enter ${label} HTML here…`, rows: 6, className: "font-mono" })),
+        ])),
+        fieldVisibility: legalVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setLegalFieldVisible,
+        fieldOrder: legalFieldOrder,
+        onMoveField: (fieldName, neighborName) => setLegalFieldOrder(swapFieldOrder(legalFieldOrder, resolveFields(siteSettingsLegalFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [legalVisibilityFields, editMode, setLegalFieldVisible, legalFieldOrder, setLegalFieldOrder]);
+    // ⑬ WhatsApp Business Cloud API (platform-level) — fourteenth tab
+    // migrated to the Universal Template System, 2026-11-04. Ten useState
+    // calls collapsed into one combined object.
+    const [whatsappForm, setWhatsappForm] = React.useState({
+        waPhoneNumberId: "", waCloudApiToken: "", waAdminNotifyNumbers: "",
+        waTemplateLanguage: "en", waTemplateOrderPlaced: "", waTemplateOrderConfirmed: "",
+        waTemplateOrderShipped: "", waTemplateOrderDelivered: "",
+        waTemplateOrderCancelled: "", waTemplateRefundInitiated: "",
+    });
+    const { fields: whatsappVisibilityFields, setVisible: setWhatsappFieldVisible, fieldOrder: whatsappFieldOrder, setFieldOrder: setWhatsappFieldOrder, } = useFieldVisibility("admin-site-settings-whatsapp");
+    const whatsappSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsWhatsappFormSchema, {
+        renderers: {
+            waCloudApiToken: ({ values, onChange }) => (_jsx(MaskedInput, { label: "Cloud API System User Token", value: values.waCloudApiToken ?? "", onChange: (v) => onChange({ waCloudApiToken: v }), placeholder: "EAAxxxxxxxx\u2026", helperText: "Long-lived system user access token with WhatsApp Business permissions" })),
+        },
+        fieldVisibility: whatsappVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setWhatsappFieldVisible,
+        fieldOrder: whatsappFieldOrder,
+        onMoveField: (fieldName, neighborName) => setWhatsappFieldOrder(swapFieldOrder(whatsappFieldOrder, resolveFields(siteSettingsWhatsappFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [whatsappVisibilityFields, editMode, setWhatsappFieldVisible, whatsappFieldOrder, setWhatsappFieldOrder]);
+    // ⓪ About — nineteenth (and last field-by-field) tab migrated to the
+    // Universal Template System, 2026-11-04. Seventeen useState calls
+    // collapsed into one combined object. The four list fields use the
+    // generic `<Repeater>` primitive — see site-settings-about-form.ts's
+    // header for why that's the right fit here (unlike Collector Drop's
+    // bid-tier array, none of these four carry special last-row rules).
+    const [aboutForm, setAboutForm] = React.useState({
+        aboutTitle: "", aboutSubtitle: "", aboutMissionTitle: "", aboutMissionText: "",
+        aboutHowItWorksTitle: "", aboutHowItems: [],
+        aboutValuesTitle: "", aboutValuesSubtitle: "", aboutValueItems: [],
+        aboutMilestonesTitle: "", aboutMilestones: [],
+        aboutTeamTitle: "", aboutTeamSubtitle: "", aboutTeamMembers: [],
+        aboutCtaTitle: "", aboutCtaSell: "", aboutCtaShop: "",
+    });
+    const { fields: aboutVisibilityFields, setVisible: setAboutFieldVisible, fieldOrder: aboutFieldOrder, setFieldOrder: setAboutFieldOrder, } = useFieldVisibility("admin-site-settings-about");
+    const aboutSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsAboutFormSchema, {
+        renderers: {
+            aboutHowItems: ({ values, onChange }) => {
+                const rows = values.aboutHowItems ?? [];
+                return (_jsx(Repeater, { rows: rows, onChange: (next) => onChange({ aboutHowItems: next }), blank: () => ({ title: "", text: "", icon: "✨", tone: "indigo" }), addLabel: "+ Add step", max: 6, renderRow: (row, set) => (_jsxs(_Fragment, { children: [_jsx(Input, { label: "Icon (emoji)", value: row.icon, onChange: (e) => set({ icon: e.target.value }), placeholder: "\uD83D\uDED2" }), _jsx(Input, { label: "Title", value: row.title, onChange: (e) => set({ title: e.target.value }) }), _jsx(Textarea, { value: row.text, onChange: (e) => set({ text: e.target.value }), rows: 2 })] })) }));
+            },
+            aboutValueItems: ({ values, onChange }) => {
+                const rows = values.aboutValueItems ?? [];
+                return (_jsx(Repeater, { rows: rows, onChange: (next) => onChange({ aboutValueItems: next }), blank: () => ({ title: "", text: "", icon: "✨" }), addLabel: "+ Add value", max: 8, renderRow: (row, set) => (_jsxs(_Fragment, { children: [_jsx(Input, { label: "Icon (emoji)", value: row.icon, onChange: (e) => set({ icon: e.target.value }), placeholder: "\uD83D\uDEE1\uFE0F" }), _jsx(Input, { label: "Title", value: row.title, onChange: (e) => set({ title: e.target.value }) }), _jsx(Textarea, { label: "Text", value: row.text, onChange: (e) => set({ text: e.target.value }), rows: 2 }), _jsx(Textarea, { label: "Detail (optional)", value: row.detail ?? "", onChange: (e) => set({ detail: e.target.value }), rows: 2, placeholder: "How this value is actually enforced" })] })) }));
+            },
+            aboutMilestones: ({ values, onChange }) => {
+                const rows = values.aboutMilestones ?? [];
+                return (_jsx(Repeater, { rows: rows, onChange: (next) => onChange({ aboutMilestones: next }), blank: () => ({ year: "", text: "" }), addLabel: "+ Add milestone", max: 10, renderRow: (row, set) => (_jsxs(_Fragment, { children: [_jsx(Input, { label: "Year", value: row.year, onChange: (e) => set({ year: e.target.value }), placeholder: "2024" }), _jsx(Textarea, { value: row.text, onChange: (e) => set({ text: e.target.value }), rows: 2 })] })) }));
+            },
+            aboutTeamMembers: ({ values, onChange }) => {
+                const rows = values.aboutTeamMembers ?? [];
+                return (_jsx(Repeater, { rows: rows, onChange: (next) => onChange({ aboutTeamMembers: next }), blank: () => ({ name: "", role: "", bio: "" }), addLabel: "+ Add team member", max: 12, renderRow: (row, set) => (_jsxs(_Fragment, { children: [_jsx(ImageUpload, { label: "Photo", currentImage: row.photoUrl, onUpload: (file) => upload(file, "store"), onChange: (url) => set({ photoUrl: url }) }), _jsx(Input, { label: "Name", value: row.name, onChange: (e) => set({ name: e.target.value }) }), _jsx(Input, { label: "Role", value: row.role, onChange: (e) => set({ role: e.target.value }), placeholder: "Founder & Developer" }), _jsx(Textarea, { value: row.bio, onChange: (e) => set({ bio: e.target.value }), rows: 3 }), _jsxs(Row, { gap: "md", children: [_jsx(Toggle, { label: "Founder", checked: !!row.isFounder, onChange: (v) => set({ isFounder: v }) }), _jsx(Toggle, { label: "Developer", checked: !!row.isDeveloper, onChange: (v) => set({ isDeveloper: v }) })] })] })) }));
+            },
+        },
+        fieldVisibility: aboutVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setAboutFieldVisible,
+        fieldOrder: aboutFieldOrder,
+        onMoveField: (fieldName, neighborName) => setAboutFieldOrder(swapFieldOrder(aboutFieldOrder, resolveFields(siteSettingsAboutFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [aboutVisibilityFields, editMode, setAboutFieldVisible, aboutFieldOrder, setAboutFieldOrder, upload]);
+    // ⑭ Notification channels — ninth tab migrated to the Universal Template
+    // System, 2026-11-04. Eighteen useState calls collapsed into one combined
+    // object. Writes across FOUR save-payload groups in buildFullPayload()
+    // (`messaging`, `notificationChannels`, part of `emailSettings`, and
+    // `credentials.resendApiKey`) — see site-settings-notifications-form.ts's
+    // header for the full breakdown.
+    //
+    // `msgEmailEnabled`/`msgWhatsappEnabled` suppress USER-facing mail only.
+    // Staff mail — the daily digest, the payout summary — keeps flowing
+    // regardless, because switching off customer email must never also blind
+    // the operator.
+    const [notificationsForm, setNotificationsForm] = React.useState({
+        msgEmailEnabled: false, msgWhatsappEnabled: false, msgCeilingEmail: 80, msgCeilingWhatsapp: 200,
+        notifEmailEnabled: false, notifEmailMinPriority: "normal", resendApiKey: "",
+        notifFromEmail: "", notifFromName: "", notifEmailTypes: [],
+        digestEnabled: false, digestRecipients: "",
+        notifWhatsappEnabled: false, notifWhatsappMinPriority: "high",
+        notifWhatsappOtpEnabled: false, notifWhatsappTypes: [],
+        notifSmsEnabled: false, notifSmsMinPriority: "high",
+    });
+    const { fields: notificationsVisibilityFields, setVisible: setNotificationsFieldVisible, fieldOrder: notificationsFieldOrder, setFieldOrder: setNotificationsFieldOrder, } = useFieldVisibility("admin-site-settings-notifications");
+    const notificationsSections = React.useMemo(() => buildSectionsFromSchema(siteSettingsNotificationsFormSchema, {
+        renderers: {
+            msgEmailEnabled: (props) => _jsx(AnchoredToggle, { id: "setting-email-notifications", ...props }),
+            msgWhatsappEnabled: (props) => _jsx(AnchoredToggle, { id: "setting-whatsapp-notifications", ...props }),
+            digestEnabled: (props) => _jsx(AnchoredToggle, { id: "setting-daily-digest", ...props }),
+            resendApiKey: ({ values, onChange }) => (_jsx(MaskedInput, { label: "Resend API Key", value: values.resendApiKey ?? "", onChange: (v) => onChange({ resendApiKey: v }), placeholder: "re_live_\u2026", helperText: "Get your key at resend.com \u2014 used for all transactional notifications." })),
+            notifEmailTypes: ({ values, onChange }) => (_jsx(PaginatedSelect, { ariaLabel: "Notification types", multiple: true, options: NOTIF_TYPE_OPTIONS, value: values.notifEmailTypes, onChange: (v) => onChange({ notifEmailTypes: v }), placeholder: "All notification types" })),
+            notifWhatsappTypes: ({ values, onChange }) => (_jsx(PaginatedSelect, { multiple: true, ariaLabel: "Notification types to send over WhatsApp", options: NOTIF_TYPE_OPTIONS, value: values.notifWhatsappTypes, onChange: (v) => onChange({ notifWhatsappTypes: v }), placeholder: "All notification types" })),
+        },
+        options: {
+            notifEmailMinPriority: PRIORITY_OPTIONS,
+            notifWhatsappMinPriority: PRIORITY_OPTIONS,
+            notifSmsMinPriority: PRIORITY_OPTIONS,
+        },
+        fieldVisibility: notificationsVisibilityFields,
+        editMode,
+        onToggleFieldVisibility: setNotificationsFieldVisible,
+        fieldOrder: notificationsFieldOrder,
+        onMoveField: (fieldName, neighborName) => setNotificationsFieldOrder(swapFieldOrder(notificationsFieldOrder, resolveFields(siteSettingsNotificationsFormSchema).map((f) => f.name), fieldName, neighborName)),
+    }), [notificationsVisibilityFields, editMode, setNotificationsFieldVisible, notificationsFieldOrder, setNotificationsFieldOrder]);
     // Snapshot of the masked placeholder strings the server returned for every
     // credentials.* field, captured once per load. A combined single-save has
     // to send the FULL credentials object on every save (not just the group the
@@ -418,214 +820,282 @@ export function AdminSiteSettingsView({ labels = {}, ...rest }) {
     React.useEffect(() => {
         if (!s || !Object.keys(s).length)
             return;
-        setSiteName(s.siteName ?? "");
-        setTagline(s.tagline ?? "");
-        setLogoUrl(s.logo ?? "");
-        setFaviconUrl(s.favicon ?? "");
-        setMaintenanceMode(s.maintenance?.enabled ?? false);
-        setMaintenanceMessage(s.maintenance?.message ?? "");
-        setLightBgType(s.background?.light?.type ?? "color");
-        setLightBgValue(s.background?.light?.value ?? "");
-        setLightBgOverlayEnabled(s.background?.light?.overlay?.enabled ?? false);
-        setLightBgOverlayColor(s.background?.light?.overlay?.color ?? "#000000");
-        setLightBgOverlayOpacity(Math.round((s.background?.light?.overlay?.opacity ?? 0.3) * 100));
-        setDarkBgType(s.background?.dark?.type ?? "color");
-        setDarkBgValue(s.background?.dark?.value ?? "");
-        setDarkBgOverlayEnabled(s.background?.dark?.overlay?.enabled ?? false);
-        setDarkBgOverlayColor(s.background?.dark?.overlay?.color ?? "#000000");
-        setDarkBgOverlayOpacity(Math.round((s.background?.dark?.overlay?.opacity ?? 0.3) * 100));
+        setBrandingForm({
+            siteName: s.siteName ?? "",
+            tagline: s.tagline ?? "",
+            logoUrl: s.logo ?? "",
+            faviconUrl: s.favicon ?? "",
+            maintenanceMode: s.maintenance?.enabled ?? false,
+            maintenanceMessage: s.maintenance?.message ?? "",
+            chatEnabled: s.chat?.enabled ?? false,
+            assistantEnabled: s.assistant?.enabled ?? true,
+        });
+        setAppearanceForm({
+            lightBg: {
+                type: (s.background?.light?.type ?? "color"),
+                value: s.background?.light?.value ?? "",
+                overlayEnabled: s.background?.light?.overlay?.enabled ?? false,
+                overlayColor: s.background?.light?.overlay?.color ?? "#000000",
+                overlayOpacity: Math.round((s.background?.light?.overlay?.opacity ?? 0.3) * 100),
+            },
+            darkBg: {
+                type: (s.background?.dark?.type ?? "color"),
+                value: s.background?.dark?.value ?? "",
+                overlayEnabled: s.background?.dark?.overlay?.enabled ?? false,
+                overlayColor: s.background?.dark?.overlay?.color ?? "#000000",
+                overlayOpacity: Math.round((s.background?.dark?.overlay?.opacity ?? 0.3) * 100),
+            },
+        });
         const themeBlock = s.theme;
         setThemeRegistry({
             themes: (themeBlock?.themes ?? []),
             defaultLightThemeId: themeBlock?.defaultLightThemeId ?? DEFAULT_LIGHT_THEME.id,
             defaultDarkThemeId: themeBlock?.defaultDarkThemeId ?? DEFAULT_DARK_THEME.id,
         });
-        setAnnouncementEnabled(s.announcementBar?.enabled ?? false);
-        setAnnouncementText(s.announcementBar?.message ?? "");
-        setAnnouncementLink(s.announcementBar?.link ?? "");
-        setAnnouncementBg(s.announcementBar?.backgroundColor ?? "");
-        setSeoTitle(s.seo?.defaultTitle ?? "");
-        setSeoDescription(s.seo?.defaultDescription ?? "");
-        setSeoOgImage(s.seo?.defaultOgImage ?? "");
-        setSeoNoIndex(s.seo?.noIndex ?? false);
-        setCanonicalUrl(s.seo?.canonicalBaseUrl ?? "");
-        setSupportEmail(s.contact?.email ?? "");
-        setSupportPhone(s.contact?.phone ?? "");
-        setSupportAddress(s.contact?.address ?? "");
-        setSupportHours(s.contact?.supportHours ?? "");
-        setInstagram(s.socialLinks?.instagram ?? "");
-        setTwitter(s.socialLinks?.twitter ?? "");
-        setFacebook(s.socialLinks?.facebook ?? "");
-        setYoutube(s.socialLinks?.youtube ?? "");
-        setWhatsapp(s.contact?.whatsappNumber ?? "");
-        setUpiVpa(s.contact?.upiVpa ?? "");
-        setLinkedin(s.socialLinks?.linkedin ?? "");
-        setPinterest(s.socialLinks?.pinterest ?? "");
-        setWatermarkType(s.watermark?.type ?? "text");
-        setWatermarkText(s.watermark?.text ?? "letitrip.in");
-        setWatermarkImageUrl(s.watermark?.imageUrl ?? "");
-        setWatermarkSize(s.watermark?.size ?? 10);
-        setWatermarkOpacity(s.watermark?.opacity ?? 10);
-        const loadedPosition = s.watermark?.position ?? "center";
-        setWatermarkUseCustomOffset(loadedPosition === "custom");
-        setWatermarkPosition(loadedPosition === "custom" ? "center" : loadedPosition);
-        setWatermarkOffsetX(s.watermark?.offsetX ?? 0);
-        setWatermarkOffsetY(s.watermark?.offsetY ?? 0);
-        setPlatformFeePercent(s.commissions?.platformFeePercent ?? 5);
-        setGstPercent(s.commissions?.gstPercent ?? 18);
-        setMinimumTransactionFee(s.commissions?.minimumTransactionFee ?? 0);
-        setPlatformFeeMax(s.commissions?.platformFeeMax ?? 10);
-        setGatewayFeePercent(s.commissions?.gatewayFeePercent ?? 2);
+        setAnnouncementForm({
+            announcementEnabled: s.announcementBar?.enabled ?? false,
+            announcementText: s.announcementBar?.message ?? "",
+            announcementLink: s.announcementBar?.link ?? "",
+            announcementBg: s.announcementBar?.backgroundColor ?? "",
+        });
+        setSeoForm({
+            seoTitle: s.seo?.defaultTitle ?? "",
+            seoDescription: s.seo?.defaultDescription ?? "",
+            seoOgImage: s.seo?.defaultOgImage ?? "",
+            seoNoIndex: s.seo?.noIndex ?? false,
+            canonicalUrl: s.seo?.canonicalBaseUrl ?? "",
+        });
+        setContactForm({
+            supportEmail: s.contact?.email ?? "",
+            supportPhone: s.contact?.phone ?? "",
+            supportAddress: s.contact?.address ?? "",
+            supportHours: s.contact?.supportHours ?? "",
+            instagram: s.socialLinks?.instagram ?? "",
+            twitter: s.socialLinks?.twitter ?? "",
+            facebook: s.socialLinks?.facebook ?? "",
+            youtube: s.socialLinks?.youtube ?? "",
+            whatsapp: s.contact?.whatsappNumber ?? "",
+            upiVpa: s.contact?.upiVpa ?? "",
+            linkedin: s.socialLinks?.linkedin ?? "",
+            pinterest: s.socialLinks?.pinterest ?? "",
+        });
+        const loadedWatermarkPosition = s.watermark?.position ?? "center";
+        setWatermarkForm({
+            watermarkType: s.watermark?.type ?? "text",
+            watermarkText: s.watermark?.text ?? getBrandDomain(),
+            watermarkImageUrl: s.watermark?.imageUrl ?? "",
+            watermarkSize: s.watermark?.size ?? 10,
+            watermarkOpacity: s.watermark?.opacity ?? 10,
+            watermarkUseCustomOffset: loadedWatermarkPosition === "custom",
+            watermarkPosition: loadedWatermarkPosition === "custom"
+                ? "center"
+                : loadedWatermarkPosition,
+            watermarkOffsetX: s.watermark?.offsetX ?? 0,
+            watermarkOffsetY: s.watermark?.offsetY ?? 0,
+        });
+        setFeesForm({
+            platformFeePercent: s.commissions?.platformFeePercent ?? 5,
+            gstPercent: s.commissions?.gstPercent ?? 18,
+            minimumTransactionFee: s.commissions?.minimumTransactionFee ?? 0,
+            platformFeeMax: s.commissions?.platformFeeMax ?? 10,
+            gatewayFeePercent: s.commissions?.gatewayFeePercent ?? 2,
+            /*
+             * 🛑 Clamped UP to the floor on load, deliberately.
+             *
+             * The live document is seeded `2`, and the payload Zod schema now
+             * refuses anything below `PAYOUT_HOLD_FLOOR_DAYS` (7) — so without this
+             * clamp an admin opening this tab would load 2, change something
+             * unrelated, and be blocked from saving by a field they never touched.
+             * The honoured value is already 7 (`resolvePayoutHoldDays` clamps at
+             * read time), so showing 7 is showing the truth, not silently
+             * overriding them.
+             */
+            payoutHoldDays: Math.max(s.commissions?.payoutHoldDays ?? 7, PAYOUT_HOLD_FLOOR_DAYS),
+            minPayoutAmount: s.commissions?.minPayoutAmount ?? 100,
+            collectorDropListingFee: s.commissions?.collectorDropListingFee ?? 0,
+            preOrderListingFee: s.commissions?.preOrderListingFee ?? 0,
+            featuredSlotFee: s.commissions?.featuredSlotFee ?? 999,
+            promotedSlotFee: s.commissions?.promotedSlotFee ?? 499,
+            codDepositPercent: s.commissions?.codDepositPercent ?? 10,
+            whatsappNotifyFeeEnabled: s.commissions?.whatsappNotifyFeeEnabled ?? false,
+            whatsappNotifyFee: s.commissions?.whatsappNotifyFee ?? 10,
+            giftWrapFeeEnabled: s.commissions?.giftWrapFeeEnabled ?? false,
+            giftWrapFee: s.commissions?.giftWrapFee ?? 49,
+            shipmentProtectionFeeEnabled: s.commissions?.shipmentProtectionFeeEnabled ?? false,
+            shipmentProtectionFeePercent: s.commissions?.shipmentProtectionFeePercent ?? 2,
+            shipmentProtectionFeeMin: s.commissions?.shipmentProtectionFeeMin ?? 30,
+            saleProtectionFeeEnabled: s.commissions?.saleProtectionFeeEnabled ?? true,
+            saleProtectionFeePercent: s.commissions?.saleProtectionFeePercent ?? 3,
+            saleProtectionFeeMin: s.commissions?.saleProtectionFeeMin ?? 49,
+            codHandlingFeePercent: s.commissions?.codHandlingFeePercent ?? 10,
+            codHandlingFeeCap: s.commissions?.codHandlingFeeCap ?? 200,
+        });
+        setProcurementForm({
+            laborHourlyRate: s.laborRate?.hourlyRate ?? 200,
+            laborMaxHoursPerDay: s.laborRate?.maxHoursPerDay ?? 6,
+        });
+        setEmiForm({
+            emiEnabled: s.emi?.enabled ?? false,
+            emiMinOrderValue: s.emi?.minOrderValue ?? 10000,
+            emiTenureOptionsText: (s.emi?.tenureOptions ?? [2, 3, 4, 5, 6]).join(","),
+            emiTokenPercent: s.emi?.tokenPercent ?? 20,
+            emiBillingDay: s.emi?.billingDay ?? 5,
+            emiSurchargePercentPerMonth: s.emi?.surchargePercentPerMonth ?? 2,
+            emiSurchargeSellerSharePercent: s.emi?.surchargeSellerSharePercent ?? 50,
+        });
+        setGstForm({
+            gstEnabled: s.gst?.enabled ?? false,
+            gstin: s.gst?.gstin ?? "",
+            gstLegalName: s.gst?.legalName ?? "",
+            gstAddress: s.gst?.address ?? "",
+        });
+        setIntegrationsForm({
+            razorpayKeyId: s.credentialsMasked?.razorpayKeyId ?? "",
+            razorpayKeySecret: s.credentialsMasked?.razorpayKeySecret ?? "",
+            razorpayWebhookSecret: s.credentialsMasked?.razorpayWebhookSecret ?? "",
+            cashfreeAppId: s.credentialsMasked?.cashfreeAppId ?? "",
+            cashfreeSecretKey: s.credentialsMasked?.cashfreeSecretKey ?? "",
+            cashfreeEnvironment: s.credentialsMasked?.cashfreeEnvironment ?? "sandbox",
+            phonepeClientId: s.credentialsMasked?.phonepeClientId ?? "",
+            phonepeClientSecret: s.credentialsMasked?.phonepeClientSecret ?? "",
+            phonepeClientVersion: s.credentialsMasked?.phonepeClientVersion ?? "1",
+            phonepeEnvironment: s.credentialsMasked?.phonepeEnvironment ?? "sandbox",
+            phonepeWebhookUsername: s.credentialsMasked?.phonepeWebhookUsername ?? "",
+            phonepeWebhookPassword: s.credentialsMasked?.phonepeWebhookPassword ?? "",
+            googleMapsApiKey: s.credentialsMasked?.googleMapsApiKey ?? "",
+            googlePlaceId: s.credentialsMasked?.googlePlaceId ?? "",
+            smtpHost: s.emailSettings?.host ?? "",
+            smtpPort: String(s.emailSettings?.port ?? 587),
+            smtpUser: s.emailSettings?.user ?? "",
+            smtpFrom: s.emailSettings?.fromAddress ?? "",
+            gaMeasurementId: s.integrations?.googleAnalyticsId ?? "",
+            fbPixelId: s.integrations?.facebookPixelId ?? "",
+            gtmContainerId: s.integrations?.gtmContainerId ?? "",
+            clarityProjectId: s.integrations?.clarityProjectId ?? "",
+            metaPageAccessToken: s.credentialsMasked?.metaPageAccessToken ?? "",
+            metaPageId: s.credentialsMasked?.metaPageId ?? "",
+            tiktokClientKey: s.credentialsMasked?.tiktokClientKey ?? "",
+            tiktokClientSecret: s.credentialsMasked?.tiktokClientSecret ?? "",
+            tiktokAccessToken: s.credentialsMasked?.tiktokAccessToken ?? "",
+            deviantartClientId: s.credentialsMasked?.deviantartClientId ?? "",
+            deviantartClientSecret: s.credentialsMasked?.deviantartClientSecret ?? "",
+        });
         /*
-         * 🛑 Clamped UP to the floor on load, deliberately.
-         *
-         * The live document is seeded `2`, and the payload Zod schema now refuses
-         * anything below `PAYOUT_HOLD_FLOOR_DAYS` (7) — so without this clamp an
-         * admin opening this tab would load 2, change something unrelated, and be
-         * blocked from saving by a field they never touched. The honoured value is
-         * already 7 (`resolvePayoutHoldDays` clamps at read time), so showing 7 is
-         * showing the truth, not silently overriding them.
+         * 🛑 The HYDRATE leg, and skipping it is the live risk this file's own
+         * comments name: a key that is SAVED but never hydrated renders its
+         * default — here the empty string — and the next save writes that default
+         * over the stored value. For this field that silently turns online
+         * collection off for the whole site on the first unrelated settings save.
          */
-        setPayoutHoldDays(Math.max(s.commissions?.payoutHoldDays ?? 7, PAYOUT_HOLD_FLOOR_DAYS));
-        setMinPayoutAmount(s.commissions?.minPayoutAmount ?? 100);
-        setAuctionListingFee(s.commissions?.auctionListingFee ?? 0);
-        setPreOrderListingFee(s.commissions?.preOrderListingFee ?? 0);
-        setFeaturedSlotFee(s.commissions?.featuredSlotFee ?? 999);
-        setPromotedSlotFee(s.commissions?.promotedSlotFee ?? 499);
-        setWhatsappNotifyFeeEnabled(s.commissions?.whatsappNotifyFeeEnabled ?? false);
-        setWhatsappNotifyFee(s.commissions?.whatsappNotifyFee ?? 10);
-        setGiftWrapFeeEnabled(s.commissions?.giftWrapFeeEnabled ?? false);
-        setGiftWrapFee(s.commissions?.giftWrapFee ?? 49);
-        setShipmentProtectionFeeEnabled(s.commissions?.shipmentProtectionFeeEnabled ?? false);
-        setSaleProtectionFeeEnabled(s.commissions?.saleProtectionFeeEnabled ?? true);
-        setSaleProtectionFeePercent(s.commissions?.saleProtectionFeePercent ?? 3);
-        setSaleProtectionFeeMin(s.commissions?.saleProtectionFeeMin ?? 49);
-        setCodHandlingFeePercent(s.commissions?.codHandlingFeePercent ?? 10);
-        setCodHandlingFeeCap(s.commissions?.codHandlingFeeCap ?? 200);
-        setShipmentProtectionFeePercent(s.commissions?.shipmentProtectionFeePercent ?? 2);
-        setShipmentProtectionFeeMin(s.commissions?.shipmentProtectionFeeMin ?? 30);
-        setCodDepositPercent(s.commissions?.codDepositPercent ?? 10);
-        setSellerShippingFixed(s.commissions?.sellerShippingFixed ?? 0);
-        setPlatformShippingPercent(s.commissions?.platformShippingPercent ?? 10);
-        setPlatformShippingFixedMin(s.commissions?.platformShippingFixedMin ?? 0);
-        setLaborHourlyRate(s.laborRate?.hourlyRate ?? 200);
-        setLaborMaxHoursPerDay(s.laborRate?.maxHoursPerDay ?? 6);
-        setEmiEnabled(s.emi?.enabled ?? false);
-        setEmiMinOrderValue(s.emi?.minOrderValue ?? 10000);
-        setEmiTenureOptionsText((s.emi?.tenureOptions ?? [2, 3, 4, 5, 6]).join(","));
-        setEmiTokenPercent(s.emi?.tokenPercent ?? 20);
-        setEmiBillingDay(s.emi?.billingDay ?? 5);
-        setEmiSurchargePercentPerMonth(s.emi?.surchargePercentPerMonth ?? 2);
-        setEmiSurchargeSellerSharePercent(s.emi?.surchargeSellerSharePercent ?? 50);
-        setGstEnabled(s.gst?.enabled ?? false);
-        setGstin(s.gst?.gstin ?? "");
-        setGstLegalName(s.gst?.legalName ?? "");
-        setGstAddress(s.gst?.address ?? "");
-        setRazorpayKeyId(s.credentialsMasked?.razorpayKeyId ?? "");
-        setRazorpayKeySecret(s.credentialsMasked?.razorpayKeySecret ?? "");
-        setRazorpayWebhookSecret(s.credentialsMasked?.razorpayWebhookSecret ?? "");
-        setPhonepeClientId(s.credentialsMasked?.phonepeClientId ?? "");
-        setPhonepeClientSecret(s.credentialsMasked?.phonepeClientSecret ?? "");
-        setPhonepeClientVersion(s.credentialsMasked?.phonepeClientVersion ?? "1");
-        setPhonepeEnvironment(s.credentialsMasked?.phonepeEnvironment ?? "sandbox");
-        setPhonepeWebhookUsername(s.credentialsMasked?.phonepeWebhookUsername ?? "");
-        setPhonepeWebhookPassword(s.credentialsMasked?.phonepeWebhookPassword ?? "");
-        setGoogleMapsApiKey(s.credentialsMasked?.googleMapsApiKey ?? "");
-        setGooglePlaceId(s.credentialsMasked?.googlePlaceId ?? "");
-        setSmtpHost(s.emailSettings?.host ?? "");
-        setSmtpPort(String(s.emailSettings?.port ?? 587));
-        setSmtpUser(s.emailSettings?.user ?? "");
-        setSmtpFrom(s.emailSettings?.fromAddress ?? "");
-        setGaMeasurementId(s.integrations?.googleAnalyticsId ?? "");
-        setFbPixelId(s.integrations?.facebookPixelId ?? "");
-        setGtmContainerId(s.integrations?.gtmContainerId ?? "");
-        setClarityProjectId(s.integrations?.clarityProjectId ?? "");
-        setMetaPageAccessToken(s.credentialsMasked?.metaPageAccessToken ?? "");
-        setMetaPageId(s.credentialsMasked?.metaPageId ?? "");
-        setTiktokClientKey(s.credentialsMasked?.tiktokClientKey ?? "");
-        setTiktokClientSecret(s.credentialsMasked?.tiktokClientSecret ?? "");
-        setTiktokAccessToken(s.credentialsMasked?.tiktokAccessToken ?? "");
-        setDeviantartClientId(s.credentialsMasked?.deviantartClientId ?? "");
-        setDeviantartClientSecret(s.credentialsMasked?.deviantartClientSecret ?? "");
-        setFreeShippingThreshold(s.shipping?.freeShippingThreshold ?? 999);
-        setDefaultCarrier(s.shipping?.defaultCarrier ?? "custom");
-        setMaxDeliveryRadius(s.shipping?.maxDeliveryRadius ?? 0);
-        setRazorpayEnabled(s.payment?.razorpayEnabled ?? false);
-        setPhonepeEnabled(s.payment?.phonepeEnabled ?? false);
-        setUpiManualEnabled(s.payment?.upiManualEnabled ?? true);
-        setCodEnabled(s.payment?.codEnabled ?? true);
-        setOtpCheckoutThreshold(s.payment?.otpCheckoutThreshold ?? 5000);
-        setCodMaxOrderValue(s.payment?.codMaxOrderValue ?? COD_MAX_ORDER_VALUE_FALLBACK);
-        setListingTypeFlags(s.listings?.listingTypes ?? {});
-        setCategoryTypeFlags(s.listings?.categoryTypes ?? {});
-        setBrowsePageFlags(s.listings?.browsePages ?? {});
-        setNotifEmailTypes(s.notificationChannels?.email?.types ?? []);
-        setNotifWhatsappTypes(s.notificationChannels?.whatsapp?.types ?? []);
-        setBidIncrementTiers(s.auctionConfig?.bidIncrementTiers ?? DEFAULT_AUCTION_BID_INCREMENT_TIERS);
-        setAutoExtendWindow(s.auctionConfig?.autoExtendWindowMinutes ?? 5);
-        setSettlementGrace(s.auctionConfig?.settlementGracePeriodHours ?? 24);
-        setMaxProductsPerStore(s.platformLimits?.maxProductsPerStore ?? 100);
-        setMaxCustomFields(s.platformLimits?.maxCustomFieldsPerProduct ?? 50);
-        setOrderCancelWindow(s.platformLimits?.orderCancellationWindowHours ?? 24);
-        setTermsHtml(s.legalPages?.terms ?? "");
-        setPrivacyHtml(s.legalPages?.privacy ?? "");
-        setRefundHtml(s.legalPages?.refundPolicy ?? "");
-        setShippingPolicyHtml(s.legalPages?.shipping ?? "");
-        setCookieHtml(s.legalPages?.cookies ?? "");
-        setEthicsHtml(s.legalPages?.ethics ?? "");
-        setCancellationHtml(s.legalPages?.cancellation ?? "");
-        setGrievanceHtml(s.legalPages?.grievance ?? "");
-        setConductHtml(s.legalPages?.codeOfConduct ?? "");
-        setAboutTitle(s.aboutContent?.title ?? "");
-        setAboutSubtitle(s.aboutContent?.subtitle ?? "");
-        setAboutMissionTitle(s.aboutContent?.missionTitle ?? "");
-        setAboutMissionText(s.aboutContent?.missionText ?? "");
-        setAboutHowItWorksTitle(s.aboutContent?.howItWorksTitle ?? "");
-        setAboutHowItems(s.aboutContent?.howItems ?? []);
-        setAboutValuesTitle(s.aboutContent?.valuesTitle ?? "");
-        setAboutValuesSubtitle(s.aboutContent?.valuesSubtitle ?? "");
-        setAboutValueItems(s.aboutContent?.valueItems ?? []);
-        setAboutMilestonesTitle(s.aboutContent?.milestonesTitle ?? "");
-        setAboutMilestones(s.aboutContent?.milestones ?? []);
-        setAboutTeamTitle(s.aboutContent?.teamTitle ?? "");
-        setAboutTeamSubtitle(s.aboutContent?.teamSubtitle ?? "");
-        setAboutTeamMembers(s.aboutContent?.teamMembers ?? []);
-        setAboutCtaTitle(s.aboutContent?.ctaTitle ?? "");
-        setAboutCtaSell(s.aboutContent?.ctaSell ?? "");
-        setAboutCtaShop(s.aboutContent?.ctaShop ?? "");
-        setWaPhoneNumberId(s.credentialsMasked?.whatsappPhoneNumberId ?? "");
-        setWaCloudApiToken(s.credentialsMasked?.whatsappCloudApiToken ?? "");
-        setWaAdminNotifyNumbers(s.credentialsMasked?.whatsappAdminNotifyNumbers ?? "");
-        setWaTemplateLanguage(s.credentialsMasked?.whatsappTemplateLanguage ?? "en");
-        setWaTemplateOrderPlaced(s.credentialsMasked?.whatsappTemplateOrderPlaced ?? "");
-        setWaTemplateOrderConfirmed(s.credentialsMasked?.whatsappTemplateOrderConfirmed ?? "");
-        setWaTemplateOrderShipped(s.credentialsMasked?.whatsappTemplateOrderShipped ?? "");
-        setWaTemplateOrderDelivered(s.credentialsMasked?.whatsappTemplateOrderDelivered ?? "");
-        setWaTemplateOrderCancelled(s.credentialsMasked?.whatsappTemplateOrderCancelled ?? "");
-        setWaTemplateRefundInitiated(s.credentialsMasked?.whatsappTemplateRefundInitiated ?? "");
-        setNotifEmailEnabled(s.notificationChannels?.email?.enabled ?? false);
-        setNotifEmailMinPriority(s.notificationChannels?.email?.minPriority ?? "normal");
-        setNotifWhatsappEnabled(s.notificationChannels?.whatsapp?.enabled ?? false);
-        setNotifWhatsappMinPriority(s.notificationChannels?.whatsapp?.minPriority ?? "high");
-        setNotifWhatsappOtpEnabled(s.notificationChannels?.whatsapp?.otpEnabled ?? false);
-        setNotifSmsEnabled(s.notificationChannels?.sms?.enabled ?? false);
-        setNotifSmsMinPriority(s.notificationChannels?.sms?.minPriority ?? "high");
-        setResendApiKey(s.credentialsMasked?.resendApiKey ?? "");
-        setNotifFromEmail(s.emailSettings?.fromEmail ?? "");
-        setNotifFromName(s.emailSettings?.fromName ?? "");
-        setDigestEnabled(s.emailSettings?.dailyDigest?.enabled ?? false);
-        setDigestRecipients((s.emailSettings?.dailyDigest?.recipients ?? []).join("\n"));
-        // Defaults mirror MESSAGE_BUDGET_DEFAULTS — both channels OFF, so a
-        // settings document written before this feature existed reads as quiet
-        // rather than as "on and unmetered".
-        setMsgEmailEnabled(s.messaging?.emailEnabled ?? false);
-        setMsgWhatsappEnabled(s.messaging?.whatsappEnabled ?? false);
-        setMsgCeilingEmail(s.messaging?.dailyCeiling?.email ?? 80);
-        setMsgCeilingWhatsapp(s.messaging?.dailyCeiling?.whatsapp ?? 200);
+        setShippingForm({
+            razorpayEnabled: s.payment?.razorpayEnabled ?? false,
+            phonepeEnabled: s.payment?.phonepeEnabled ?? false,
+            cashfreeEnabled: s.payment?.cashfreeEnabled ?? false,
+            platformStoreId: s.payment?.platformStoreId ?? "",
+            upiManualEnabled: s.payment?.upiManualEnabled ?? true,
+            codEnabled: s.payment?.codEnabled ?? true,
+            otpCheckoutThreshold: s.payment?.otpCheckoutThreshold ?? 5000,
+            codMaxOrderValue: s.payment?.codMaxOrderValue ?? COD_MAX_ORDER_VALUE_FALLBACK,
+            freeShippingThreshold: s.shipping?.freeShippingThreshold ?? 999,
+            defaultCarrier: s.shipping?.defaultCarrier ?? "custom",
+            maxDeliveryRadius: s.shipping?.maxDeliveryRadius ?? 0,
+            sellerShippingFixed: s.commissions?.sellerShippingFixed ?? 0,
+            platformShippingPercent: s.commissions?.platformShippingPercent ?? 10,
+            platformShippingFixedMin: s.commissions?.platformShippingFixedMin ?? 0,
+        });
+        /*
+         * 🛑 `FlagValue`, not `boolean`. These three maps store
+         * `boolean | "unlisted"`; the old `as Record<string, boolean>` cast was a
+         * lie that let a truthy `"unlisted"` string flow into a two-state Toggle,
+         * which rendered it as "on" and overwrote it on the next click.
+         */
+        setListingsForm({
+            listingTypeFlags: s.listings?.listingTypes ?? {},
+            categoryTypeFlags: s.listings?.categoryTypes ?? {},
+            browsePageFlags: s.listings?.browsePages ?? {},
+        });
+        setCollectorDropForm({
+            bidIncrementTiers: s.collectorDropConfig?.bidIncrementTiers ?? DEFAULT_COLLECTOR_DROP_BID_INCREMENT_TIERS,
+            autoExtendWindow: s.collectorDropConfig?.autoExtendWindowMinutes ?? 5,
+            settlementGrace: s.collectorDropConfig?.settlementGracePeriodHours ?? 24,
+        });
+        setLimitsForm({
+            maxProductsPerStore: s.platformLimits?.maxProductsPerStore ?? 100,
+            maxCustomFields: s.platformLimits?.maxCustomFieldsPerProduct ?? 50,
+            orderCancelWindow: s.platformLimits?.orderCancellationWindowHours ?? 24,
+        });
+        setLegalForm({
+            termsHtml: s.legalPages?.terms ?? "",
+            privacyHtml: s.legalPages?.privacy ?? "",
+            refundHtml: s.legalPages?.refundPolicy ?? "",
+            shippingPolicyHtml: s.legalPages?.shipping ?? "",
+            cookieHtml: s.legalPages?.cookies ?? "",
+            ethicsHtml: s.legalPages?.ethics ?? "",
+            cancellationHtml: s.legalPages?.cancellation ?? "",
+            grievanceHtml: s.legalPages?.grievance ?? "",
+            conductHtml: s.legalPages?.codeOfConduct ?? "",
+        });
+        setAboutForm({
+            aboutTitle: s.aboutContent?.title ?? "",
+            aboutSubtitle: s.aboutContent?.subtitle ?? "",
+            aboutMissionTitle: s.aboutContent?.missionTitle ?? "",
+            aboutMissionText: s.aboutContent?.missionText ?? "",
+            aboutHowItWorksTitle: s.aboutContent?.howItWorksTitle ?? "",
+            aboutHowItems: s.aboutContent?.howItems ?? [],
+            aboutValuesTitle: s.aboutContent?.valuesTitle ?? "",
+            aboutValuesSubtitle: s.aboutContent?.valuesSubtitle ?? "",
+            aboutValueItems: s.aboutContent?.valueItems ?? [],
+            aboutMilestonesTitle: s.aboutContent?.milestonesTitle ?? "",
+            aboutMilestones: s.aboutContent?.milestones ?? [],
+            aboutTeamTitle: s.aboutContent?.teamTitle ?? "",
+            aboutTeamSubtitle: s.aboutContent?.teamSubtitle ?? "",
+            aboutTeamMembers: s.aboutContent?.teamMembers ?? [],
+            aboutCtaTitle: s.aboutContent?.ctaTitle ?? "",
+            aboutCtaSell: s.aboutContent?.ctaSell ?? "",
+            aboutCtaShop: s.aboutContent?.ctaShop ?? "",
+        });
+        setWhatsappForm({
+            waPhoneNumberId: s.credentialsMasked?.whatsappPhoneNumberId ?? "",
+            waCloudApiToken: s.credentialsMasked?.whatsappCloudApiToken ?? "",
+            waAdminNotifyNumbers: s.credentialsMasked?.whatsappAdminNotifyNumbers ?? "",
+            waTemplateLanguage: s.credentialsMasked?.whatsappTemplateLanguage ?? "en",
+            waTemplateOrderPlaced: s.credentialsMasked?.whatsappTemplateOrderPlaced ?? "",
+            waTemplateOrderConfirmed: s.credentialsMasked?.whatsappTemplateOrderConfirmed ?? "",
+            waTemplateOrderShipped: s.credentialsMasked?.whatsappTemplateOrderShipped ?? "",
+            waTemplateOrderDelivered: s.credentialsMasked?.whatsappTemplateOrderDelivered ?? "",
+            waTemplateOrderCancelled: s.credentialsMasked?.whatsappTemplateOrderCancelled ?? "",
+            waTemplateRefundInitiated: s.credentialsMasked?.whatsappTemplateRefundInitiated ?? "",
+        });
+        setNotificationsForm({
+            notifEmailEnabled: s.notificationChannels?.email?.enabled ?? false,
+            notifEmailMinPriority: s.notificationChannels?.email?.minPriority ?? "normal",
+            notifWhatsappEnabled: s.notificationChannels?.whatsapp?.enabled ?? false,
+            notifWhatsappMinPriority: s.notificationChannels?.whatsapp?.minPriority ?? "high",
+            notifWhatsappOtpEnabled: s.notificationChannels?.whatsapp?.otpEnabled ?? false,
+            notifSmsEnabled: s.notificationChannels?.sms?.enabled ?? false,
+            notifSmsMinPriority: s.notificationChannels?.sms?.minPriority ?? "high",
+            notifEmailTypes: s.notificationChannels?.email?.types ?? [],
+            notifWhatsappTypes: s.notificationChannels?.whatsapp?.types ?? [],
+            resendApiKey: s.credentialsMasked?.resendApiKey ?? "",
+            notifFromEmail: s.emailSettings?.fromEmail ?? "",
+            notifFromName: s.emailSettings?.fromName ?? "",
+            digestEnabled: s.emailSettings?.dailyDigest?.enabled ?? false,
+            digestRecipients: (s.emailSettings?.dailyDigest?.recipients ?? []).join("\n"),
+            // Defaults mirror MESSAGE_BUDGET_DEFAULTS — both channels OFF, so a
+            // settings document written before this feature existed reads as
+            // quiet rather than as "on and unmetered".
+            msgEmailEnabled: s.messaging?.emailEnabled ?? false,
+            msgWhatsappEnabled: s.messaging?.whatsappEnabled ?? false,
+            msgCeilingEmail: s.messaging?.dailyCeiling?.email ?? 80,
+            msgCeilingWhatsapp: s.messaging?.dailyCeiling?.whatsapp ?? 200,
+        });
         originalMaskedRef.current = {
             razorpayKeyId: s.credentialsMasked?.razorpayKeyId ?? "",
             razorpayKeySecret: s.credentialsMasked?.razorpayKeySecret ?? "",
             razorpayWebhookSecret: s.credentialsMasked?.razorpayWebhookSecret ?? "",
+            cashfreeAppId: s.credentialsMasked?.cashfreeAppId ?? "",
+            cashfreeSecretKey: s.credentialsMasked?.cashfreeSecretKey ?? "",
+            cashfreeEnvironment: s.credentialsMasked?.cashfreeEnvironment ?? "",
             phonepeClientId: s.credentialsMasked?.phonepeClientId ?? "",
             phonepeClientSecret: s.credentialsMasked?.phonepeClientSecret ?? "",
             phonepeClientVersion: s.credentialsMasked?.phonepeClientVersion ?? "",
@@ -660,36 +1130,47 @@ export function AdminSiteSettingsView({ labels = {}, ...rest }) {
     function buildFullPayload() {
         return {
             aboutContent: {
-                title: aboutTitle,
-                subtitle: aboutSubtitle,
-                missionTitle: aboutMissionTitle,
-                missionText: aboutMissionText,
-                howItWorksTitle: aboutHowItWorksTitle,
-                howItems: aboutHowItems,
-                valuesTitle: aboutValuesTitle,
-                valuesSubtitle: aboutValuesSubtitle,
-                valueItems: aboutValueItems,
-                milestonesTitle: aboutMilestonesTitle,
-                milestones: aboutMilestones,
-                teamTitle: aboutTeamTitle,
-                teamSubtitle: aboutTeamSubtitle,
-                teamMembers: aboutTeamMembers,
-                ctaTitle: aboutCtaTitle,
-                ctaSell: aboutCtaSell,
-                ctaShop: aboutCtaShop,
-            },
-            siteName, tagline, logo: logoUrl, favicon: faviconUrl,
-            maintenance: { enabled: maintenanceMode, message: maintenanceMessage },
+                title: aboutForm.aboutTitle,
+                subtitle: aboutForm.aboutSubtitle,
+                missionTitle: aboutForm.aboutMissionTitle,
+                missionText: aboutForm.aboutMissionText,
+                howItWorksTitle: aboutForm.aboutHowItWorksTitle,
+                howItems: aboutForm.aboutHowItems,
+                valuesTitle: aboutForm.aboutValuesTitle,
+                valuesSubtitle: aboutForm.aboutValuesSubtitle,
+                valueItems: aboutForm.aboutValueItems,
+                milestonesTitle: aboutForm.aboutMilestonesTitle,
+                milestones: aboutForm.aboutMilestones,
+                teamTitle: aboutForm.aboutTeamTitle,
+                teamSubtitle: aboutForm.aboutTeamSubtitle,
+                teamMembers: aboutForm.aboutTeamMembers,
+                ctaTitle: aboutForm.aboutCtaTitle,
+                ctaSell: aboutForm.aboutCtaSell,
+                ctaShop: aboutForm.aboutCtaShop,
+            },
+            siteName: brandingForm.siteName, tagline: brandingForm.tagline,
+            logo: brandingForm.logoUrl, favicon: brandingForm.faviconUrl,
+            maintenance: { enabled: brandingForm.maintenanceMode, message: brandingForm.maintenanceMessage },
+            chat: { enabled: brandingForm.chatEnabled },
+            assistant: { enabled: brandingForm.assistantEnabled },
             background: {
                 light: {
-                    type: lightBgType,
-                    value: lightBgValue,
-                    overlay: { enabled: lightBgOverlayEnabled, color: lightBgOverlayColor, opacity: lightBgOverlayOpacity / 100 },
+                    type: appearanceForm.lightBg.type,
+                    value: appearanceForm.lightBg.value,
+                    overlay: {
+                        enabled: appearanceForm.lightBg.overlayEnabled,
+                        color: appearanceForm.lightBg.overlayColor,
+                        opacity: appearanceForm.lightBg.overlayOpacity / 100,
+                    },
                 },
                 dark: {
-                    type: darkBgType,
-                    value: darkBgValue,
-                    overlay: { enabled: darkBgOverlayEnabled, color: darkBgOverlayColor, opacity: darkBgOverlayOpacity / 100 },
+                    type: appearanceForm.darkBg.type,
+                    value: appearanceForm.darkBg.value,
+                    overlay: {
+                        enabled: appearanceForm.darkBg.overlayEnabled,
+                        color: appearanceForm.darkBg.overlayColor,
+                        opacity: appearanceForm.darkBg.overlayOpacity / 100,
+                    },
                 },
             },
             theme: {
@@ -698,81 +1179,117 @@ export function AdminSiteSettingsView({ labels = {}, ...rest }) {
                 defaultDarkThemeId: themeRegistry.defaultDarkThemeId,
             },
             // message, not text — text was never read by AnnouncementBar or the homepage.
-            announcementBar: { enabled: announcementEnabled, message: announcementText, link: announcementLink, backgroundColor: announcementBg },
-            seo: { defaultTitle: seoTitle, defaultDescription: seoDescription, defaultOgImage: seoOgImage, noIndex: seoNoIndex, canonicalBaseUrl: canonicalUrl },
-            contact: { email: supportEmail, phone: supportPhone, address: supportAddress, supportHours, whatsappNumber: whatsapp, upiVpa },
-            socialLinks: { instagram, twitter, facebook, youtube, linkedin, pinterest },
+            announcementBar: {
+                enabled: announcementForm.announcementEnabled,
+                message: announcementForm.announcementText,
+                link: announcementForm.announcementLink,
+                backgroundColor: announcementForm.announcementBg,
+            },
+            seo: {
+                defaultTitle: seoForm.seoTitle,
+                defaultDescription: seoForm.seoDescription,
+                defaultOgImage: seoForm.seoOgImage,
+                noIndex: seoForm.seoNoIndex,
+                canonicalBaseUrl: seoForm.canonicalUrl,
+            },
+            contact: {
+                email: contactForm.supportEmail,
+                phone: contactForm.supportPhone,
+                address: contactForm.supportAddress,
+                supportHours: contactForm.supportHours,
+                whatsappNumber: contactForm.whatsapp,
+                upiVpa: contactForm.upiVpa,
+            },
+            socialLinks: {
+                instagram: contactForm.instagram,
+                twitter: contactForm.twitter,
+                facebook: contactForm.facebook,
+                youtube: contactForm.youtube,
+                linkedin: contactForm.linkedin,
+                pinterest: contactForm.pinterest,
+            },
             watermark: {
-                type: watermarkType,
-                text: watermarkText,
-                imageUrl: watermarkImageUrl,
-                size: watermarkSize,
-                opacity: watermarkOpacity,
-                position: watermarkUseCustomOffset ? "custom" : watermarkPosition,
-                offsetX: watermarkOffsetX,
-                offsetY: watermarkOffsetY,
-            },
-            commissions: { platformFeePercent, gstPercent, minimumTransactionFee, platformFeeMax, gatewayFeePercent, payoutHoldDays, whatsappNotifyFee, whatsappNotifyFeeEnabled, minPayoutAmount, auctionListingFee, preOrderListingFee, featuredSlotFee, promotedSlotFee, giftWrapFeeEnabled, giftWrapFee, shipmentProtectionFeeEnabled, shipmentProtectionFeePercent, shipmentProtectionFeeMin, saleProtectionFeeEnabled, saleProtectionFeePercent, saleProtectionFeeMin, codHandlingFeePercent, codHandlingFeeCap, codDepositPercent, sellerShippingFixed, platformShippingPercent, platformShippingFixedMin },
-            laborRate: { hourlyRate: laborHourlyRate, maxHoursPerDay: laborMaxHoursPerDay },
+                type: watermarkForm.watermarkType,
+                text: watermarkForm.watermarkText,
+                imageUrl: watermarkForm.watermarkImageUrl,
+                size: watermarkForm.watermarkSize,
+                opacity: watermarkForm.watermarkOpacity,
+                position: watermarkForm.watermarkUseCustomOffset ? "custom" : watermarkForm.watermarkPosition,
+                offsetX: watermarkForm.watermarkOffsetX,
+                offsetY: watermarkForm.watermarkOffsetY,
+            },
+            commissions: {
+                ...feesForm,
+                sellerShippingFixed: shippingForm.sellerShippingFixed,
+                platformShippingPercent: shippingForm.platformShippingPercent,
+                platformShippingFixedMin: shippingForm.platformShippingFixedMin,
+            },
+            laborRate: { hourlyRate: procurementForm.laborHourlyRate, maxHoursPerDay: procurementForm.laborMaxHoursPerDay },
             emi: {
-                enabled: emiEnabled,
-                minOrderValue: emiMinOrderValue,
-                tenureOptions: emiTenureOptionsText
+                enabled: emiForm.emiEnabled,
+                minOrderValue: emiForm.emiMinOrderValue,
+                tenureOptions: (emiForm.emiTenureOptionsText ?? "")
                     .split(",")
                     .map((v) => parseInt(v.trim(), 10))
                     .filter((v) => !isNaN(v) && v > 0),
-                tokenPercent: emiTokenPercent,
-                billingDay: emiBillingDay,
-                surchargePercentPerMonth: emiSurchargePercentPerMonth,
-                surchargeSellerSharePercent: emiSurchargeSellerSharePercent,
+                tokenPercent: emiForm.emiTokenPercent,
+                billingDay: emiForm.emiBillingDay,
+                surchargePercentPerMonth: emiForm.emiSurchargePercentPerMonth,
+                surchargeSellerSharePercent: emiForm.emiSurchargeSellerSharePercent,
             },
             gst: {
-                enabled: gstEnabled,
-                gstin: gstin.trim().toUpperCase(),
-                legalName: gstLegalName.trim(),
-                address: gstAddress.trim(),
+                enabled: gstForm.gstEnabled,
+                gstin: (gstForm.gstin ?? "").trim().toUpperCase(),
+                legalName: (gstForm.gstLegalName ?? "").trim(),
+                address: (gstForm.gstAddress ?? "").trim(),
             },
             // Masked credential fields resolve to "" when untouched — the repository's
             // mergeEncryptedCredentials preserves the existing encrypted value for any
             // "" field, so an unedited tab never overwrites a real secret with its
             // own masked display string.
             credentials: {
-                razorpayKeyId: maskedOrReal("razorpayKeyId", razorpayKeyId),
-                razorpayKeySecret: maskedOrReal("razorpayKeySecret", razorpayKeySecret),
-                razorpayWebhookSecret: maskedOrReal("razorpayWebhookSecret", razorpayWebhookSecret),
-                phonepeClientId: maskedOrReal("phonepeClientId", phonepeClientId),
-                phonepeClientSecret: maskedOrReal("phonepeClientSecret", phonepeClientSecret),
-                phonepeClientVersion: maskedOrReal("phonepeClientVersion", phonepeClientVersion),
-                phonepeEnvironment: maskedOrReal("phonepeEnvironment", phonepeEnvironment),
-                phonepeWebhookUsername: maskedOrReal("phonepeWebhookUsername", phonepeWebhookUsername),
-                phonepeWebhookPassword: maskedOrReal("phonepeWebhookPassword", phonepeWebhookPassword),
-                googleMapsApiKey: maskedOrReal("googleMapsApiKey", googleMapsApiKey),
-                googlePlaceId: maskedOrReal("googlePlaceId", googlePlaceId),
-                metaPageAccessToken: maskedOrReal("metaPageAccessToken", metaPageAccessToken),
-                metaPageId: maskedOrReal("metaPageId", metaPageId),
-                tiktokClientKey: maskedOrReal("tiktokClientKey", tiktokClientKey),
-                tiktokClientSecret: maskedOrReal("tiktokClientSecret", tiktokClientSecret),
-                tiktokAccessToken: maskedOrReal("tiktokAccessToken", tiktokAccessToken),
-                deviantartClientId: maskedOrReal("deviantartClientId", deviantartClientId),
-                deviantartClientSecret: maskedOrReal("deviantartClientSecret", deviantartClientSecret),
-                whatsappPhoneNumberId: maskedOrReal("whatsappPhoneNumberId", waPhoneNumberId),
-                whatsappCloudApiToken: maskedOrReal("whatsappCloudApiToken", waCloudApiToken),
-                whatsappAdminNotifyNumbers: maskedOrReal("whatsappAdminNotifyNumbers", waAdminNotifyNumbers),
-                whatsappTemplateLanguage: maskedOrReal("whatsappTemplateLanguage", waTemplateLanguage),
-                whatsappTemplateOrderPlaced: maskedOrReal("whatsappTemplateOrderPlaced", waTemplateOrderPlaced),
-                whatsappTemplateOrderConfirmed: maskedOrReal("whatsappTemplateOrderConfirmed", waTemplateOrderConfirmed),
-                whatsappTemplateOrderShipped: maskedOrReal("whatsappTemplateOrderShipped", waTemplateOrderShipped),
-                whatsappTemplateOrderDelivered: maskedOrReal("whatsappTemplateOrderDelivered", waTemplateOrderDelivered),
-                whatsappTemplateOrderCancelled: maskedOrReal("whatsappTemplateOrderCancelled", waTemplateOrderCancelled),
-                whatsappTemplateRefundInitiated: maskedOrReal("whatsappTemplateRefundInitiated", waTemplateRefundInitiated),
-                resendApiKey: maskedOrReal("resendApiKey", resendApiKey),
+                razorpayKeyId: maskedOrReal("razorpayKeyId", integrationsForm.razorpayKeyId ?? ""),
+                razorpayKeySecret: maskedOrReal("razorpayKeySecret", integrationsForm.razorpayKeySecret ?? ""),
+                razorpayWebhookSecret: maskedOrReal("razorpayWebhookSecret", integrationsForm.razorpayWebhookSecret ?? ""),
+                cashfreeAppId: maskedOrReal("cashfreeAppId", integrationsForm.cashfreeAppId ?? ""),
+                cashfreeSecretKey: maskedOrReal("cashfreeSecretKey", integrationsForm.cashfreeSecretKey ?? ""),
+                cashfreeEnvironment: maskedOrReal("cashfreeEnvironment", integrationsForm.cashfreeEnvironment ?? ""),
+                phonepeClientId: maskedOrReal("phonepeClientId", integrationsForm.phonepeClientId ?? ""),
+                phonepeClientSecret: maskedOrReal("phonepeClientSecret", integrationsForm.phonepeClientSecret ?? ""),
+                phonepeClientVersion: maskedOrReal("phonepeClientVersion", integrationsForm.phonepeClientVersion ?? ""),
+                phonepeEnvironment: maskedOrReal("phonepeEnvironment", integrationsForm.phonepeEnvironment ?? ""),
+                phonepeWebhookUsername: maskedOrReal("phonepeWebhookUsername", integrationsForm.phonepeWebhookUsername ?? ""),
+                phonepeWebhookPassword: maskedOrReal("phonepeWebhookPassword", integrationsForm.phonepeWebhookPassword ?? ""),
+                googleMapsApiKey: maskedOrReal("googleMapsApiKey", integrationsForm.googleMapsApiKey ?? ""),
+                googlePlaceId: maskedOrReal("googlePlaceId", integrationsForm.googlePlaceId ?? ""),
+                metaPageAccessToken: maskedOrReal("metaPageAccessToken", integrationsForm.metaPageAccessToken ?? ""),
+                metaPageId: maskedOrReal("metaPageId", integrationsForm.metaPageId ?? ""),
+                tiktokClientKey: maskedOrReal("tiktokClientKey", integrationsForm.tiktokClientKey ?? ""),
+                tiktokClientSecret: maskedOrReal("tiktokClientSecret", integrationsForm.tiktokClientSecret ?? ""),
+                tiktokAccessToken: maskedOrReal("tiktokAccessToken", integrationsForm.tiktokAccessToken ?? ""),
+                deviantartClientId: maskedOrReal("deviantartClientId", integrationsForm.deviantartClientId ?? ""),
+                deviantartClientSecret: maskedOrReal("deviantartClientSecret", integrationsForm.deviantartClientSecret ?? ""),
+                whatsappPhoneNumberId: maskedOrReal("whatsappPhoneNumberId", whatsappForm.waPhoneNumberId ?? ""),
+                whatsappCloudApiToken: maskedOrReal("whatsappCloudApiToken", whatsappForm.waCloudApiToken ?? ""),
+                whatsappAdminNotifyNumbers: maskedOrReal("whatsappAdminNotifyNumbers", whatsappForm.waAdminNotifyNumbers ?? ""),
+                whatsappTemplateLanguage: maskedOrReal("whatsappTemplateLanguage", whatsappForm.waTemplateLanguage ?? ""),
+                whatsappTemplateOrderPlaced: maskedOrReal("whatsappTemplateOrderPlaced", whatsappForm.waTemplateOrderPlaced ?? ""),
+                whatsappTemplateOrderConfirmed: maskedOrReal("whatsappTemplateOrderConfirmed", whatsappForm.waTemplateOrderConfirmed ?? ""),
+                whatsappTemplateOrderShipped: maskedOrReal("whatsappTemplateOrderShipped", whatsappForm.waTemplateOrderShipped ?? ""),
+                whatsappTemplateOrderDelivered: maskedOrReal("whatsappTemplateOrderDelivered", whatsappForm.waTemplateOrderDelivered ?? ""),
+                whatsappTemplateOrderCancelled: maskedOrReal("whatsappTemplateOrderCancelled", whatsappForm.waTemplateOrderCancelled ?? ""),
+                whatsappTemplateRefundInitiated: maskedOrReal("whatsappTemplateRefundInitiated", whatsappForm.waTemplateRefundInitiated ?? ""),
+                resendApiKey: maskedOrReal("resendApiKey", notificationsForm.resendApiKey ?? ""),
             },
             emailSettings: {
-                host: smtpHost, port: Number(smtpPort), user: smtpUser, fromAddress: smtpFrom,
-                fromEmail: notifFromEmail, fromName: notifFromName,
+                host: integrationsForm.smtpHost,
+                port: Number(integrationsForm.smtpPort),
+                user: integrationsForm.smtpUser,
+                fromAddress: integrationsForm.smtpFrom,
+                fromEmail: notificationsForm.notifFromEmail, fromName: notificationsForm.notifFromName,
                 dailyDigest: {
-                    enabled: digestEnabled,
-                    recipients: splitEmailList(digestRecipients),
+                    enabled: notificationsForm.digestEnabled,
+                    recipients: splitEmailList(notificationsForm.digestRecipients ?? ""),
                     // Always empty — the CC field is gone (see the Notifications tab).
                     // Sent explicitly rather than omitted so a save clears any CC list a
                     // pre-existing document still carries.
@@ -780,36 +1297,88 @@ export function AdminSiteSettingsView({ labels = {}, ...rest }) {
                 },
             },
             messaging: {
-                emailEnabled: msgEmailEnabled,
-                whatsappEnabled: msgWhatsappEnabled,
+                emailEnabled: notificationsForm.msgEmailEnabled,
+                whatsappEnabled: notificationsForm.msgWhatsappEnabled,
                 dailyCeiling: {
-                    email: msgCeilingEmail,
-                    whatsapp: msgCeilingWhatsapp,
+                    email: notificationsForm.msgCeilingEmail,
+                    whatsapp: notificationsForm.msgCeilingWhatsapp,
                     // No SMS sender exists; the ceiling is carried so one cannot ship
                     // uncapped if somebody adds a provider later.
                     sms: 50,
                 },
             },
-            integrations: { googleAnalyticsId: gaMeasurementId, facebookPixelId: fbPixelId, gtmContainerId, clarityProjectId },
-            shipping: { freeShippingThreshold, defaultCarrier, maxDeliveryRadius },
-            payment: { razorpayEnabled, phonepeEnabled, upiManualEnabled, codEnabled, codMaxOrderValue, otpCheckoutThreshold },
-            auctionConfig: { bidIncrementTiers: bidIncrementTiers, autoExtendWindowMinutes: autoExtendWindow, settlementGracePeriodHours: settlementGrace },
-            platformLimits: { maxProductsPerStore, maxCustomFieldsPerProduct: maxCustomFields, orderCancellationWindowHours: orderCancelWindow },
-            legalPages: { terms: termsHtml, privacy: privacyHtml, refundPolicy: refundHtml, shipping: shippingPolicyHtml, cookies: cookieHtml, ethics: ethicsHtml, codeOfConduct: conductHtml, cancellation: cancellationHtml, grievance: grievanceHtml },
+            integrations: {
+                googleAnalyticsId: integrationsForm.gaMeasurementId,
+                facebookPixelId: integrationsForm.fbPixelId,
+                gtmContainerId: integrationsForm.gtmContainerId,
+                clarityProjectId: integrationsForm.clarityProjectId,
+            },
+            shipping: {
+                freeShippingThreshold: shippingForm.freeShippingThreshold,
+                defaultCarrier: shippingForm.defaultCarrier,
+                maxDeliveryRadius: shippingForm.maxDeliveryRadius,
+            },
+            /*
+             * `platformStoreId` is trimmed and sent as `undefined` when blank rather
+             * than as `""` — the resolver treats an empty-ish value as unset anyway,
+             * but writing a literal empty string would record a DECISION ("no store
+             * is ours") where none was made, and a stored `""` reads differently
+             * from an absent key to anyone inspecting the document.
+             */
+            payment: {
+                razorpayEnabled: shippingForm.razorpayEnabled,
+                phonepeEnabled: shippingForm.phonepeEnabled,
+                cashfreeEnabled: shippingForm.cashfreeEnabled,
+                platformStoreId: (shippingForm.platformStoreId ?? "").trim() || undefined,
+                upiManualEnabled: shippingForm.upiManualEnabled,
+                codEnabled: shippingForm.codEnabled,
+                codMaxOrderValue: shippingForm.codMaxOrderValue,
+                otpCheckoutThreshold: shippingForm.otpCheckoutThreshold,
+            },
+            collectorDropConfig: {
+                bidIncrementTiers: collectorDropForm.bidIncrementTiers,
+                autoExtendWindowMinutes: collectorDropForm.autoExtendWindow,
+                settlementGracePeriodHours: collectorDropForm.settlementGrace,
+            },
+            platformLimits: {
+                maxProductsPerStore: limitsForm.maxProductsPerStore,
+                maxCustomFieldsPerProduct: limitsForm.maxCustomFields,
+                orderCancellationWindowHours: limitsForm.orderCancelWindow,
+            },
+            legalPages: {
+                terms: legalForm.termsHtml,
+                privacy: legalForm.privacyHtml,
+                refundPolicy: legalForm.refundHtml,
+                shipping: legalForm.shippingPolicyHtml,
+                cookies: legalForm.cookieHtml,
+                ethics: legalForm.ethicsHtml,
+                codeOfConduct: legalForm.conductHtml,
+                cancellation: legalForm.cancellationHtml,
+                grievance: legalForm.grievanceHtml,
+            },
             // Both keys are always sent: Firestore's update() replaces a nested map
             // wholesale, so omitting one here would wipe it. The load-time spread this
             // used to carry existed to preserve `adminCheckoutBypass`, which is now a
             // permission rather than a stored flag.
             listings: {
-                listingTypes: listingTypeFlags,
-                categoryTypes: categoryTypeFlags,
-                browsePages: browsePageFlags,
+                listingTypes: listingsForm.listingTypeFlags,
+                categoryTypes: listingsForm.categoryTypeFlags,
+                browsePages: listingsForm.browsePageFlags,
             },
             notificationChannels: {
                 inApp: { enabled: true, readOnly: true },
-                email: { enabled: notifEmailEnabled, minPriority: notifEmailMinPriority, types: notifEmailTypes },
-                whatsapp: { enabled: notifWhatsappEnabled, minPriority: notifWhatsappMinPriority, otpEnabled: notifWhatsappOtpEnabled, types: notifWhatsappTypes },
-                sms: { enabled: notifSmsEnabled, minPriority: notifSmsMinPriority },
+                email: {
+                    enabled: notificationsForm.notifEmailEnabled,
+                    minPriority: notificationsForm.notifEmailMinPriority,
+                    types: notificationsForm.notifEmailTypes,
+                },
+                whatsapp: {
+                    enabled: notificationsForm.notifWhatsappEnabled,
+                    minPriority: notificationsForm.notifWhatsappMinPriority,
+                    otpEnabled: notificationsForm.notifWhatsappOtpEnabled,
+                    types: notificationsForm.notifWhatsappTypes,
+                },
+                sms: { enabled: notificationsForm.notifSmsEnabled, minPriority: notificationsForm.notifSmsMinPriority },
             },
         };
     }
@@ -844,17 +1413,6 @@ export function AdminSiteSettingsView({ labels = {}, ...rest }) {
         { label: "Image", value: "image" },
         { label: "Video", value: "video" },
     ];
-    const CARRIER_OPTIONS = [
-        { label: "Custom / Other", value: "custom" },
-        { label: "Shiprocket", value: "shiprocket" },
-        { label: "Delhivery", value: "delhivery" },
-        { label: "Bluedart", value: "bluedart" },
-        { label: "FedEx", value: "fedex" },
-    ];
-    const PHONEPE_ENVIRONMENT_OPTIONS = [
-        { label: "Sandbox (test)", value: "sandbox" },
-        { label: "Production (live)", value: "production" },
-    ];
     /*
      * 🛑 DERIVED. This was a hand-written literal and it had drifted in both
      * directions at once: `art` and `stickers` were MISSING — so an admin had no
@@ -901,61 +1459,18 @@ export function AdminSiteSettingsView({ labels = {}, ...rest }) {
         }
         saveAllMutation.mutate();
     };
-    return (_jsx(StackedViewShell, { portal: "admin", ...rest, title: labels.title ?? "Site Settings", sections: [
-            isLoading ? (_jsx(Alert, { variant: "info", title: "Loading", children: "Fetching site settings\u2026" }, "loading")) : null,
-            error ? (_jsx(Alert, { variant: "error", title: "Load failed", children: error instanceof Error ? error.message : "Unknown error" }, "error")) : null,
-            _jsxs(FormShellContext.Provider, { value: shellCtx, children: [_jsxs(Tabs, { value: activeTab, 
-                        /*
-                         * `Tabs` hands back a bare string, so it is narrowed here rather
-                         * than cast. An unknown value is ignored instead of being written
-                         * into state — the same reason `?tab=` is validated on the way in.
-                         */
-                        onChange: (next) => {
-                            if (isSiteSettingsTabId(next))
-                                setActiveTab(next);
-                        }, children: [_jsx(TabsList, { children: SITE_SETTINGS_TABS.map((tab) => (_jsx(TabsTrigger, { value: tab.id, children: tab.label }, tab.id))) }), _jsx(TabsContent, { value: "about", children: _jsxs(SettingsTabForm, { id: "about", label: "About", children: [_jsx(Text, { size: "xs", color: "muted", children: "Override the About page content. Leave blank to use the platform defaults." }), _jsx(Input, { label: "Hero title", value: aboutTitle, onChange: (e) => setAboutTitle(e.target.value), placeholder: "About LetItRip" }), _jsx(Input, { label: "Hero subtitle", value: aboutSubtitle, onChange: (e) => setAboutSubtitle(e.target.value), placeholder: "Connecting buyers, sellers, and bidders in one vibrant marketplace" }), _jsx(Input, { label: "Mission section title", value: aboutMissionTitle, onChange: (e) => setAboutMissionTitle(e.target.value), placeholder: "Our Mission" }), _jsx(_Fragment, { children: _jsx(Textarea, { label: "Mission text", value: aboutMissionText, onChange: (e) => setAboutMissionText(e.target.value), placeholder: "LetItRip was built to democratise commerce\u2026", rows: 4 }) }), _jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "md", children: [_jsx(Input, { label: '"How it works" section title', value: aboutHowItWorksTitle, onChange: (e) => setAboutHowItWorksTitle(e.target.value), placeholder: "How It Works" }), aboutHowItems.map((item, i) => (_jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "sm", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsxs(Text, { size: "xs", weight: "medium", color: "muted", children: ["Step ", i + 1] }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => setAboutHowItems(aboutHowItems.filter((_, idx) => idx !== i)), children: "\u2715" })] }), _jsx(Input, { label: "Icon (emoji)", value: item.icon, onChange: (e) => { const next = [...aboutHowItems]; next[i] = { ...item, icon: e.target.value }; setAboutHowItems(next); }, placeholder: "\uD83D\uDED2" }), _jsx(Input, { label: "Title", value: item.title, onChange: (e) => { const next = [...aboutHowItems]; next[i] = { ...item, title: e.target.value }; setAboutHowItems(next); } }), _jsx(Textarea, { value: item.text, onChange: (e) => { const next = [...aboutHowItems]; next[i] = { ...item, text: e.target.value }; setAboutHowItems(next); }, rows: 2 })] }, i))), _jsx(Button, { type: "button", variant: "secondary", size: "sm", onClick: () => setAboutHowItems([...aboutHowItems, { title: "", text: "", icon: "✨", tone: "indigo" }]), children: "+ Add step" })] }), _jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "md", children: [_jsx(Input, { label: "Values section title", value: aboutValuesTitle, onChange: (e) => setAboutValuesTitle(e.target.value), placeholder: "Our Values" }), _jsx(Input, { label: "Values section subtitle", value: aboutValuesSubtitle, onChange: (e) => setAboutValuesSubtitle(e.target.value), placeholder: "Optional intro line under the heading" }), aboutValueItems.map((item, i) => (_jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "sm", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsxs(Text, { size: "xs", weight: "medium", color: "muted", children: ["Value ", i + 1] }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => setAboutValueItems(aboutValueItems.filter((_, idx) => idx !== i)), children: "\u2715" })] }), _jsx(Input, { label: "Icon (emoji)", value: item.icon, onChange: (e) => { const next = [...aboutValueItems]; next[i] = { ...item, icon: e.target.value }; setAboutValueItems(next); }, placeholder: "\uD83D\uDEE1\uFE0F" }), _jsx(Input, { label: "Title", value: item.title, onChange: (e) => { const next = [...aboutValueItems]; next[i] = { ...item, title: e.target.value }; setAboutValueItems(next); } }), _jsx(Textarea, { label: "Text", value: item.text, onChange: (e) => { const next = [...aboutValueItems]; next[i] = { ...item, text: e.target.value }; setAboutValueItems(next); }, rows: 2 }), _jsx(Textarea, { label: "Detail (optional)", value: item.detail ?? "", onChange: (e) => { const next = [...aboutValueItems]; next[i] = { ...item, detail: e.target.value }; setAboutValueItems(next); }, rows: 2, placeholder: "How this value is actually enforced" })] }, i))), _jsx(Button, { type: "button", variant: "secondary", size: "sm", onClick: () => setAboutValueItems([...aboutValueItems, { title: "", text: "", icon: "✨" }]), children: "+ Add value" })] }), _jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "md", children: [_jsx(Input, { label: "Milestones section title", value: aboutMilestonesTitle, onChange: (e) => setAboutMilestonesTitle(e.target.value), placeholder: "Our Journey" }), aboutMilestones.map((item, i) => (_jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "sm", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsxs(Text, { size: "xs", weight: "medium", color: "muted", children: ["Milestone ", i + 1] }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => setAboutMilestones(aboutMilestones.filter((_, idx) => idx !== i)), children: "\u2715" })] }), _jsx(Input, { label: "Year", value: item.year, onChange: (e) => { const next = [...aboutMilestones]; next[i] = { ...item, year: e.target.value }; setAboutMilestones(next); }, placeholder: "2024" }), _jsx(Textarea, { value: item.text, onChange: (e) => { const next = [...aboutMilestones]; next[i] = { ...item, text: e.target.value }; setAboutMilestones(next); }, rows: 2 })] }, i))), _jsx(Button, { type: "button", variant: "secondary", size: "sm", onClick: () => setAboutMilestones([...aboutMilestones, { year: "", text: "" }]), children: "+ Add milestone" })] }), _jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "md", children: [_jsx(Input, { label: "Team section title", value: aboutTeamTitle, onChange: (e) => setAboutTeamTitle(e.target.value), placeholder: "Meet the Team" }), _jsx(Input, { label: "Team section subtitle", value: aboutTeamSubtitle, onChange: (e) => setAboutTeamSubtitle(e.target.value), placeholder: "The people building LetItRip" }), aboutTeamMembers.map((member, i) => (_jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "sm", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsxs(Text, { size: "xs", weight: "medium", color: "muted", children: ["Team member ", i + 1] }), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => setAboutTeamMembers(aboutTeamMembers.filter((_, idx) => idx !== i)), children: "\u2715" })] }), _jsx(ImageUpload, { label: "Photo", currentImage: member.photoUrl, onUpload: (file) => upload(file, "store"), onChange: (url) => { const next = [...aboutTeamMembers]; next[i] = { ...member, photoUrl: url }; setAboutTeamMembers(next); } }), _jsx(Input, { label: "Name", value: member.name, onChange: (e) => { const next = [...aboutTeamMembers]; next[i] = { ...member, name: e.target.value }; setAboutTeamMembers(next); } }), _jsx(Input, { label: "Role", value: member.role, onChange: (e) => { const next = [...aboutTeamMembers]; next[i] = { ...member, role: e.target.value }; setAboutTeamMembers(next); }, placeholder: "Founder & Developer" }), _jsx(Textarea, { value: member.bio, onChange: (e) => { const next = [...aboutTeamMembers]; next[i] = { ...member, bio: e.target.value }; setAboutTeamMembers(next); }, rows: 3 }), _jsxs(Row, { gap: "md", children: [_jsx(Toggle, { label: "Founder", checked: !!member.isFounder, onChange: (v) => { const next = [...aboutTeamMembers]; next[i] = { ...member, isFounder: v }; setAboutTeamMembers(next); } }), _jsx(Toggle, { label: "Developer", checked: !!member.isDeveloper, onChange: (v) => { const next = [...aboutTeamMembers]; next[i] = { ...member, isDeveloper: v }; setAboutTeamMembers(next); } })] })] }, i))), _jsx(Button, { type: "button", variant: "secondary", size: "sm", onClick: () => setAboutTeamMembers([...aboutTeamMembers, { name: "", role: "", bio: "" }]), children: "+ Add team member" })] }), _jsx(Input, { label: "CTA banner title", value: aboutCtaTitle, onChange: (e) => setAboutCtaTitle(e.target.value), placeholder: "Ready to get started?" }), _jsx(Input, { label: "Sell CTA copy", value: aboutCtaSell, onChange: (e) => setAboutCtaSell(e.target.value), placeholder: "Start selling in minutes" }), _jsx(Input, { label: "Shop CTA copy", value: aboutCtaShop, onChange: (e) => setAboutCtaShop(e.target.value), placeholder: "Browse the marketplace" })] }) }), _jsx(TabsContent, { value: "branding", children: _jsxs(SettingsTabForm, { id: "branding", label: "Branding", children: [_jsx(Input, { label: "Site name", value: siteName, onChange: (e) => setSiteName(e.target.value), placeholder: "LetItRip" }), _jsx(Input, { label: "Tagline", value: tagline, onChange: (e) => setTagline(e.target.value), placeholder: "India's Largest Collectibles Marketplace" }), _jsx(ImageUpload, { label: "Logo", currentImage: logoUrl, onUpload: (file) => upload(file, "store"), onChange: setLogoUrl }), _jsx(ImageUpload, { label: "Favicon", currentImage: faviconUrl, onUpload: (file) => upload(file, "store"), onChange: setFaviconUrl }), _jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "md", children: [_jsx(Div, { id: "setting-maintenance-mode", children: _jsx(Toggle, { label: "Maintenance mode", checked: maintenanceMode, onChange: setMaintenanceMode }) }), _jsx(Input, { label: "Maintenance message", value: maintenanceMessage, onChange: (e) => setMaintenanceMessage(e.target.value), placeholder: "We're back soon.", disabled: !maintenanceMode })] })] }) }), _jsx(TabsContent, { value: "appearance", children: _jsxs(SettingsTabForm, { id: "appearance", label: "Appearance", children: [_jsx(Text, { size: "xs", color: "muted", children: "Sets the background behind the public shell, dashboard sidebars, and any Section/Card that opts into it. Leave the value blank for a plain surface." }), _jsxs(Grid, { cols: 2, gap: "lg", children: [_jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "md", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Light mode" }), _jsx(Select, { label: "Type", options: BG_TYPE_OPTIONS, value: lightBgType, onValueChange: (v) => setLightBgType(v) }), lightBgType === "color" ? (_jsx(Input, { type: "color", label: "Color", value: lightBgValue || "#ffffff", onChange: (e) => setLightBgValue(e.target.value), className: "h-10 w-full cursor-pointer", bare: true }) /* audit-hex-tokens-ok: native color picker requires literal hex string fallback */) : lightBgType === "gradient" ? (_jsx(Textarea, { label: "CSS gradient expression", rows: 2, value: lightBgValue, onChange: (e) => setLightBgValue(e.target.value), placeholder: "linear-gradient(...)" })) : (_jsx(MediaUploadField, { label: lightBgType === "video" ? "Background video" : "Background image", kind: lightBgType === "video" ? "video" : "image", value: lightBgValue, onChange: setLightBgValue, onUpload: (file) => upload(file, "store") })), _jsx(Toggle, { label: "Dim overlay", checked: lightBgOverlayEnabled, onChange: setLightBgOverlayEnabled }), lightBgOverlayEnabled && (_jsxs(_Fragment, { children: [_jsx(Input, { type: "color", label: "Overlay color", value: lightBgOverlayColor, onChange: (e) => setLightBgOverlayColor(e.target.value), className: "h-10 w-full cursor-pointer", bare: true }), " ", _jsx(Slider, { label: "Overlay opacity", min: 0, max: 100, value: lightBgOverlayOpacity, onChange: setLightBgOverlayOpacity })] })), _jsx(Text, { size: "xs", color: "muted", children: "Preview" }), _jsx(Div, { className: "relative h-24 w-full", overflow: "hidden", rounded: "md", border: "default", children: _jsx(BackgroundRenderer, { mode: "light", lightMode: {
-                                                                    type: lightBgType,
-                                                                    value: lightBgValue,
-                                                                    overlay: { enabled: lightBgOverlayEnabled, color: lightBgOverlayColor, opacity: lightBgOverlayOpacity / 100 },
-                                                                }, darkMode: { type: "color", value: "" } }) })] }), _jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "md", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Dark mode" }), _jsx(Select, { label: "Type", options: BG_TYPE_OPTIONS, value: darkBgType, onValueChange: (v) => setDarkBgType(v) }), darkBgType === "color" ? (_jsx(Input, { type: "color", label: "Color", value: darkBgValue || "#000000", onChange: (e) => setDarkBgValue(e.target.value), className: "h-10 w-full cursor-pointer", bare: true }) /* audit-hex-tokens-ok: native color picker requires literal hex string fallback */) : darkBgType === "gradient" ? (_jsx(Textarea, { label: "CSS gradient expression", rows: 2, value: darkBgValue, onChange: (e) => setDarkBgValue(e.target.value), placeholder: "linear-gradient(...)" })) : (_jsx(MediaUploadField, { label: darkBgType === "video" ? "Background video" : "Background image", kind: darkBgType === "video" ? "video" : "image", value: darkBgValue, onChange: setDarkBgValue, onUpload: (file) => upload(file, "store") })), _jsx(Toggle, { label: "Dim overlay", checked: darkBgOverlayEnabled, onChange: setDarkBgOverlayEnabled }), darkBgOverlayEnabled && (_jsxs(_Fragment, { children: [_jsx(Input, { type: "color", label: "Overlay color", value: darkBgOverlayColor, onChange: (e) => setDarkBgOverlayColor(e.target.value), className: "h-10 w-full cursor-pointer", bare: true }), " ", _jsx(Slider, { label: "Overlay opacity", min: 0, max: 100, value: darkBgOverlayOpacity, onChange: setDarkBgOverlayOpacity })] })), _jsx(Text, { size: "xs", color: "muted", children: "Preview" }), _jsx(Div, { className: "relative h-24 w-full", overflow: "hidden", rounded: "md", border: "default", children: _jsx(BackgroundRenderer, { mode: "dark", lightMode: { type: "color", value: "" }, darkMode: {
-                                                                    type: darkBgType,
-                                                                    value: darkBgValue,
-                                                                    overlay: { enabled: darkBgOverlayEnabled, color: darkBgOverlayColor, opacity: darkBgOverlayOpacity / 100 },
-                                                                } }) })] })] })] }) }), _jsx(TabsContent, { value: "themes", children: _jsx(SettingsTabForm, { id: "themes", label: "Themes", children: _jsx(ThemeManagerView, { value: themeRegistry, onChange: setThemeRegistry, previewOrigin: "/" }) }) }), _jsx(TabsContent, { value: "announcement", children: _jsxs(SettingsTabForm, { id: "announcement", label: "Announcement", children: [_jsx(Div, { id: "setting-announcement-bar", children: _jsx(Toggle, { label: "Show announcement bar", checked: announcementEnabled, onChange: setAnnouncementEnabled }) }), _jsx(Input, { label: "Announcement text", value: announcementText, onChange: (e) => setAnnouncementText(e.target.value), placeholder: "\uD83C\uDF89 Free shipping on orders \u20B9999+", disabled: !announcementEnabled }), _jsx(Input, { label: "Link URL (optional)", value: announcementLink, onChange: (e) => setAnnouncementLink(e.target.value), placeholder: String(ROUTES.PUBLIC.PRODUCTS), disabled: !announcementEnabled }), _jsxs(Stack, { gap: "none", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", className: "mb-1", children: "Background color" }), _jsx(Input, { type: "color", "aria-label": "Background color", value: announcementBg || "#1d4ed8", onChange: (e) => setAnnouncementBg(e.target.value), className: "h-10 w-32 cursor-pointer", bare: true, disabled: !announcementEnabled }), " "] })] }) }), _jsx(TabsContent, { value: "seo", children: _jsxs(SettingsTabForm, { id: "seo", label: "Seo", children: [_jsx(Input, { label: "Default meta title", value: seoTitle, onChange: (e) => setSeoTitle(e.target.value), placeholder: "LetItRip \u2014 Buy, Sell & Auction Collectibles in India", maxLength: 60, helperText: "Max 60 chars. Use {page} token for dynamic insertion." }), _jsx(Input, { label: "Default meta description", value: seoDescription, onChange: (e) => setSeoDescription(e.target.value), placeholder: "India's largest collectibles marketplace\u2026", maxLength: 160, helperText: "Max 160 chars." }), _jsx(ImageUpload, { label: "Default OG image", currentImage: seoOgImage, onUpload: (file) => upload(file, "store"), onChange: setSeoOgImage }), _jsx(Input, { label: "Canonical base URL", value: canonicalUrl, onChange: (e) => setCanonicalUrl(e.target.value), placeholder: "https://letitrip.in" }), _jsx(Div, { id: "setting-robots-noindex", children: _jsx(Toggle, { label: "Robots noindex (disables search indexing \u2014 use carefully)", checked: seoNoIndex, onChange: setSeoNoIndex }) })] }) }), _jsx(TabsContent, { value: "contact", children: _jsxs(SettingsTabForm, { id: "contact", label: "Contact", children: [_jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Support email", value: supportEmail, onChange: (e) => setSupportEmail(e.target.value), type: "email", placeholder: "support@letitrip.in" }), _jsx(Input, { label: "Support phone", value: supportPhone, onChange: (e) => setSupportPhone(e.target.value), placeholder: "+91 XXXXX XXXXX" })] }), _jsx(Input, { label: "Physical address", value: supportAddress, onChange: (e) => setSupportAddress(e.target.value), placeholder: "Mumbai, Maharashtra, India" }), _jsx(Input, { label: "Support hours", value: supportHours, onChange: (e) => setSupportHours(e.target.value), placeholder: "Mon\u2013Fri, 10 AM \u2013 6 PM IST" }), _jsx(Text, { className: "pt-[0.5rem]", color: "muted", size: "sm", weight: "medium", children: "Social links" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Instagram URL", value: instagram, onChange: (e) => setInstagram(e.target.value), placeholder: "https://instagram.com/letitrip" }), _jsx(Input, { label: "Twitter / X URL", value: twitter, onChange: (e) => setTwitter(e.target.value), placeholder: "https://twitter.com/letitrip" }), _jsx(Input, { label: "Facebook URL", value: facebook, onChange: (e) => setFacebook(e.target.value), placeholder: "https://facebook.com/letitrip" }), _jsx(Input, { label: "YouTube URL", value: youtube, onChange: (e) => setYoutube(e.target.value), placeholder: "https://youtube.com/@letitrip" }), _jsx(Input, { label: "WhatsApp number", value: whatsapp, onChange: (e) => setWhatsapp(e.target.value), placeholder: "+91XXXXXXXXXX" }), _jsx(Input, { label: "Business UPI VPA", value: upiVpa, onChange: (e) => setUpiVpa(e.target.value), placeholder: "name@bank" }), _jsx(Input, { label: "LinkedIn URL", value: linkedin, onChange: (e) => setLinkedin(e.target.value), placeholder: "https://linkedin.com/company/letitrip" }), _jsx(Input, { label: "Pinterest URL", value: pinterest, onChange: (e) => setPinterest(e.target.value), placeholder: "https://pinterest.com/letitrip" })] })] }) }), _jsx(TabsContent, { value: "watermark", children: _jsxs(SettingsTabForm, { id: "watermark", label: "Watermark", children: [_jsx(Select, { label: "Watermark type", options: [{ label: "Text", value: "text" }, { label: "Image", value: "image" }], value: watermarkType, onValueChange: (v) => setWatermarkType(v) }), watermarkType === "text" ? (_jsx(Input, { label: "Watermark text", value: watermarkText, onChange: (e) => setWatermarkText(e.target.value), placeholder: "letitrip.in" })) : (_jsx(ImageUpload, { label: "Watermark image", currentImage: watermarkImageUrl, onUpload: (file) => upload(file, "store"), onChange: setWatermarkImageUrl })), _jsx(Slider, { label: `Size — ${watermarkSize}% of image width`, value: watermarkSize, onChange: setWatermarkSize, min: 5, max: 100, step: 5 }), _jsx(Slider, { label: `Opacity — ${watermarkOpacity}%`, value: watermarkOpacity, onChange: setWatermarkOpacity, min: 5, max: 100, step: 5 }), _jsx(Select, { label: "Position", options: [
-                                                { label: "Center", value: "center" },
-                                                { label: "Top left", value: "top-left" },
-                                                { label: "Top right", value: "top-right" },
-                                                { label: "Bottom left", value: "bottom-left" },
-                                                { label: "Bottom right", value: "bottom-right" },
-                                            ], value: watermarkPosition, onValueChange: (v) => setWatermarkPosition(v), disabled: watermarkUseCustomOffset }), _jsx(Toggle, { checked: watermarkUseCustomOffset, onChange: setWatermarkUseCustomOffset, label: "Use a custom X/Y offset instead" }), watermarkUseCustomOffset && (_jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "X offset (%) \u2014 + right / \u2212 left of center", value: String(watermarkOffsetX), onChange: (e) => setWatermarkOffsetX(Math.max(-45, Math.min(45, parseInt(e.target.value) || 0))), type: "number", min: -45, max: 45 }), _jsx(Input, { label: "Y offset (%) \u2014 + down / \u2212 up from center", value: String(watermarkOffsetY), onChange: (e) => setWatermarkOffsetY(Math.max(-45, Math.min(45, parseInt(e.target.value) || 0))), type: "number", min: -45, max: 45 })] })), _jsxs(Stack, { gap: "xs", surface: "muted", rounded: "lg", border: "default", padding: "md", children: [_jsx(Text, { size: "xs", color: "muted", children: "Preview (text watermark only)" }), _jsx(Row, { surface: "default", justify: "end", align: "end", className: `relative h-32 ${__O.hidden}`, rounded: "default", children: _jsx(Span, { ref: watermarkPreviewRef, weight: "medium", color: "faint", padding: "1", className: "select-none", children: watermarkText }) })] })] }) }), _jsx(TabsContent, { value: "fees", children: _jsxs(SettingsTabForm, { id: "fees", label: "Fees", children: [_jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Platform fee \u2014 our cut (%)", helperText: "% charged on order value. Buyer pays this.", value: String(platformFeePercent), onChange: (e) => setPlatformFeePercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 100, step: 0.1 }), _jsx(Input, { label: "GST on platform fee (%)", helperText: "Applied to our fee only (not full order). Usually 18%.", value: String(gstPercent), onChange: (e) => setGstPercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 100, step: 0.1 }), _jsx(Input, { label: "PhonePe gateway cost (%)", helperText: "Gateway's own fee \u2014 absorbed by platform, not passed through.", value: String(gatewayFeePercent), onChange: (e) => setGatewayFeePercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 10, step: 0.01 }), _jsx(Input, { label: "Minimum transaction fee (\u20B9)", helperText: "Per-transaction floor. Total charge will never be below base + this.", value: String(minimumTransactionFee), onChange: (e) => setMinimumTransactionFee(parseFloat(e.target.value) || 0), type: "number", min: 0, step: 0.01 }), _jsx(Input, { label: "Maximum platform fee (\u20B9)", helperText: "Ceiling on the buyer's platform commission, charged once per checkout on every payment method. GST is calculated on the capped amount.", value: String(platformFeeMax), onChange: (e) => setPlatformFeeMax(parseFloat(e.target.value) || 0), type: "number", min: 0, step: 0.01 }), _jsx(Input, { label: "Seller payout hold (days)", value: String(payoutHoldDays), onChange: (e) => setPayoutHoldDays(parseInt(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "Minimum payout amount (\u20B9)", value: String(minPayoutAmount), onChange: (e) => setMinPayoutAmount(parseInt(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "Auction listing fee (\u20B9)", helperText: "Not charged yet \u2014 no billing path exists for seller listing fees. Setting a value records the intended price; nothing collects it.", value: String(auctionListingFee), onChange: (e) => setAuctionListingFee(parseInt(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "Pre-order listing fee (\u20B9)", helperText: "Not charged yet \u2014 no billing path exists for seller listing fees. Setting a value records the intended price; nothing collects it.", value: String(preOrderListingFee), onChange: (e) => setPreOrderListingFee(parseInt(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "Featured slot fee (\u20B9)", helperText: "Not charged yet \u2014 no billing path exists for seller listing fees. Setting a value records the intended price; nothing collects it. /admin/deals sets isPromoted for free today.", value: String(featuredSlotFee), onChange: (e) => setFeaturedSlotFee(parseInt(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "Promoted slot fee (\u20B9)", helperText: "Not charged yet \u2014 no billing path exists for seller listing fees. Setting a value records the intended price; nothing collects it. /admin/deals sets isPromoted for free today.", value: String(promotedSlotFee), onChange: (e) => setPromotedSlotFee(parseInt(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "COD deposit (%)", helperText: "% of order collected upfront on COD orders; remainder paid on delivery.", value: String(codDepositPercent), onChange: (e) => setCodDepositPercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 100, step: 0.1 })] }), _jsx(Toggle, { checked: whatsappNotifyFeeEnabled, onChange: setWhatsappNotifyFeeEnabled, label: "Offer the WhatsApp order-updates addon at checkout" }), _jsx(Grid, { cols: 2, gap: "md", children: _jsx(Input, { label: "WhatsApp addon fee (\u20B9)", helperText: "Flat fee charged to the buyer when they opt in. Requires WhatsApp credentials + at least one approved template \u2014 see the WhatsApp tab.", value: String(whatsappNotifyFee), onChange: (e) => setWhatsappNotifyFee(parseFloat(e.target.value) || 0), type: "number", min: 0, disabled: !whatsappNotifyFeeEnabled }) }), _jsx(Toggle, { checked: giftWrapFeeEnabled, onChange: setGiftWrapFeeEnabled, label: "Offer the gift-wrap addon at checkout" }), _jsx(Grid, { cols: 2, gap: "md", children: _jsx(Input, { label: "Gift wrap fee (\u20B9)", helperText: "Flat fee charged to the buyer when they opt in.", value: String(giftWrapFee), onChange: (e) => setGiftWrapFee(parseFloat(e.target.value) || 0), type: "number", min: 0, disabled: !giftWrapFeeEnabled }) }), _jsx(Toggle, { checked: shipmentProtectionFeeEnabled, onChange: setShipmentProtectionFeeEnabled, label: "Offer the shipment-protection addon at checkout" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Shipment protection (%)", helperText: "% of order subtotal, charged when the buyer opts in.", value: String(shipmentProtectionFeePercent), onChange: (e) => setShipmentProtectionFeePercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 100, step: 0.1, disabled: !shipmentProtectionFeeEnabled }), _jsx(Input, { label: "Shipment protection minimum (\u20B9)", helperText: "Floor for the shipment-protection fee.", value: String(shipmentProtectionFeeMin), onChange: (e) => setShipmentProtectionFeeMin(parseFloat(e.target.value) || 0), type: "number", min: 0, disabled: !shipmentProtectionFeeEnabled })] }), _jsx(Toggle, { checked: saleProtectionFeeEnabled, onChange: setSaleProtectionFeeEnabled, label: "Offer the sale-protection addon at checkout" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Sale protection (%)", helperText: "% of order subtotal, charged when the buyer opts in. Covers the item against not-as-described and counterfeit claims.", value: String(saleProtectionFeePercent), onChange: (e) => setSaleProtectionFeePercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 100, step: 0.1, disabled: !saleProtectionFeeEnabled }), _jsx(Input, { label: "Sale protection minimum (\u20B9)", helperText: "Floor for the sale-protection fee.", value: String(saleProtectionFeeMin), onChange: (e) => setSaleProtectionFeeMin(parseFloat(e.target.value) || 0), type: "number", min: 0, disabled: !saleProtectionFeeEnabled })] }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "COD handling fee (%)", helperText: "% of order subtotal, charged on Cash-on-Delivery orders only.", value: String(codHandlingFeePercent), onChange: (e) => setCodHandlingFeePercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 100, step: 0.1 }), _jsx(Input, { label: "COD handling fee cap (\u20B9)", helperText: "Ceiling for the COD handling fee, however large the order.", value: String(codHandlingFeeCap), onChange: (e) => setCodHandlingFeeCap(parseFloat(e.target.value) || 0), type: "number", min: 0 })] })] }) }), _jsx(TabsContent, { value: "procurement", children: _jsxs(SettingsTabForm, { id: "procurement", label: "Procurement", children: [_jsx(Text, { size: "xs", color: "muted", children: "Used to compute each procurement shipment's labor cost (hours spent \u00D7 hourly rate) and its estimated processing time (hours spent \u00F7 max hours/day)." }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Hourly rate (\u20B9)", helperText: "Your effective hourly wage for sorting/categorizing/listing a shipment.", value: String(laborHourlyRate), onChange: (e) => setLaborHourlyRate(Math.round((parseFloat(e.target.value) || 0) * 100) / 100), type: "number", min: 0 }), _jsx(Input, { label: "Max hours per day", helperText: "Used only to project how many days a shipment's tracked hours will take.", value: String(laborMaxHoursPerDay), onChange: (e) => setLaborMaxHoursPerDay(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 24 })] })] }) }), _jsx(TabsContent, { value: "emi", children: _jsxs(SettingsTabForm, { id: "emi", label: "Emi", children: [_jsx(Text, { size: "xs", color: "muted", children: "A seller must also opt in via their own Payout Settings for EMI to appear at checkout on their items. See the \"How EMI Works\" public page for buyer-facing copy." }), _jsx(Toggle, { checked: emiEnabled, onChange: setEmiEnabled, label: "Enable EMI platform-wide" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Minimum order value (\u20B9)", helperText: "A seller's cart subtotal must exceed this for EMI to appear as an option.", value: String(emiMinOrderValue), onChange: (e) => setEmiMinOrderValue(Math.round((parseFloat(e.target.value) || 0) * 100) / 100), type: "number", min: 0 }), _jsx(Input, { label: "Tenure options (months, comma-separated)", helperText: "e.g. 2,3,4,5,6", value: emiTenureOptionsText, onChange: (e) => setEmiTenureOptionsText(e.target.value) }), _jsx(Input, { label: "Token / down-payment (%)", helperText: "Collected upfront at checkout.", value: String(emiTokenPercent), onChange: (e) => setEmiTokenPercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 100 }), _jsx(Input, { label: "Billing day (1\u201310)", helperText: "Day of month each installment is due.", value: String(emiBillingDay), onChange: (e) => setEmiBillingDay(parseFloat(e.target.value) || 1), type: "number", min: 1, max: 10 }), _jsx(Input, { label: "Surcharge (% of principal per month)", helperText: "The 'excess EMI fee' the buyer pays for spreading payment.", value: String(emiSurchargePercentPerMonth), onChange: (e) => setEmiSurchargePercentPerMonth(parseFloat(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "Seller's share of surcharge (%)", helperText: "The rest of the surcharge goes to the platform.", value: String(emiSurchargeSellerSharePercent), onChange: (e) => setEmiSurchargeSellerSharePercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 100 })] })] }) }), _jsx(TabsContent, { value: "gst", children: _jsxs(SettingsTabForm, { id: "gst", label: "Gst", children: [_jsx(Text, { size: "xs", color: "muted", children: "Required before enabling GST-inclusive checkout (P-8). Also set a GST rate + HSN code on each taxable product for the tax breakdown to appear." }), _jsx(Toggle, { checked: gstEnabled, onChange: setGstEnabled, label: "Enable GST on checkout" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "GSTIN", helperText: "15-character GST Identification Number.", error: gstProblems.gstin, value: gstin, onChange: (e) => setGstin(e.target.value), placeholder: "29AAAAA0000A1Z5", maxLength: 15 }), _jsx(Input, { label: "Legal name", helperText: "Registered business name for invoices.", error: gstProblems.legalName, value: gstLegalName, onChange: (e) => setGstLegalName(e.target.value), placeholder: "LetItRip Collectibles Pvt Ltd" })] }), _jsxs(Stack, { gap: "xs", children: [_jsx(Textarea, { label: "Registered address", value: gstAddress, onChange: (e) => setGstAddress(e.target.value), placeholder: "Registered business address for GST invoices\u2026", rows: 3 }), gstProblems.address ? (_jsx(Text, { size: "sm", variant: "error", role: "alert", children: gstProblems.address })) : null] })] }) }), _jsx(TabsContent, { value: "listings", children: _jsxs(SettingsTabForm, { id: "listings", label: "Listings", children: [_jsx(Text, { size: "xs", color: "muted", children: "Which listing and category types the marketplace offers. A disabled type is hidden from every browse surface and rejected on create and add-to-cart \u2014 existing data is untouched, it just becomes unreachable until re-enabled." }), _jsxs(Stack, { gap: "xs", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Listing types" }), _jsx(Text, { size: "xs", color: "muted", children: "Disabled types are hidden from listings and reject create/add-to-cart." }), _jsx(Grid, { cols: 2, gap: "sm", children: LISTING_TYPE_KEYS.map((key) => (_jsx(Toggle, { 
-                                                        // The plugin's own display label, not the raw key — the
-                                                        // literal version rendered "pre-order" and
-                                                        // "digital-code" at an admin.
-                                                        label: pluginFor(key).typeLabel, checked: listingTypeFlags[key] ?? true, onChange: (v) => setListingTypeFlags((prev) => ({ ...prev, [key]: v })) }, key))) })] }), _jsxs(Stack, { gap: "xs", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Category types" }), _jsx(Grid, { cols: 2, gap: "sm", children: CATEGORY_TYPE_KEYS.map((key) => (_jsx(Toggle, { label: key, checked: categoryTypeFlags[key] ?? true, onChange: (v) => setCategoryTypeFlags((prev) => ({ ...prev, [key]: v })) }, key))) })] }), _jsxs(Stack, { gap: "xs", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Browse sections" }), _jsx(Text, { size: "xs", color: "muted", children: "A closed section returns Not Found and disappears from the navbar, the sidebar, the mobile menu, the footer and the sitemap. Products, categories and stores are untouched \u2014 only the public way in is withdrawn, and re-opening restores it." }), _jsx(Grid, { cols: 2, gap: "sm", children: BROWSE_PAGE_KEYS.map((key) => (_jsxs(Stack, { gap: "xs", children: [_jsx(Toggle, { label: BROWSE_PAGE_META[key]?.label ?? key, checked: browsePageFlags[key] ?? true, onChange: (v) => setBrowsePageFlags((prev) => ({ ...prev, [key]: v })) }), _jsx(Text, { size: "xs", color: "muted", children: BROWSE_PAGE_META[key]?.hint })] }, key))) })] })] }) }), _jsx(TabsContent, { value: "integrations", children: _jsxs(SettingsTabForm, { id: "integrations", label: "Integrations", children: [_jsx(Text, { size: "xs", color: "muted", children: "Keys are masked in transit and stored encrypted. Click Reveal to view." }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "Razorpay" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(MaskedInput, { label: "Razorpay Key ID", value: razorpayKeyId, onChange: setRazorpayKeyId, placeholder: "rzp_test_\u2026 / rzp_live_\u2026" }), _jsx(MaskedInput, { label: "Razorpay Key Secret", value: razorpayKeySecret, onChange: setRazorpayKeySecret, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }), _jsx(MaskedInput, { label: "Razorpay Webhook Secret", value: razorpayWebhookSecret, onChange: setRazorpayWebhookSecret, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" })] })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "PhonePe" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(MaskedInput, { label: "PhonePe Client ID", value: phonepeClientId, onChange: setPhonepeClientId, placeholder: "MERCHANTID_\u2026" }), _jsx(MaskedInput, { label: "PhonePe Client Secret", value: phonepeClientSecret, onChange: setPhonepeClientSecret, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }), _jsx(Input, { label: "PhonePe Client Version", value: phonepeClientVersion, onChange: (e) => setPhonepeClientVersion(e.target.value), placeholder: "1" }), _jsx(Select, { label: "PhonePe Environment", options: PHONEPE_ENVIRONMENT_OPTIONS, value: phonepeEnvironment, onValueChange: setPhonepeEnvironment }), _jsx(MaskedInput, { label: "PhonePe Webhook Username", value: phonepeWebhookUsername, onChange: setPhonepeWebhookUsername, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }), _jsx(MaskedInput, { label: "PhonePe Webhook Password", value: phonepeWebhookPassword, onChange: setPhonepeWebhookPassword, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" })] })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "SMTP / Email" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "SMTP host", value: smtpHost, onChange: (e) => setSmtpHost(e.target.value), placeholder: "smtp.sendgrid.net" }), _jsx(Input, { label: "SMTP port", value: smtpPort, onChange: (e) => setSmtpPort(e.target.value), type: "number", placeholder: "587" }), _jsx(Input, { label: "SMTP user", value: smtpUser, onChange: (e) => setSmtpUser(e.target.value), placeholder: "apikey" })] }), _jsx(Input, { label: "From address", value: smtpFrom, onChange: (e) => setSmtpFrom(e.target.value), placeholder: "noreply@letitrip.in", type: "email" }), _jsx(Text, { size: "xs", color: "muted", children: "Transactional email is delivered through Resend \u2014 set the Resend API key below. These SMTP fields are stored but not currently used for delivery." })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "Google Places (store reviews)" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(MaskedInput, { label: "Google Maps API key", value: googleMapsApiKey, onChange: setGoogleMapsApiKey, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }), _jsx(Input, { label: "Default Google Place ID", value: googlePlaceId, onChange: (e) => setGooglePlaceId(e.target.value), placeholder: "ChIJ\u2026" })] })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "Analytics & Tracking" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Google Analytics ID", value: gaMeasurementId, onChange: (e) => setGaMeasurementId(e.target.value), placeholder: "G-XXXXXXXXXX" }), _jsx(Input, { label: "Facebook Pixel ID", value: fbPixelId, onChange: (e) => setFbPixelId(e.target.value), placeholder: "XXXXXXXXXXXXXXXX" }), _jsx(Input, { label: "GTM Container ID", value: gtmContainerId, onChange: (e) => setGtmContainerId(e.target.value), placeholder: "GTM-XXXXXXX" }), _jsx(Input, { label: "Microsoft Clarity Project ID", value: clarityProjectId, onChange: (e) => setClarityProjectId(e.target.value), placeholder: "abcdefghij", helperText: "Heatmaps and session replay. Recording is strictly masked \u2014 no text or input values are captured. Leave blank to keep Clarity off." })] })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "Meta (Instagram & Facebook Social Feed)" }), _jsx(Text, { size: "xs", color: "muted", children: "Used by the Social Feed section to fetch Instagram and Facebook posts via Meta Graph API v19." }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(MaskedInput, { label: "Page Access Token", value: metaPageAccessToken, onChange: setMetaPageAccessToken, placeholder: "EAAxxxxxxx\u2026" }), _jsx(Input, { label: "Page ID (or handle)", value: metaPageId, onChange: (e) => setMetaPageId(e.target.value), placeholder: "letitrip" })] })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "TikTok for Developers (Social Feed)" }), _jsx(Text, { size: "xs", color: "muted", children: "Client credentials + long-lived access token from TikTok for Developers. Used to list your account's public videos." }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(MaskedInput, { label: "Client Key", value: tiktokClientKey, onChange: setTiktokClientKey, placeholder: "aw\u2026" }), _jsx(MaskedInput, { label: "Client Secret", value: tiktokClientSecret, onChange: setTiktokClientSecret, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }), _jsx(MaskedInput, { label: "Access Token (long-lived)", value: tiktokAccessToken, onChange: setTiktokAccessToken, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" })] })] }), _jsxs(Stack, { gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "DeviantArt OAuth2 (Social Feed)" }), _jsx(Text, { size: "xs", color: "muted", children: "Client credentials for DeviantArt gallery fetching (client-credentials OAuth2 flow \u2014 no user login required)." }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(MaskedInput, { label: "Client ID", value: deviantartClientId, onChange: setDeviantartClientId, placeholder: "1234" }), _jsx(MaskedInput, { label: "Client Secret", value: deviantartClientSecret, onChange: setDeviantartClientSecret, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" })] })] })] }) }), _jsx(TabsContent, { value: "shipping", children: _jsxs(SettingsTabForm, { id: "shipping", label: "Shipping", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "Payment methods" }), _jsx(Div, { id: "setting-razorpay-enabled", children: _jsx(Toggle, { label: "Razorpay (online card/UPI/netbanking) enabled \u2014 needs Key ID + Key Secret under Credentials", checked: razorpayEnabled, onChange: setRazorpayEnabled }) }), _jsx(Div, { id: "setting-phonepe-enabled", children: _jsx(Toggle, { label: "PhonePe (online card/UPI) enabled \u2014 ignored while Razorpay is on; only one online gateway runs at a time", checked: phonepeEnabled, onChange: setPhonepeEnabled }) }), _jsx(Div, { id: "setting-manual-payment-enabled", children: _jsx(Toggle, { label: "Manual UPI/bank transfer enabled", checked: upiManualEnabled, onChange: setUpiManualEnabled }) }), _jsx(Div, { id: "setting-cod-enabled", children: _jsx(Toggle, { label: "Cash on delivery (COD) enabled", checked: codEnabled, onChange: setCodEnabled }) }), _jsx(Input, { label: "Free shipping threshold (\u20B9)", value: String(freeShippingThreshold), onChange: (e) => setFreeShippingThreshold(parseInt(e.target.value) || 0), type: "number", min: 0, helperText: "Orders above this amount get free shipping." }), _jsx(Select, { label: "Default carrier", options: CARRIER_OPTIONS, value: defaultCarrier, onValueChange: setDefaultCarrier }), _jsx(Input, { label: "Max delivery radius (km, 0 = no limit)", value: String(maxDeliveryRadius), onChange: (e) => setMaxDeliveryRadius(parseInt(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "COD maximum order value (\u20B9)", 
-                                            /*
-                                              🛑 A MAXIMUM, sitting directly above a THRESHOLD that is a
-                                              minimum. The helper text says which way each one runs,
-                                              because the two fields look identical and mean opposite
-                                              things — and getting it backwards here either refuses every
-                                              COD order or refuses none.
-                                            */
-                                            helperText: "Carts ABOVE this subtotal cannot pay by cash on delivery; the option is shown disabled with the reason. 0 = COD off for every cart.", value: String(codMaxOrderValue), onChange: (e) => setCodMaxOrderValue(parseInt(e.target.value) || 0), type: "number", min: 0, disabled: !codEnabled }), _jsx(Input, { label: "High-value checkout OTP threshold (\u20B9)", helperText: "Carts at or above this subtotal require an extra OTP verification step before payment (0 = disabled).", value: String(otpCheckoutThreshold), onChange: (e) => setOtpCheckoutThreshold(parseInt(e.target.value) || 0), type: "number", min: 0 }), _jsx(Text, { size: "sm", weight: "medium", color: "muted", className: "pt-[var(--appkit-space-2)]", children: "Seller shipping charge defaults" }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Seller shipping fixed (\u20B9)", helperText: "Flat shipping charge collected on the seller's behalf.", value: String(sellerShippingFixed), onChange: (e) => setSellerShippingFixed(parseFloat(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "Platform shipping (%)", helperText: "Platform's own shipping markup, as a % of order value.", value: String(platformShippingPercent), onChange: (e) => setPlatformShippingPercent(parseFloat(e.target.value) || 0), type: "number", min: 0, max: 100, step: 0.1 }), _jsx(Input, { label: "Platform shipping minimum (\u20B9)", helperText: "Floor for the platform shipping markup.", value: String(platformShippingFixedMin), onChange: (e) => setPlatformShippingFixedMin(parseFloat(e.target.value) || 0), type: "number", min: 0 })] })] }) }), _jsx(TabsContent, { value: "auction", children: _jsxs(SettingsTabForm, { id: "auction", label: "Auction", children: [_jsxs(Stack, { gap: "sm", rounded: "lg", border: "default", padding: "sm", children: [_jsx(Text, { size: "xs", weight: "medium", color: "muted", children: "Bid increment tiers" }), _jsx(Text, { size: "xs", color: "muted", children: "The minimum jump a new bid must clear, based on the current bid amount. A seller's per-listing override can require more than the matching tier, but can never undercut it." }), bidIncrementTiers.map((tier, i) => {
-                                                    const isLast = i === bidIncrementTiers.length - 1;
-                                                    return (_jsxs(Grid, { align: "end", gap: "xs", className: "grid-cols-12", children: [_jsx(Div, { className: "col-span-5", children: isLast ? (_jsxs(_Fragment, { children: [_jsx(Text, { size: "xs", weight: "medium", className: "mb-1", children: "Up to (\u20B9)" }), _jsx(Text, { size: "sm", color: "muted", children: "and above" })] })) : (_jsx(Input, { label: "Up to (\u20B9)", type: "number", min: 1, value: String(tier.upTo ?? ""), onChange: (e) => setBidIncrementTiers(bidIncrementTiers.map((t, j) => j === i ? { ...t, upTo: parseInt(e.target.value) || 0 } : t)) })) }), _jsx(Div, { className: "col-span-5", children: _jsx(Input, { label: "Increment (\u20B9)", type: "number", min: 1, value: String(tier.increment), onChange: (e) => setBidIncrementTiers(bidIncrementTiers.map((t, j) => j === i ? { ...t, increment: parseInt(e.target.value) || 0 } : t)) }) }), _jsx(Row, { centered: true, className: "col-span-2", padding: "b-xs", children: _jsx(Button, { variant: "ghost", type: "button", disabled: bidIncrementTiers.length <= 1, onClick: () => setBidIncrementTiers(bidIncrementTiers.filter((_, j) => j !== i)), "aria-label": "Remove tier", children: "\u00D7" }) })] }, i));
-                                                }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setBidIncrementTiers([
-                                                        ...bidIncrementTiers.slice(0, -1),
-                                                        { upTo: 100, increment: 10 },
-                                                        bidIncrementTiers[bidIncrementTiers.length - 1] ?? { upTo: null, increment: 1000 },
-                                                    ]), children: "+ Add tier" })] }), _jsx(Input, { label: "Auto-extend window (minutes before end)", value: String(autoExtendWindow), onChange: (e) => setAutoExtendWindow(parseInt(e.target.value) || 0), type: "number", min: 0, helperText: "Extend auction end time if a bid arrives within this window." }), _jsx(Input, { label: "Settlement grace period (hours)", value: String(settlementGrace), onChange: (e) => setSettlementGrace(parseInt(e.target.value) || 0), type: "number", min: 1, helperText: "Time winner has to pay before the auction is re-listed." })] }) }), _jsx(TabsContent, { value: "limits", children: _jsx(SettingsTabForm, { id: "limits", label: "Limits", children: _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Max products per store", value: String(maxProductsPerStore), onChange: (e) => setMaxProductsPerStore(parseInt(e.target.value) || 0), type: "number", min: 1 }), _jsx(Input, { label: "Max custom fields per product", value: String(maxCustomFields), onChange: (e) => setMaxCustomFields(parseInt(e.target.value) || 0), type: "number", min: 0 }), _jsx(Input, { label: "Order cancellation window (hours)", value: String(orderCancelWindow), onChange: (e) => setOrderCancelWindow(parseInt(e.target.value) || 0), type: "number", min: 0 })] }) }) }), _jsx(TabsContent, { value: "whatsapp", children: _jsxs(SettingsTabForm, { id: "whatsapp", label: "Whatsapp", children: [_jsx(Text, { size: "xs", color: "muted", children: "Platform-level WhatsApp Business Cloud API credentials. Used for automated purchase announcements to admin numbers when orders are placed. Store owners configure their own credentials in Store \u2192 WhatsApp." }), _jsx(Input, { label: "Phone Number ID", value: waPhoneNumberId, onChange: (e) => setWaPhoneNumberId(e.target.value), placeholder: "987654321098765", helperText: "From Meta for Developers \u2192 App \u2192 WhatsApp \u2192 API Setup" }), _jsx(MaskedInput, { label: "Cloud API System User Token", value: waCloudApiToken, onChange: setWaCloudApiToken, placeholder: "EAAxxxxxxxx\u2026", helperText: "Long-lived system user access token with WhatsApp Business permissions" }), _jsx(Input, { label: "Admin Notify Numbers", value: waAdminNotifyNumbers, onChange: (e) => setWaAdminNotifyNumbers(e.target.value), placeholder: "919876543210,918765432109", helperText: "Comma-separated, digits-only, include country code. These receive a WhatsApp message when any order is placed." }), _jsx(Text, { size: "xs", color: "muted", children: "Approved Meta message templates for the buyer-facing WhatsApp order-updates addon (Fees tab). Meta rejects business-initiated free-text WhatsApp messages outside a 24h customer-service window \u2014 a real template name here is required for that notification type to actually deliver. Leave blank to skip WhatsApp for that type (in-app + email still fire)." }), _jsx(Input, { label: "Template language code", value: waTemplateLanguage, onChange: (e) => setWaTemplateLanguage(e.target.value), placeholder: "en", helperText: "BCP-47 code the templates below were approved in, e.g. en or en_US." }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Order placed template name", value: waTemplateOrderPlaced, onChange: (e) => setWaTemplateOrderPlaced(e.target.value), placeholder: "order_placed_update" }), _jsx(Input, { label: "Order confirmed template name", value: waTemplateOrderConfirmed, onChange: (e) => setWaTemplateOrderConfirmed(e.target.value), placeholder: "order_confirmed_update" }), _jsx(Input, { label: "Order shipped template name", value: waTemplateOrderShipped, onChange: (e) => setWaTemplateOrderShipped(e.target.value), placeholder: "order_shipped_update" }), _jsx(Input, { label: "Order delivered template name", value: waTemplateOrderDelivered, onChange: (e) => setWaTemplateOrderDelivered(e.target.value), placeholder: "order_delivered_update" }), _jsx(Input, { label: "Order cancelled template name", value: waTemplateOrderCancelled, onChange: (e) => setWaTemplateOrderCancelled(e.target.value), placeholder: "order_cancelled_update" }), _jsx(Input, { label: "Refund initiated template name", value: waTemplateRefundInitiated, onChange: (e) => setWaTemplateRefundInitiated(e.target.value), placeholder: "refund_initiated_update" })] })] }) }), _jsx(TabsContent, { value: "notifications", children: _jsxs(SettingsTabForm, { id: "notifications", label: "Notifications", children: [_jsx(Text, { size: "xs", color: "muted", children: "In-app notifications are always on. Enable external channels below to let the platform fan out to email, WhatsApp, or SMS. Users can further restrict which types they receive." }), _jsxs(Stack, { gap: "md", rounded: "lg", border: "default", padding: "md", children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Outbound messaging budget" }), _jsxs(Text, { size: "xs", color: "muted", children: ["The master switches. These suppress ", _jsx(Span, { weight: "semibold", children: "user-facing" }), " messages only \u2014 the daily status digest always reaches staff, so turning customer email off never leaves the site unwatched. Transactional messages (checkout verification codes, order receipts) also keep sending, because suppressing those breaks checkout rather than quietening it."] }), _jsx(Toggle, { label: "Send user-facing email", checked: msgEmailEnabled, onChange: setMsgEmailEnabled }), _jsx(Toggle, { label: "Send user-facing WhatsApp", checked: msgWhatsappEnabled, onChange: setMsgWhatsappEnabled }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "Daily email ceiling", type: "number", value: String(msgCeilingEmail), onChange: (e) => setMsgCeilingEmail(Number(e.target.value) || 0), helperText: "Resend's free tier is 100/day. 80 leaves headroom for password-reset mail and in-flight sends." }), _jsx(Input, { label: "Daily WhatsApp ceiling", type: "number", value: String(msgCeilingWhatsapp), onChange: (e) => setMsgCeilingWhatsapp(Number(e.target.value) || 0), helperText: "A sanity bound. Meta bills per conversation, not per message." })] }), _jsx(Text, { size: "xs", color: "muted", children: "Some notification types never email regardless of these settings \u2014 losing an auction, being outbid, marketing, review activity and ticket updates are shown in the notification bell only. That is deliberate: those were the highest-volume sends and the ones most likely to exhaust the day's allowance. A support reply can still be emailed one-off from the ticket screen." })] }), _jsxs(Stack, { gap: "xs", surface: "muted", rounded: "lg", border: "default", padding: "md", children: [_jsxs(Row, { justify: "between", gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "In-app (notification bell)" }), _jsx(Span, { color: "success", surface: "success-surface", size: "xs", weight: "semibold", rounded: "full", padding: "pill-xs", children: "Always on" })] }), _jsx(Text, { size: "xs", color: "muted", children: "Displayed in the notification bell and inbox. Cannot be disabled." })] }), _jsxs(Stack, { gap: "md", rounded: "lg", border: "default", padding: "md", children: [_jsx(Div, { id: "setting-email-notifications", children: _jsx(Toggle, { label: "Email notifications", checked: notifEmailEnabled, onChange: setNotifEmailEnabled }) }), notifEmailEnabled && (_jsxs(Stack, { gap: "md", className: NOTIF_CHANNEL_INDENT, children: [_jsx(Select, { label: "Minimum priority to send email", options: PRIORITY_OPTIONS, value: notifEmailMinPriority, onValueChange: setNotifEmailMinPriority }), _jsx(Text, { size: "xs", weight: "medium", color: "muted", className: "pt-[0.25rem]", children: "Resend API (for transactional email)" }), _jsx(MaskedInput, { label: "Resend API Key", value: resendApiKey, onChange: setResendApiKey, placeholder: "re_live_\u2026", helperText: "Get your key at resend.com \u2014 used for all transactional notifications." }), _jsxs(Grid, { cols: 2, gap: "md", children: [_jsx(Input, { label: "From email", value: notifFromEmail, onChange: (e) => setNotifFromEmail(e.target.value), placeholder: "noreply@letitrip.in", type: "email" }), _jsx(Input, { label: "From name", value: notifFromName, onChange: (e) => setNotifFromName(e.target.value), placeholder: "LetItRip" })] }), _jsx(Text, { size: "xs", weight: "medium", color: "muted", className: "pt-[0.25rem]", children: "Notification types (leave empty to send all types)" }), _jsx(PaginatedSelect, { ariaLabel: "Notification types", multiple: true, options: NOTIF_TYPE_OPTIONS, value: notifEmailTypes, onChange: (values) => setNotifEmailTypes(values), placeholder: "All notification types" })] }))] }), _jsxs(Stack, { gap: "md", rounded: "lg", border: "default", padding: "md", children: [_jsx(Div, { id: "setting-daily-digest", children: _jsx(Toggle, { label: "Daily status digest", checked: digestEnabled, onChange: setDigestEnabled }) }), digestEnabled && (_jsxs(Stack, { gap: "md", className: NOTIF_CHANNEL_INDENT, children: [_jsx(Text, { size: "xs", color: "muted", children: "Sent every morning at 10:00 IST with the previous 24 hours of order activity. Its arrival doubles as the platform health check \u2014 if it stops landing, something needs a look." }), _jsx(Textarea, { label: "Recipients (To)", value: digestRecipients, onChange: (e) => setDigestRecipients(e.target.value), placeholder: "mohasin@letitrip.in", rows: 3, helperText: "One address per line. Each address is billed as a separate send against the daily allowance \u2014 keep this list short." })] }))] }), _jsxs(Stack, { gap: "md", rounded: "lg", border: "default", padding: "md", children: [_jsx(Div, { id: "setting-whatsapp-notifications", children: _jsx(Toggle, { label: "WhatsApp notifications", checked: notifWhatsappEnabled, onChange: setNotifWhatsappEnabled }) }), notifWhatsappEnabled && (_jsxs(Stack, { gap: "md", className: NOTIF_CHANNEL_INDENT, children: [_jsx(Select, { label: "Minimum priority to send WhatsApp", options: PRIORITY_OPTIONS, value: notifWhatsappMinPriority, onValueChange: setNotifWhatsappMinPriority }), _jsx(Toggle, { label: "Enable WhatsApp OTP (for login and verification)", checked: notifWhatsappOtpEnabled, onChange: setNotifWhatsappOtpEnabled }), _jsx(Text, { size: "xs", color: "muted", children: "WhatsApp credentials are configured in the WhatsApp tab (\u246C). OTP messages use the same phone number." }), _jsx(PaginatedSelect, { multiple: true, ariaLabel: "Notification types to send over WhatsApp", options: NOTIF_TYPE_OPTIONS, value: notifWhatsappTypes, onChange: (values) => setNotifWhatsappTypes(values), placeholder: "All notification types" }), _jsx(Text, { size: "xs", color: "muted", children: "Leave empty to send all types." })] }))] }), _jsxs(Stack, { gap: "md", rounded: "lg", border: "default", padding: "md", children: [_jsx(Toggle, { label: "SMS notifications", checked: notifSmsEnabled, onChange: setNotifSmsEnabled }), notifSmsEnabled && (_jsxs(Stack, { gap: "md", className: NOTIF_CHANNEL_INDENT, children: [_jsx(Select, { label: "Minimum priority to send SMS", options: PRIORITY_OPTIONS, value: notifSmsMinPriority, onValueChange: setNotifSmsMinPriority }), _jsx(Text, { size: "xs", color: "muted", children: "SMS gateway credentials (e.g. Twilio, MSG91) can be configured in the Integrations tab once an SMS provider is connected." })] }))] })] }) }), _jsx(TabsContent, { value: "legal", children: _jsx(SettingsTabForm, { id: "legal", label: "Legal", children: [
-                                        ["Terms of Service", termsHtml, setTermsHtml],
-                                        ["Privacy Policy", privacyHtml, setPrivacyHtml],
-                                        ["Refund Policy", refundHtml, setRefundHtml],
-                                        ["Shipping Policy", shippingPolicyHtml, setShippingPolicyHtml],
-                                        ["Cookie Policy", cookieHtml, setCookieHtml],
-                                        ["Our Ethics", ethicsHtml, setEthicsHtml],
-                                        ["Code of Conduct", conductHtml, setConductHtml],
-                                        ["Cancellation Policy", cancellationHtml, setCancellationHtml],
-                                        ["Grievance Redressal", grievanceHtml, setGrievanceHtml],
-                                    ].map(([label, value, setter]) => (_jsx(Textarea, { label: label, value: value, onChange: (e) => setter(e.target.value), placeholder: `Enter ${label} HTML here…`, rows: 6, className: "font-mono" }, label))) }) })] }), _jsx(SaveAllBar, { isPending: saveAllMutation.isPending, onSave: handleSaveAll })] }, "settings-form"),
-        ] }));
+    return (_jsxs(_Fragment, { children: [_jsx(AdminComposableRegion, { pageId: "admin-site", initialCards: pageRegionCards }), _jsx(StackedViewShell, { portal: "admin", ...rest, title: labels.title ?? "Site Settings", sections: [
+                    isLoading ? (_jsx(Alert, { variant: "info", title: "Loading", children: "Fetching site settings\u2026" }, "loading")) : null,
+                    error ? (_jsx(Alert, { variant: "error", title: "Load failed", children: error instanceof Error ? error.message : "Unknown error" }, "error")) : null,
+                    _jsxs(FormShellContext.Provider, { value: shellCtx, children: [_jsxs(Tabs, { value: activeTab, 
+                                /*
+                                 * `Tabs` hands back a bare string, so it is narrowed here rather
+                                 * than cast. An unknown value is ignored instead of being written
+                                 * into state — the same reason `?tab=` is validated on the way in.
+                                 */
+                                onChange: (next) => {
+                                    if (isSiteSettingsTabId(next))
+                                        setActiveTab(next);
+                                }, children: [_jsx(TabsList, { children: SITE_SETTINGS_TABS.map((tab) => (_jsx(TabsTrigger, { value: tab.id, children: tab.label }, tab.id))) }), _jsx(TabsContent, { value: "about", children: _jsx(SectionForm, { sections: aboutSections, values: aboutForm, onChange: (partial) => setAboutForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsAboutFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "branding", children: _jsx(SectionForm, { sections: brandingSections, values: brandingForm, onChange: (partial) => setBrandingForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsBrandingFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "appearance", children: _jsx(SectionForm, { sections: appearanceSections, values: appearanceForm, onChange: (partial) => setAppearanceForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsAppearanceFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "themes", children: _jsx(SettingsTabForm, { id: "themes", label: "Themes", children: _jsx(ThemeManagerView, { value: themeRegistry, onChange: setThemeRegistry, previewOrigin: "/" }) }) }), _jsx(TabsContent, { value: "announcement", children: _jsx(SectionForm, { sections: announcementSections, values: announcementForm, onChange: (partial) => setAnnouncementForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsAnnouncementFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "seo", children: _jsx(SectionForm, { sections: seoSections, values: seoForm, onChange: (partial) => setSeoForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsSeoFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "contact", children: _jsx(SectionForm, { sections: contactSections, values: contactForm, onChange: (partial) => setContactForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsContactFormSchema, hideActions: true }) }), _jsxs(TabsContent, { value: "watermark", children: [_jsx(SectionForm, { sections: watermarkSections, values: watermarkForm, onChange: (partial) => setWatermarkForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsWatermarkFormSchema, hideActions: true }), _jsxs(Stack, { gap: "xs", surface: "muted", rounded: "lg", border: "default", padding: "md", children: [_jsx(Text, { size: "xs", color: "muted", children: "Preview (text watermark only)" }), _jsx(Row, { surface: "default", justify: "end", align: "end", className: `relative h-32 ${__O.hidden}`, rounded: "default", children: _jsx(Span, { ref: watermarkPreviewRef, weight: "medium", color: "faint", padding: "1", className: "select-none", children: watermarkForm.watermarkText }) })] })] }), _jsx(TabsContent, { value: "fees", children: _jsx(SectionForm, { sections: feesSections, values: feesForm, onChange: (partial) => setFeesForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsFeesFormSchema, hideActions: true }) }), _jsxs(TabsContent, { value: "procurement", children: [_jsx(Text, { size: "xs", color: "muted", className: "mb-2", children: "Used to compute each procurement shipment's labor cost (hours spent \u00D7 hourly rate) and its estimated processing time (hours spent \u00F7 max hours/day)." }), _jsx(SectionForm, { sections: procurementSections, values: procurementForm, onChange: (partial) => setProcurementForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsProcurementFormSchema, hideActions: true })] }), _jsx(TabsContent, { value: "emi", children: _jsx(SectionForm, { sections: emiSections, values: emiForm, onChange: (partial) => setEmiForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsEmiFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "gst", children: _jsx(SectionForm, { sections: gstSections, values: gstForm, onChange: (partial) => setGstForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsGstFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "listings", children: _jsx(SectionForm, { sections: listingsSections, values: listingsForm, onChange: (partial) => setListingsForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsListingsFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "integrations", children: _jsx(SectionForm, { sections: integrationsSections, values: integrationsForm, onChange: (partial) => setIntegrationsForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsIntegrationsFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "shipping", children: _jsx(SectionForm, { sections: shippingSections, values: shippingForm, onChange: (partial) => setShippingForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsShippingFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "collector-drop", children: _jsx(SectionForm, { sections: collectorDropSections, values: collectorDropForm, onChange: (partial) => setCollectorDropForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsCollectorDropFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "limits", children: _jsx(SectionForm, { sections: limitsSections, values: limitsForm, onChange: (partial) => setLimitsForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsLimitsFormSchema, hideActions: true }) }), _jsx(TabsContent, { value: "whatsapp", children: _jsx(SectionForm, { sections: whatsappSections, values: whatsappForm, onChange: (partial) => setWhatsappForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsWhatsappFormSchema, hideActions: true }) }), _jsxs(TabsContent, { value: "notifications", children: [_jsx(Text, { size: "xs", color: "muted", className: "mb-2", children: "In-app notifications are always on. Enable external channels below to let the platform fan out to email, WhatsApp, or SMS. Users can further restrict which types they receive." }), _jsxs(Stack, { gap: "xs", surface: "muted", rounded: "lg", border: "default", padding: "md", className: "mb-4", children: [_jsxs(Row, { justify: "between", gap: "sm", children: [_jsx(Text, { size: "sm", weight: "medium", color: "muted", children: "In-app (notification bell)" }), _jsx(Span, { color: "success", surface: "success-surface", size: "xs", weight: "semibold", rounded: "full", padding: "pill-xs", children: "Always on" })] }), _jsx(Text, { size: "xs", color: "muted", children: "Displayed in the notification bell and inbox. Cannot be disabled." })] }), _jsx(SectionForm, { sections: notificationsSections, values: notificationsForm, onChange: (partial) => setNotificationsForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsNotificationsFormSchema, hideActions: true })] }), _jsx(TabsContent, { value: "legal", children: _jsx(SectionForm, { sections: legalSections, values: legalForm, onChange: (partial) => setLegalForm((prev) => ({ ...prev, ...partial })), onSubmit: () => undefined, schema: siteSettingsLegalFormSchema, hideActions: true }) })] }), _jsx(SaveAllBar, { isPending: saveAllMutation.isPending, onSave: handleSaveAll })] }, "settings-form"),
+                ] })] }));
 }