/* 定义默认变量 (浅色模式) */
:root {
    --sdm-bg: #ffffff;
    --sdm-text: #333333;
    --sdm-link: #0073aa;
    --sdm-border: #dddddd;
    --sdm-card-bg: #f9f9f9;
}

/* 深色模式变量覆盖 */
body.dark-mode {
    --sdm-bg: #121212;
    --sdm-text: #e0e0e0;
    --sdm-link: #4dabf7;
    --sdm-border: #333333;
    --sdm-card-bg: #1e1e1e;
    
    background-color: var(--sdm-bg) !important;
    color: var(--sdm-text) !important;
}

/* 基础元素适配 */
body.dark-mode p, 
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, 
body.dark-mode li {
    color: var(--sdm-text);
}

body.dark-mode a {
    color: var(--sdm-link);
}

/* 浮动切换按钮样式 */
#sdm-toggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: none;
    background: var(--sdm-text);
    color: var(--sdm-bg);
    font-size: 20px;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
}

#sdm-toggle:hover {
    transform: scale(1.1);
}

/* ---------------------------------------------------- */
/* === AI 插件兼容性专用样式 === */
/* 假设之前的 AI 插件使用了常见的结构，如 pre, code, card 等 */
/* ---------------------------------------------------- */

/* 1. 代码块与预格式化文本 (AI 生成代码常用) */
body.dark-mode pre, 
body.dark-mode code {
    background-color: #2d2d2d !important;
    color: #f8f8f2 !important;
    border: 1px solid var(--sdm-border);
}

/* 2. 图片亮度降低 (护眼模式) */
body.dark-mode img {
    opacity: 0.85;
    transition: opacity 0.3s;
}
body.dark-mode img:hover {
    opacity: 1;
}

/* 3. 输入框和表单 */
body.dark-mode input, 
body.dark-mode textarea {
    background-color: #2b2b2b;
    color: #fff;
    border: 1px solid var(--sdm-border);
}

/* =========================================================
   WordPress 后台 (WP Admin) 基础适配
   ========================================================= */

/* 1. 后台主背景变色 */
body.dark-mode.wp-admin {
    background-color: #121212 !important;
    color: #e0e0e0 !important;
}

/* 修复后台内容区域容器 */
body.dark-mode.wp-admin #wpbody-content,
body.dark-mode.wp-admin .wrap {
    background-color: transparent !important;
}

/* 2. 所有的卡片、设置框、表格容器 (最重要) */
body.dark-mode.wp-admin .postbox,
body.dark-mode.wp-admin .card,
body.dark-mode.wp-admin .welcome-panel,
body.dark-mode.wp-admin #activity-widget, 
body.dark-mode.wp-admin .wrap .notice,
body.dark-mode.wp-admin table.widefat {
    background-color: #1e1e1e !important;
    border-color: #333 !important;
    color: #ccc !important;
    box-shadow: none !important;
}

/* 3. 后台标题 */
body.dark-mode.wp-admin h1, 
body.dark-mode.wp-admin h2, 
body.dark-mode.wp-admin h3,
body.dark-mode.wp-admin label {
    color: #e0e0e0 !important;
}

/* 4. 输入框适配 */
body.dark-mode.wp-admin input[type=text],
body.dark-mode.wp-admin input[type=search],
body.dark-mode.wp-admin input[type=password],
body.dark-mode.wp-admin input[type=email],
body.dark-mode.wp-admin input[type=number],
body.dark-mode.wp-admin textarea,
body.dark-mode.wp-admin select {
    background-color: #2b2b2b !important;
    border-color: #444 !important;
    color: #fff !important;
}

/* 5. 链接颜色 */
body.dark-mode.wp-admin a {
    color: #4dabf7 !important;
}
body.dark-mode.wp-admin .button-primary {
    background: #0057ff !important;
    border-color: #0057ff !important;
    text-shadow: none !important;
}