/* 버전 2 — 4b단계: 캘린더(#view-calendar) 신규 LMS 모양. /v2/ 에서만, #view-calendar 범위 한정.
   일정 칩의 과정별 색·긴급/주의 테두리·휴일 빨강·완료 취소선은 의미 색이라 그대로 둔다.
   설계: docs/superpowers/specs/2026-10-13-lms-ux-reskin-design.md */
html[data-ui="v2"] #view-calendar .cal-title { font-size: 20px; font-weight: 700; color: var(--ds-foreground); }
html[data-ui="v2"] #view-calendar .cal-header { gap: 8px; }
/* 날짜가 항상 가운데: 왼쪽(오늘) · 가운데(◀ 날짜 ▶) · 오른쪽(표시 색상·이벤트 타입) 3칸. 기능 버튼이 늘어도 밀리지 않는다. */
html[data-ui="v2"] #view-calendar .cal-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
}
html[data-ui="v2"] #view-calendar .v2-cal-left { display: flex; align-items: center; justify-self: start; }
html[data-ui="v2"] #view-calendar .v2-cal-nav { display: flex; align-items: center; justify-content: center; gap: 12px; }
html[data-ui="v2"] #view-calendar .v2-cal-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; justify-self: end; }
/* 좁은 화면: 날짜 줄을 위에 두고 버튼은 아래로 */
@media (max-width: 900px) {
  html[data-ui="v2"] #view-calendar .cal-header { grid-template-columns: 1fr; justify-items: center; row-gap: 8px; }
  html[data-ui="v2"] #view-calendar .v2-cal-nav { order: 1; }
  html[data-ui="v2"] #view-calendar .v2-cal-left { order: 2; justify-self: center; }
  html[data-ui="v2"] #view-calendar .v2-cal-actions { order: 3; justify-content: center; justify-self: center; }
}
html[data-ui="v2"] #view-calendar .cal-weekdays { color: var(--ds-muted-foreground); font-weight: 600; }
html[data-ui="v2"] #view-calendar .cal-grid { gap: 8px; }
html[data-ui="v2"] #view-calendar .cal-cell {
  border-color: var(--ds-border);
  border-radius: var(--ds-radius-lg);
  background: var(--ds-card);
}
html[data-ui="v2"] #view-calendar .cal-cell-out { background: var(--ds-background); color: var(--ds-muted-foreground); }
html[data-ui="v2"] #view-calendar .cal-cell-out .cal-date { color: var(--ds-muted-foreground); opacity: 0.7; }
html[data-ui="v2"] #view-calendar .cal-date { color: var(--ds-muted-foreground); font-weight: 600; }
/* 오늘: 로즈 테두리 + 옅은 바탕 */
html[data-ui="v2"] #view-calendar .cal-cell-today {
  border-color: var(--ds-primary);
  background: var(--ds-primary-soft);
}
html[data-ui="v2"] #view-calendar .cal-cell-today .cal-date { color: var(--ds-primary-active); font-weight: 700; }
html[data-ui="v2"] #view-calendar .cal-event { border-radius: var(--ds-radius-md); }
html[data-ui="v2"] #view-calendar .cal-more { color: var(--ds-muted-foreground); }
html[data-ui="v2"] #view-calendar .cal-more-popup {
  border-color: var(--ds-border);
  border-radius: var(--ds-radius-xl);
  background: var(--ds-card);
  color: var(--ds-card-foreground);
  box-shadow: var(--ds-shadow-card-hover);
}
html[data-ui="v2"] #view-calendar .cal-more-popup-row { border-bottom-color: var(--ds-border); }
html[data-ui="v2"] #view-calendar .cal-color-legend {
  border-color: var(--ds-border);
  border-radius: var(--ds-radius-xl);
  background: var(--ds-card);
  color: var(--ds-card-foreground);
  box-shadow: var(--ds-shadow-card-hover);
}