:root {
    /* ===== 深色主题（默认） ===== */

    /* 背景色 */
    --bg-color: #0d1117;
    --bg-color-secondary: #161b22;
    --bg-color-tertiary: #1c2129;

    /* 文字色 */
    --text-color: #e6edf3;
    --text-color-secondary: #b0b8c1;
    --text-color-muted: #7d8590;
    --text-color-heading: #f0f3f6;

    /* 主题色 */
    --primary-color: #f8ebba;
    --primary-color-hover: #c5b677;
    --primary-color-rgb: 248, 235, 186;

    /* 边框色 */
    --border-color: rgba(248, 235, 186, 0.2);
    --border-color-strong: rgba(248, 235, 186, 0.4);

    /* 表面色（卡片、导航等） */
    --surface-color: #161b22;
    --surface-color-hover: #1c2129;

    /* 按钮 */
    --btn-primary-bg: #f8ebba;
    --btn-primary-text: #0d1117;
    --btn-primary-hover: #c5b677;
    --btn-outline-border: rgba(248, 235, 186, 0.4);
    --btn-outline-text: #e6edf3;
    --btn-outline-hover-border: #f8ebba;

    /* 输入框 */
    --input-bg: rgba(255, 255, 255, 0.05);
    --input-border: rgba(248, 235, 186, 0.25);
    --input-focus-border: #f8ebba;
    --input-text: #e6edf3;

    /* 代码块 */
    --code-bg: #0d1117;
    --code-text: #e0e0e0;

    /* 状态色 */
    --success-color: #3fb950;
    --error-color: #f85149;
    --warning-color: #d29922;

    /* 消息提示 */
    --msg-error-bg: rgba(248, 81, 73, 0.1);
    --msg-error-border: rgba(248, 81, 73, 0.3);
    --msg-error-text: #f85149;
    --msg-success-bg: rgba(63, 185, 80, 0.1);
    --msg-success-border: rgba(63, 185, 80, 0.3);
    --msg-success-text: #3fb950;

    /* 页脚 */
    --footer-border: rgba(255, 255, 255, 0.1);
    --footer-text: #7d8590;

    /* 链接 */
    --link-color: #c5b677;

    /* 步骤圆圈 */
    --step-num-bg: #f8ebba;
    --step-num-text: #0d1117;
}

:root.light {
    /* ===== 浅色主题 ===== */

    /* 背景色 */
    --bg-color: #f7f8fa;
    --bg-color-secondary: #ffffff;
    --bg-color-tertiary: #f0f1f3;

    /* 文字色 */
    --text-color: #1f2328;
    --text-color-secondary: #656d76;
    --text-color-muted: #8b949e;
    --text-color-heading: #1a1a2e;

    /* 主题色 */
    --primary-color: #1a1a2e;
    --primary-color-hover: #16213e;
    --primary-color-rgb: 26, 26, 46;

    /* 边框色 */
    --border-color: #e0e0e0;
    --border-color-strong: #d0d0d0;

    /* 表面色 */
    --surface-color: #ffffff;
    --surface-color-hover: #f6f8fa;

    /* 按钮 */
    --btn-primary-bg: #1a1a2e;
    --btn-primary-text: #ffffff;
    --btn-primary-hover: #16213e;
    --btn-outline-border: #d0d0d0;
    --btn-outline-text: #1f2328;
    --btn-outline-hover-border: #1a1a2e;

    /* 输入框 */
    --input-bg: #ffffff;
    --input-border: #d0d0d0;
    --input-focus-border: #1a1a2e;
    --input-text: #1f2328;

    /* 代码块 */
    --code-bg: #1a1a2e;
    --code-text: #e0e0e0;

    /* 状态色 */
    --success-color: #389e0d;
    --error-color: #cf1322;
    --warning-color: #faad14;

    /* 消息提示 */
    --msg-error-bg: #fff2f0;
    --msg-error-border: #ffccc7;
    --msg-error-text: #cf1322;
    --msg-success-bg: #f6ffed;
    --msg-success-border: #b7eb8f;
    --msg-success-text: #389e0d;

    /* 页脚 */
    --footer-border: #eee;
    --footer-text: #ccc;

    /* 链接 */
    --link-color: #1a1a2e;

    /* 步骤圆圈 */
    --step-num-bg: #1a1a2e;
    --step-num-text: #ffffff;
}

/* ===== 自动填充样式 ===== */
input:-webkit-autofill {
    border: 1px solid var(--input-border) !important;
    -webkit-text-fill-color: var(--input-text) !important;
    background-color: var(--input-bg) !important;
    transition: background-color 5000s ease-in-out 0s !important;
}

/* ===== 字体 ===== */
@font-face {
    font-family: 'LogoFont';
    src: url("/static/logo.ttf");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* ===== Logo ===== */
.logo-icon {
    display: flex;
    width: 45px;
    height: 45px;
    background-image: url('/static/lingyao-144x144-tm.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: background-image 0.5s ease-in-out;
}

.light .logo-icon {
    background-image: url('/static/lingyao-144x144-yj.png');
}

/* ===== 主题切换按钮 ===== */
.theme-btn {
    display: flex;
    padding: 5px;
    width: 35px;
    height: 35px;
    border-radius: 10px;
    align-items: center;
    border: 1px solid var(--border-color-strong);
    cursor: pointer;
    transition: border-color 0.2s;
}

.theme-btn:hover {
    border-color: var(--primary-color);
}

.theme-icon {
    display: flex;
    width: 35px;
    height: 35px;
    background-image: url('/static/dark.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: background-image 0.5s ease-in-out;
}

.light .theme-icon {
    background-image: url('/static/light.svg');
}