:root {
    /* 主色调 */
    --color-primary: rgb(227, 107, 2);
    --color-primary-hex: #e36b02;

    /* 主色衍生 */
    --color-primary-light: rgb(255, 151, 77);
    --color-primary-light-hex: #ff964c;
    --color-primary-dark: rgb(184, 86, 0);
    --color-primary-dark-hex: #b85600;

    /* 中性色 */
    --color-bg: rgb(255, 249, 245);
    --color-bg-hex: #fff9f5;
    --color-text: rgb(51, 51, 51);
    --color-text-hex: #333333;
    --color-text-secondary: rgb(102, 102, 102);
    --color-text-secondary-hex: #666666;
    --color-border: rgb(224, 224, 224);
    --color-border-hex: #e0e0e0;

    /* 辅助色 */
    --color-success: rgb(76, 175, 80);
    --color-success-hex: #4caf50;
    --color-warning: rgb(255, 193, 7);
    --color-warning-hex: #ffc107;
    --color-error: rgb(244, 67, 54);
    --color-error-hex: #f44336;
    --color-info: rgb(33, 150, 243);
    --color-info-hex: #2196f3;

    /* 透明度控制 */
    --color-primary-10: rgba(var(--color-primary), 0.1);
    --color-primary-20: rgba(var(--color-primary), 0.2);
    --color-primary-40: rgba(var(--color-primary), 0.4);
    --color-primary-60: rgba(var(--color-primary), 0.6);
    --color-primary-80: rgba(var(--color-primary), 0.8);
}


/* 文字主题样式 */
.text-title-main {
    color: var(--color-primary);
}
.text-title-second {
    color: var(--color-text);
}
.text-title-note {
    color: var(--color-text-secondary);
}
.text-content-main {
    color: var(--color-text);
}
.text-content-second {
    color: var(--color-text-secondary);
}
.text-content-note {
    color: var(--color-text-secondary);
    opacity: 0.8;
}


/* 背景色主题样式 */
.bgcolor-page {
    background-color: var(--color-bg);
}
.bgcolor-menu {
    background-color: var(--color-primary-light);
    color: white;
}
.bgcolor-head {
    background-color: var(--color-primary);
    color: white;
}
.bgcolor-foot {
    background-color: var(--color-primary-dark);
    color: white;
}
.bgcolor-card {
    background-color: white;
}
.bgcolor-container {
    background-color: white;
    box-shadow: 0 2px 8px var(--color-primary-10);
}
