/* ===== 全局容器 ===== */
.app-container {
  max-width: 100%;
  margin: 0;
  min-height: 100vh;
  background: var(--bg-page);
  display: flex;
}
.app-container--wide {
  max-width: 100%;
  margin: 0;
  min-height: 100vh;
  background: var(--bg-page);
  display: flex;
}

/* PC 端：侧边栏 + 主内容区布局 */
@media (min-width: 769px) {
  .app-container,
  .app-container--wide {
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    min-height: 100vh;
  }
  
  .app-container aside.sidebar {
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    overflow-y: auto;
  }
  
  .app-container main#main-content {
    margin-left: 110px;
    width: calc(100% - 110px);
    min-height: 100vh;
  }
}

/* 移动端：单列布局 */
@media (max-width: 768px) {
  .app-container {
    flex-direction: column;
  }
  
  .app-container aside.sidebar {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    z-index: 1000;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
  }
  
  .app-container.sidebar-open aside.sidebar {
    transform: translateX(0);
  }
  
  .app-container main#main-content {
    margin-left: 0;
    width: 100%;
  }
}

/* ===== 底部固定操作栏 ===== */
.bottom-bar {
  position: fixed; 
  bottom: 0; 
  left: 0; 
  right: 0;
  display: flex; 
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  background: var(--bg-card);
  border-top: 1px solid var(--border-light);
  z-index: 100;
}
@media (min-width: 769px) {
  .bottom-bar { 
    position: absolute; 
    left: 110px; 
    right: 0; 
    width: calc(100% - 110px);
  }
}

/* ===== 内容区域 ===== */
.content-with-bottom {
  padding-bottom: 80px;
}

/* ===== 响应式调整 ===== */
@media (max-width: 480px) {
  .sidebar {
    width: 140px !important;
  }
}