<template>
  <div class="content-area flex-1 flex flex-col overflow-hidden">
    <!-- 内容头部插槽 -->
    <slot name="header"></slot>
    
    <!-- 主内容区域 -->
    <main class="flex-1 overflow-auto bg-gray-50 dark:bg-gray-900">
      <slot></slot>
    </main>
  </div>
</template>

<script setup>
// 内容区域容器，仅提供布局结构
</script>

<style scoped>
.content-area {
  @apply relative;
}
</style>
    