/* 사랑공장 관리자 — 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 { position: relative; 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; }
/* 선택(체크) — 썸네일 링크(<a>)의 형제로 두어 클릭이 유튜브로 새지 않게 한다 */
.sh-pick {
  position: absolute; top: 0; left: 0; z-index: 3; padding: 8px 12px 12px 8px;
  cursor: pointer; line-height: 1;
}
.sh-pick .form-check-input {
  width: 1.35rem; height: 1.35rem; margin: 0; cursor: pointer;
  background-color: rgba(255, 255, 255, .92); border-color: #a1acb8;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .25);
}
.sh-card.picked { outline: 3px solid #ff3e1d; outline-offset: -3px; }
.sh-card.picked .sh-thumb img { opacity: .72; }
/* 삭제됨(숨김) 카드 — 행은 남아 있지만 비활성으로 보이게 */
.sh-card.gone .sh-thumb img { filter: grayscale(1); opacity: .6; }
.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; }


/* 경품 예약 — 개체 단위 체크리스트 (경품 1개 = 예약 1행) */
/* 상품 선택 탭 — 이름 + 진행("17개 중 3 추첨됨") 2줄 버튼 */
.sch-tab { text-align: left; line-height: 1.2; padding-top: .25rem; padding-bottom: .25rem; }
.sch-tab small { display: block; font-size: 10.5px; opacity: .85; font-weight: 400; }

/* 체크리스트 표 — 17행(길렛)은 한 화면에 다 보이고, 47행(방수재킷)부터 스크롤 + 머리글 고정 */
.sch-wrap { max-height: 900px; overflow: auto; }
.sch-wrap thead th { position: sticky; top: 0; z-index: 2; }
/* 지난 프로젝트 목록 (2026-10-24) */
.past-search { max-width: 260px; }
.past-table { min-width: 760px; }            /* 휴대폰 폭에선 .table-responsive 가로 스크롤 — 열이 짓눌려 한 글자씩 꺾이지 않게 */
.past-table th { white-space: nowrap; }
.past-table td { vertical-align: middle; }
.past-table .past-no { width: 3.5rem; }
.past-table .past-act { width: 9rem; }
.sch-table td { vertical-align: middle; }
.sch-table input[type="datetime-local"] { width: 210px; }
/* 남은 시간 — 1초마다 숫자가 바뀌므로 폭이 흔들리지 않게 고정폭 숫자 */
.sch-cd { font-variant-numeric: tabular-nums; white-space: nowrap; }
/* 지급 완료 행 — 입력이 잠겨 있음을 번호 색으로도 알린다 */
.sch-table input[disabled] { background-color: #f5f5f9; }


/* 도슨트 콘텐츠 원고 — 페어링 9종 아코디언 + 페이지 3종 */
/* 진행률 큰 숫자 (원고 몇 종 도착했는지가 이 화면의 핵심) */
.dc-num { font-size: 2.4rem; font-weight: 700; line-height: 1; color: #566a7f; }

/* 접힌 상태로 9종이 한 화면에 들어오게 — 헤더 한 줄만 보인다 */
.dc-item { border: 1px solid #e7e7e8; box-shadow: none; overflow: hidden; }
.dc-item.pending { border-left: 3px solid #ffab00; }   /* 원고 대기 — 눈에 띄게 */
.dc-item.done { border-left: 3px solid #71dd37; }
.dc-item[open] { box-shadow: 0 3px 12px rgba(67, 89, 113, .12); }

.dc-sum {
  list-style: none; display: flex; align-items: center; gap: .5rem;
  padding: .55rem .85rem; cursor: pointer; user-select: none;
}
.dc-sum::-webkit-details-marker { display: none; }   /* 기본 삼각형 제거 (사파리) */
.dc-sum:hover { background: #f4f4ff; }
.dc-item[open] .dc-sum { background: #fcfcfd; border-bottom: 1px solid #f0f0f2; }
.dc-food { font-weight: 600; color: #566a7f; min-width: 108px; }
.dc-prod { color: #697a8d; font-size: .875rem; flex: 1 1 auto; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dc-fill { white-space: nowrap; font-variant-numeric: tabular-nums; }
.dc-caret { color: #a1acb8; transition: transform .15s; }
.dc-item[open] .dc-caret { transform: rotate(180deg); }

.dc-body { padding: .85rem; }
/* 폼 구획 라벨 (제품 정보 / 테이스팅 노트 / MAIN INGREDIENTS …) */
.dc-sep {
  font-size: 12px; font-weight: 600; color: #566a7f; text-transform: uppercase;
  letter-spacing: .3px; margin-top: .5rem; padding-top: .5rem; border-top: 1px dashed #e7e7e8;
}
.dc-sep .text-muted { text-transform: none; letter-spacing: 0; font-size: 11.5px; }
.dc-body textarea { line-height: 1.5; }

/* 페이지 원고 3종 카드 */
.dc-page { box-shadow: none; }
.dc-page.pending { border-left: 3px solid #ffab00 !important; }
.dc-page.done { border-left: 3px solid #71dd37 !important; }

/* 상단 요약의 이동 칩 — 누르면 해당 입력칸으로 */
.dc-chip { cursor: pointer; font-weight: 500; }
.dc-chip:hover { filter: brightness(.96); }