// ==UserScript==
// @name         智读宝 (SmartReader) V7.8
// @namespace    http://tampermonkey.net/
// @version      7.8
// @description  深度加固删除主题、重置插件、实时变色逻辑，确保按钮100%可用
// @author       Gemini
// @match        *://*/*
// @grant        none
// @downloadURL https://update.greasyfork.icu/scripts/570088/%E6%99%BA%E8%AF%BB%E5%AE%9D%20%28SmartReader%29%20V78.user.js
// @updateURL https://update.greasyfork.icu/scripts/570088/%E6%99%BA%E8%AF%BB%E5%AE%9D%20%28SmartReader%29%20V78.meta.js
// ==/UserScript==

(function() {
    'use strict';

    const STORAGE_KEY = 'gm_read_master_v7_8';

    const defaultThemes = {
        'pureDark': { name: '极黑模式', bg: '#000000', text: '#cccccc', link: '#3daee9' },
        'softDark': { name: '深灰模式', bg: '#1a1a1b', text: '#d7dadc', link: '#4fbcff' },
        'green': { name: '森林护眼', bg: '#c7edcc', text: '#004010', link: '#0066cc' },
        'paper': { name: '复古羊皮', bg: '#f4ecd8', text: '#5b4636', link: '#b85c00' }
    };

    let config = JSON.parse(localStorage.getItem(STORAGE_KEY)) || {
        active: false,
        currentThemeKey: 'softDark',
        fontSize: 20,
        imgSize: 80,
        customThemes: {}
    };

    const styleTag = document.createElement('style');
    styleTag.id = 'gm-read-v7-style';
    document.head.appendChild(styleTag);

    function getTheme(key) {
        return defaultThemes[key] || config.customThemes[key] || defaultThemes['softDark'];
    }

    function updateStyles() {
        if (!config.active) {
            styleTag.innerHTML = '';
            return;
        }
        const c = getTheme(config.currentThemeKey);
        styleTag.innerHTML = `
            html, body { background-color: ${c.bg} !important; }
            body *:not(#rm-panel):not(#rm-panel *):not(#rm-mini-gear):not(button):not(i):not([class*="icon"]):not(a) {
                background-color: transparent !important;
                color: ${c.text} !important;
                font-size: ${config.fontSize}px !important;
                line-height: 1.8 !important;
            }
            body a:not(#rm-panel *) {
                color: ${c.link} !important;
                font-size: ${config.fontSize}px !important;
                text-decoration: underline !important;
            }
            img:not(#rm-panel *) {
                display: block !important;
                margin: 20px auto !important;
                width: ${config.imgSize}% !important;
                max-width: ${config.imgSize}% !important;
                height: auto !important;
                object-fit: contain !important;
            }
            header, footer, aside, nav, .ads, .sidebar { display: none !important; }
        `;
    }

    const panel = document.createElement('div');
    panel.id = 'rm-panel';
    panel.style = `
        position: fixed; top: 60px; right: 20px; z-index: 2147483647;
        background: #ffffff; border: 1px solid #ddd; padding: 15px;
        border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,0.3);
        font-family: sans-serif; width: 250px; color: #333; font-size: 13px;
        display: none;
    `;

    const miniGear = document.createElement('div');
    miniGear.id = 'rm-mini-gear';
    miniGear.innerHTML = '⚙️';
    miniGear.style = `
        position: fixed; top: 80px; right: 20px; z-index: 2147483647;
        cursor: pointer; font-size: 26px; width: 45px; height: 45px;
        background: rgba(0, 0, 0, 0.7); color: white; border-radius: 50%;
        display: flex; align-items: center; justify-content: center;
        box-shadow: 0 4px 15px rgba(0,0,0,0.4);
    `;

    function renderUI() {
        const current = getTheme(config.currentThemeKey);
        const isCustom = !!config.customThemes[config.currentThemeKey];

        panel.innerHTML = `
            <div style="font-weight:bold; margin-bottom:12px; display:flex; justify-content:space-between; border-bottom:1px solid #eee; padding-bottom:8px;">
                🚀 阅读大师 V7.8 <span id="rm-close" style="cursor:pointer; font-size:18px;">✕</span>
            </div>

            <label style="display:flex; align-items:center; margin-bottom:12px; cursor:pointer;">
                <input type="checkbox" id="rm-active" ${config.active?'checked':''}> <span style="margin-left:8px;font-weight:bold;">启用阅读模式</span>
            </label>

            <div style="margin-bottom:10px;">字号: <b>${config.fontSize}px</b> <input type="range" id="rm-fontSize" min="14" max="60" value="${config.fontSize}" style="width:100%;"></div>
            <div style="margin-bottom:15px;">图片比例: <b>${config.imgSize}%</b> <input type="range" id="rm-imgSize" min="5" max="100" value="${config.imgSize}" style="width:100%;"></div>

            <div style="background:#f5f5f5; padding:12px; border-radius:10px; border:1px solid #ddd;">
                <div style="margin-bottom:8px;">主题选择:</div>
                <select id="rm-theme-select" style="width:100%; margin-bottom:10px; padding:5px;">
                    <optgroup label="内置主题">${Object.keys(defaultThemes).map(k => `<option value="${k}" ${config.currentThemeKey===k?'selected':''}>${defaultThemes[k].name}</option>`).join('')}</optgroup>
                    <optgroup label="我的自定义">${Object.keys(config.customThemes).map(k => `<option value="${k}" ${config.currentThemeKey===k?'selected':''}>${config.customThemes[k].name}</option>`).join('')}</optgroup>
                </select>

                <div style="display:flex; gap:8px; text-align:center; margin-bottom:12px;">
                    <div style="flex:1;"><input type="color" id="cp-bg" value="${current.bg}" style="width:100%; height:30px;"><br><span style="font-size:10px;">背景</span></div>
                    <div style="flex:1;"><input type="color" id="cp-text" value="${current.text}" style="width:100%; height:30px;"><br><span style="font-size:10px;">文字</span></div>
                    <div style="flex:1;"><input type="color" id="cp-link" value="${current.link}" style="width:100%; height:30px;"><br><span style="font-size:10px;">链接</span></div>
                </div>

                <button id="rm-add-theme" style="width:100%; padding:8px; cursor:pointer; background:#28a745; color:white; border:none; border-radius:5px; font-weight:bold;">✚ 保存为新主题</button>
            </div>

            <button id="rm-del-theme" style="width:100%; color:#dc3545; font-size:11px; background:none; border:1px solid #dc3545; border-radius:4px; cursor:pointer; padding:5px; margin-top:10px; display:${isCustom?'block':'none'}">🗑 删除当前主题</button>

            <button id="rm-reset-all" style="margin-top:15px; width:100%; border:none; color:#999; text-decoration:underline; cursor:pointer; font-size:10px; background:none;">⚠️ 重置插件(清空所有)</button>
        `;

        // 渲染完立刻重新绑定所有事件
        bindEvents();
    }

    function bindEvents() {
        const el = (id) => document.getElementById(id);
        if (!el('rm-active')) return; // 防止在未渲染时调用

        const syncAndSave = () => {
            config.active = el('rm-active').checked;
            config.fontSize = el('rm-fontSize').value;
            config.imgSize = el('rm-imgSize').value;

            // 实时同步自定义颜色
            if (config.customThemes[config.currentThemeKey]) {
                config.customThemes[config.currentThemeKey].bg = el('cp-bg').value;
                config.customThemes[config.currentThemeKey].text = el('cp-text').value;
                config.customThemes[config.currentThemeKey].link = el('cp-link').value;
            }
            updateStyles();
            localStorage.setItem(STORAGE_KEY, JSON.stringify(config));
        };

        // 基础监听
        ['cp-bg', 'cp-text', 'cp-link', 'rm-fontSize', 'rm-imgSize', 'rm-active'].forEach(id => {
            el(id).oninput = syncAndSave;
        });

        // 1. 主题切换
        el('rm-theme-select').onchange = (e) => {
            config.currentThemeKey = e.target.value;
            const t = getTheme(config.currentThemeKey);
            el('cp-bg').value = t.bg;
            el('cp-text').value = t.text;
            el('cp-link').value = t.link;
            syncAndSave();
            renderUI(); // 刷新以显示/隐藏删除按钮
            panel.style.display = 'block';
        };

        // 2. 新增功能修复
        el('rm-add-theme').onclick = () => {
            const name = prompt("请输入新主题名称:", "自定义主题 " + (Object.keys(config.customThemes).length + 1));
            if (name) {
                const id = 'custom_' + Date.now();
                config.customThemes[id] = {
                    name: name,
                    bg: el('cp-bg').value,
                    text: el('cp-text').value,
                    link: el('cp-link').value
                };
                config.currentThemeKey = id;
                syncAndSave();
                renderUI();
                panel.style.display = 'block';
            }
        };

        // 3. 删除功能修复
        el('rm-del-theme').onclick = () => {
            if(confirm("确定要彻底删除这个自定义配色吗？")) {
                delete config.customThemes[config.currentThemeKey];
                config.currentThemeKey = 'softDark';
                syncAndSave();
                renderUI();
                panel.style.display = 'block';
            }
        };

        // 4. 重置功能修复 (重命名 ID 避免冲突)
        el('rm-reset-all').onclick = () => {
            if(confirm("警告：这将删除你所有的自定义主题并恢复出厂设置！确定吗？")) {
                localStorage.removeItem(STORAGE_KEY);
                location.reload();
            }
        };

        // 5. 收起/展开
        el('rm-close').onclick = () => {
            panel.style.display = 'none';
            document.body.appendChild(miniGear);
        };
        miniGear.onclick = () => {
            panel.style.display = 'block';
            miniGear.remove();
        };
    }

    // 初始化运行
    document.body.appendChild(miniGear);
    document.body.appendChild(panel);
    renderUI();
    if (config.active) updateStyles();

})();