/* KNUH Spine worksheet — 체크리스트 탭. 클래스는 ck- 로 시작한다.
   새로 쓰는 색(회진 보라, 마무리 초록, 수술 빨강 글자)은 여기서만 정의한다.
   다크 모드 값은 app.css 와 같이 [data-theme="dark"] 와 prefers-color-scheme 두 곳에 둔다. */
:root{--ck-round:#5e3fbf;--ck-round-soft:#efebfc;--ck-end:#2f7a1f;--ck-end-soft:#eff6ea;--ck-red:#b3261e}
:root[data-theme="dark"]{--ck-round:#c3b4fb;--ck-round-soft:#2a2442;--ck-end:#8fd38a;--ck-end-soft:#15261a;--ck-red:#ff8a80}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--ck-round:#c3b4fb;--ck-round-soft:#2a2442;--ck-end:#8fd38a;--ck-end-soft:#15261a;--ck-red:#ff8a80}
}

.ck{max-width:880px;margin:0 auto}
.ck-hero{margin-bottom:14px}
.ck-herorow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ck-herorow h1{flex:1;min-width:0;margin:0}
.ck-hero .ms{margin-top:6px;font-size:13.5px}
.ck-legend{margin-top:10px;display:flex;gap:6px 14px;flex-wrap:wrap;font-size:12px;color:var(--sub)}
.ck-legend span{display:inline-flex;align-items:center;gap:5px}
.ck-legend i{width:10px;height:10px;border-radius:3px}
.ck-legend i.k-opd{background:var(--ac)}
.ck-legend i.k-op{background:var(--ck-red)}
.ck-legend i.k-round{background:var(--ck-round)}
.ck-legend i.k-etc{background:var(--sub)}
.ck-tplmeta{margin-top:8px;font-size:11.5px;color:var(--sub)}
.ck-tplmeta:empty{display:none}

/* 요일 고르기 */
.ck-bar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-bottom:14px}
.ck-pill{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:0;padding:8px 2px;
  border-radius:14px;background:var(--card);box-shadow:var(--shadow);transition:background .18s ease}
.ck-pill b{font-size:15px;font-weight:700}
.ck-pill span,.ck-pill i{font-size:11px;color:var(--sub);font-style:normal;font-variant-numeric:tabular-nums}
.ck-pill.today b{color:var(--ac)}
.ck-pill.full i{color:var(--ck-end);font-weight:650}
.ck-pill.on{background:var(--ink);box-shadow:none}
.ck-pill.on b,.ck-pill.on span,.ck-pill.on i{color:var(--bg)}

/* 하루 */
.ck-day,.ck-edit{padding:20px 22px}
.ck-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ck-title{flex:1;min-width:0;display:flex;align-items:center;gap:8px}
.ck-title h2{margin:0;font-size:19px;font-weight:720;letter-spacing:-.02em}
.ck-title h2 span{margin-left:7px;font-size:13px;font-weight:500;color:var(--sub)}
.ck-acts{display:flex;gap:6px}
.ck-sub{margin-top:4px;font-size:12px;color:var(--sub)}
.ck-glab{margin-bottom:4px;font-size:11.5px;font-weight:650;color:var(--sub)}
.ck-none{font-size:13px;color:var(--sub)}

.ck-sched{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0 4px}
.ck-sg{min-width:0;padding:10px 11px;border-radius:12px;background:var(--card2)}
.ck-chip{margin-top:5px;padding:6px 10px;border-radius:9px;font-size:13px;font-weight:650;overflow-wrap:anywhere}
.ck-chip.k-opd{background:var(--ac-soft);color:var(--ac)}
.ck-chip.k-op{background:var(--bad-soft);color:var(--ck-red)}
.ck-chip.k-round{background:var(--ck-round-soft);color:var(--ck-round)}
.ck-chip.k-etc{background:var(--fill);color:var(--ink)}
.ck-note{margin-top:5px;font-size:12px;color:var(--warn);overflow-wrap:anywhere}

