diff --git a/f/web-kboss/src/api/newHome.js b/f/web-kboss/src/api/newHome.js
index 0cfbf51..a5070db 100644
--- a/f/web-kboss/src/api/newHome.js
+++ b/f/web-kboss/src/api/newHome.js
@@ -94,3 +94,10 @@ export const reqQuickNav = () => {
     method: 'post',
   })
 }
+// 待办数量
+export const todoCount = () => {
+  return request({
+    url: '/bz_order/todo_info.dspy',
+    method: 'post',
+  })
+}
diff --git a/f/web-kboss/src/router/index.js b/f/web-kboss/src/router/index.js
index cbebb76..4529902 100644
--- a/f/web-kboss/src/router/index.js
+++ b/f/web-kboss/src/router/index.js
@@ -331,7 +331,7 @@ export const asyncRoutes = [
     component: Layout,
     meta: {
       title: "资源概览",
-      fullPath: "/overview", 
+      fullPath: "/overview",
       noCache: true,
       icon: "el-icon-s-data"
     },
diff --git a/f/web-kboss/src/views/customer/orderManagement/index.vue b/f/web-kboss/src/views/customer/orderManagement/index.vue
index 9eb9042..9cbf51d 100644
--- a/f/web-kboss/src/views/customer/orderManagement/index.vue
+++ b/f/web-kboss/src/views/customer/orderManagement/index.vue
@@ -357,6 +357,7 @@ export default {
   methods: {
     // 累计消费 优惠
     async getAllPrice() {
+      const res = await reqDiscount();
       console.log(54321,res);
       if(res.status === true){
         this.price = res.data.total_paid_amount
@@ -519,7 +520,7 @@ export default {
       this.getOrder();
 
       // 清除路由参数
-      this.$router.replace({ path: '/product/overview', query: {} });
+      //this.$router.replace({ path: '/product/overview', query: {} });
     },
 
     // 获取订单数据
diff --git a/f/web-kboss/src/views/customer/unsubscribe/BaiduNetdisk.vue/index.vue b/f/web-kboss/src/views/customer/unsubscribe/BaiduNetdisk.vue/index.vue
index 63849f4..eaf8c31 100644
--- a/f/web-kboss/src/views/customer/unsubscribe/BaiduNetdisk.vue/index.vue
+++ b/f/web-kboss/src/views/customer/unsubscribe/BaiduNetdisk.vue/index.vue
@@ -1,13 +1,42 @@
 <template>
   <div class="box">
+    <!-- 实名认证通知 -->
+    <div v-if="showAuthNotification" class="auth-notification-container">
+      <!-- 展开状态：完整提示窗口 -->
+      <div v-show="isNotificationExpanded" class="notification-card">
+        <div class="notification-header">
+          <div class="notification-title">
+            <i class="notification-icon el-icon-warning"></i>
+            <span>实名认证提示</span>
+          </div>
+          <button class="collapse-btn" @click="toggleNotification" aria-label="收起提示">
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M9 18L15 12L9 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+            </svg>
+          </button>
+        </div>
+        <div class="notification-content">
+          <p>您当前还没有完成实名认证，部分功能可能受限。请先完成<span class="link-text" @click="goToAuth">实名认证</span>，以确保正常使用所有服务。</p>
+        </div>
+      </div>
+
+      <!-- 收起状态：简化按钮 -->
+      <div v-show="!isNotificationExpanded" class="notification-minimized" @click="toggleNotification">
+        <div class="minimized-content">
+          <i class="minimized-icon el-icon-warning"></i>
+          <span>实名认证</span>
+          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M15 18L9 12L15 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+          </svg>
+        </div>
+      </div>
+    </div>
+
     <!-- 添加全屏加载效果 -->
     <div v-loading="loading" class="loading-container">
       <iframe v-if="url" :src="url" frameborder="0" class="baidu-style">
       </iframe>
-      <div v-else class="login-prompt">
-        <p>请先登录百度云账号</p>
-        <button @click="getToken">重试</button>
-      </div>
+
     </div>
   </div>
 </template>
@@ -15,6 +44,7 @@
 <script>
 import { baiducloudAPI } from '@/api/BaiDuTokenapi'
 import { reqBaiduJudgePrice, reqConfirmBtn } from '@/api/baidu'
+import { reqIsReallyPeople } from '@/api/baidu' // 引入实名认证检查API
 
 export default {
   name: 'baiduProductShow',
@@ -24,9 +54,12 @@ export default {
       url: '',
       loading: true,
       userid: '',
+      showAuthNotification: false, // 控制是否显示实名认证通知
+      isNotificationExpanded: true, // 控制通知是展开还是收起状态
     }
   },
   async created() {
+    await this.checkRealNameAuth();
     await this.getToken();
   },
   mounted() {
@@ -36,6 +69,38 @@ export default {
     window.removeEventListener('message', this.receiveMessage, false);
   },
   methods: {
+    // 检查实名认证状态
+    async checkRealNameAuth() {
+      try {
+        this.userid = sessionStorage.getItem('userId');
+        if (!this.userid) {
+          console.warn('未获取到用户ID，无法检查实名认证状态');
+          return;
+        }
+
+        const response = await reqIsReallyPeople({user_id: this.userid});
+        // 假设API返回res.status为true表示已实名认证，false表示未实名认证
+        this.showAuthNotification = !response.status;
+
+        if (!response.status) {
+          console.log('用户未完成实名认证，显示通知');
+        }
+      } catch (error) {
+        console.error('检查实名认证状态失败:', error);
+        // 出错时默认不显示通知，避免干扰用户体验
+      }
+    },
+
+    // 跳转到实名认证页面
+    goToAuth() {
+      window.open('https://console.vcp.baidu.com/qualify/#/qualify/index', '_blank');
+    },
+
+    // 切换通知展开/收起状态
+    toggleNotification() {
+      this.isNotificationExpanded = !this.isNotificationExpanded;
+    },
+
     // 获取百度云token
     async getToken() {
       try {
@@ -120,7 +185,8 @@ export default {
 <style lang="less" scoped>
 .box {
   padding: 10px;
-  height:calc(100vh - 100px);
+  height: calc(100vh - 100px);
+  position: relative;
 }
 
 .loading-container {
@@ -131,12 +197,197 @@ export default {
 
 .login-prompt {
   height: calc(100vh - 100px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
   text-align: center;
-  padding: 50px;
+}
+
+.prompt-content {
+  max-width: 300px;
+  padding: 30px;
+  border-radius: 8px;
+  background: #f8f9fa;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+}
+
+.prompt-icon {
+  font-size: 48px;
+  color: #ffc107;
+  margin-bottom: 16px;
+}
+
+.prompt-content p {
+  font-size: 16px;
+  color: #606266;
+  margin-bottom: 20px;
+}
+
+.retry-btn {
+  background: #1890ff;
+  color: white;
+  border: none;
+  padding: 8px 20px;
+  border-radius: 4px;
+  cursor: pointer;
+  transition: background 0.3s;
+
+  &:hover {
+    background: #40a9ff;
+  }
 }
 
 .baidu-style {
   width: 100%;
   height: calc(100vh - 100px);
 }
+
+/* 实名认证通知容器 */
+.auth-notification-container {
+  position: absolute;
+  top: 20px;
+  right: 20px;
+  z-index: 1000;
+  max-width: 380px;
+}
+
+/* 通知卡片样式 */
+.notification-card {
+  background: #ffffff;
+  border-radius: 12px;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
+  border: 1px solid #e8e8e8;
+  overflow: hidden;
+  animation: slideIn 0.3s ease-out;
+}
+
+@keyframes slideIn {
+  from {
+    opacity: 0;
+    transform: translateX(20px);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+/* 通知头部 */
+.notification-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16px 20px 12px;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.notification-title {
+  display: flex;
+  align-items: center;
+  font-weight: 600;
+  font-size: 16px;
+  color: #333;
+}
+
+.notification-icon {
+  color: #FFBA00;
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.collapse-btn {
+  background: none;
+  border: none;
+  color: #999;
+  cursor: pointer;
+  padding: 4px;
+  border-radius: 4px;
+  transition: all 0.2s;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  &:hover {
+    background-color: #f5f5f5;
+    color: #666;
+  }
+}
+
+/* 通知内容 */
+.notification-content {
+  padding: 16px 20px 20px;
+
+  p {
+    margin: 0;
+    line-height: 1.6;
+    color: #666;
+    font-size: 14px;
+  }
+}
+
+.link-text {
+  color: #1890ff;
+  cursor: pointer;
+  text-decoration: none;
+  margin: 0 4px;
+  font-weight: 500;
+  transition: color 0.2s;
+
+  &:hover {
+    color: #40a9ff;
+    text-decoration: underline;
+  }
+}
+
+/* 收起状态样式 */
+.notification-minimized {
+  background: #ffffff;
+  border-radius: 8px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+  border: 1px solid #e8e8e8;
+  cursor: pointer;
+  transition: all 0.2s;
+
+  &:hover {
+    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
+    transform: translateY(-2px);
+  }
+}
+
+.minimized-content {
+  display: flex;
+  align-items: center;
+  padding: 10px 14px;
+  font-size: 14px;
+  font-weight: 500;
+  color: #333;
+}
+
+.minimized-icon {
+  color: #FFBA00;
+  margin-right: 8px;
+  font-size: 16px;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+  .auth-notification-container {
+    top: 10px;
+    right: 10px;
+    left: 10px;
+    max-width: none;
+  }
+
+  .notification-card {
+    border-radius: 8px;
+  }
+
+  .notification-header {
+    padding: 12px 16px 8px;
+  }
+
+  .notification-content {
+    padding: 12px 16px 16px;
+  }
+}
 </style>
diff --git a/f/web-kboss/src/views/product/mainPage/index.vue b/f/web-kboss/src/views/product/mainPage/index.vue
index b0455a8..7208280 100644
--- a/f/web-kboss/src/views/product/mainPage/index.vue
+++ b/f/web-kboss/src/views/product/mainPage/index.vue
@@ -5,7 +5,6 @@
         <div class="bigTitle">快捷导航</div>
         <ul class="recUl">
           <li v-for="(item,index) in navList" :key="index" @click="goBaidu(item)">
-            <!-- 修改这里：使用img标签替换i标签 -->
             <img :src="getNavIcon(index)" class="nav-icon" alt="icon" />
             {{ item.name }}
           </li>
@@ -71,7 +70,7 @@
       <div class="price card">
         <div class="title">账户余额</div>
         <div class="content">
-          <span class="balance">￥{{ this.mybalance }}</span>
+          <span class="balance">￥{{ mybalance }}</span>
           <el-button size="mini" type="primary" @click="$router.push('/kbossCharge')">
             立即充值
           </el-button>
@@ -105,7 +104,7 @@
 <script>
 import Vue from 'vue'
 import { mapState } from "vuex";
-import { reqNewHomeResource, reqNewHomeResourceWarning, reqQuickNav } from "@/api/newHome";
+import { reqNewHomeResource, reqNewHomeResourceWarning, reqQuickNav, todoCount } from "@/api/newHome";
 import { editReachargelogAPI } from "@/api/finance/customerRechargeManagement";
 import { getUnreadmsgAPI } from "@/api/login";
 import MessageCenter from '@/components/MessageCenter/MessageCenter.vue';
@@ -113,6 +112,7 @@ import icon1 from '@/assets/image/icon1.png';
 import icon2 from '@/assets/image/icon2.png';
 import icon3 from '@/assets/image/icon3.png';
 import icon4 from '@/assets/image/icon4.png';
+
 export default Vue.extend({
   name: "mainPage",
   components: {
@@ -131,9 +131,9 @@ export default Vue.extend({
       navList: [],
       mybalance: 0,
       todoList: [
-        { name: '待支付', count: 7 },
-        { name: '待续费', count: 3 },
-        { name: '处理中', count: 7 },
+        { name: '待支付', count: 0 },
+        { name: '待续费', count: 0 },
+        { name: '处理中', count: 0 },
         { name: '站内信', count: 0 }
       ],
       messageCenterVisible: false,
@@ -144,6 +144,7 @@ export default Vue.extend({
   created() {
     this.initMybalance();
     this.getUnreadMsgCount();
+    this.fetchTodoCount();
   },
   mounted() {
     reqQuickNav().then(res => {
@@ -206,6 +207,32 @@ export default Vue.extend({
         this.$message.error('获取未读消息失败');
       }
     },
+    // 获取待办事项数量
+    async fetchTodoCount() {
+      try {
+        const res = await todoCount();
+        if (res.status && res.data) {
+          // 更新待办事项数量
+          this.todoList = this.todoList.map(item => {
+            switch(item.name) {
+              case '待支付':
+                return { ...item, count: res.data.pending_payment_orders || 0 };
+              case '待续费':
+                return { ...item, count: res.data.pending_renew_orders || 0 };
+              case '处理中':
+                return { ...item, count: res.data.processing_orders || 0 };
+              default:
+                return item;
+            }
+          });
+        } else {
+          this.$message.error(res.msg || '获取待办事项数量失败');
+        }
+      } catch (error) {
+        console.error('获取待办事项数量失败:', error);
+        this.$message.error('获取待办事项数量失败');
+      }
+    },
     handleTodoClick(todoName) {
       if (todoName === '站内信') {
         this.openMessageCenter();
diff --git a/f/web-kboss/src/views/product/productHome/baiduProductShow/index.vue b/f/web-kboss/src/views/product/productHome/baiduProductShow/index.vue
index c075421..2727138 100644
--- a/f/web-kboss/src/views/product/productHome/baiduProductShow/index.vue
+++ b/f/web-kboss/src/views/product/productHome/baiduProductShow/index.vue
@@ -5,25 +5,43 @@
     element-loading-spinner="el-icon-loading"
     element-loading-background="rgba(0, 0, 0, 0.8)">
     <iframe :src="url" v-if="flag"></iframe>
-    <div v-if="isAllShow" style="font-size: 16px">
-      <div class="windowTip" v-show="isShowWindow">
-        <span class="title-word"><i style="color: #FFBA00;margin-right: 5px" class="el-icon-warning"></i>提示</span>
-        <img @click="zheBtn" class="zheStyle" src="./svg/展开向右开.svg" alt="">
-        <span style="margin-top: 12px; text-indent: 2em;  display: inline-block;line-height: 1.5;">
-         您当前还没有进行实名认证，请先进行
-         <span class="linkStyle" @click="goConfigPeople">实名认证</span>
-         ！
-       </span>
+
+    <!-- 实名认证提示弹窗 -->
+    <div v-if="isAllShow" class="auth-notification-container">
+      <!-- 展开状态：完整提示窗口 -->
+      <div v-show="isShowWindow" class="notification-card">
+        <div class="notification-header">
+          <div class="notification-title">
+            <i class="notification-icon el-icon-warning"></i>
+            <span>提示</span>
+          </div>
+          <button class="collapse-btn" @click="zheBtn" aria-label="收起提示">
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M9 18L15 12L9 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+            </svg>
+          </button>
+        </div>
+        <div class="notification-content">
+          <p>您当前还没有进行实名认证，请先进行<span class="link-text" @click="goConfigPeople">实名认证</span>！</p>
+        </div>
       </div>
-      <div v-show="!isShowWindow" class="zhanStyle" @click="zhanBtn">
-        <img style="padding: 0 5px" src="./svg/展开向左开.svg" alt="">
-        <span>实名</span>
+
+      <!-- 收起状态：简化按钮 -->
+      <div v-show="!isShowWindow" class="notification-minimized" @click="zhanBtn">
+        <div class="minimized-content">
+          <i class="minimized-icon el-icon-warning"></i>
+          <span>实名认证</span>
+          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M15 18L9 12L15 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+          </svg>
+        </div>
       </div>
     </div>
   </div>
 </template>
 
 <script>
+// 脚本部分保持不变
 import {reqBaiduToken} from "@/api/baidu/login";
 import {mapState} from "vuex";
 import {reqBaiduJudgePrice, reqBaiduOrderCost, reqIsReallyPeople} from "@/api/baidu";
@@ -47,21 +65,16 @@ export default {
     reqIsReallyPeople({user_id: this.userid}).then(res => {
       this.isShowReallyBtn = !res.status;
       if (!res.status) {
-        // this.open2()
         this.isShowWindow = true
         this.isAllShow = true
-      } 
+      }
     })
 
-
-    // this.openFullScreen2()
-
     let resultUrlLast = 'https://console.vcp.baidu.com/api/loginvcp/login/securitytoken?'
     reqBaiduToken({userid: this.userid}).then(res => {
       if (res.status) {
         this.baiduToken = res.data
         resultUrlLast = resultUrlLast + '&redirectUrl=' + encodeURIComponent(localStorage.getItem('redirectUrl')) + '&signinSecurityToken=' + encodeURIComponent(res.data)
-        // this.$message.success('获取回调成功')
         this.url = resultUrlLast
         console.log('iframeurl', resultUrlLast)
         this.flag = true
@@ -70,12 +83,7 @@ export default {
       }
     })
 
-    // this.url = 'https://my.oschina.net/hongjiang/blog/3224875'
-    // this.flag = true
-    // window.addEventListener('message', this.handleMessage);
     window.addEventListener('message', this.receiveMessage, false);
-
-
   },
   activated() {
 
@@ -93,7 +101,6 @@ export default {
     goToAuthentication() {
       console.log("回调方法执行了")
     },
-    //未实名认证信息 点击实名认证去www.baidu.com
     open1() {
       this.$notify({
         title: '提示',
@@ -110,14 +117,8 @@ export default {
       });
     },
     receiveMessage(event) {
-      //   if (event.origin !== "https://example.com") {
-      //     // 确保消息来自预期的源
-      //     return;
-      //   }
-      // console.log("iframe中的event是", event);
       const data = event.data;
       if (data && data.orderInfo && data.orderInfo.orderId) {
-        // 检查接收到的数据是否包含 orderId 或者 orderIdList
         this.loading = true
 
         const orderId = data.orderInfo.orderId
@@ -129,10 +130,6 @@ export default {
         reqBaiduJudgePrice(ploay).then((res) => {
           console.log("二级接口是", res)
           if (res.status) {
-            // let lastPloay = {
-            //   orderid: res.orderid,
-            //   product_url: this.$route.params.listUrl ? this.$route.params.listUrl : localStorage.getItem('userRescourseUrl')
-            // }
             this.$router.push({
               name: 'userResource',
               params: {
@@ -141,30 +138,13 @@ export default {
               }
             })
             this.$message.success('购买成功')
-            // reqBaiduOrderCost(lastPloay).then(res => {
-            //   if (res.status) {
-            //     this.loading = false
-            //     this.$message.success('购买成功')
-            //     this.$router.push({
-            //       name: 'userResource',
-            //       params: {
-            //         listUrl: this.$route.params.listUrl,
-            //         url: this.$route.params.url
-            //       }
-            //     })
-            //   }
-            //
-            // })
           } else {
             this.loading = false
             this.$message.error(res.msg)
           }
         })
-        // 在这里处理接收到的订单ID
         const orderLog = data
-
       }
-
     },
 
     goConfigPeople() {
@@ -184,65 +164,161 @@ export default {
 .baidu-product-style {
   width: 100%;
   height: 100%;
+  position: relative;
 
   iframe {
     width: 100%;
     height: 100%;
+    border: none;
   }
 }
 
-.c {
-  color: blue;
+/* 实名认证通知容器 */
+.auth-notification-container {
+  position: absolute;
+  top: 20px;
+  right: 20px;
+  z-index: 1000;
+  max-width: 380px;
 }
 
-.windowTip {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-direction: column;
-  position: absolute;
-  top: 5px;
-  right: 10px;
-  display: flex;
-  width: 330px;
-  padding: 14px 26px 14px 13px;
-  border-radius: 8px;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
-  border: 1px solid #e6ebf5;
+/* 通知卡片样式 */
+.notification-card {
+  background: #fff;
+  border-radius: 12px;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
+  border: 1px solid #e8e8e8;
   overflow: hidden;
-  background-color: white;
+  animation: slideIn 0.3s ease-out;
 }
 
-.title-word {
-  width: 100%;
+@keyframes slideIn {
+  from {
+    opacity: 0;
+    transform: translateX(20px);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
 }
 
-.linkStyle {
-  color: blue;
-  cursor: pointer;
-  text-decoration: underline;
-  margin: 0;
-  padding: 0;
-}
-
-.zheStyle {
-  position: absolute;
-  top: 5px;
-  right: 15px;
-  cursor: pointer;
-}
-
-.zhanStyle {
-  position: absolute;
-  top: 10px;
-  right: 25px;
-  cursor: pointer;
+/* 通知头部 */
+.notification-header {
   display: flex;
-  justify-content: center;
+  justify-content: space-between;
   align-items: center;
-  background-color: #dddd;
-  border-radius: 5px;
+  padding: 16px 20px 12px;
+  border-bottom: 1px solid #f0f0f0;
+}
 
+.notification-title {
+  display: flex;
+  align-items: center;
+  font-weight: 600;
+  font-size: 16px;
+  color: #333;
+}
+
+.notification-icon {
+  color: #FFBA00;
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.collapse-btn {
+  background: none;
+  border: none;
+  color: #999;
+  cursor: pointer;
+  padding: 4px;
+  border-radius: 4px;
+  transition: all 0.2s;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  &:hover {
+    background-color: #f5f5f5;
+    color: #666;
+  }
+}
+
+/* 通知内容 */
+.notification-content {
+  padding: 16px 20px 20px;
+
+  p {
+    margin: 0;
+    line-height: 1.6;
+    color: #666;
+    font-size: 14px;
+  }
+}
+
+.link-text {
+  color: #1890ff;
+  cursor: pointer;
+  text-decoration: none;
+  margin: 0 4px;
+  font-weight: 500;
+  transition: color 0.2s;
+
+  &:hover {
+    color: #40a9ff;
+    text-decoration: underline;
+  }
+}
+
+/* 收起状态样式 */
+.notification-minimized {
+  background: #ffffff;
+  border-radius: 8px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+  border: 1px solid #e8e8e8;
+  cursor: pointer;
+  transition: all 0.2s;
+
+  &:hover {
+    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
+    transform: translateY(-2px);
+  }
+}
+
+.minimized-content {
+  display: flex;
+  align-items: center;
+  padding: 10px 14px;
+  font-size: 14px;
+  font-weight: 500;
+  color: #333;
+}
+
+.minimized-icon {
+  color: #FFBA00;
+  margin-right: 8px;
+  font-size: 16px;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+  .auth-notification-container {
+    top: 10px;
+    right: 10px;
+    left: 10px;
+    max-width: none;
+  }
+
+  .notification-card {
+    border-radius: 8px;
+  }
+
+  .notification-header {
+    padding: 12px 16px 8px;
+  }
+
+  .notification-content {
+    padding: 12px 16px 16px;
+  }
 }
 </style>