/* ============================================
   歪歪漫画 用户主题变量体系
   用法：<div id="framework7-root" class="framework7-root {$user.myui}">
   未登录/默认 -> :root 默认（对齐整站框架红 #f44336）
   登录用户个人中心选主题 -> framework7-root.color-theme-* 映射
   搜索页等自定义样式通过 var(--primary) 等变量跟随用户主题
   ============================================ */

/* ---------- 默认（未登录 / 无主题）：对齐整站框架红 ---------- */
:root {
    --primary: #f44336;
    --primary-light: #ff8a80;
    --primary-dark: #d2190b;
    --primary-rgb: 244, 67, 54;
    --grad-1: #ff6e6e;
    --grad-2: #f44336;
    --grad-3: #d2190b;
    --btn-g1: #ff6e6e;
    --btn-g2: #f44336;
    --tag-bg: #ffebee;
    --tag-border: #ffcdd2;
    --tag-text: #d2190b;
    --shadow: rgba(244, 67, 54, .35);
    --shadow-btn: rgba(244, 67, 54, .45);
    --chip-bg: #f5f5f7;
    --chip-text: #666;
    --hero-title: rgba(255, 255, 255, .9);
    --star: #ff9800;
}

/* ---------- 用户主题映射（与旧站个人中心 9 主题一一对应） ---------- */

/* Pink 粉 */
.framework7-root.color-theme-pink {
    --primary: #e91e63;
    --primary-light: #f8bbd0;
    --primary-dark: #aa1145;
    --primary-rgb: 233, 30, 99;
    --grad-1: #ff5c8d;
    --grad-2: #e91e63;
    --grad-3: #aa1145;
    --btn-g1: #ff5c8d;
    --btn-g2: #e91e63;
    --tag-bg: #fce4ec;
    --tag-border: #f8bbd0;
    --tag-text: #aa1145;
    --shadow: rgba(233, 30, 99, .35);
    --shadow-btn: rgba(233, 30, 99, .45);
}

/* Red 红 */
.framework7-root.color-theme-red {
    --primary: #f44336;
    --primary-light: #ff8a80;
    --primary-dark: #d2190b;
    --primary-rgb: 244, 67, 54;
    --grad-1: #ff6e6e;
    --grad-2: #f44336;
    --grad-3: #d2190b;
    --btn-g1: #ff6e6e;
    --btn-g2: #f44336;
    --tag-bg: #ffebee;
    --tag-border: #ffcdd2;
    --tag-text: #d2190b;
    --shadow: rgba(244, 67, 54, .35);
    --shadow-btn: rgba(244, 67, 54, .45);
}

/* Green 绿 */
.framework7-root.color-theme-green {
    --primary: #4caf50;
    --primary-light: #c8e6c9;
    --primary-dark: #357a38;
    --primary-rgb: 76, 175, 80;
    --grad-1: #81c784;
    --grad-2: #4caf50;
    --grad-3: #357a38;
    --btn-g1: #81c784;
    --btn-g2: #4caf50;
    --tag-bg: #e8f5e9;
    --tag-border: #c8e6c9;
    --tag-text: #357a38;
    --shadow: rgba(76, 175, 80, .35);
    --shadow-btn: rgba(76, 175, 80, .45);
}

/* Blue 蓝 */
.framework7-root.color-theme-blue {
    --primary: #2196f3;
    --primary-light: #bbdefb;
    --primary-dark: #0a6ebd;
    --primary-rgb: 33, 150, 243;
    --grad-1: #64b5f6;
    --grad-2: #2196f3;
    --grad-3: #0a6ebd;
    --btn-g1: #64b5f6;
    --btn-g2: #2196f3;
    --tag-bg: #e3f2fd;
    --tag-border: #bbdefb;
    --tag-text: #0a6ebd;
    --shadow: rgba(33, 150, 243, .35);
    --shadow-btn: rgba(33, 150, 243, .45);
}

/* Yellow 黄 */
.framework7-root.color-theme-yellow {
    --primary: #ffeb3b;
    --primary-light: #fff9c4;
    --primary-dark: #b39100;
    --primary-rgb: 255, 235, 59;
    --grad-1: #fff176;
    --grad-2: #ffeb3b;
    --grad-3: #b39100;
    --btn-g1: #ffd54f;
    --btn-g2: #fbc02d;
    --tag-bg: #fffde7;
    --tag-border: #fff9c4;
    --tag-text: #b39100;
    --shadow: rgba(255, 235, 59, .35);
    --shadow-btn: rgba(255, 193, 7, .45);
}

/* Orange 橙 */
.framework7-root.color-theme-orange {
    --primary: #ff9800;
    --primary-light: #ffe0b2;
    --primary-dark: #b36a00;
    --primary-rgb: 255, 152, 0;
    --grad-1: #ffb74d;
    --grad-2: #ff9800;
    --grad-3: #b36a00;
    --btn-g1: #ffb74d;
    --btn-g2: #ff9800;
    --tag-bg: #fff3e0;
    --tag-border: #ffe0b2;
    --tag-text: #b36a00;
    --shadow: rgba(255, 152, 0, .35);
    --shadow-btn: rgba(255, 152, 0, .45);
}

/* Gray 灰 */
.framework7-root.color-theme-gray {
    --primary: #9e9e9e;
    --primary-light: #e0e0e0;
    --primary-dark: #787878;
    --primary-rgb: 158, 158, 158;
    --grad-1: #bdbdbd;
    --grad-2: #9e9e9e;
    --grad-3: #787878;
    --btn-g1: #bdbdbd;
    --btn-g2: #9e9e9e;
    --tag-bg: #f5f5f5;
    --tag-border: #e0e0e0;
    --tag-text: #787878;
    --shadow: rgba(158, 158, 158, .35);
    --shadow-btn: rgba(158, 158, 158, .45);
}

/* Black 黑 */
.framework7-root.color-theme-black {
    --primary: #000000;
    --primary-light: #9e9e9e;
    --primary-dark: #212121;
    --primary-rgb: 0, 0, 0;
    --grad-1: #424242;
    --grad-2: #000000;
    --grad-3: #212121;
    --btn-g1: #424242;
    --btn-g2: #000000;
    --tag-bg: #e0e0e0;
    --tag-border: #bdbdbd;
    --tag-text: #212121;
    --shadow: rgba(0, 0, 0, .35);
    --shadow-btn: rgba(0, 0, 0, .45);
}

/* Violet 紫 */
.framework7-root.color-theme-violet {
    --primary: #b65bb6;
    --primary-light: #e1bee7;
    --primary-dark: #883d88;
    --primary-rgb: 182, 91, 182;
    --grad-1: #ce93d8;
    --grad-2: #b65bb6;
    --grad-3: #883d88;
    --btn-g1: #ce93d8;
    --btn-g2: #b65bb6;
    --tag-bg: #f3e5f5;
    --tag-border: #e1bee7;
    --tag-text: #883d88;
    --shadow: rgba(182, 91, 182, .35);
    --shadow-btn: rgba(182, 91, 182, .45);
}