.ck-g{margin-top:12px;padding:11px 12px 5px;border-radius:12px}
.ck-g-morning{padding-left:2px;padding-right:2px}
.ck-g-evening{background:var(--card2)}
.ck-g-close{background:var(--ck-end-soft)}
.ck-g > .ck-none{padding-bottom:6px}
.ck-item{display:flex;align-items:flex-start;gap:9px;padding:7px 0;font-size:14.5px;line-height:1.45;cursor:pointer}
.ck-item input{flex:none;width:18px;height:18px;margin:1px 0 0;accent-color:var(--ac);cursor:pointer}
.ck-txt{flex:1;min-width:0;overflow-wrap:anywhere}
.ck-txt b{margin-right:3px;font-weight:700;font-variant-numeric:tabular-nums}
.ck-item.t-red .ck-txt{color:var(--ck-red);font-weight:650}
.ck-item.t-amber .ck-txt{color:var(--warn);font-weight:650}
.ck-g-close .ck-txt{color:var(--ck-end);font-weight:650}
.ck-item.on .ck-txt{color:var(--sub);text-decoration:line-through;text-decoration-color:var(--sub)}
.ck-by{flex:none;max-width:42%;margin-top:2px;font-size:11px;color:var(--sub);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ck-subl{margin:0 0 6px 27px;padding:7px 10px 7px 24px;border-radius:9px;background:var(--card2);
  font-size:12.5px;line-height:1.5;color:var(--sub)}
.ck-g-evening .ck-subl,.ck-g-close .ck-subl{background:var(--card)}

/* 초기화 확인창. 모달 상자는 원래 화면 높이만큼 늘어나서, 짧은 확인창은 내용 높이로 줄인다. */
.modal .box.ck-confirm{align-self:flex-start;max-width:440px}

/* 메모 */
.ck-memo{margin-top:14px}
.ck-memohead{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.ck-memohead b{font-size:14px}
.ck-meta{font-size:11.5px;color:var(--sub)}
.ck-memo textarea{width:100%;min-height:96px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;
  background:var(--card);color:var(--ink);font:inherit;font-size:14px;line-height:1.55;resize:vertical;outline:none}
.ck-memo textarea:focus{border-color:var(--ac);box-shadow:0 0 0 3px var(--ac-soft)}

/* 편집 */
.ck-edit > .ms{margin:6px 0 0;font-size:12.5px;color:var(--sub)}
.ck-eg{margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}
.ck-eg .ck-glab{margin-bottom:8px}
.ck-erow{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:6px;align-items:center;margin-bottom:6px}
.ck-erow.sched{grid-template-columns:minmax(0,1fr) auto}
.ck-erow input,.ck-erow select,.ck-erow textarea{min-width:0;padding:7px 9px;border:1px solid var(--line);border-radius:8px;
  background:var(--card);color:var(--ink);font:inherit;font-size:13.5px;outline:none}
.ck-erow input:focus,.ck-erow select:focus,.ck-erow textarea:focus{border-color:var(--ac);box-shadow:0 0 0 3px var(--ac-soft)}
.ck-ectl{display:flex;gap:4px;align-items:center}
.ck-mini{padding:5px 9px;font-size:12px;white-space:nowrap}
.ck-mini[disabled]{opacity:.35;cursor:default}
.ck-subbtn{min-width:56px}   /* "세부 4" 처럼 숫자가 붙어도 줄마다 입력칸 폭이 같게 */
.ck-esub{grid-column:1/-1;width:100%;line-height:1.5;resize:vertical}
.ck-add{margin-top:2px;font-size:12.5px}
.ck-apply{margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}
.ck-apply .ms{margin:0;font-size:12.5px;color:var(--sub)}
.ck-applydays{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}
.ck-dchk{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:99px;background:var(--fill);
  font-size:13px;cursor:pointer}
.ck-dchk input{margin:0;accent-color:var(--ac)}
.ck-efoot{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:18px}

@media (max-width:640px){
  .ck-day,.ck-edit{padding:15px 14px}
  .ck-bar{gap:4px}
  .ck-pill{padding:7px 0;border-radius:12px}
  .ck-pill b{font-size:14px}
  .ck-sched{gap:8px}
  .ck-erow{grid-template-columns:58px minmax(0,1fr)}
  .ck-erow.sched{grid-template-columns:minmax(0,1fr)}
  .ck-ectl{grid-column:1/-1;flex-wrap:wrap;justify-content:flex-end}
}
@media (hover:none){
  .ck-mini{min-height:30px}
  .ck-item{padding:9px 0}
}
