.template {
  height: 100%;
}
.main-card {
  height: 100%;
}
.config-box {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.content {
  flex: 1;
}
.goods-item-name {
  cursor: pointer;
  padding: 6px 12px;
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
  border-radius: 3px;
  margin-bottom: 30px;
  display: inline-block;
}
.goods-change-box {
  max-width: 100%;
}
.goods-change-box .goods-item-box {
  max-height: 500px;
  overflow-y: auto;
  padding: 0.2rem;
}
.goods-change-box .goods-item-box .goods-group-item {
  margin-bottom: 0.3rem;
}
.goods-change-box .goods-item-box .goods-group-item .goods-group-name {
  font-weight: 700;
  font-size: 0.18rem;
  margin-bottom: 0.15rem;
}
.goods-change-box .goods-item-box .goods-group-item .goods-group-info {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: 15px;
  row-gap: 0.1rem;
}
.goods-change-box .goods-item-box .goods-group-item .goods-group-info .option-name {
  cursor: pointer;
  font-size: 0.14rem;
}
.goods-change-box .goods-item-box .goods-group-item .goods-group-info .option-name:hover {
  color: var(--color-primary);
}

/* ==================== 移动端底部留白修复 ==================== */
@media screen and (max-width: 750px) {
  /* 主内容区域底部适度留白 */
  .el-main {
    padding-bottom: 1rem !important;
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
  }
  
  /* 魔方云模块底部适度留白 */
  .mf-cloud {
    padding-bottom: 1.5rem !important;
    min-height: auto !important;
    max-height: none !important;
  }
  
  /* 配置容器适度留白 */
  .buy-box,
  .fast-box,
  .custom-box {
    padding-bottom: 1rem !important;
  }
  
  /* 标签内容区域适度留白 */
  .el-tabs__content {
    padding-bottom: 1rem !important;
  }
  
  /* 表单最后一项适度间距 */
  .el-form-item:last-child {
    margin-bottom: 1.5rem !important;
  }
  
  /* body底部留白 */
  body {
    padding-bottom: 140px !important;
  }
  
  /* 底部固定栏优化 - 圆角悬浮效果 */
  .f-order {
    height: auto !important;
    max-height: none !important;
    background: transparent !important;
  }
  
  .f-order .el-main {
    padding: 12px 16px !important;
    margin: 0 12px 12px 12px !important;
    background: #fff !important;
    border-radius: 12px !important;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.08), 0 4px 12px rgba(0,0,0,0.05) !important;
  }
}