/* ============================================================
   ZCSHOP 用户中心 · 前台 zcmuban1 卡片视觉语言统一
   ------------------------------------------------------------
   作用：仅做视觉对齐，不改动任何 HTML 结构 / JS / 功能。
   1) 表面令牌（页面底色、圆角、阴影、描边）整体对齐前台卡片；
   2) 把用户中心里零散的紫/靛蓝硬编码色统一为前台品牌蓝 #0071e3；
   3) 主 CTA 按钮采用前台橙红渐变，正向状态用前台绿 #18b985。
   --theme-primary 仍由后台「外观设置 > 用户后台模板 > 配置」控制，
   不强制写死，保证管理功能不被削弱。
   ============================================================ */

:root {
    /* —— 前台 zcmuban1 品牌色板 —— */
    --jbj-blue: #0071e3;
    --jbj-blue-deep: #0057b8;
    --jbj-text: #1d1d1f;
    --jbj-orange: #ff7b34;
    --jbj-button: #ff6540;
    --jbj-button-start: #ff884f;
    --jbj-button-dark: #e64d28;
    --jbj-accent: #18b985;
    --jbj-page: #f2f3f5;
    --jbj-line: rgba(0, 0, 0, .06);
    --jbj-shadow: 0 8px 24px rgba(20, 44, 78, .08);

    /* —— 表面令牌全局对齐前台卡片 —— */
    --bg-main: var(--jbj-page);
    --bg-secondary: #eaecef;
    --card-bg: #ffffff;
    --card-border: var(--jbj-line);
    --text-main: var(--jbj-text);
    --text-sub: #6b7280;
    --border-radius: 16px;
    --border-radius-sm: 12px;
    --shadow-primary: var(--jbj-shadow);
    --shadow-secondary: 0 2px 12px rgba(20, 44, 78, .05);
}

/* ============================================================
   一、品牌色重着色：紫 / 靛蓝硬编码 → 前台蓝
   （用 !important 覆盖后续引入的页面级样式表与内联样式）
   ============================================================ */

/* 徽章 / 内联徽章 */
.center-home-badge,
.center-home-inline-badge {
    background: rgba(0, 113, 227, .08) !important;
    color: var(--jbj-blue) !important;
}

/* 用户信息卡 / 信息条目底色 */
.center-home-user-card,
.center-home-info-item {
    background: rgba(0, 113, 227, .04) !important;
}

/* 头像渐变（原靛蓝 #468ae5→#6366f1） */
.center-home-avatar {
    background: linear-gradient(135deg, #0071e3, #3aa0ff) !important;
    box-shadow: 0 14px 30px rgba(0, 113, 227, .20) !important;
}

/* 等级标签 */
.center-home-level-tag {
    border-color: rgba(0, 113, 227, .24) !important;
    background: rgba(0, 113, 227, .08) !important;
    color: var(--jbj-blue) !important;
}
.center-home-level-tag:hover {
    background: rgba(0, 113, 227, .14) !important;
    color: var(--jbj-blue-deep) !important;
}

/* 分店标签 / 资料链接 hover */
.center-home-station-tag:hover,
.center-home-profile-link:hover {
    color: var(--jbj-blue) !important;
}

/* 分店「已开通」正向态（绿） */
.center-home-station-tag.is-open {
    border-color: rgba(5, 150, 105, .20) !important;
    background: rgba(5, 150, 105, .06) !important;
    color: #059669 !important;
}
.center-home-station-tag.is-open:hover {
    border-color: rgba(5, 150, 105, .30) !important;
    background: rgba(5, 150, 105, .10) !important;
    color: #047857 !important;
}

/* 邀请面板图标 / 复制按钮（原 #6366f1） */
.invite-panel-title i,
.uc-invite-title i {
    color: var(--jbj-blue) !important;
}
.invite-copy-btn,
.uc-invite-copy {
    border-color: var(--jbj-blue) !important;
    color: var(--jbj-blue) !important;
}
.invite-copy-btn:hover,
.uc-invite-copy:active {
    background: var(--jbj-blue) !important;
    color: #fff !important;
}

/* ============================================================
   二、主 CTA 按钮：前台橙红渐变（storefront 签名色）
   ============================================================ */
.center-home-btn.is-primary,
.uorder-btn.is-primary,
.order-btn-group .layui-btn,
.uc-bulletin-btn {
    background: linear-gradient(135deg, var(--jbj-button-start), var(--jbj-button-dark)) !important;
    border-color: transparent !important;
    color: #fff !important;
}
.center-home-btn.is-primary:hover,
.uorder-btn.is-primary:hover,
.order-btn-group .layui-btn:hover {
    background: linear-gradient(135deg, #ff7a52, #d9431f) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(230, 77, 40, .28) !important;
}
/* 继续付款（语义橙，保持与下单流程一致） */
.btn-continue-pay {
    background: linear-gradient(135deg, var(--jbj-button-start), var(--jbj-button-dark)) !important;
    border-color: transparent !important;
    color: #fff !important;
}
.btn-continue-pay:hover {
    background: linear-gradient(135deg, #ff7a52, #d9431f) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(230, 77, 40, .28) !important;
}

/* ============================================================
   三、卡片阴影提亮（仅静态卡，保留订单卡 hover 动效）
   ============================================================ */
.center-home-hero,
.center-home-metric,
.center-home-notice,
.center-home-panel,
.balance-card,
.uorder-hero,
.uorder-tabs-bar,
.uc-card,
.uc-notice,
.uc-invite {
    box-shadow: var(--shadow-primary) !important;
}

/* ============================================================
   四、外壳圆角对齐前台（16px）
   ============================================================ */
.user-layout {
    border-radius: 16px !important;
}
.win-titlebar {
    border-radius: 16px 16px 0 0 !important;
}

/* ============================================================
   五、移动端品牌重着色（原 #667eea / #764ba2 紫渐变）
   ============================================================ */
.uc-badge {
    background: linear-gradient(135deg, var(--jbj-blue), #3aa0ff) !important;
}
.uc-top::before {
    background:
        radial-gradient(560px 220px at 10% 0%, rgba(0, 113, 227, .18), transparent 60%),
        radial-gradient(520px 220px at 90% 10%, rgba(0, 113, 227, .14), transparent 60%) !important;
}
.uc-bulletin-icon {
    background: linear-gradient(135deg, var(--jbj-blue), #3aa0ff) !important;
}
.uc-bulletin-btn {
    background: linear-gradient(135deg, var(--jbj-button-start), var(--jbj-button-dark)) !important;
}
.uc-grid-ico {
    color: var(--jbj-blue) !important;
}
.uc-sub-btn:active {
    background: var(--jbj-blue) !important;
}
.uc-guest-login-link:hover,
.uc-guest-login-link:active {
    color: var(--jbj-blue) !important;
}