/* VIP页面多主题适配样式 */

/* ==================== 深海安全蓝主题 ==================== */
[data-theme="blue"] {
    /* VIP定价卡片 */
    --vip-card-bg: rgba(255, 255, 255, 0.98);
    --vip-card-border: rgba(30, 58, 138, 0.2);
    --vip-card-text-primary: #0F172A;
    --vip-card-text-secondary: #334155;
    --vip-card-text-accent: #1E3A8A;
    --vip-card-text-muted: #64748B;
    
    /* 特色卡片 */
    --vip-featured-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(30, 58, 138, 0.05) 100%);
    --vip-featured-border: #1E3A8A;
    --vip-featured-shadow: rgba(30, 58, 138, 0.15);
    
    /* 价格显示 */
    --vip-price-gradient: linear-gradient(135deg, #1E3A8A 0%, #0F172A 100%);
    
    /* 按钮样式 */
    --vip-btn-featured-bg: linear-gradient(135deg, #1E3A8A 0%, #0F172A 100%);
    --vip-btn-featured-text: #FFFFFF;
    --vip-btn-featured-hover: linear-gradient(135deg, #1E40AF 0%, #1E293B 100%);
    
    /* 表格样式 */
    --vip-table-header-bg: linear-gradient(135deg, #0F172A 0%, #1E3A8A 100%);
    --vip-table-header-text: #FFFFFF;
    --vip-table-border: rgba(30, 58, 138, 0.2);
    --vip-table-hover: rgba(30, 58, 138, 0.05);
    
    /* FAQ和客服区域 */
    --vip-section-bg: rgba(255, 255, 255, 0.98);
    --vip-section-border: rgba(30, 58, 138, 0.2);
    --vip-section-shadow: rgba(30, 58, 138, 0.08);
    
    /* 模态框 */
    --vip-modal-header-bg: linear-gradient(135deg, #0F172A 0%, #1E3A8A 100%);
    --vip-modal-header-text: #FFFFFF;
    --vip-modal-accent: #1E3A8A;
    --vip-modal-tab-active-bg: #0F172A;
    --vip-modal-tab-active-text: #FFFFFF;
}

/* ==================== 琉璃金辉主题 ==================== */
[data-theme="warm"] {
    /* VIP定价卡片 */
    --vip-card-bg: rgba(254, 252, 243, 0.98);
    --vip-card-border: rgba(139, 69, 19, 0.2);
    --vip-card-text-primary: #451A03;
    --vip-card-text-secondary: #78350F;
    --vip-card-text-accent: #8B4513;
    --vip-card-text-muted: #A16207;
    
    /* 特色卡片 */
    --vip-featured-bg: linear-gradient(135deg, rgba(254, 252, 243, 0.98) 0%, rgba(212, 175, 55, 0.05) 100%);
    --vip-featured-border: #D4AF37;
    --vip-featured-shadow: rgba(212, 175, 55, 0.15);
    
    /* 价格显示 */
    --vip-price-gradient: linear-gradient(135deg, #D4AF37 0%, #8B4513 100%);
    
    /* 按钮样式 */
    --vip-btn-featured-bg: linear-gradient(135deg, #D4AF37 0%, #B8860B 100%);
    --vip-btn-featured-text: #451A03;
    --vip-btn-featured-hover: linear-gradient(135deg, #FFD700 0%, #DAA520 100%);
    
    /* 表格样式 */
    --vip-table-header-bg: linear-gradient(135deg, #451A03 0%, #8B4513 100%);
    --vip-table-header-text: #FFFFFF;
    --vip-table-border: rgba(139, 69, 19, 0.2);
    --vip-table-hover: rgba(212, 175, 55, 0.05);
    
    /* FAQ和客服区域 */
    --vip-section-bg: rgba(254, 252, 243, 0.98);
    --vip-section-border: rgba(139, 69, 19, 0.2);
    --vip-section-shadow: rgba(212, 175, 55, 0.08);
    
    /* 模态框 */
    --vip-modal-header-bg: linear-gradient(135deg, #451A03 0%, #8B4513 100%);
    --vip-modal-header-text: #FFFFFF;
    --vip-modal-accent: #D4AF37;
    --vip-modal-tab-active-bg: #451A03;
    --vip-modal-tab-active-text: #FFD700;
}

/* ==================== 墨玉青华主题 ==================== */
[data-theme="cyan"] {
    /* VIP定价卡片 */
    --vip-card-bg: rgba(240, 253, 250, 0.98);
    --vip-card-border: rgba(12, 74, 110, 0.2);
    --vip-card-text-primary: #0F172A;
    --vip-card-text-secondary: #334155;
    --vip-card-text-accent: #0C4A6E;
    --vip-card-text-muted: #475569;
    
    /* 特色卡片 */
    --vip-featured-bg: linear-gradient(135deg, rgba(240, 253, 250, 0.98) 0%, rgba(56, 178, 172, 0.05) 100%);
    --vip-featured-border: #38B2AC;
    --vip-featured-shadow: rgba(56, 178, 172, 0.15);
    
    /* 价格显示 */
    --vip-price-gradient: linear-gradient(135deg, #38B2AC 0%, #0C4A6E 100%);
    
    /* 按钮样式 */
    --vip-btn-featured-bg: linear-gradient(135deg, #38B2AC 0%, #0891B2 100%);
    --vip-btn-featured-text: #FFFFFF;
    --vip-btn-featured-hover: linear-gradient(135deg, #4DD4AC 0%, #0EA5E9 100%);
    
    /* 表格样式 */
    --vip-table-header-bg: linear-gradient(135deg, #0F172A 0%, #0C4A6E 100%);
    --vip-table-header-text: #FFFFFF;
    --vip-table-border: rgba(12, 74, 110, 0.2);
    --vip-table-hover: rgba(56, 178, 172, 0.05);
    
    /* FAQ和客服区域 */
    --vip-section-bg: rgba(240, 253, 250, 0.98);
    --vip-section-border: rgba(12, 74, 110, 0.2);
    --vip-section-shadow: rgba(56, 178, 172, 0.08);
    
    /* 模态框 */
    --vip-modal-header-bg: linear-gradient(135deg, #0F172A 0%, #0C4A6E 100%);
    --vip-modal-header-text: #FFFFFF;
    --vip-modal-accent: #38B2AC;
    --vip-modal-tab-active-bg: #0F172A;
    --vip-modal-tab-active-text: #38B2AC;
}

/* ==================== 量子离火主题 ==================== */
[data-theme="quantum"] {
    /* VIP定价卡片 */
    --vip-card-bg: hsla(220, 33%, 95%, 0.98);
    --vip-card-border: hsla(0, 75%, 55%, 0.2);
    --vip-card-text-primary: hsl(210, 28%, 8%);
    --vip-card-text-secondary: hsl(210, 28%, 15%);
    --vip-card-text-accent: hsl(0, 75%, 45%);
    --vip-card-text-muted: hsl(210, 28%, 35%);
    
    /* 特色卡片 */
    --vip-featured-bg: linear-gradient(135deg, hsla(220, 33%, 95%, 0.98) 0%, hsla(0, 75%, 55%, 0.05) 100%);
    --vip-featured-border: hsl(0, 75%, 55%);
    --vip-featured-shadow: hsla(0, 75%, 55%, 0.15);
    
    /* 价格显示 */
    --vip-price-gradient: linear-gradient(135deg, hsl(0, 75%, 55%) 0%, hsl(210, 28%, 15%) 100%);
    
    /* 按钮样式 */
    --vip-btn-featured-bg: linear-gradient(135deg, hsl(0, 75%, 55%) 0%, hsl(0, 75%, 45%) 100%);
    --vip-btn-featured-text: #FFFFFF;
    --vip-btn-featured-hover: linear-gradient(135deg, hsl(0, 75%, 60%) 0%, hsl(0, 75%, 50%) 100%);
    
    /* 表格样式 */
    --vip-table-header-bg: linear-gradient(135deg, hsl(210, 28%, 8%) 0%, hsl(0, 75%, 45%) 100%);
    --vip-table-header-text: #FFFFFF;
    --vip-table-border: hsla(0, 75%, 55%, 0.2);
    --vip-table-hover: hsla(0, 75%, 55%, 0.05);
    
    /* FAQ和客服区域 */
    --vip-section-bg: hsla(220, 33%, 95%, 0.98);
    --vip-section-border: hsla(0, 75%, 55%, 0.2);
    --vip-section-shadow: hsla(0, 75%, 55%, 0.08);
    
    /* 模态框 */
    --vip-modal-header-bg: linear-gradient(135deg, hsl(210, 28%, 8%) 0%, hsl(0, 75%, 45%) 100%);
    --vip-modal-header-text: #FFFFFF;
    --vip-modal-accent: hsl(0, 75%, 55%);
    --vip-modal-tab-active-bg: hsl(210, 28%, 8%);
    --vip-modal-tab-active-text: hsl(0, 75%, 55%);
}

/* ==================== 通用主题适配样式 ==================== */

/* VIP定价卡片适配 */
.vip-pricing-card {
    background: var(--vip-card-bg) !important;
    border-color: var(--vip-card-border) !important;
    color: var(--vip-card-text-primary) !important;
}

.vip-pricing-card.featured {
    background: var(--vip-featured-bg) !important;
    border-color: var(--vip-featured-border) !important;
    box-shadow: 0 8px 32px var(--vip-featured-shadow) !important;
}

/* 文字颜色适配 */
.vip-plan-name {
    color: var(--vip-card-text-accent) !important;
}

.vip-plan-description {
    color: var(--vip-card-text-secondary) !important;
}

.vip-plan-price {
    background: var(--vip-price-gradient) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.price-period,
.vip-plan-period {
    color: var(--vip-card-text-muted) !important;
}

.original-price {
    color: var(--vip-card-text-muted) !important;
}

/* 功能列表适配 */
.vip-features-list li {
    color: var(--vip-card-text-primary) !important;
}

.feature-highlight {
    color: var(--vip-card-text-accent) !important;
}

/* 按钮适配 */
.vip-purchase-btn.featured {
    background: var(--vip-btn-featured-bg) !important;
    color: var(--vip-btn-featured-text) !important;
}

.vip-purchase-btn.featured:hover {
    background: var(--vip-btn-featured-hover) !important;
}

/* 表格适配 */
.comparison-table thead {
    background: var(--vip-table-header-bg) !important;
}

.comparison-table th {
    color: var(--vip-table-header-text) !important;
}

.comparison-table td {
    color: var(--vip-card-text-primary) !important;
    border-bottom-color: var(--vip-table-border) !important;
}

.comparison-table tr:hover td {
    background: var(--vip-table-hover) !important;
}

.comparison-table .feature-name {
    color: var(--vip-card-text-accent) !important;
}

.feature-premium {
    color: var(--vip-card-text-accent) !important;
}

/* FAQ和客服区域适配 */
.faq-section,
.customer-service-section,
.comparison-section {
    background: var(--vip-section-bg) !important;
    box-shadow: 0 4px 16px var(--vip-section-shadow) !important;
}

.faq-item {
    border-color: var(--vip-section-border) !important;
}

.faq-question h4 {
    color: var(--vip-card-text-accent) !important;
}

.faq-answer p {
    color: var(--vip-card-text-secondary) !important;
}

/* 客服卡片适配 */
.service-card {
    background: var(--vip-card-bg) !important;
    border-color: var(--vip-section-border) !important;
}

.service-card h5 {
    color: var(--vip-card-text-accent) !important;
}

.service-card p {
    color: var(--vip-card-text-secondary) !important;
}

/* 模态框适配 */
.modal-header {
    background: var(--vip-modal-header-bg) !important;
}

.modal-title {
    color: var(--vip-modal-header-text) !important;
}

.modal-body {
    color: var(--vip-card-text-primary) !important;
}

.form-group label {
    color: var(--vip-card-text-accent) !important;
}

.form-control {
    color: var(--vip-card-text-primary) !important;
}

.form-control:focus {
    border-color: var(--vip-modal-accent) !important;
    box-shadow: 0 0 0 3px var(--vip-section-shadow) !important;
}

.nav-tabs .nav-link.active {
    background: var(--vip-modal-tab-active-bg) !important;
    color: var(--vip-modal-tab-active-text) !important;
}

.payment-notice {
    color: var(--vip-card-text-accent) !important;
}

/* 特殊元素适配 */
.featured-badge {
    background: var(--vip-btn-featured-bg) !important;
    color: var(--vip-btn-featured-text) !important;
}

/* 确保文字对比度 */
.vip-pricing-card *,
.comparison-section *,
.faq-section *,
.customer-service-section *,
.modal-body * {
    text-shadow: none !important;
}

/* 响应式适配 */
@media (max-width: 768px) {
    .vip-pricing-card {
        background: var(--vip-card-bg) !important;
    }
    
    .vip-pricing-card.featured {
        background: var(--vip-featured-bg) !important;
    }
}