/* NanumSquareRound 폰트 패밀리 추가 */
@font-face {
    font-family: 'NanumSquareRoundLight';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRoundL.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'NanumSquareRound';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRound.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'NanumSquareRoundBold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRoundB.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'NanumSquareRoundExtraBold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRoundEB.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

/* 기본 폰트 설정 */
body,
#calendar,
#calendar-mobile,
.fc,
.fc * {
  font-family: 'NanumSquareRound', sans-serif !important;
  color: #111827;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* 캘린더와 게임 영역 + 헤더에 폰트 적용 */
#calendar,
#calendar-mobile,
#calendar *,
#calendar-mobile *,
#birthday-game-container,
#birthday-game-container *,
.calendar-header,
.calendar-header *,
.calendar-header h2,
.calendar-header a {
    font-family: 'NanumSquareRound', sans-serif !important;
}

/* 굵기별 폰트 적용 - 캘린더/게임 영역에만 */
#calendar .font-light,
#calendar-mobile .font-light,
#birthday-game-container .font-light {
    font-family: 'NanumSquareRoundLight', sans-serif !important;
}

#calendar .font-bold, #calendar strong, #calendar b,
#calendar-mobile .font-bold, #calendar-mobile strong, #calendar-mobile b,
#birthday-game-container .font-bold, #birthday-game-container strong, #birthday-game-container b {
    font-family: 'NanumSquareRoundBold', sans-serif !important;
}

#calendar .font-black, #calendar .font-extrabold,
#calendar-mobile .font-black, #calendar-mobile .font-extrabold,
#birthday-game-container .font-black, #birthday-game-container .font-extrabold {
    font-family: 'NanumSquareRoundExtraBold', sans-serif !important;
}

/* 게임과 캘린더 간격 조정 */
.game-container {
  margin-bottom: 4rem !important;
}

/* 캘린더 기본 스타일 */
.fc-toolbar-title {
  font-size: 1.125rem;
  text-align: center !important;
  width: 100% !important;
}

.fc-toolbar {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}

.fc-toolbar-chunk {
  display: flex !important;
  align-items: center !important;
}

.fc-toolbar-chunk:nth-child(2) {
  flex: 1 !important;
  justify-content: center !important;
}

.fc-button {
  background-color: #efefef;
  border: none;
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 0.875rem;
}

.fc-button-primary:not(:disabled).fc-button-active,
.fc-button-primary:not(:disabled):active {
  background-color: #000000;
  color: #ffffff;
}

.fc-today-button {
  pointer-events: auto !important;
  cursor: pointer !important;
}

.fc-day-today {
  background-color: rgba(59, 130, 246, 0.08) !important;
}

.fc-day-today .fc-daygrid-day-number {
  background: rgba(255, 255, 255, 0.9) !important;
  color: #374151 !important;
  font-weight: 600;
}

/* 날짜 셀 스타일 - 찌그러진 느낌 개선 */
.fc-daygrid-day-frame {
  position: relative;
  overflow: visible;
  padding: 0.5rem;
  min-height: 140px !important; /* 기존 120px에서 140px로 증가 */
  background: transparent !important;
}

/* FullCalendar 기본 오버레이 요소들 완전 제거 */
.fc-daygrid-day-frame::before,
.fc-daygrid-day-frame::after,
.fc-daygrid-day::before,
.fc-daygrid-day::after {
  display: none !important;
}

.fc-daygrid-day-top,
.fc-daygrid-day-bottom {
  pointer-events: none !important;
  background: transparent !important;
}

/* FullCalendar 기본 오늘 날짜 요소들 완전 제거 */
.fc-day-today .fc-daygrid-day-number:not(.fc-daygrid-day-number) {
  display: none !important;
}

.fc-day-today .fc-day-other,
.fc-day-today .fc-day-past,
.fc-day-today .fc-day-future,
.fc-day-today .fc-daygrid-day-top .fc-daygrid-day-number {
  display: none !important;
}

/* 모든 기본 날짜 번호 요소 숨기고 우리 것만 표시 */
.fc-daygrid-day .fc-daygrid-day-number:not(.custom-day-number) {
  display: none !important;
}

/* 우리가 만든 날짜 번호만 표시 */
.custom-day-number {
  font-weight: 600;
  font-size: 0.65rem;
  color: #374151 !important;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 0.25rem;
  padding: 0.125rem 0.25rem;
  z-index: 2;
  position: absolute;
  top: 2px;
  left: 2px;
  text-align: center;
  margin: 0;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-width: 16px;
  line-height: 1.1;
}

/* 오늘 날짜 스타일 */
.fc-day-today .fc-daygrid-day-number {
  background: #3b82f6 !important;
  color: white !important;
  font-weight: bold;
}

/* 이벤트 영역 투명화 및 포인터 이벤트 제거 */
.fc-daygrid-day-events,
.fc-daygrid-event-harness,
.fc-daygrid-event-harness-abs,
.fc-daygrid-event-harness-inset,
.fc-highlight,
.fc-daygrid-day.fc-day-selected,
.custom-events-container,
.fc-daygrid-day-top,
.fc-daygrid-day-bg,
.fc-daygrid-day-events {
  background: transparent !important;
  background-color: transparent !important;
  pointer-events: none !important;
}

/* 커스텀 이벤트만 클릭 가능하게 */
.custom-event-item,
.mobile-avatar,
.more-members {
  pointer-events: auto !important;
}

/* 데스크톱 이벤트 영역 - 날짜와 더 가깝게 */
@media (min-width: 769px) {
  .fc-daygrid-day-events {
    margin-top: 1.2rem !important;
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
  }
}

