/* =========================
   Calendar base
   ========================= */
.cal-wrap{
  position: relative;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  overflow: hidden;
}

.cal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.cal-title{
  font-size: 12px;
  color: rgba(255,255,255,.85);
  font-weight: 700;
}

.cal-hint{
  font-size: 12px;
  color: rgba(255,255,255,.52);
}

.cal-grid{
  padding: 10px 10px 12px;
}

.cal-weekdays{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  margin-bottom: 8px;
}
.cal-weekdays div{
  font-size: 11px;
  color: rgba(255,255,255,.55);
  text-align: center;
  font-weight: 600;
}

.cal-month{
  display:flex;
  flex-direction:column;
  gap: 8px;
}

.cal-week{
  position: relative;
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  overflow: hidden;
}

.cal-days{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  padding: 8px;
}

.cal-day{
  height: 34px;
  border-radius: 10px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.06);
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  padding: 4px 6px;
  font-size: 11px;
  color: rgba(255,255,255,.82);
}
.cal-day.is-out{
  opacity: .38;
}
.cal-day.is-today{
  outline: 1px solid rgba(125,211,252,.36);
  box-shadow: 0 0 0 1px rgba(125,211,252,.08) inset;
}

/* bars layer */
.cal-bars{
  position: absolute;
  left: 8px;
  right: 8px;
  top: 30px; /* 让条形进入日期区中间，看起来像钉钉 */
  pointer-events: none;
}

.cal-bar{
  position: absolute;
  height: 18px;
  padding: 0 8px;
  display:flex;
  align-items:center;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size: 11px;
  font-weight: 700;
  color: rgba(10,19,48,.95);
  border: 1px solid rgba(255,255,255,.32);
  box-shadow: 0 8px 18px rgba(59,130,246,.14);
  cursor: pointer;
  pointer-events: auto;
  user-select: none;
}
.cal-bar:hover{
  filter: brightness(1.03);
  transform: translateY(-0.5px);
}
.cal-bar .txt{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  width:100%;
}

/* 端点样式 */
.cal-bar.single{
  border-radius: 9px;
}
.cal-bar.start{
  border-top-left-radius: 9px;
  border-bottom-left-radius: 9px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.cal-bar.mid{
  border-radius: 3px;
}
.cal-bar.end{
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top-right-radius: 9px;
  border-bottom-right-radius: 9px;
}

/* mini */
.cal-mini .cal-head{ padding: 8px 10px; }
.cal-mini .cal-grid{ padding: 8px 8px 10px; }
.cal-mini .cal-weekdays{ gap: 4px; margin-bottom: 6px; }
.cal-mini .cal-weekdays div{ font-size: 10px; }
.cal-mini .cal-days{
  gap: 4px;
  padding: 6px;
}
.cal-mini .cal-day{
  height: 24px;
  border-radius: 8px;
  font-size: 10px;
  padding: 3px 5px;
}
.cal-mini .cal-bars{
  left: 6px;
  right: 6px;
  top: 22px;
}
.cal-mini .cal-bar{
  height: 14px;
  padding: 0 5px;
  font-size: 10px;
  box-shadow: 0 5px 12px rgba(59,130,246,.10);
}
.cal-mini .cal-bar.single{
  border-radius: 7px;
}
.cal-mini .cal-bar.start{
  border-top-left-radius: 7px;
  border-bottom-left-radius: 7px;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
}
.cal-mini .cal-bar.mid{
  border-radius: 2px;
}
.cal-mini .cal-bar.end{
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
  border-top-right-radius: 7px;
  border-bottom-right-radius: 7px;
}

/* 日历弹窗 */
#calendarOverlay{
  position: fixed;
  inset: 0;
  display:none;
  align-items:center;
  justify-content:center;
  background: rgba(0,0,0,.62);
  padding: 16px;
  z-index: 70;
}
#calendarOverlay.show{
  display:flex;
}

.cal-modal{
  width: min(1120px, 96vw);
  max-height: 88vh;
  display:flex;
  flex-direction:column;
  border-radius: 18px;
  overflow:hidden;
}

.cal-modal-body{
  overflow:auto;
  padding: 14px;
}

/* big 模式更宽松 */
.cal-big .cal-day{
  height: 72px;
  font-size: 12px;
}
.cal-big .cal-bars{
  top: 32px;
}
.cal-big .cal-bar{
  height: 20px;
  font-size: 12px;
  padding: 0 9px;
}

/* +N more */
.cal-more{
  position:absolute;
  right: 10px;
  bottom: 6px;
  font-size: 11px;
  color: rgba(255,255,255,.62);
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  padding: 1px 6px;
  pointer-events: none;
}