Template:SwitchImage/style.css

/* 容器样式 */
.themed-image-container {
    display: inline-block;
    line-height: 0;
}

/* 默认逻辑：显示浅色图，隐藏深色图 */
.themed-image-dark {
    display: none;
}
.themed-image-light {
    display: block;
}

/* --- 情况 A：手动切换模式 --- */

/* 1. 强制深色模式 (Night) */
html.skin-theme-clientpref-night .themed-image-light {
    display: none !important;
}
html.skin-theme-clientpref-night .themed-image-dark {
    display: block !important;
}

/* 2. 强制浅色模式 (Day) - 确保在 OS 模式切换后能正确切回 */
html.skin-theme-clientpref-day .themed-image-light {
    display: block !important;
}
html.skin-theme-clientpref-day .themed-image-dark {
    display: none !important;
}

/* --- 情况 B：跟随系统模式 (OS) --- */

@media (prefers-color-scheme: dark) {
    /* 当用户选择“跟随系统”且系统当前为深色时 */
    html.skin-theme-clientpref-os .themed-image-light {
        display: none !important;
    }
    html.skin-theme-clientpref-os .themed-image-dark {
        display: block !important;
    }
}