/**
 * H5 会员区主题色（由 body.shop-h5-theme-* 切换，后台配置 h5_theme_color）
 */

.shop-h5 {
    --shop-accent-secondary-rgb: 30, 58, 138;
    --shop-header-tint: #fff5f4;
    --shop-bg-top: #fff8f7;
}

/* 福顺堂品牌蓝（默认） */
.shop-h5.shop-h5-theme-red {
    --shop-brand: #004b8d;
    --shop-brand-dark: #003366;
    --shop-brand-soft: #e8f2fa;
    --shop-brand-rgb: 0, 75, 141;
    --shop-primary-deep: #002a50;
    --shop-danger: #dc2626;
    --shop-danger-soft: #fef2f2;
    --shop-primary-glow: rgba(0, 75, 141, 0.14);
    --shop-shadow-brand: 0 8px 28px rgba(0, 75, 141, 0.22);
    --shop-bg: #f3f6fa;
    --shop-header-tint: #e8f2fa;
    --shop-bg-top: #f5f8fc;
    --shop-accent-secondary-rgb: 0, 58, 102;
}

/* 蜜桃粉 */
.shop-h5.shop-h5-theme-pink {
    --shop-brand: #ec4899;
    --shop-brand-dark: #db2777;
    --shop-brand-soft: #fdf2f8;
    --shop-brand-rgb: 236, 72, 153;
    --shop-primary-deep: #9d174d;
    --shop-danger: #ec4899;
    --shop-danger-soft: #fdf2f8;
    --shop-primary-glow: rgba(236, 72, 153, 0.16);
    --shop-shadow-brand: 0 8px 28px rgba(236, 72, 153, 0.22);
    --shop-bg: #faf5f7;
    --shop-header-tint: #fce7f3;
    --shop-bg-top: #fff5f9;
    --shop-accent-secondary-rgb: 251, 146, 60;
}

/* 天空蓝 */
.shop-h5.shop-h5-theme-blue {
    --shop-brand: #2563eb;
    --shop-brand-dark: #1d4ed8;
    --shop-brand-soft: #eff6ff;
    --shop-brand-rgb: 37, 99, 235;
    --shop-primary-deep: #1e3a8a;
    --shop-danger: #ef4444;
    --shop-danger-soft: #fef2f2;
    --shop-primary-glow: rgba(37, 99, 235, 0.14);
    --shop-shadow-brand: 0 8px 28px rgba(37, 99, 235, 0.22);
    --shop-bg: #f0f5ff;
    --shop-header-tint: #dbeafe;
    --shop-bg-top: #f5f9ff;
    --shop-accent-secondary-rgb: 14, 165, 233;
}

/* 活力黄（金橙） */
.shop-h5.shop-h5-theme-gold {
    --shop-brand: #ea580c;
    --shop-brand-dark: #c2410c;
    --shop-brand-soft: #fff7ed;
    --shop-brand-rgb: 234, 88, 12;
    --shop-primary-deep: #9a3412;
    --shop-danger: #ea580c;
    --shop-danger-soft: #fff7ed;
    --shop-primary-glow: rgba(234, 88, 12, 0.16);
    --shop-shadow-brand: 0 8px 28px rgba(234, 88, 12, 0.22);
    --shop-bg: #fffbeb;
    --shop-header-tint: #fef3c7;
    --shop-bg-top: #fffdf5;
    --shop-accent-secondary-rgb: 245, 158, 11;
}

/* 首页氛围随主题 */
.shop-h5.shop-page-home,
.shop-h5.shop-page-home .shop-h5-body {
    background-color: var(--shop-bg);
    background-image:
        radial-gradient(ellipse 100% 60% at 50% -8%, rgba(var(--shop-brand-rgb), 0.12), transparent 55%),
        radial-gradient(ellipse 50% 35% at 100% 0%, rgba(var(--shop-accent-secondary-rgb), 0.06), transparent 50%),
        linear-gradient(180deg, var(--shop-bg-top) 0%, var(--shop-bg) 120px);
}

.shop-h5:not(.shop-page-home) {
    background-color: var(--shop-bg);
    background-image:
        radial-gradient(ellipse 80% 50% at 50% -15%, rgba(var(--shop-brand-rgb), 0.06), transparent 50%),
        linear-gradient(180deg, var(--shop-bg-top) 0%, var(--shop-bg) 80px);
}

/* 首页顶栏：浅色渐变 + 品牌色点缀（参考电商 App） */
.shop-h5.shop-page-home .shop-home-header {
    background: linear-gradient(180deg, var(--shop-header-tint) 0%, rgba(255, 255, 255, 0.96) 72%) !important;
    border-bottom-color: rgba(var(--shop-brand-rgb), 0.08) !important;
}

.shop-h5 .shop-home-brand-name {
    color: var(--shop-brand);
}

.shop-h5 .shop-tab.is-active {
    color: var(--shop-brand);
}

.shop-h5 .shop-tab.is-active::after {
    background: var(--shop-brand) !important;
}

.shop-h5 .shop-tab-badge {
    background: var(--shop-brand);
}

.shop-h5 .shop-home-section-title::before {
    background: linear-gradient(180deg, var(--shop-brand), rgba(var(--shop-brand-rgb), 0.45));
}

.shop-h5 .shop-home-product-price span,
.shop-h5 .shop-pl-price span {
    color: var(--shop-brand);
}

/* 分类图标渐变随主题微调 */
.shop-h5.shop-h5-theme-pink .shop-home-nav-icon--0 { background: linear-gradient(145deg, #f9a8d4, #ec4899); }
.shop-h5.shop-h5-theme-pink .shop-home-nav-icon--1 { background: linear-gradient(145deg, #fbcfe8, #db2777); }
.shop-h5.shop-h5-theme-blue .shop-home-nav-icon--0 { background: linear-gradient(145deg, #93c5fd, #2563eb); }
.shop-h5.shop-h5-theme-blue .shop-home-nav-icon--1 { background: linear-gradient(145deg, #7dd3fc, #0284c7); }
.shop-h5.shop-h5-theme-gold .shop-home-nav-icon--0 { background: linear-gradient(145deg, #fcd34d, #ea580c); }
.shop-h5.shop-h5-theme-gold .shop-home-nav-icon--1 { background: linear-gradient(145deg, #fdba74, #d97706); }