/* 영업관리 전용 스타일. 공통 틀(상단 바·카드·버튼·표)은 ERP와 같은 app.css를 쓴다 */
:root {
  --st-prep: #8a94a6;
  --st-contact: #3b82c4;
  --st-consult: #6a5acd;
  --st-quote: #c98a12;
  --st-order: #2f9e6b;
  --st-paid: #1d6b45;
  --st-lost: #a0a8b4;
}

/* 2단 화면: 왼쪽 본문, 오른쪽 정보 */
.page-cols { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 16px; align-items: start; }
.page-cols > .col > .card:last-child { margin-bottom: 0; }
@media (max-width: 1000px) { .page-cols { grid-template-columns: 1fr; } }

.small { font-size: 12px; }
.big { font-size: 16px; }
.pre-line { white-space: pre-line; }
ul.plain { margin: 6px 0 0; padding-left: 18px; }
.badge.b-overseas { background: #eaf0ff; color: #2a56b3; }
.badge.b-ok { background: #e3f6ec; color: #1d6b45; }

/* 단계 색 */
.stage-tag { display: inline-block; padding: 2px 8px; border-radius: 6px; font-size: 11px; font-weight: 700; color: #fff; white-space: nowrap; background: var(--st-prep); }
.s-prep .stage-tag, .stage-tag.s-prep { background: var(--st-prep); }
.stage-tag.s-contact { background: var(--st-contact); }
.stage-tag.s-consult { background: var(--st-consult); }
.stage-tag.s-quote { background: var(--st-quote); }
.stage-tag.s-order { background: var(--st-order); }
.stage-tag.s-paid { background: var(--st-paid); }
.stage-tag.s-lost { background: var(--st-lost); }

.intent { display: inline-block; padding: 1px 7px; border-radius: 999px; font-size: 11px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; }
.intent.i-possible { border-color: #cfd8e8; color: #4a5568; }
.intent.i-interested { border-color: #b9cdf3; color: #2a56b3; background: #f2f6fe; }
.intent.i-buying { border-color: #9fd8b8; color: #1d6b45; background: #effaf3; font-weight: 700; }
.ball { display: inline-block; font-size: 11px; color: var(--muted); white-space: nowrap; }
.ball.b-us::before { content: '● '; color: var(--primary); }
.ball.b-them::before { content: '○ '; color: var(--muted); }

/* 보기 전환 */
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #fff; }
.seg a { padding: 6px 14px; color: var(--muted); font-size: 13px; }
.seg a + a { border-left: 1px solid var(--line); }
.seg a.on { background: var(--primary); color: #fff; }
.seg a:hover { text-decoration: none; }

/* ---------- 파이프라인 보드 ---------- */
.board { display: grid; grid-template-columns: repeat(7, minmax(172px, 1fr)); gap: 10px; overflow-x: auto; padding-bottom: 12px; align-items: start; }
.bcol { background: #eef1f6; border-radius: 10px; padding: 8px; min-height: 200px; border-top: 3px solid var(--st-prep); transition: background .1s; }
.bcol.s-contact { border-top-color: var(--st-contact); } .bcol.s-consult { border-top-color: var(--st-consult); }
.bcol.s-quote { border-top-color: var(--st-quote); } .bcol.s-order { border-top-color: var(--st-order); }
.bcol.s-paid { border-top-color: var(--st-paid); } .bcol.s-lost { border-top-color: var(--st-lost); background: #f3f4f6; }
.bcol.over { background: #dfe8fa; }
.bcol > header { padding: 4px 4px 8px; }
.bcol > header .cnt { display: inline-block; min-width: 20px; padding: 0 6px; border-radius: 999px; background: #fff; font-size: 11px; text-align: center; color: #4a5568; }
.bcards { display: flex; flex-direction: column; gap: 8px; min-height: 120px; }
.bcard { display: block; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 9px 10px; color: var(--text); cursor: grab; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.bcard:hover { text-decoration: none; border-color: var(--primary); }
.bcard.dragging { opacity: .45; }
.bcard.late { border-left: 3px solid var(--danger); }
.bc-org { font-size: 12px; color: var(--muted); }
.bc-title { font-weight: 700; font-size: 13px; margin: 1px 0 4px; word-break: keep-all; }
.bc-meta { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; font-size: 12px; }
.bc-next { margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--line); font-size: 12px; color: #2a56b3; }
.bc-next.none { color: var(--warn); }
.bcard.late .bc-next { color: var(--danger); font-weight: 600; }
.bc-owner { margin-top: 4px; }

/* 상세 화면 단계 표시줄 */
.stagebar { display: flex; margin: 0 0 16px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); background: #fff; }
.stagebar .sb { flex: 1; border: 0; background: #fff; padding: 10px 6px; font: inherit; font-size: 13px; color: var(--muted); cursor: pointer; position: relative; }
.stagebar .sb + .sb { border-left: 1px solid var(--line); }
.stagebar .sb:hover { background: #f4f7fc; color: var(--text); }
.stagebar .sb.past { background: #f4f9f6; color: #1d6b45; }
.stagebar .sb.cur { background: var(--primary); color: #fff; font-weight: 700; }
.stagebar .sb.cur.s-lost { background: var(--st-lost); }
.stagebar .sb.cur.s-order, .stagebar .sb.cur.s-paid { background: var(--ok); }
@media (max-width: 760px) { .stagebar { flex-wrap: wrap; } .stagebar .sb { flex: 1 0 30%; } }

/* 다음 행동 카드 */
.next-card { border-left: 4px solid var(--primary); }
.next-card.missing { border-left-color: var(--warn); background: #fffcf3; }
.next-card.late { border-left-color: var(--danger); background: #fff8f8; }
.next-card .big { margin: 0 0 4px; }
fieldset.next-box { border: 1px solid #cfdcf5; border-radius: 8px; padding: 10px 14px 14px; background: #f7faff; margin: 0; }
fieldset.next-box legend { font-weight: 700; font-size: 13px; color: var(--primary); padding: 0 4px; }

/* 활동 기록 폼 */
.act-kinds { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.kind-pill input { position: absolute; opacity: 0; pointer-events: none; }
.kind-pill span { display: inline-block; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--line); background: #fff; font-size: 13px; cursor: pointer; }
.kind-pill input:checked + span { background: var(--primary); border-color: var(--primary); color: #fff; }
.kind-pill input:focus-visible + span { outline: 2px solid var(--primary); outline-offset: 2px; }
details.next-step { margin-top: 10px; }
details.next-step > summary { cursor: pointer; color: var(--primary); font-size: 13px; margin-bottom: 8px; }

/* 활동 타임라인 */
ul.timeline { list-style: none; margin: 0; padding: 0; }
ul.timeline > li { padding: 9px 0 9px 14px; border-left: 2px solid var(--line); margin-left: 4px; position: relative; }
ul.timeline > li::before { content: ''; position: absolute; left: -5px; top: 15px; width: 8px; height: 8px; border-radius: 50%; background: #c5cdd9; }
ul.timeline > li.tl-day { border-left-color: transparent; padding: 14px 0 4px; font-weight: 700; color: #4a5568; font-size: 12px; margin-left: 0; }
ul.timeline > li.tl-day::before { display: none; }
.tl-body { white-space: pre-line; font-size: 13px; color: #3a4452; margin-top: 3px; }
.kind-tag { display: inline-block; font-size: 11px; padding: 1px 6px; border-radius: 4px; background: #eef1f6; color: #4a5568; margin-right: 2px; }
.kind-tag.k-call { background: #e3ecfb; color: #2a56b3; }
.kind-tag.k-visit { background: #e3f6ec; color: #1d6b45; }
.kind-tag.k-email { background: #f1ecfb; color: #5a3fb3; }
.kind-tag.k-meeting, .kind-tag.k-demo { background: #fff3dc; color: #8a5a00; }

/* 담당자 */
details.contact { border-bottom: 1px solid var(--line); padding: 8px 0; }
details.contact > summary { list-style: none; cursor: pointer; }
details.contact > summary::-webkit-details-marker { display: none; }
details.contact[open] > summary { margin-bottom: 8px; }
details.contact.add { border-bottom: 0; padding-top: 12px; }
details.contact.add > summary { display: inline-block; }

/* 영업 건 미니 목록 */
a.mini-deal { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); color: var(--text); }
a.mini-deal:last-child { border-bottom: 0; }
a.mini-deal:hover { text-decoration: none; } a.mini-deal:hover b { color: var(--primary); }
a.mini-deal .muted { flex-basis: 100%; }

/* 할 일 줄 */
.task-row { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid var(--line); color: var(--text); }
.task-row:last-child { border-bottom: 0; }
a.task-row:hover { text-decoration: none; background: #f7f9fc; }
.task-row .grow { flex: 1; min-width: 0; }
.task-row.late b { color: var(--danger); }
.task-row form { margin: 0; }
.task-row .move { margin-left: auto; }
button.chk { flex: none; width: 24px; height: 24px; border-radius: 50%; border: 2px solid #c5cdd9; background: #fff; color: transparent; font-size: 12px; font-weight: 700; cursor: pointer; padding: 0; line-height: 1; }
button.chk:hover { border-color: var(--ok); color: var(--ok); }
button.chk.on { background: var(--ok); border-color: var(--ok); color: #fff; }
.task-row.done { color: var(--muted); }
.tgroup.g-late h2 { color: var(--danger); }
.tgroup.g-today h2 { color: var(--primary); }
.sub-warn { margin-top: 12px; padding: 10px 12px; background: #fff8e6; border-radius: 8px; font-size: 13px; display: flex; flex-direction: column; gap: 3px; }

/* 대시보드 파이프라인 띠 */
.pipe-strip { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; }
.pipe-strip .ps { display: flex; flex-direction: column; align-items: center; padding: 10px 6px; border-radius: 8px; background: #f7f9fc; color: var(--text); border-top: 3px solid var(--st-prep); }
.pipe-strip .ps:hover { text-decoration: none; background: #eef3fd; }
.pipe-strip .ps b { font-size: 22px; }
.pipe-strip .ps span { font-size: 12px; color: #4a5568; }
.pipe-strip .ps small { font-size: 11px; color: var(--muted); min-height: 14px; }
.pipe-strip .s-contact { border-top-color: var(--st-contact); } .pipe-strip .s-consult { border-top-color: var(--st-consult); }
.pipe-strip .s-quote { border-top-color: var(--st-quote); } .pipe-strip .s-order { border-top-color: var(--st-order); }
.pipe-strip .s-paid { border-top-color: var(--st-paid); } .pipe-strip .s-lost { border-top-color: var(--st-lost); }
@media (max-width: 760px) { .pipe-strip { grid-template-columns: repeat(4, 1fr); } }
a.tile { color: var(--text); } a.tile:hover { text-decoration: none; border-color: var(--primary); }

/* 달력 */
.tasks-layout { grid-template-columns: minmax(0, 1fr) 460px; }
.cal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.cal-w { text-align: center; font-size: 11px; color: var(--muted); padding: 4px 0; }
.cal-d { min-height: 62px; background: #f7f9fc; border-radius: 6px; padding: 3px 4px; overflow: hidden; }
.cal-d.empty { background: transparent; }
.cal-d.today { background: #e8effd; box-shadow: inset 0 0 0 1px var(--primary); }
.cal-n { font-size: 11px; color: #4a5568; font-weight: 600; }
.cal-t { font-size: 10.5px; line-height: 1.25; margin-top: 2px; padding: 1px 3px; border-radius: 3px; background: #dfe8fa; color: #234a9a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-t.late { background: #fbe1e1; color: #8d2323; }
.cal-t.done { background: #e6ebf1; color: #9aa3b2; text-decoration: line-through; }
.cal-more { font-size: 10px; color: var(--muted); }

/* 중복 경고 */
.dup-box { background: #fff6e0; border: 1px solid #f1dca3; border-radius: 8px; padding: 10px 12px; font-size: 13px; color: #6b4a00; margin: 8px 0; }
.dup-box ul { margin: 6px 0 0; padding-left: 18px; }
.dup-box form { display: flex; gap: 8px; align-items: center; margin-top: 6px; }

/* 후보 검토함 */
.cand-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.cand-reason { background: #f7f9fc; border-radius: 6px; padding: 8px 10px; margin: 8px 0 4px; font-size: 13px; }
.cand-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.cand-actions select, .cand-actions input[name=note] { width: auto; margin: 0; }
.cand-actions input[name=note] { flex: 1; min-width: 160px; }
.cand-actions label.check { padding-top: 0; }

/* 가져오기 */
.map-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 16px; margin-bottom: 18px; }
@media (max-width: 900px) { .map-grid { grid-template-columns: 1fr 1fr; } }
.target-pick { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.target-pick .check-card { display: block; }
.target-pick label.check { padding-top: 8px; }
@media (max-width: 760px) { .target-pick { grid-template-columns: 1fr; } }

.search-hit { padding: 6px 0; border-bottom: 1px solid var(--line); }
.search-hit:last-child { border-bottom: 0; }
.erp-hit { display: flex; gap: 8px; align-items: center; padding: 4px 0; }
.danger-zone { margin-top: 10px; border-top: 1px solid var(--line); padding-top: 8px; }
.danger-zone form { margin-top: 8px; }
label.fb-field.check { padding-top: 0; }

/* 보드 끌기 */
.bcard { touch-action: pan-y; user-select: none; }
.bcard.ghost { position: fixed; left: 0; top: 0; z-index: 100; pointer-events: none; box-shadow: 0 10px 28px rgba(0,0,0,.22); transform-origin: 0 0; opacity: .95; cursor: grabbing; }
body.board-dragging, body.board-dragging * { cursor: grabbing !important; }

/* 라디오 칩: 공통 CSS의 input 폭(100%)이 화면을 넓히지 않게 */
.kind-pill { position: relative; }
.kind-pill input { width: 1px !important; height: 1px; left: 0; top: 0; margin: 0; }
/* 메뉴가 ERP보다 많아 중간 폭에서 상단 바가 넘치지 않게 */
@media (max-width: 1200px) and (min-width: 901px) {
  .nav > a, .nav > details > summary { padding: 7px 8px; }
  .quick-search input { width: 120px; }
  .topbar-inner { gap: 10px; }
}