/**
 * Vietnamese Banner Overlay Fix
 * 越南语 Banner 遮罩层修复
 * 
 * 问题：绿色到橙色的渐变遮罩层不显示
 * 解决方案：使用高优先级选择器强制应用遮罩层样式
 * 
 * 版本：1.0.0
 * 创建时间：2026-02-04
 */

/* ============================================================================
   越南语首页 Hero Banner 遮罩层 - 最高优先级
   ============================================================================ */

/* 方案 1：针对越南语首页的 body class */
body.lang-vi .vietnamese-hero .hero-overlay,
body.lang-vi.vietnamese-home .hero-section .hero-overlay,
body.lang-vi.language-specific-homepage .hero-section .hero-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(135deg, rgba(0, 128, 0, 0.85) 0%, rgba(255, 140, 0, 0.75) 100%) !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

/* 方案 2：针对所有包含 vietnamese-hero 的 section */
.vietnamese-hero .hero-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(135deg, rgba(0, 128, 0, 0.85) 0%, rgba(255, 140, 0, 0.75) 100%) !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

/* 方案 3：针对 hero-section 内的 hero-overlay */
.hero-section.vietnamese-hero .hero-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(135deg, rgba(0, 128, 0, 0.85) 0%, rgba(255, 140, 0, 0.75) 100%) !important;
    z-index: 1 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
}

/* 确保 hero-content 在遮罩层之上 */
body.lang-vi .vietnamese-hero .hero-content,
body.lang-vi .hero-section .hero-content {
    position: relative !important;
    z-index: 2 !important;
}

/* 确保 Hero Section 有正确的定位 */
.vietnamese-hero,
.hero-section.vietnamese-hero {
    position: relative !important;
}

/* ============================================================================
   调试：如果遮罩层元素不存在，添加备用样式
   ============================================================================ */

/* 如果没有 hero-overlay 元素，直接在 hero-section 上添加伪元素遮罩 */
body.lang-vi .vietnamese-hero::before,
body.lang-vi .hero-section.vietnamese-hero::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(135deg, rgba(0, 128, 0, 0.85) 0%, rgba(255, 140, 0, 0.75) 100%) !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

/* 确保内容在伪元素之上 */
body.lang-vi .vietnamese-hero > *,
body.lang-vi .hero-section.vietnamese-hero > * {
    position: relative !important;
    z-index: 2 !important;
}
