fix(diet): 修复饮食推荐页面右侧溢出-添加box-sizing和width约束

cfc-frontend/pages/diet/index.vue

@@ -344,9 +344,13 @@ export default {
 .diet-page {
   min-height: 100vh;
   background: linear-gradient(180deg, #FFF7ED 0%, #FFF3E6 30%, #F5F7FA 100%);
+  overflow: hidden;
 }
 .content {
   padding: 24rpx 32rpx;
+  box-sizing: border-box;
+  width: 100%;
+  overflow: hidden;
 }
 
 /* 页面头部 */
@@ -354,6 +358,8 @@ export default {
   display: flex;
   align-items: center;
   padding: 20rpx 0 32rpx;
+  box-sizing: border-box;
+  width: 100%;
 }
 .header-icon-wrap {
   width: 80rpx;
@@ -391,6 +397,8 @@ export default {
   margin-bottom: 24rpx;
   box-shadow: 0 4rpx 20rpx rgba(255, 140, 66, 0.08);
   overflow: hidden;
+  box-sizing: border-box;
+  width: 100%;
 }
 .card-header {
   display: flex;
@@ -455,6 +463,8 @@ export default {
 .action-bar {
   display: flex;
   margin-bottom: 24rpx;
+  box-sizing: border-box;
+  width: 100%;
 }
 .action-btn {
   padding: 14rpx 24rpx;
@@ -565,6 +575,8 @@ export default {
   display: flex;
   flex-wrap: wrap;
   margin-bottom: 24rpx;
+  box-sizing: border-box;
+  width: 100%;
 }
 .nav-item {
   width: 20%;
@@ -611,6 +623,8 @@ export default {
 .trend-row {
   display: flex;
   align-items: center;
+  box-sizing: border-box;
+  width: 100%;
 }
 .trend-item {
   flex: 1;