.notification-page[data-v-00b8d492]{padding:20px}.notification-container[data-v-00b8d492]{max-width:1200px;margin:0 auto}.page-header[data-v-00b8d492]{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.title-area h2[data-v-00b8d492]{margin:0;font-size:24px;font-weight:600}.title-area .subtitle[data-v-00b8d492]{color:#606266;font-size:14px}.filter-card[data-v-00b8d492]{margin-bottom:20px;border-radius:8px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1)}.filter-form[data-v-00b8d492]{display:flex;flex-wrap:wrap}.notification-list-card[data-v-00b8d492]{border-radius:8px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1)}.notification-list[data-v-00b8d492]{min-height:300px}.notification-item[data-v-00b8d492]{display:flex;padding:20px;border-bottom:1px solid #ebeef5;transition:all .3s;position:relative}.notification-item[data-v-00b8d492]:last-child{border-bottom:none}.notification-item[data-v-00b8d492]:hover{background-color:#f5f7fa}.notification-item.unread[data-v-00b8d492]{background-color:rgba(64,158,255,.05)}.notification-item.unread[data-v-00b8d492]:before{content:"";position:absolute;width:4px;height:calc(100% - 40px);background-color:#409eff;top:20px;left:0;border-radius:0 2px 2px 0}.notification-item.important[data-v-00b8d492]:before{background-color:#e6a23c}.notification-item.urgent[data-v-00b8d492]:before{background-color:#f56c6c}.notification-type[data-v-00b8d492]{width:80px;display:flex;flex-direction:column;align-items:center;margin-right:20px}.type-icon[data-v-00b8d492]{font-size:24px;color:#409eff;margin-bottom:8px}.type-text[data-v-00b8d492]{font-size:12px;color:#606266;text-align:center}.importance-tag[data-v-00b8d492]{margin-top:8px;padding:2px 6px;border-radius:4px;font-size:12px;color:#fff;text-align:center}.importance-tag.important[data-v-00b8d492]{background-color:#e6a23c}.importance-tag.urgent[data-v-00b8d492]{background-color:#f56c6c}.notification-main[data-v-00b8d492]{flex:1;overflow:hidden;padding-right:20px}.notification-header[data-v-00b8d492]{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.notification-title[data-v-00b8d492]{margin:0;font-size:16px;font-weight:500}.notification-time[data-v-00b8d492]{font-size:12px;color:#909399}.notification-content[data-v-00b8d492]{color:#606266;line-height:1.5}.notification-actions[data-v-00b8d492]{width:120px;display:flex;flex-direction:column;gap:10px;align-items:flex-end}.pagination-container[data-v-00b8d492]{margin-top:20px;text-align:right}.empty-data[data-v-00b8d492]{padding:60px 0;text-align:center;color:#909399}.empty-icon[data-v-00b8d492]{font-size:60px;margin-bottom:20px}@media (max-width:768px){.notification-page[data-v-00b8d492]{padding:15px}.notification-container[data-v-00b8d492]{max-width:100%}.page-header[data-v-00b8d492]{flex-direction:column;align-items:flex-start;margin-bottom:15px;.title-area[data-v-00b8d492]{margin-bottom:10px;h2[data-v-00b8d492]{font-size:18px}.subtitle[data-v-00b8d492]{font-size:12px}}.action-area[data-v-00b8d492]{width:100%;.el-button[data-v-00b8d492]{width:100%}}}.filter-card[data-v-00b8d492]{margin-bottom:15px;[data-v-00b8d492] .el-card__body{padding:12px}.filter-form[data-v-00b8d492]{.el-form-item[data-v-00b8d492]{width:100%;margin-right:0;.el-select[data-v-00b8d492]{width:100%}.el-button[data-v-00b8d492]{width:100%;margin-left:0;margin-top:5px}}}}.notification-list[data-v-00b8d492]{min-height:200px}.notification-item[data-v-00b8d492]{flex-direction:column;padding:15px;.notification-type[data-v-00b8d492]{width:100%;flex-direction:row;justify-content:flex-start;align-items:center;margin-right:0;margin-bottom:10px;.type-icon[data-v-00b8d492]{margin-right:10px;margin-bottom:0}.type-text[data-v-00b8d492]{flex:1;text-align:left}.importance-tag[data-v-00b8d492]{margin-top:0;margin-left:auto}}.notification-main[data-v-00b8d492]{padding-right:0;margin-bottom:10px;.notification-header[data-v-00b8d492]{flex-direction:column;align-items:flex-start;.notification-title[data-v-00b8d492]{font-size:14px;margin-bottom:5px}.notification-time[data-v-00b8d492]{font-size:11px}}.notification-content[data-v-00b8d492]{font-size:12px}}.notification-actions[data-v-00b8d492]{width:100%;flex-direction:row;align-items:center;.el-button[data-v-00b8d492]{flex:1}}}.pagination-container[data-v-00b8d492]{margin-top:15px;[data-v-00b8d492] .el-pagination{.el-pagination__sizes[data-v-00b8d492]{display:none}.el-pagination__jump[data-v-00b8d492]{display:none}}}.empty-data[data-v-00b8d492]{padding:40px 0;.empty-icon[data-v-00b8d492]{font-size:48px}}}@media (min-width:769px) and (max-width:1024px){.notification-page[data-v-00b8d492]{padding:15px}.notification-type[data-v-00b8d492]{width:60px}.notification-actions[data-v-00b8d492]{width:100px}}