/* TOTAL_SCHEDULE2 - 달력 위젯 스킨 (상단 헤더형) */
.TOTAL_SCHEDULE2 { width: 100%; float: left }

/* ★ 100% 높이 모드 (그리드 형제와 동일 높이) */
.TOTAL_SCHEDULE2.ts_full_height { height: 100% }
.ts_full_height .ts_calendar_wrap { height: 100% }
.ts_full_height .ts_calendar_right { flex: 1 0 0; min-height: 0 }
.ts_full_height .ts_right_schedules { max-height: var(--ts-cal-list-height, none); flex: 1; min-height: 0 }

/* ★ 달력 래퍼: 박스 디자인 (메인 블록 상세 설정 CSS 변수) */
.TOTAL_SCHEDULE2 .ts_calendar_wrap {
  width: 100%; float: left; display: flex; flex-direction: column; gap: 0; overflow: hidden;
  background: var(--ts-box-bg, #fff);
  border-radius: var(--ts-box-radius, 0);
  box-shadow: var(--ts-box-shadow, none);
  padding: var(--ts-box-padding, 0)
}

/* === 달력 영역 (단일 칼럼: 헤더 → 요일 → 날짜) === */
.TOTAL_SCHEDULE2 .ts_calendar_left { width: 100%; min-width: 0; flex-shrink: 0 }
.TOTAL_SCHEDULE2 .ts_calendar_all { display: block; width: 100%; margin-bottom: 15px }

/* === 헤더: 타이틀(좌) + 년.월 네비(우) === */
.TOTAL_SCHEDULE2 .ts_calendar_header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
  padding: 4px 0 14px;
}
.TOTAL_SCHEDULE2 .ts_cal_title {
  font-size: var(--ts2-title-size, clamp(22px, calc(0.78vw + 19.5px), 32px));
  font-weight: var(--ts2-title-weight, 800);
  color: var(--ts2-title-color, #222);
  letter-spacing: var(--ts2-title-spacing, normal);
  line-height: var(--ts2-title-lh, 1.1);
  margin-bottom: var(--ts2-title-mb, 0);
  word-break: keep-all;
}
.TOTAL_SCHEDULE2 .ts_cal_title_empty { min-height: 1px }

/* === 헤더 정렬 모드 === */
/* center: 타이틀 가운데, 년월은 한 칸 아래(중앙) */
.TOTAL_SCHEDULE2.ts2_hdr_center .ts_calendar_header { flex-direction: column; align-items: center; text-align: center }
.TOTAL_SCHEDULE2.ts2_hdr_center .ts_cal_nav { justify-content: center }
/* stack: 타이틀 위(좌측), 년월 아래(좌측) */
.TOTAL_SCHEDULE2.ts2_hdr_stack .ts_calendar_header { flex-direction: column; align-items: flex-start }

/* 년.월 네비: < 2026.01 > */
.TOTAL_SCHEDULE2 .ts_cal_nav { display: flex; align-items: center; gap: clamp(8px, calc(0.39vw + 6.75px), 14px) }
.TOTAL_SCHEDULE2 .ts_cal_ym {
  font-size: var(--ts2-ym-size, clamp(15px, calc(0.16vw + 14.5px), 17px));
  font-weight: 700; color: var(--ts-date-color, #333);
  font-variant-numeric: tabular-nums; min-width: 56px; text-align: center;
}

/* 네비게이션 버튼 (< >) */
.TOTAL_SCHEDULE2 .ts_nav_btn {
  width: 26px; aspect-ratio: 1/1; background: transparent; border: none;
  border-radius: 8px; cursor: pointer; font-size: 11px; color: #555;
  transition: all 0.2s; display: grid; place-items: center; padding: 0;
}
.TOTAL_SCHEDULE2 .ts_nav_btn:hover { background: #f1f1f1; color: #111 }

/* === 요일 헤더 === */
.TOTAL_SCHEDULE2 .ts_weekdays {
  display: grid; grid-template-columns: repeat(7, 1fr);
  padding: 0; margin: 0 0 4px; list-style: none; text-align: center;
}
.TOTAL_SCHEDULE2 .ts_weekdays li {
  font-weight: 800; color: var(--primary, #2196f3); font-size: 13px;
  padding: 8px 0; text-transform: uppercase;
}

/* === 날짜 그리드 — ★ --ts-cal-day: 달력 날짜 크기 === */
.TOTAL_SCHEDULE2 .ts_days {
  display: grid; grid-template-columns: repeat(7, 1fr);
  padding: 0; margin: 0; list-style: none; text-align: center;
}
.TOTAL_SCHEDULE2 .ts_days li {
  padding: 14px 10px; color: var(--ts-title-color, #333);
  font-size: var(--ts-cal-day, 16px); font-weight: 500;
  position: relative; cursor: default; line-height: 1;
}

/* 클릭 가능한 날짜 */
.TOTAL_SCHEDULE2 .ts_day_li { cursor: pointer; transition: color 0.15s }
.TOTAL_SCHEDULE2 .ts_day_li:hover { color: var(--primary, #2196f3) }

/* 오늘 — ★ --ts-cal-circle: 동그라미 크기 */
.TOTAL_SCHEDULE2 .ts_day_li.ts_today { color: #fff; z-index: 1 }
.TOTAL_SCHEDULE2 .ts_day_li.ts_today::before { content: ''; width: var(--ts-cal-circle, 42px); height: var(--ts-cal-circle, 42px); background: #333; border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1 }

/* 선택된 날짜 */
.TOTAL_SCHEDULE2 .ts_day_li.ts_active { color: #fff; z-index: 1 }
.TOTAL_SCHEDULE2 .ts_day_li.ts_active::before { content: ''; width: var(--ts-cal-circle, 42px); height: var(--ts-cal-circle, 42px); background: var(--primary, #2196f3); border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1 }

/* 일정 있는 날짜 (점) */
.TOTAL_SCHEDULE2 .ts_day_li.ts_dayon::after { content: ''; width: 5px; height: 5px; background: var(--primary, #2196f3); border-radius: 50%; position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%); z-index: 2 }

/* 선택/오늘 + 일정 있는 날짜: 점 흰색 */
.TOTAL_SCHEDULE2 .ts_day_li.ts_active.ts_dayon::after,
.TOTAL_SCHEDULE2 .ts_day_li.ts_today.ts_dayon::after { background: #fff }

/* 다른 달 날짜 */
.TOTAL_SCHEDULE2 .ts_other_month { color: #ccc !important; pointer-events: none }

/* === 일정 상세 영역 (달력 아래, 타임라인) === */
.TOTAL_SCHEDULE2 .ts_calendar_right {
  width: 100%; flex-shrink: 0; padding: var(--ts-txt-padding, 18px 0 0);
  border-top: 1px solid #eee; margin-top: 4px; position: relative;
}
.TOTAL_SCHEDULE2 .ts_right_schedules {
  width: 100%; max-height: var(--ts-cal-list-height, 240px);
  overflow-y: auto; overflow-x: hidden;
}

/* 일정 아이템: 데코(동그라미+라인) + 콘텐츠 — ★ 데코↔콘텐츠 간격 */
.TOTAL_SCHEDULE2 .ts_sch_item { display: flex; align-items: stretch; gap: var(--ts2-deco-gap, 14px) }

/* 타임라인 데코: 동그라미(○) + 라인(│) — ★ 크기/색/두께 개별 변수 */
.TOTAL_SCHEDULE2 .ts_sch_deco { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; align-self: stretch; width: var(--ts2-dot-size, 13px); padding-top: var(--ts2-dot-top, 3px) }
.TOTAL_SCHEDULE2 .ts_sch_dot {
  width: var(--ts2-dot-size, 13px); height: var(--ts2-dot-size, 13px);
  border-radius: 50%;
  border: var(--ts2-dot-border-width, 2px) solid var(--ts2-dot-color, var(--primary, #2196f3));
  background: var(--ts2-dot-bg, transparent);
  flex-shrink: 0; box-sizing: border-box;
}
/* 세로 라인: 동그라미 아래 내용 높이만큼 채움 (세로=flex 늘어남, 가로=중앙정렬) */
.TOTAL_SCHEDULE2 .ts_sch_line {
  width: var(--ts2-line-width, 1px);
  flex: 1 1 auto;
  align-self: center;                 /* 동그라미 중앙에 맞춤 (가로) */
  background: var(--ts2-line-color, #e2e2e2);
  margin-top: 6px;
  min-height: 18px;
  /* ★ 동그라미 크기/두께에 맞춰 라인 좌우 위치 미세조정 (예: 1px, -2px) */
  transform: translateX(var(--ts2-line-offset-x, 0));
}

/* 마지막 아이템: 라인 숨김 — 단, 일정이 2개 이상일 때만 (1개뿐이면 라인 유지) */
.TOTAL_SCHEDULE2 .ts_sch_item:last-child:not(:first-child) .ts_sch_line { display: none }

/* 콘텐츠: 메타(날짜·시간) + 제목 + 상세 — ★ 각각 개별 CSS 변수 */
.TOTAL_SCHEDULE2 .ts_sch_content { flex: 1; min-width: 0; padding-bottom: var(--ts2-row-gap, 22px) }

/* 메타 줄 (날짜 + 시간) */
.TOTAL_SCHEDULE2 .ts_sch_meta { display: flex; align-items: baseline; gap: var(--ts2-meta-gap, 8px); flex-wrap: wrap; margin-bottom: var(--ts2-meta-mb, 3px) }
.TOTAL_SCHEDULE2 .ts_sch_date {
  font-size: var(--ts-cal-det-date, var(--ts-date-size, 15px));
  color: var(--ts-sch-date-color, var(--ts-date-color, #222));
  font-weight: var(--ts2-date-weight, 700);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.TOTAL_SCHEDULE2 .ts_sch_time {
  font-size: var(--ts-cal-time, 12px);
  color: var(--ts2-time-color, #b0b0b0);
  font-weight: var(--ts2-time-weight, 500);
  letter-spacing: .02em; white-space: nowrap;
}
/* 시간 라벨 숨김 */
.TOTAL_SCHEDULE2.ts2_hide_time .ts_sch_time { display: none }
/* 날짜 숨김 (메타 줄 통째) */
.TOTAL_SCHEDULE2.ts2_hide_date .ts_sch_meta { display: none }

/* 제목 */
.TOTAL_SCHEDULE2 .ts_sch_title {
  font-size: var(--ts-cal-title, var(--ts-title-size, 14px));
  color: var(--ts-sch-title-color, var(--ts-title-color, #333));
  font-weight: var(--ts2-stitle-weight, 600);
  line-height: var(--ts2-stitle-lh, 1.4);
  margin-bottom: var(--ts2-stitle-mb, 0);
  word-break: keep-all;
}
.TOTAL_SCHEDULE2.ts2_hide_stitle .ts_sch_title { display: none }

/* 상세 내용 — ★ 줄 제한 가능 */
.TOTAL_SCHEDULE2 .ts_sch_detail {
  font-size: var(--ts-cal-content, var(--ts-content-size, 13px));
  color: var(--ts-sch-content-color, var(--ts-content-color, #999));
  line-height: var(--ts2-detail-lh, 1.55);
  margin-top: var(--ts2-detail-mt, 3px);
  word-break: keep-all;
}
/* 상세 줄수 제한 (...) — ts2_detail_clamp 클래스 + --ts2-detail-lines */
.TOTAL_SCHEDULE2.ts2_detail_clamp .ts_sch_detail {
  display: -webkit-box;
  -webkit-line-clamp: var(--ts2-detail-lines, 2);
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.TOTAL_SCHEDULE2.ts2_hide_detail .ts_sch_detail { display: none }

/* 마지막 아이템 하단 패딩 제거 — 단, 일정이 2개 이상일 때만.
   (1개뿐이면 패딩 유지 → 동그라미 아래 라인이 내용 끝까지 내려갈 공간 확보) */
.TOTAL_SCHEDULE2 .ts_sch_item:last-child:not(:first-child) .ts_sch_content { padding-bottom: 0 }

/* 일정 없음 */
.TOTAL_SCHEDULE2 .ts_no_schedule { color: #aaa; font-size: 13px; padding: 5px 0 }

/* === 반응형 === */
@media only all and (max-width: 767px) {
  .TOTAL_SCHEDULE2 .ts_days li { padding: 12px 6px; font-size: 15px }
  .TOTAL_SCHEDULE2 .ts_day_li.ts_today::before,
  .TOTAL_SCHEDULE2 .ts_day_li.ts_active::before { width: 38px; height: 38px }
  .TOTAL_SCHEDULE2 .ts_cal_title { font-size: var(--ts2-title-size, 24px) }
  .TOTAL_SCHEDULE2 .ts_right_schedules { max-height: var(--ts-cal-list-height, 200px) }
  /* 100% 높이 모드 모바일 해제 */
  .TOTAL_SCHEDULE2.ts_full_height { height: auto }
  .ts_full_height .ts_calendar_right { flex: 0 0 auto }
  .ts_full_height .ts_right_schedules { max-height: var(--ts-cal-list-height, 200px) }
}