<!-- 主界面容器 -->
<div id="mainInterface" style="display: none;">
    <!-- 表头 -->
    <div id="mainHeader">
        <button id="minimizeBtn" class="header-btn">
            <img src="chrome-extension://__MSG_@@extension_id__/assets/icons/font/AliExpress_suoxiao.png" alt="缩小" class="header-icon" style="width: 16px; height: 16px;">
        </button>
        <h2><strong>AliExpress运营工具</strong></h2>
        <button id="heartBtn" class="header-btn">
            <img src="chrome-extension://__MSG_@@extension_id__/assets/icons/font/AliExpress_aixin_1.png" alt="爱心" class="header-icon heart-icon" style="width: 20px; height: 20px;">
        </button>
    </div>

    <!-- 表单主体 -->
    <div id="mainBody">
        <!-- 结算币种选择 -->
        <div class="form-group">
            <label>结算币种</label>
            <div class="currency-selector">
                <label class="radio-label">
                    <input type="radio" name="currency" value="CNY" checked> 人民币 (CNY)
                </label>
                <label class="radio-label">
                    <input type="radio" name="currency" value="USD"> 美元 (USD)
                </label>
            </div>
        </div>

        <!-- 参考汇率设置 -->
        <div class="form-group">
            <label>参考汇率</label>
            <input type="number" id="exchangeRate" class="form-input" placeholder="请输入当前汇率" step="0.1" min="0">
        </div>

        <!-- 类目选择 -->
        <div class="form-group">
            <label>产品类目</label>
            <div class="category-selector-container" style="display: flex; gap: 8px;">
                <div style="position: relative; flex: 1;">
                    <input type="text" id="categoryInput" class="form-input" placeholder="点击选择类目" readonly style="cursor: pointer; padding-right: 30px; height: 34px; box-sizing: border-box;">
                    <input type="hidden" id="categoryId">
                    <img src="chrome-extension://__MSG_@@extension_id__/assets/icons/font/AliExpress_shousuo_shang.png" class="select-icon" alt="" style="position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; pointer-events: none;">
                </div>
                <button id="autoFillCategoryBtn" class="sku-submit-btn" style="width: auto; padding: 0 15px; font-size: 13px; height: 34px; line-height: 32px; margin-top: 0; box-sizing: border-box; white-space: nowrap;">填充</button>
            </div>
        </div>
    </div>

    <!-- 表尾按钮 -->
    <div id="mainFooter">
        <button id="skuPricingBtn" class="footer-btn sku-btn">SKU定价</button>
        <button id="regionPricingBtn" class="footer-btn region-btn">区域定价</button>
        <button id="aboutBtn" class="footer-btn about-btn">说明</button>
    </div>
</div>

<!-- 最小化圆盘 -->
<div id="minimizedDisc" class="water-ripple-container" style="display: none;">
    <div class="minimized-disc rotate-disc">
        <img src="https://www.3qniuma.com/images/logo_120.png" alt="3Q小牛马" />
    </div>
    <div class="water-ripple"></div>
    <div class="water-ripple"></div>
    <div class="water-ripple"></div>
</div>

<!-- 弹窗容器（用于动态加载弹窗内容） -->
<div id="modalContainer"></div>

<!-- 类目选择弹窗 -->
<div id="categorySelectionModal" class="modal-overlay" style="display: none; z-index: 9999;">
    <div class="modal-content category-selection-content" style="width: 1000px; height: 700px; display: flex; flex-direction: column;">
        <div class="modal-header">
            <h2 style="margin: 0;">选择类目</h2>
            <button id="closeCategoryModal" class="modal-close" style="background: none; border: none; cursor: pointer;">
                <img src="chrome-extension://__MSG_@@extension_id__/assets/icons/font/AliExpress_close.png" alt="关闭" style="width: 16px; height: 16px;">
            </button>
        </div>
        
        <div class="modal-body" style="flex: 1; overflow: hidden; display: flex; flex-direction: column;">
            <!-- 搜索框 -->
            <div class="category-search-bar" style="margin-bottom: 10px; padding: 0 5px;">
                <input type="text" id="categorySearchInput" placeholder="搜索类目..." style="width: 100%; padding: 8px; border: 1px solid #ddd; border-radius: 4px;">
            </div>
            
            <!-- 面包屑导航 -->
            <div id="categoryBreadcrumb" style="padding: 5px; color: #666; font-size: 12px; min-height: 20px;"></div>

            <!-- 级联选择区域 (Miller Columns) -->
            <div class="category-columns-container" style="flex: 1; display: flex; overflow-x: auto; border: 1px solid #eee; border-radius: 4px;">
                <!-- 动态生成列 -->
            </div>
        </div>

        <div class="modal-footer" style="padding-top: 15px; text-align: right; border-top: 1px solid #eee;">
            <button id="confirmCategoryBtn" class="sku-submit-btn" style="width: auto; padding: 8px 20px;">确定</button>
        </div>
    </div>
</div>

<script src="../main.js"></script>





