/*
 * Qeel Theme Menu UI
 * 只负责菜单外观，不接管原网站主题切换逻辑
 */

:root {
    --qtf-popup: #ffffff;
    --qtf-row: #f5f8fc;
    --qtf-row-hover: #edf4ff;
    --qtf-selected: #e8f2ff;

    --qtf-text: #13213d;
    --qtf-muted: #8594aa;

    --qtf-border: #dce5f0;
    --qtf-blue: #347ef3;
}


/* 深色主题 */
html[data-theme="dark"],
html.dark,
html.theme-dark,
body[data-theme="dark"] {
    --qtf-popup: #111d2d;
    --qtf-row: #172538;
    --qtf-row-hover: #1d2d43;
    --qtf-selected: #203a5e;

    --qtf-text: #eef4ff;
    --qtf-muted: #95a8c0;

    --qtf-border: #2b3d53;
    --qtf-blue: #6da9ff;
}


/* 整个主题弹窗 */
[data-qeel-theme-popup="1"] {
    background: var(--qtf-popup) !important;
    background-image: none !important;

    color: var(--qtf-text) !important;

    border: 1px solid var(--qtf-border) !important;
    border-radius: 16px !important;

    padding: 10px !important;

    box-shadow:
        0 16px 42px rgba(24, 48, 82, .15) !important;
}


/* “界面主题” */
[data-qeel-theme-title="1"] {
    background: transparent !important;
    background-image: none !important;

    color: var(--qtf-text) !important;

    border: 0 !important;
    box-shadow: none !important;

    padding: 3px 7px 9px !important;

    font-size: 13px !important;
    font-weight: 600 !important;
}


/*
 * 真正的三整行：
 * 浅色 / 深色 / 跟随系统
 */
[data-qeel-theme-row="1"] {
    position: relative !important;

    background: var(--qtf-row) !important;
    background-image: none !important;

    color: var(--qtf-text) !important;

    border: 1px solid transparent !important;
    border-radius: 12px !important;

    box-shadow: none !important;

    opacity: 1 !important;

    margin: 4px 0 !important;

    cursor: pointer !important;
}


[data-qeel-theme-row="1"]:hover {
    background: var(--qtf-row-hover) !important;
    background-image: none !important;
}


/*
 * 之前被错误选中的内部白色文字块。
 * 现在全部恢复透明。
 */
[data-qeel-theme-inner="1"] {
    background: transparent !important;
    background-image: none !important;

    border-color: transparent !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    color: inherit !important;
}


/* 标题文字 */
[data-qeel-theme-row="1"] strong,
[data-qeel-theme-row="1"] b,
[data-qeel-theme-row="1"] span,
[data-qeel-theme-row="1"] div {
    color: inherit;
}


/* 第二行小字 */
[data-qeel-theme-row="1"] small {
    color: var(--qtf-muted) !important;
}


/*
 * 当前选中项。
 * 不再自己生成 ✓，保留网站原来的勾。
 */
[data-qeel-theme-row="1"][data-qeel-theme-current="1"] {
    background: var(--qtf-selected) !important;

    border-color:
        rgba(52, 126, 243, .28) !important;
}


/*
 * 彻底禁用上一版产生的第二个 ✓
 */
[data-qeel-theme-option="1"][data-qeel-selected="1"]::after,
[data-qeel-theme-row="1"]::after {
    content: none !important;
    display: none !important;
}


/* =====================================================
   Theme click flash fix
   点击、按下、聚焦状态全部保持当前菜单样式，
   禁止原站点按钮蓝底 / transform / animation 短暂出现
   ===================================================== */

[data-qeel-theme-row="1"],
[data-qeel-theme-row="1"]:hover,
[data-qeel-theme-row="1"]:active,
[data-qeel-theme-row="1"]:focus,
[data-qeel-theme-row="1"]:focus-visible {
    background: var(--qtf-row) !important;
    background-color: var(--qtf-row) !important;
    background-image: none !important;

    color: var(--qtf-text) !important;

    transform: none !important;
    scale: none !important;

    filter: none !important;

    box-shadow: none !important;

    outline: none !important;

    transition: none !important;
    animation: none !important;

    -webkit-tap-highlight-color: transparent !important;
}


/* 当前选中的一项保持淡色选中 */
[data-qeel-theme-row="1"][data-qeel-theme-current="1"],
[data-qeel-theme-row="1"][data-qeel-theme-current="1"]:hover,
[data-qeel-theme-row="1"][data-qeel-theme-current="1"]:active,
[data-qeel-theme-row="1"][data-qeel-theme-current="1"]:focus {
    background: var(--qtf-selected) !important;
    background-color: var(--qtf-selected) !important;
    background-image: none !important;

    transform: none !important;
    box-shadow: none !important;

    transition: none !important;
    animation: none !important;
}


/* 内部元素点击时也禁止旧按钮样式冒出来 */
[data-qeel-theme-row="1"] *,
[data-qeel-theme-row="1"] *:active,
[data-qeel-theme-row="1"] *:focus {
    transform: none !important;
    filter: none !important;

    transition: none !important;
    animation: none !important;

    -webkit-tap-highlight-color: transparent !important;
}


/* =====================================================
   Login / Register 主题菜单字体颜色修正
   不修改登录表单本身，只修“界面主题”菜单
   ===================================================== */

[data-qeel-theme-main-label="1"] {
    color: var(--qtf-text) !important;
    -webkit-text-fill-color: var(--qtf-text) !important;

    font-weight: 600 !important;
    opacity: 1 !important;
}


[data-qeel-theme-description="1"] {
    color: var(--qtf-muted) !important;
    -webkit-text-fill-color: var(--qtf-muted) !important;

    font-weight: 400 !important;
    opacity: 1 !important;
}


/*
 * 防止登录 / 注册页面原有 button/span 颜色把菜单重新染乱
 */
[data-qeel-theme-row="1"]
[data-qeel-theme-main-label="1"] * {
    color: var(--qtf-text) !important;
    -webkit-text-fill-color: var(--qtf-text) !important;
}


[data-qeel-theme-row="1"]
[data-qeel-theme-description="1"] * {
    color: var(--qtf-muted) !important;
    -webkit-text-fill-color: var(--qtf-muted) !important;
}