/* ============================================================
   스케줄러 — 이미지 달력 (2026-10-02 주인님)
   ------------------------------------------------------------
   data.js SCHEDULE_IMAGES 에 있는 달만 쓰입니다 (app.js renderMonthImage).
   ★ 원본 이미지를 가리거나 자르지 않습니다.
     · 이미지는 원본 비율 그대로 (aspect-ratio + width:100%)
     · 날짜 칸 층은 투명. 오늘 테두리는 칸 '바깥쪽'(칸 사이 틈)으로 그립니다.
   ★ schedule.css 와 따로 둔 파일입니다 — 기존 달력 스타일과 섞이지 않게.
   ============================================================ */

/* 이미지 달인 동안만 숨김 — 다른 달로 넘기면 클래스가 빠져 그대로 보입니다 */
.bc-view.img-mode #bc-dow,
.bc-view.img-mode #bc-filters,
.bc-view.img-mode #bc-mlegend,
.bc-view.img-mode #bc-mnotes{ display:none !important; }
.bc-view.img-mode #bc-cal{ display:block !important; }

.bc-imgcal{ width:100%; }

.bc-imgbox{
  position:relative; width:100%; height:auto;
  overflow:visible;                         /* 가장자리 칸의 테두리가 잘리지 않게 */
}
.bc-imgbox img{
  display:block; width:100%; height:100%;
  border-radius:14px; cursor:zoom-in;
  -webkit-user-select:none; user-select:none;
}

/* 투명 날짜 층 — 층 자체는 눌리지 않고(그 아래 이미지 = 크게 보기), 날짜 칸만 눌립니다 */
.bc-imgov{ position:absolute; inset:0; pointer-events:none; }
.bc-imgday{
  position:absolute; box-sizing:border-box; margin:0; padding:0;
  background:transparent; border:0; border-radius:8px;
  cursor:pointer; pointer-events:auto;
  -webkit-tap-highlight-color:transparent;
}
@media (hover:hover){
  .bc-imgday:hover{ outline:2px dashed rgba(226,51,107,.55); outline-offset:1px; }
}
.bc-imgday:focus-visible{ outline:3px solid #5a62c9; outline-offset:1px; }

/* 오늘 — 칸 안쪽은 투명, 선은 칸 바깥쪽으로 */
.bc-imgtoday{
  position:absolute; box-sizing:border-box; pointer-events:none;
  border-radius:9px;
  outline:3px solid #ff2e7e; outline-offset:1px;
  box-shadow:0 0 0 7px rgba(255,46,126,.20);
  animation:bcTodayPulse 2.4s ease-in-out infinite;
}
@keyframes bcTodayPulse{
  0%,100%{ box-shadow:0 0 0 6px rgba(255,46,126,.12); }
  50%    { box-shadow:0 0 0 10px rgba(255,46,126,.28); }
}
@media (prefers-reduced-motion:reduce){ .bc-imgtoday{ animation:none; } }

/* ?grid=1 검증용 — 31칸 번호 */
.bc-imgday.grid{ outline:1.5px dashed #2f5bff; outline-offset:-1px; }
.bc-imgday.grid i{
  position:absolute; right:3px; top:3px; padding:0 4px; border-radius:4px;
  background:#2f5bff; color:#fff; font:700 11px/16px sans-serif; font-style:normal;
}

/* 이미지 아래 안내 + 크게 보기 단추 (이미지 위에 겹치지 않게 아래에 둠) */
.bc-imgfoot{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:8px 14px; margin-top:12px; font-size:13px; color:#8d858a;
}
.bc-imgzoom{
  padding:7px 16px; border-radius:999px; border:1.5px solid #f6b3cb;
  background:#fff; color:#e2336b; font-size:13.5px; font-weight:700; cursor:pointer;
}
.bc-imgzoom:hover{ background:#fff3f7; }

/* 크게 보기 — 화면 전체. 공홈 PC 축소 배율(body zoom)을 되돌려 실제 크기로 */
html.bc-iv-lock{ overflow:hidden; }
.bc-imgview{
  position:fixed; inset:0; z-index:9999; display:none; flex-direction:column;
  background:rgba(25,18,22,.92);
  zoom:calc(1 / var(--fit, 1));
}
.bc-imgview.show{ display:flex; }
.bc-iv-bar{
  flex:0 0 auto; display:flex; align-items:center; justify-content:center; gap:10px;
  padding:10px 12px; color:#fff;
}
.bc-iv-bar b{ min-width:52px; text-align:center; font-size:14px; }
.bc-iv-bar button{
  min-width:40px; height:36px; padding:0 12px; border-radius:10px; border:0;
  background:rgba(255,255,255,.16); color:#fff; font-size:16px; font-weight:700; cursor:pointer;
}
.bc-iv-bar .bc-iv-x{ margin-left:8px; background:#ff2e7e; font-size:14px; }
.bc-iv-scroll{
  flex:1 1 auto; overflow:auto; -webkit-overflow-scrolling:touch;
  padding:14px; box-sizing:border-box;
}
.bc-iv-inner{ margin:0 auto; max-width:none; }
.bc-iv-inner .bc-imgbox img{ cursor:default; }

/* 폰 */
@media (max-width:768px){
  .bc-imgbox img{ border-radius:8px; }
  .bc-imgday{ border-radius:4px; }
  .bc-imgtoday{ border-radius:5px; outline-width:2px; outline-offset:0;
                box-shadow:0 0 0 4px rgba(255,46,126,.22); }
  @keyframes bcTodayPulse{
    0%,100%{ box-shadow:0 0 0 3px rgba(255,46,126,.14); }
    50%    { box-shadow:0 0 0 6px rgba(255,46,126,.30); }
  }
  .bc-imgday.grid i{ font-size:8px; line-height:11px; padding:0 2px; right:1px; top:1px; }
  .bc-imgfoot{ font-size:12px; margin-top:10px; }
  .bc-iv-scroll{ padding:8px; }
}