@charset "UTF-8";

.renwukanban-view {
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(20px);
  border-left: 4px solid #1890ff;
  box-shadow: -5px 0 25px rgba(0,0,0,0.2);
  color: #333;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* 顶部栏 */
.renwukanban-view .header {
  padding: 12px 20px;
  background: #fff;
  border-bottom: 1px solid #eee;
  flex-shrink: 0;
  z-index: 10;
}
.renwukanban-view .clock { font-size: 32px; font-weight: bold; color: #1890ff; font-family: "Courier New", monospace; }
.renwukanban-view .duty-row { font-size: 13px; color: #666; margin-top: 4px; padding-top: 4px; border-top: 1px solid #f5f5f5; }
.renwukanban-view .duty-val { font-weight: bold; color: #333; margin-right: 12px; }

/* 四象限动态伸缩区 */
.renwukanban-view .matrix-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 8px;
  overflow: hidden;
}

.renwukanban-view .quadrant {
  flex: 1; /* 初始平分高度 */
  background: #fff;
  margin-bottom: 6px;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
  overflow: hidden;
  position: relative;
  border-top: 4px solid #ddd;
  display: flex;
  flex-direction: column;
  /* 关键动画：平滑伸缩 */
  transition: flex 0.5s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.3s;
}

/* 聚焦展开样式 */
.renwukanban-view .quadrant.focused {
  flex: 5; /* 展开时占据绝大部分空间 */
  box-shadow: 0 4px 15px rgba(0,0,0,0.1);
  z-index: 5;
}
/* 未聚焦的象限稍微变淡，突出重点 */
.renwukanban-view .matrix-area.has-focus .quadrant:not(.focused) {
  flex: 0.6; /* 被挤压 */
  opacity: 0.6;
}

.renwukanban-view .q1 { border-color: #ff4d4f; } 
.renwukanban-view .q2 { border-color: #1890ff; }
.renwukanban-view .q3 { border-color: #fa8c16; } 
.renwukanban-view .q4 { border-color: #8c8c8c; }

.renwukanban-view .q-head { 
  padding: 8px 12px; font-weight: bold; font-size: 14px; 
  background: #fafafa; border-bottom: 1px solid #f0f0f0;
  flex-shrink: 0; cursor: pointer;
}
.renwukanban-view .q-total { float: right; color: #1890ff; font-size: 11px; }

/* 任务滚动区 */
.renwukanban-view .flip-window { flex: 1; overflow: hidden; position: relative; }
.renwukanban-view .task-list { position: absolute; width: 100%; top: 0; padding: 6px; box-sizing: border-box; transition: top 0.8s cubic-bezier(0.65, 0, 0.35, 1); }

/* 任务条目 */
.renwukanban-view .task-card {
  height: 64px; margin-bottom: 5px; background: #fcfcfc; border: 1px solid #eee;
  border-radius: 4px; padding: 6px 10px; box-sizing: border-box; position: relative;
  overflow: hidden;
}
.renwukanban-view .task-no { position: absolute; left: 0; top: 0; background: #595959; color: #fff; font-size: 9px; padding: 1px 4px; }
.renwukanban-view .task-title { font-size: 14px; font-weight: bold; color: #262626; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: 12px; margin-bottom: 2px; }

/* 人员三级显示 */
.renwukanban-view .people-row { font-size: 11px; color: #8c8c8c; padding-left: 12px; padding-right: 50px; }
.renwukanban-view .p-owner { color: #1890ff; font-weight: bold; margin: 0 5px; }
.renwukanban-view .p-helpers { margin-left: 5px; padding-left: 5px; border-left: 1px solid #ddd; }

/* 涉密任务 */
.renwukanban-view .is-secret { 
  background-color: #fffbe6;
  background-image: linear-gradient(45deg, #fff 25%, transparent 25%, transparent 50%, #fff 50%, #fff 75%, transparent 75%, transparent);
  background-size: 15px 15px;
}

/* 报警标签 */
.renwukanban-view .time-tag { position: absolute; right: 8px; top: 6px; font-size: 10px; padding: 1px 5px; border-radius: 3px; font-weight: bold; }
.renwukanban-view .tag-red { background: #fff1f0; color: #f5222d; border: 1px solid #ffa39e; animation: flash 1.5s infinite; }
.renwukanban-view .tag-blue { background: #e6f7ff; color: #1890ff; border: 1px solid #91d5ff; }
@keyframes flash { 50% { opacity: 0.4; } }

/* 全局通知 */
.renwukanban-view .footer-marquee {
  height: 40px; background: #001529; color: #fbd38d; 
  line-height: 40px; font-size: 15px; overflow: hidden; 
  position: relative; flex-shrink: 0;
}
.renwukanban-view .marquee-content { position: absolute; white-space: nowrap; font-weight: bold; letter-spacing: 1px; }

/* 任务展开按钮 (Span Style) */
.renwukanban-view .task-expand-span {
  position: absolute;
  right: 10px;
  bottom: 6px;
  font-size: 11px;
  color: #1890ff;
  cursor: pointer;
  padding: 2px 6px;
  background: #f0f5ff;
  border-radius: 4px;
  border: 1px solid #d6e4ff;
  transition: all 0.2s;
  z-index: 2;
}
.renwukanban-view .task-expand-span:hover {
  background: #1890ff;
  color: #fff;
  border-color: #1890ff;
}