/* 模块样式 - 确保模块容器占满父布局 */

/* 模块主容器样式 - 占满父布局 */
.module-full-width {
    width: 100%;
    display: block;
}

/* 针对各个模块的特定样式 */
#learning-module,
#competition-module,
#interaction-module,
#support-module,
#core-module {
    width: 100%;
    display: block;
}

/* 确保模块内容区域占满可用空间 */
#learning-module .section-card,
#competition-module .section-card,
#interaction-module .section-card,
#support-module .section-card,
#core-module .section-card {
    width: 100%;
}

/* 当侧边栏隐藏时，内容区域占满 */
.content-section:only-child,
.main-content:has(#sidebar-container[style*="display: none"]) .content-section {
    flex: 1;
    width: 100%;
}

/* 当侧边栏隐藏时，主内容区域调整 */
.main-content:has(#sidebar-container[style*="display: none"]) {
    gap: 0;
}

/* 兼容性：使用类名方式 */
.main-content.no-sidebar .content-section {
    flex: 1;
    width: 100%;
}

.main-content.no-sidebar {
    gap: 0;
}

/* 轮播图容器样式 - 控制显示/隐藏 */
#hero-carousel-container {
    transition: opacity 0.3s ease, height 0.3s ease;
}

#hero-carousel-container[style*="display: none"] {
    display: none !important;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

/* 响应式：移动端模块占满 */
@media (max-width: 768px) {
    .module-full-width {
        width: 100%;
    }
    
    #learning-module,
    #competition-module,
    #interaction-module,
    #support-module,
    #core-module {
        width: 100%;
    }
}