/**
 * Settings section: Cards + Badges + Grid + Sidebar.
 */

import { APP_CONFIG, APP_DEFAULTS } from "../config.js";
import { t } from "../i18n.js";
import {
    _safeOneOf,
    GRID_SIZE_PRESETS,
    GRID_SIZE_PRESET_OPTIONS,
    detectGridSizePreset,
} from "./settingsUtils.js";
import { saveMajoorSettings, applySettingsToConfig } from "./settingsCore.js";

const SETTINGS_PREFIX = "Majoor";
const SETTINGS_CATEGORY = "Majoor Assets Manager";

/**
 * Register all Cards, Badges, Grid layout and Sidebar settings.
 *
 * @param {Function} safeAddSetting - Wrapped addSetting function from the parent.
 * @param {object}   settings       - Live settings object (mutated on change).
 * @param {Function} notifyApplied  - Callback(key) to schedule change notifications.
 */
export function registerGridSettings(safeAddSetting: (def: any) => void, settings: Record<string, any>, notifyApplied: (..._args: any[]) => void): void {
    const cat = (section: any, label: any) => [SETTINGS_CATEGORY, section, label];
    const cardCat = (label: any) => [SETTINGS_CATEGORY, t("cat.cards", "Cards"), label];
    const badgeCat = (label: any) => [SETTINGS_CATEGORY, t("cat.badges", "Badges"), label];
    const colorCat = (label: any) => [SETTINGS_CATEGORY, t("cat.badges", "Badges"), label];

    const normalizeHexColor = (value: any, fallback: any) => {
        let v = String(value || "").trim();
        // PrimeVue ColorPicker returns hex without '#' prefix
        if (/^[0-9a-fA-F]{6}$/.test(v)) v = `#${v}`;
        return /^#[0-9a-fA-F]{6}$/.test(v) ? v.toUpperCase() : fallback;
    };

    if (!settings.grid?.minSizePreset) {
        settings.grid = settings.grid || {};
        settings.grid.minSizePreset = detectGridSizePreset(settings.grid.minSize);
        saveMajoorSettings(settings);
    }

    // ----------------------------------------------
    // Section: Cards
    // ----------------------------------------------

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Cards.ThumbSize`,
        category: cardCat(t("setting.grid.cardSize.group", "Card size")),
        name: t("setting.grid.cardSize.name", "Majoor: Card Size"),
        tooltip: t(
            "setting.grid.cardSize.desc",
            "Choose the card size preset used by the grid layout.",
        ),
        type: "combo",
        defaultValue: (() => {
            const preset = _safeOneOf(
                String(settings.grid?.minSizePreset || "").toLowerCase(),
                GRID_SIZE_PRESET_OPTIONS,
                detectGridSizePreset(settings.grid?.minSize),
            );
            const labels = {
                small: t("setting.grid.cardSize.small", "Small"),
                medium: t("setting.grid.cardSize.medium", "Medium"),
                large: t("setting.grid.cardSize.large", "Large"),
            };
            return (labels as Record<string, string>)[preset] || labels.medium;
        })(),
        options: [
            t("setting.grid.cardSize.small", "Small"),
            t("setting.grid.cardSize.medium", "Medium"),
            t("setting.grid.cardSize.large", "Large"),
        ],
        onChange: (value: any) => {
            const label = String(value || "")
                .trim()
                .toLowerCase();
            const smallLabel = t("setting.grid.cardSize.small", "Small").toLowerCase();
            const mediumLabel = t("setting.grid.cardSize.medium", "Medium").toLowerCase();
            const largeLabel = t("setting.grid.cardSize.large", "Large").toLowerCase();
            let preset = "medium";
            if (label === smallLabel || label === "small" || label === "petit") preset = "small";
            else if (label === largeLabel || label === "large" || label === "grand")
                preset = "large";
            else if (label === mediumLabel || label === "medium" || label === "moyen")
                preset = "medium";
            settings.grid.minSizePreset = preset;
            settings.grid.minSize = (GRID_SIZE_PRESETS as Record<string, number>)[preset];
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.minSizePreset");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Cards.CustomThumbSize`,
        category: cardCat(t("setting.grid.cardSize.group", "Card size")),
        name: "Majoor: Custom Card Size (px)",
        tooltip: "Set the minimum card width used by the main grid layout (60-600 px).",
        type: "number",
        defaultValue: Math.max(60, Math.min(600, Number(settings.grid?.minSize) || 120)),
        attrs: { min: 60, max: 600, step: 10 },
        onChange: (value: any) => {
            const minSize = Math.max(60, Math.min(600, Math.round(Number(value) || 120)));
            settings.grid.minSize = minSize;
            settings.grid.minSizePreset = detectGridSizePreset(minSize);
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.minSize");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowDetails`,
        category: cardCat("Show card details"),
        name: "Show metadata panel",
        tooltip: "Show the bottom details panel on asset cards (filename, date, etc.)",
        type: "boolean",
        defaultValue: !!settings.grid?.showDetails,
        onChange: (value: any) => {
            settings.grid.showDetails = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showDetails");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowFilename`,
        category: cardCat("Show filename"),
        name: "Show filename",
        tooltip: "Display filename in details panel",
        type: "boolean",
        defaultValue: !!settings.grid?.showFilename,
        onChange: (value: any) => {
            settings.grid.showFilename = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showFilename");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowDate`,
        category: cardCat("Show date/time"),
        name: "Show date/time",
        tooltip: "Display date and time in details panel",
        type: "boolean",
        defaultValue: !!settings.grid?.showDate,
        onChange: (value: any) => {
            settings.grid.showDate = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showDate");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowDimensions`,
        category: cardCat("Show dimensions"),
        name: "Show dimensions",
        tooltip: "Display resolution (WxH) in details panel",
        type: "boolean",
        defaultValue: !!settings.grid?.showDimensions,
        onChange: (value: any) => {
            settings.grid.showDimensions = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showDimensions");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowGenTime`,
        category: cardCat("Show generation time"),
        name: "Show generation time",
        tooltip: "Display seconds taken to generate the asset (if available)",
        type: "boolean",
        defaultValue: !!(settings.grid?.showGenTime ?? APP_DEFAULTS.GRID_SHOW_DETAILS_GENTIME),
        onChange: (value: any) => {
            settings.grid.showGenTime = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showGenTime");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowHoverInfo`,
        category: cardCat("Show prompt on hover"),
        name: "Show prompt on hover",
        tooltip:
            "Show positive prompt and generation time as a tooltip overlay when hovering over a card thumbnail. Does not block video play-on-hover.",
        type: "boolean",
        defaultValue: !!(settings.grid?.showHoverInfo ?? APP_DEFAULTS.GRID_SHOW_HOVER_INFO),
        onChange: (value: any) => {
            settings.grid.showHoverInfo = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showHoverInfo");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowWorkflowDot`,
        category: cardCat("Show workflow dot"),
        name: "Show workflow indicator",
        tooltip:
            "Display the green dot indicating workflow metadata availability (bottom right of card)",
        type: "boolean",
        defaultValue: !!settings.grid?.showWorkflowDot,
        onChange: (value: any) => {
            settings.grid.showWorkflowDot = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showWorkflowDot");
        },
    });

    // ----------------------------------------------
    // Section: Badges
    // ----------------------------------------------

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowExtBadge`,
        category: badgeCat("Show format badges"),
        name: "Show format badges",
        tooltip: "Display format badges (e.g. JPG, MP4) on thumbnails",
        type: "boolean",
        defaultValue: !!settings.grid?.showExtBadge,
        onChange: (value: any) => {
            settings.grid.showExtBadge = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showExtBadge");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowRatingBadge`,
        category: badgeCat("Show rating badges"),
        name: "Show ratings",
        tooltip: "Display star ratings on thumbnails",
        type: "boolean",
        defaultValue: !!settings.grid?.showRatingBadge,
        onChange: (value: any) => {
            settings.grid.showRatingBadge = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showRatingBadge");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.ShowTagsBadge`,
        category: badgeCat("Show tags badges"),
        name: "Show tags",
        tooltip: "Display a small indicator if an asset has tags",
        type: "boolean",
        defaultValue: !!settings.grid?.showTagsBadge,
        onChange: (value: any) => {
            settings.grid.showTagsBadge = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.showTagsBadge");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Badges.StarColor`,
        category: colorCat(t("setting.starColor", "Star color")),
        name: t("setting.starColor", "Majoor: Star color"),
        tooltip: t(
            "setting.starColor.tooltip",
            "Color of rating stars on thumbnails (hex, e.g. #FFD45A)",
        ),
        type: "color",
        defaultValue: normalizeHexColor(settings.grid?.starColor, APP_DEFAULTS.BADGE_STAR_COLOR),
        onChange: (value: any) => {
            settings.grid.starColor = normalizeHexColor(value, APP_DEFAULTS.BADGE_STAR_COLOR);
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.starColor");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Badges.ImageColor`,
        category: colorCat(t("setting.badgeImageColor", "Image badge color")),
        name: t("setting.badgeImageColor", "Majoor: Image badge color"),
        tooltip: t(
            "setting.badgeImageColor.tooltip",
            "Color for image badges: PNG, JPG, WEBP, GIF, BMP, TIF (hex)",
        ),
        type: "color",
        defaultValue: normalizeHexColor(
            settings.grid?.badgeImageColor,
            APP_DEFAULTS.BADGE_IMAGE_COLOR,
        ),
        onChange: (value: any) => {
            settings.grid.badgeImageColor = normalizeHexColor(
                value,
                APP_DEFAULTS.BADGE_IMAGE_COLOR,
            );
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.badgeImageColor");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Badges.VideoColor`,
        category: colorCat(t("setting.badgeVideoColor", "Video badge color")),
        name: t("setting.badgeVideoColor", "Majoor: Video badge color"),
        tooltip: t(
            "setting.badgeVideoColor.tooltip",
            "Color for video badges: MP4, WEBM, MOV, AVI, MKV (hex)",
        ),
        type: "color",
        defaultValue: normalizeHexColor(
            settings.grid?.badgeVideoColor,
            APP_DEFAULTS.BADGE_VIDEO_COLOR,
        ),
        onChange: (value: any) => {
            settings.grid.badgeVideoColor = normalizeHexColor(
                value,
                APP_DEFAULTS.BADGE_VIDEO_COLOR,
            );
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.badgeVideoColor");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Badges.AudioColor`,
        category: colorCat(t("setting.badgeAudioColor", "Audio badge color")),
        name: t("setting.badgeAudioColor", "Majoor: Audio badge color"),
        tooltip: t(
            "setting.badgeAudioColor.tooltip",
            "Color for audio badges: MP3, WAV, OGG, FLAC (hex)",
        ),
        type: "color",
        defaultValue: normalizeHexColor(
            settings.grid?.badgeAudioColor,
            APP_DEFAULTS.BADGE_AUDIO_COLOR,
        ),
        onChange: (value: any) => {
            settings.grid.badgeAudioColor = normalizeHexColor(
                value,
                APP_DEFAULTS.BADGE_AUDIO_COLOR,
            );
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.badgeAudioColor");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Badges.Model3dColor`,
        category: colorCat(t("setting.badgeModel3dColor", "3D model badge color")),
        name: t("setting.badgeModel3dColor", "Majoor: 3D model badge color"),
        tooltip: t(
            "setting.badgeModel3dColor.tooltip",
            "Color for 3D model badges: OBJ, FBX, GLB, GLTF (hex)",
        ),
        type: "color",
        defaultValue: normalizeHexColor(
            settings.grid?.badgeModel3dColor,
            APP_DEFAULTS.BADGE_MODEL3D_COLOR,
        ),
        onChange: (value: any) => {
            settings.grid.badgeModel3dColor = normalizeHexColor(
                value,
                APP_DEFAULTS.BADGE_MODEL3D_COLOR,
            );
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.badgeModel3dColor");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Badges.DuplicateAlertColor`,
        category: colorCat(t("setting.badgeDuplicateAlertColor", "Duplicate alert badge color")),
        name: t("setting.badgeDuplicateAlertColor", "Majoor: Duplicate alert badge color"),
        tooltip: t(
            "setting.badgeDuplicateAlertColor.tooltip",
            "Color for duplicate extension badges (PNG+, JPG+, etc).",
        ),
        type: "color",
        defaultValue: normalizeHexColor(
            settings.grid?.badgeDuplicateAlertColor,
            APP_DEFAULTS.BADGE_DUPLICATE_ALERT_COLOR,
        ),
        onChange: (value: any) => {
            settings.grid.badgeDuplicateAlertColor = normalizeHexColor(
                value,
                APP_DEFAULTS.BADGE_DUPLICATE_ALERT_COLOR,
            );
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.badgeDuplicateAlertColor");
        },
    });

    // ----------------------------------------------
    // Section: Grid
    // ----------------------------------------------

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.PageSize`,
        category: cat(t("cat.grid"), t("setting.grid.pagesize.name").replace("Majoor: ", "")),
        name: t("setting.grid.pagesize.name"),
        tooltip: t("setting.grid.pagesize.desc"),
        type: "number",
        defaultValue: settings.grid.pageSize,
        attrs: { min: 50, max: Number(APP_CONFIG.MAX_PAGE_SIZE) || 2000, step: 50 },
        onChange: (value: any) => {
            const maxPage = Number(APP_CONFIG.MAX_PAGE_SIZE) || 2000;
            settings.grid.pageSize = Math.max(
                50,
                Math.min(maxPage, Number(value) || APP_DEFAULTS.DEFAULT_PAGE_SIZE),
            );
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.pageSize");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.WorkflowGroupBy`,
        category: cat(t("cat.grid"), "Workflow grouping"),
        name: "Workflow grid grouping",
        tooltip:
            "In Workflow scope, insert titled separators and group cards by Task, Model, or Category.",
        type: "combo",
        defaultValue: (() => {
            const mode = String(settings.grid?.workflowGroupBy || APP_DEFAULTS.WORKFLOW_GRID_GROUP_BY)
                .trim()
                .toLowerCase();
            const labels = {
                none: "None",
                task: "Task",
                model: "Model",
                category: "Category",
            };
            return (labels as Record<string, string>)[mode] || labels.none;
        })(),
        options: ["None", "Task", "Model", "Category"],
        onChange: (value: any) => {
            const modeMap = {
                None: "none",
                Task: "task",
                Model: "model",
                Category: "category",
            };
            const mode = (modeMap as Record<string, string>)[String(value || "")] || "none";
            settings.grid = settings.grid || {};
            settings.grid.workflowGroupBy = mode;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.workflowGroupBy");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.InfiniteScroll.Enabled`,
        category: cat(t("cat.grid"), t("setting.nav.infinite.name").replace("Majoor: ", "")),
        name: t("setting.nav.infinite.name"),
        tooltip: t("setting.nav.infinite.desc"),
        type: "boolean",
        defaultValue: !!settings.infiniteScroll?.enabled,
        onChange: (value: any) => {
            settings.infiniteScroll = settings.infiniteScroll || {};
            settings.infiniteScroll.enabled = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("infiniteScroll.enabled");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Sidebar.Position`,
        category: cat(t("cat.grid"), t("setting.sidebar.pos.name").replace("Majoor: ", "")),
        name: t("setting.sidebar.pos.name"),
        tooltip: t("setting.sidebar.pos.desc"),
        type: "combo",
        defaultValue: settings.sidebar?.position || "right",
        options: ["left", "right"],
        onChange: (value: any) => {
            settings.sidebar = settings.sidebar || {};
            settings.sidebar.position = value === "left" ? "left" : "right";
            saveMajoorSettings(settings);
            notifyApplied("sidebar.position");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Sidebar.ShowPreviewThumb`,
        category: cat(t("cat.grid"), "Sidebar preview"),
        name: "Show sidebar preview thumb",
        tooltip: "Show/hide the large media preview at the top of the sidebar metadata panel.",
        type: "boolean",
        defaultValue: !!(settings.sidebar?.showPreviewThumb ?? true),
        onChange: (value: any) => {
            settings.sidebar = settings.sidebar || {};
            settings.sidebar.showPreviewThumb = !!value;
            saveMajoorSettings(settings);
            notifyApplied("sidebar.showPreviewThumb");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Sidebar.AssetBadgeEnabled`,
        category: cat(t("cat.grid"), "Sidebar asset notification badge"),
        name: "Show new asset badge on sidebar icon",
        tooltip:
            "Display a small counter on the Majoor sidebar icon only when a new asset is indexed by Assets Manager.",
        type: "boolean",
        defaultValue: !!(
            settings.sidebar?.assetBadgeEnabled ?? APP_DEFAULTS.SIDEBAR_ASSET_BADGE_ENABLED
        ),
        onChange: (value: any) => {
            settings.sidebar = settings.sidebar || {};
            settings.sidebar.assetBadgeEnabled = !!value;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("sidebar.assetBadgeEnabled");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Sidebar.WidthPx`,
        category: cat(t("cat.grid"), "Sidebar width"),
        name: "Sidebar width (px)",
        tooltip: "Set the details sidebar width in pixels (240-640).",
        type: "number",
        defaultValue: Math.max(240, Math.min(640, Number(settings.sidebar?.widthPx) || 360)),
        attrs: {
            min: 240,
            max: 640,
            step: 10,
        },
        onChange: (value: any) => {
            settings.sidebar = settings.sidebar || {};
            settings.sidebar.widthPx = Math.max(
                240,
                Math.min(640, Math.round(Number(value) || 360)),
            );
            saveMajoorSettings(settings);
            notifyApplied("sidebar.widthPx");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.General.HideSiblings`,
        category: cat(t("cat.grid"), t("setting.siblings.hide.name").replace("Majoor: ", "")),
        name: t("setting.siblings.hide.name"),
        tooltip: t("setting.siblings.hide.desc"),
        type: "boolean",
        defaultValue: !!settings.siblings?.hidePngSiblings,
        onChange: (value: any) => {
            settings.siblings = settings.siblings || {};
            settings.siblings.hidePngSiblings = !!value;
            saveMajoorSettings(settings);
            notifyApplied("siblings.hidePngSiblings");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Grid.VideoAutoplayMode`,
        category: cat(
            t("cat.grid"),
            t("setting.grid.videoAutoplayMode.name", "Video autoplay").replace("Majoor: ", ""),
        ),
        name: t("setting.grid.videoAutoplayMode.name", "Majoor: Video autoplay"),
        tooltip: t(
            "setting.grid.videoAutoplayMode.desc",
            "Controls video thumbnail playback in the grid. Off: static frame. Hover: play on mouse hover. Always: loop while visible.",
        ),
        type: "combo",
        defaultValue: (() => {
            let mode = settings.grid?.videoAutoplayMode;
            // Backward compat from old boolean
            if (mode === undefined || mode === null) {
                mode = settings.grid?.videoHoverAutoplay === false ? "off" : "hover";
            }
            if (mode === true) mode = "hover";
            if (mode === false) mode = "off";
            if (mode !== "hover" && mode !== "always" && mode !== "off") mode = "hover";
            const labels = {
                off: t("setting.grid.videoAutoplayMode.off", "Off"),
                hover: t("setting.grid.videoAutoplayMode.hover", "Hover"),
                always: t("setting.grid.videoAutoplayMode.always", "Always"),
            };
            return (labels as Record<string, string>)[mode] || labels.off;
        })(),
        options: [
            t("setting.grid.videoAutoplayMode.off", "Off"),
            t("setting.grid.videoAutoplayMode.hover", "Hover"),
            t("setting.grid.videoAutoplayMode.always", "Always"),
        ],
        onChange: (value: any) => {
            const labelToMode = {
                [t("setting.grid.videoAutoplayMode.off", "Off")]: "off",
                [t("setting.grid.videoAutoplayMode.hover", "Hover")]: "hover",
                [t("setting.grid.videoAutoplayMode.always", "Always")]: "always",
            };
            const mode = labelToMode[value] || "off";
            settings.grid = settings.grid || {};
            settings.grid.videoAutoplayMode = mode;
            // Clean up legacy key
            delete settings.grid.videoHoverAutoplay;
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("grid.videoAutoplayMode");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Cards.HoverColor`,
        category: cardCat("Hover color"),
        name: "Majoor: Card hover color",
        tooltip: "Background tint used when hovering a card (hex, e.g. #3D3D3D).",
        type: "color",
        defaultValue: normalizeHexColor(
            settings.ui?.cardHoverColor,
            APP_DEFAULTS.UI_CARD_HOVER_COLOR,
        ),
        onChange: (value: any) => {
            settings.ui = settings.ui || {};
            settings.ui.cardHoverColor = normalizeHexColor(value, APP_DEFAULTS.UI_CARD_HOVER_COLOR);
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("ui.cardHoverColor");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Cards.SelectionColor`,
        category: cardCat("Selection color"),
        name: "Majoor: Card selection color",
        tooltip: "Outline/accent color used for selected cards (hex, e.g. #4A90E2).",
        type: "color",
        defaultValue: normalizeHexColor(
            settings.ui?.cardSelectionColor,
            APP_DEFAULTS.UI_CARD_SELECTION_COLOR,
        ),
        onChange: (value: any) => {
            settings.ui = settings.ui || {};
            settings.ui.cardSelectionColor = normalizeHexColor(
                value,
                APP_DEFAULTS.UI_CARD_SELECTION_COLOR,
            );
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("ui.cardSelectionColor");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Badges.RatingColor`,
        category: badgeCat("Rating color"),
        name: "Majoor: Rating badge color",
        tooltip: "Color used for rating badge text/accent (hex, e.g. #FF9500).",
        type: "color",
        defaultValue: normalizeHexColor(settings.ui?.ratingColor, APP_DEFAULTS.UI_RATING_COLOR),
        onChange: (value: any) => {
            settings.ui = settings.ui || {};
            settings.ui.ratingColor = normalizeHexColor(value, APP_DEFAULTS.UI_RATING_COLOR);
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("ui.ratingColor");
        },
    });

    safeAddSetting({
        id: `${SETTINGS_PREFIX}.Badges.TagColor`,
        category: badgeCat("Tag color"),
        name: "Majoor: Tags badge color",
        tooltip: "Color used for tags badge text/accent (hex, e.g. #4A90E2).",
        type: "color",
        defaultValue: normalizeHexColor(settings.ui?.tagColor, APP_DEFAULTS.UI_TAG_COLOR),
        onChange: (value: any) => {
            settings.ui = settings.ui || {};
            settings.ui.tagColor = normalizeHexColor(value, APP_DEFAULTS.UI_TAG_COLOR);
            saveMajoorSettings(settings);
            applySettingsToConfig(settings);
            notifyApplied("ui.tagColor");
        },
    });
}