/* 데스크톱 멤버 이벤트 스타일 */
.custom-event-item {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 100%;
  color: #111827;
  font-weight: normal;
  padding: 2px 4px;
  background: rgba(248, 250, 252, 0.8);
  border: 1px solid rgba(226, 232, 240, 0.6);
  font-size: 0.75rem;
  line-height: 1.2;
  border-radius: 0.25rem;
  margin-bottom: 1px;
  cursor: pointer;
  position: relative;
  z-index: 3;
}

.custom-event-item:hover {
  background-color: rgba(59, 130, 246, 0.1) !important;
  transform: translateY(-1px);
  z-index: 10;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.member-avatar {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid rgba(226, 232, 240, 0.6);
  flex-shrink: 0;
}

.member-name {
  font-size: 0.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}

/* 툴팁 스타일 */
.member-tooltip {
  position: fixed;
  background: #1f2937;
  color: white;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.75rem;
  z-index: 9999;
  white-space: nowrap;
  visibility: hidden;
  opacity: 0;
  transition: all 0.2s ease;
  pointer-events: none;
}

.member-tooltip.show {
  visibility: visible;
  opacity: 1;
}

/* 모바일 스타일 */
@media (max-width: 768px) {
  /* 게임과 캘린더 간격 모바일 조정 */
  .game-container {
    margin-bottom: 3rem !important;
  }

  /* 캘린더 셀 높이 모바일 최적화 */
  .fc-daygrid-day-frame {
    min-height: 120px !important;
    padding: 0.2rem !important;
  }

  .fc-toolbar-title {
    font-size: 1rem !important;
  }
  
  .fc-toolbar {
    padding: 0.5rem 0 !important;
  }

  .fc-prevMobile-button,
  .fc-nextMobile-button {
    background-color: transparent !important;
    border: none !important;
    color: #374151 !important;
    font-size: 1.5rem !important;
    font-weight: bold !important;
    padding: 0.25rem 0.5rem !important;
    border-radius: 0.375rem !important;
    min-width: auto !important;
  }

  .fc-prevMobile-button:hover,
  .fc-nextMobile-button:hover {
    background-color: #f3f4f6 !important;
    color: #111827 !important;
  }

  #calendar-mobile {
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }
  
  /* 모바일 날짜 번호 스타일 - z-index 조정 */
  .fc .fc-daygrid-day-number {
    font-size: 0.6rem !important;
    padding: 0.0625rem 0.125rem !important;
    margin: 0 !important;
    position: absolute !important;
    top: 1px !important;
    left: 1px !important;
    z-index: 2 !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 2px !important;
    color: #374151 !important;
    min-width: 14px !important;
    line-height: 1 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  /* 모바일 오늘 날짜 - 셀 배경만 다르게 */
  .fc-day-today {
    background-color: rgba(59, 130, 246, 0.08) !important;
  }
  
  .fc-day-today .fc-daygrid-day-number {
    background: rgba(255, 255, 255, 0.9) !important;
    color: #374151 !important;
    font-weight: 600 !important;
  }
  
  .fc-col-header-cell {
    padding: 0.2rem 0 !important;
  }
  
  .fc-col-header-cell-cushion {
    font-size: 0.75rem !important;
  }
  
  .fc-daygrid-day-events {
    height: 0 !important;
    min-height: 0 !important;
    overflow: visible !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 1px !important;
    margin-top: 16px !important;
  }

  /* 모바일 아바타 스타일 */
  .mobile-avatar {
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    margin: 1px !important;
    display: block !important;
  }
  
  .more-members {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #6b7280;
    color: white;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 0.65rem;
    font-weight: bold;
    margin: 1px;
    cursor: pointer;
    border: 1px solid #e5e7eb;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  }

  .fc-daygrid-day {
    cursor: pointer;
    overflow: visible !important;
  }

  /* 전체 캘린더 오버플로 허용 */
  .fc *,
  .fc,
  .fc-view-harness,
  .fc-view-harness-active,
  .fc-daygrid,
  .fc-daygrid-body,
  .fc-scrollgrid,
  .fc-scrollgrid-section,
  .fc-scrollgrid-section-body,
  .fc-scrollgrid-sync-table,
  .fc-daygrid-day-top,
  .fc-daygrid-day-bg,
  table,
  tbody,
  tr,
  td {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
  }

  /* 모바일 레이아웃 조정 */
  section.max-w-6xl {
    padding: 0.5rem !important;
  }

  h2.text-xl {
    font-size: 1rem !important;
    margin-bottom: 0.75rem !important;
  }

  .md\\:hidden {
    margin-bottom: 0.5rem !important;
  }

  .fc {
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    font-size: 0.8rem !important;
  }

  .fc-header-toolbar {
    margin-bottom: 0.5rem !important;
  }
}

/* 팝업 스타일 */
.member-popup {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  border-radius: 0.5rem;
  padding: 1rem;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  z-index: 10000;
  max-width: 300px;
  width: 90%;
  max-height: 70vh;
  overflow-y: auto;
}

.member-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9999;
}

.member-popup h3 {
  margin: 0 0 1rem 0;
  font-size: 1rem;
  font-weight: bold;
  text-align: center;
}

.member-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.member-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.25rem;
  border-radius: 0.25rem;
  background: #f9fafb;
}

.member-item img {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
}

.popup-close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  background: none;
  border: none;
  font-size: 1.2rem;
  cursor: pointer;
  color: #6b7280;
}