/* 사랑공장 관리자 — Sneat(core.css·theme-default.css) 위에 얹는 커스텀 오버레이.
   룩은 전부 Sneat 클래스가 담당한다. 여기는 한글 폰트·대시보드 v2 조각·모달/토스트만. */

/* 한글 본문 = Pretendard 폴백 (Public Sans는 숫자·영문용으로 유지) */
body {
  font-family: "Public Sans", "Pretendard Variable", Pretendard, "Malgun Gothic",
    -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* ── 대시보드 v2 조각 (kiosk-jsp-admin templates/dashboard_v2.md 표준) ── */
.kpi-icon {
  width: 42px; height: 42px; display: flex; align-items: center; justify-content: center;
  border-radius: .5rem; font-size: 1.4rem; flex: 0 0 auto;
}
.kpi-num { font-size: 1.6rem; font-weight: 700; line-height: 1.1; color: #566a7f; }
.card-title-sm { font-size: .95rem; font-weight: 600; margin: 0; }
.summary-item { display: flex; align-items: center; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid #f0f0f2; }
.summary-item:last-child { border-bottom: 0; }

/* 일자표 — 스크롤 + 헤더/합계 고정 */
.day-table { max-height: 220px; overflow: auto; }
.day-table thead th { position: sticky; top: 0; z-index: 1; }
.day-table tfoot td { position: sticky; bottom: 0; }

/* 저장 대기(수정됨) 버튼 상태 */
.btn.btn-dirty { background: #ffab00; border-color: #ffab00; color: #fff; }

/* extra JSON 접기 */
details.json-edit summary { font-size: 12px; color: #a1acb8; cursor: pointer; padding: 4px 0; }
details.json-edit summary:hover { color: #696cff; }
details.json-edit textarea { font-family: ui-monospace, Consolas, monospace; font-size: 12px; min-height: 140px; }

/* 썸네일 */
.adm-thumb { width: 48px; height: 36px; object-fit: cover; border-radius: 4px; background: #eceef1; display: inline-block; }
.adm-thumb-lg { width: 120px; height: 80px; object-fit: cover; border-radius: 6px; background: #eceef1; }

/* 메인 배경 카드 */
.hero-thumb { aspect-ratio: 16 / 9; background: #eceef1; border-radius: .375rem .375rem 0 0; overflow: hidden; }
.hero-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 표 행 드래그 정렬 (사례 노출 순서) */
.drag-handle { cursor: grab; color: #a1acb8; text-align: center; }
.drag-handle:active { cursor: grabbing; }
tr.dragging { opacity: .45; background: #f4f4ff; }

/* 이미지 업로드 드롭존 — 클릭 · 드래그 · Ctrl+V */
.adm-drop {
  border: 2px dashed #d9dee3; border-radius: .5rem; padding: 18px 16px; text-align: center;
  color: #697a8d; cursor: pointer; background: #fff; font-size: 13px;
  transition: border-color .15s, background .15s;
}
.adm-drop:hover, .adm-drop:focus-visible, .adm-drop.drag { border-color: #696cff; background: #f4f4ff; outline: none; }
.adm-drop i { font-size: 26px; color: #a1acb8; display: block; margin-bottom: 4px; transition: color .15s; }
.adm-drop:hover i, .adm-drop.drag i { color: #696cff; }
.adm-drop small { display: block; margin-top: 3px; }

/* 모달 (Bootstrap .modal 과 충돌 방지용 자체 오버레이) */
.adm-modal {
  position: fixed; inset: 0; background: rgba(50, 71, 92, .5); z-index: 1090;
  display: flex; align-items: flex-start; justify-content: center; padding: 40px 16px; overflow-y: auto;
}
.adm-modal-box { width: 600px; max-width: 100%; }

/* 토스트 (Bootstrap .toast 와 충돌 방지) */
.adm-toast {
  position: fixed; bottom: 24px; right: 24px; background: #566a7f; color: #fff;
  padding: 12px 18px; border-radius: 8px; box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
  font-size: 13px; z-index: 1100; opacity: 0; transform: translateY(8px);
  transition: opacity .2s, transform .2s;
}
.adm-toast.show { opacity: 1; transform: none; }
.adm-toast.err { background: #ff3e1d; }

/* 로그인 (login.html) */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 20px; background: #f5f5f9; }
.login-box { width: 400px; max-width: 100%; }


/* 쇼츠 갤러리 — 관리자에서 썸네일 보며 제품 매핑 */
/* 4열 고정 (minmax(0,1fr) — 긴 제목이 칸을 밀어내지 않게). 좁은 화면에서만 단계적으로 줄인다 */
.sh-grid { display: grid; gap: 14px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199px) { .sh-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) { .sh-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sh-card { overflow: hidden; transition: box-shadow .15s, transform .15s; }
.sh-card:hover { box-shadow: 0 6px 18px rgba(67, 89, 113, .18); transform: translateY(-2px); }
.sh-card.mapped { outline: 2px solid #696cff; outline-offset: -2px; }
.sh-thumb { position: relative; display: block; aspect-ratio: 3 / 4; background: #eceef1; overflow: hidden; }
.sh-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sh-noimg { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 4px; color: #a1acb8; font-size: 12px; }
.sh-noimg i { font-size: 26px; }
.sh-badge { position: absolute; left: 6px; bottom: 6px; background: rgba(105, 108, 255, .92); color: #fff;
  font-size: 11px; padding: 2px 8px; border-radius: 10px; max-width: calc(100% - 12px);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sh-title { font-size: 12.5px; line-height: 1.35; height: 2.7em; overflow: hidden; color: #566a7f; }
.sh-tags { font-size: 11px; color: #a1acb8; height: 1.3em; overflow: hidden; white-space: nowrap;
  text-overflow: ellipsis; }