/* ==============================================
   잠재고객 관리 - 영업단계별 대시보드 배너
   ============================================== */

/* 배너 컨테이너 */
#prospect-stage-banners {
  display: flex;
  gap: 8px;
  margin: 4px 0 8px;
  flex-wrap: wrap;
  /* 배너가 위쪽 뱃지를 덮지 않도록 z-index 낮게 */
  position: relative;
  z-index: 1;
  padding-bottom: 4px;
}

/* 개별 배너 박스 */
.prospect-stage-banner {
  flex: 1;
  min-width: 110px;
  max-width: 190px;
  background: var(--white);
  border: 2px solid var(--gray-200);
  border-radius: var(--radius);
  padding: 8px 12px;
  cursor: pointer;
  transition: all .18s cubic-bezier(.34,1.56,.64,1);
  position: relative;
  overflow: hidden;
  /* 기본: 살짝 눌린 느낌 */
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}

.prospect-stage-banner:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
  z-index: 2;
}

/* ★ active: 아래로만 살짝 강조 (위쪽 뱃지 침범 방지) ★ */
.prospect-stage-banner.active {
  transform: translateY(0) scale(1.03);
  box-shadow: 0 6px 20px rgba(0,0,0,.18), 0 0 0 3px currentColor;
  z-index: 2;
}

/* active 시 배너 밝아짐 + 강한 테두리 */
.prospect-stage-banner.active::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: calc(var(--radius) - 2px);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.6);
  pointer-events: none;
}

/* 상단 컬러 라인 */
.prospect-stage-banner::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  border-radius: var(--radius) var(--radius) 0 0;
}

/* 영업단계별 색상 */
.prospect-stage-banner.stage-all {
  border-color: #94A3B8;
}
.prospect-stage-banner.stage-all::before {
  background: linear-gradient(90deg, #64748B, #94A3B8);
}
.prospect-stage-banner.stage-all.active {
  background: linear-gradient(145deg, #F1F5F9, #E2E8F0);
  border-color: #64748B;
  color: #64748B;
}

.prospect-stage-banner.stage-lead {
  border-color: #93C5FD;
}
.prospect-stage-banner.stage-lead::before {
  background: linear-gradient(90deg, #3B82F6, #60A5FA);
}
.prospect-stage-banner.stage-lead.active {
  background: linear-gradient(145deg, #DBEAFE, #BFDBFE);
  border-color: #3B82F6;
  color: #3B82F6;
}

.prospect-stage-banner.stage-contact {
  border-color: #86EFAC;
}
.prospect-stage-banner.stage-contact::before {
  background: linear-gradient(90deg, #22C55E, #4ADE80);
}
.prospect-stage-banner.stage-contact.active {
  background: linear-gradient(145deg, #DCFCE7, #BBF7D0);
  border-color: #22C55E;
  color: #22C55E;
}

.prospect-stage-banner.stage-proposal {
  border-color: #FED7AA;
}
.prospect-stage-banner.stage-proposal::before {
  background: linear-gradient(90deg, #F97316, #FB923C);
}
.prospect-stage-banner.stage-proposal.active {
  background: linear-gradient(145deg, #FFEDD5, #FED7AA);
  border-color: #F97316;
  color: #F97316;
}

.prospect-stage-banner.stage-negotiation {
  border-color: #C4B5FD;
}
.prospect-stage-banner.stage-negotiation::before {
  background: linear-gradient(90deg, #9333EA, #A855F7);
}
.prospect-stage-banner.stage-negotiation.active {
  background: linear-gradient(145deg, #F3E8FF, #E9D5FF);
  border-color: #9333EA;
  color: #9333EA;
}

.prospect-stage-banner.stage-won {
  border-color: #67E8F9;
}
.prospect-stage-banner.stage-won::before {
  background: linear-gradient(90deg, #06B6D4, #22D3EE);
}
.prospect-stage-banner.stage-won.active {
  background: linear-gradient(145deg, #CFFAFE, #A5F3FC);
  border-color: #06B6D4;
  color: #06B6D4;
}

.prospect-stage-banner.stage-lost {
  border-color: #FCA5A5;
}
.prospect-stage-banner.stage-lost::before {
  background: linear-gradient(90deg, #DC2626, #EF4444);
}
.prospect-stage-banner.stage-lost.active {
  background: linear-gradient(145deg, #FEE2E2, #FECACA);
  border-color: #DC2626;
  color: #DC2626;
}

.prospect-stage-banner.stage-longterm {
  border-color: #FCD34D;
}
.prospect-stage-banner.stage-longterm::before {
  background: linear-gradient(90deg, #D97706, #F59E0B);
}
.prospect-stage-banner.stage-longterm.active {
  background: linear-gradient(145deg, #FEF3C7, #FDE68A);
  border-color: #D97706;
  color: #D97706;
}
.prospect-stage-banner.stage-longterm.active .psb-amount-value {
  color: #D97706;
}

/* 배너 내용 */
.psb-label {
  font-size: 12px;
  font-weight: 800;
  color: #111827;
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.psb-count {
  font-size: 22px;
  font-weight: 900;
  color: var(--gray-800);
  margin-bottom: 2px;
  line-height: 1;
}

.prospect-stage-banner.active .psb-count {
  color: var(--primary);
}

.psb-amount {
  font-size: 11px;
  font-weight: 700;
  color: var(--primary);
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px solid var(--gray-100);
}

.psb-amount-label {
  font-size: 10px;
  color: var(--gray-500);
  font-weight: 500;
  margin-bottom: 2px;
}

.psb-amount-value {
  font-size: 12px;
  font-weight: 800;
  color: var(--gray-900);
}

.prospect-stage-banner.stage-all.active .psb-amount-value {
  color: #64748B;
}

.prospect-stage-banner.stage-lead.active .psb-amount-value {
  color: #3B82F6;
}

.prospect-stage-banner.stage-contact.active .psb-amount-value {
  color: #22C55E;
}

.prospect-stage-banner.stage-proposal.active .psb-amount-value {
  color: #F97316;
}

.prospect-stage-banner.stage-negotiation.active .psb-amount-value {
  color: #9333EA;
}

.prospect-stage-banner.stage-won.active .psb-amount-value {
  color: #06B6D4;
}

.prospect-stage-banner.stage-lost.active .psb-amount-value {
  color: #DC2626;
}

/* PT 그룹 배너 (_pt_group key → stage-_pt_group 클래스) */
.prospect-stage-banner.stage-_pt_group {
  border-color: #C4B5FD;
}
.prospect-stage-banner.stage-_pt_group::before {
  background: linear-gradient(90deg, #7C3AED, #9333EA);
}
.prospect-stage-banner.stage-_pt_group.active {
  background: linear-gradient(145deg, #F3E8FF, #E9D5FF);
  border-color: #7C3AED;
  color: #7C3AED;
}
.prospect-stage-banner.stage-_pt_group.active .psb-amount-value {
  color: #7C3AED;
}

/* PT 세부 분리 칩 */
.psb-pt-sub {
  display: flex;
  gap: 5px;
  margin: 5px 0 2px;
  flex-wrap: wrap;
}
.psb-pt-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 8px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  background: rgba(124,58,237,.1);
  color: #6D28D9;
  border: 1.5px solid transparent;
  cursor: pointer;
  transition: all .14s;
  white-space: nowrap;
}
.psb-pt-chip:hover {
  background: rgba(124,58,237,.18);
}
.psb-pt-chip.on {
  background: #7C3AED;
  color: #fff;
  border-color: #7C3AED;
}

/* ══════════════════════════════════════════════════════
   리스크고객 관리 - 배너 색상 (잠재고객 배너와 동일 구조)
   ══════════════════════════════════════════════════════ */
/* 전체 */
.prospect-stage-banner.stage-risk-all { border-color: #94A3B8; }
.prospect-stage-banner.stage-risk-all::before { background: linear-gradient(90deg, #64748B, #94A3B8); }
.prospect-stage-banner.stage-risk-all.active { background: linear-gradient(145deg, #F1F5F9, #E2E8F0); border-color: #64748B; color: #64748B; }

/* 위험감지 */
.prospect-stage-banner.stage-risk-detect { border-color: #FCA5A5; }
.prospect-stage-banner.stage-risk-detect::before { background: linear-gradient(90deg, #EF4444, #F87171); }
.prospect-stage-banner.stage-risk-detect.active { background: linear-gradient(145deg, #FEE2E2, #FECACA); border-color: #EF4444; color: #EF4444; }

/* 원인분석/대응전략 통합 → 원인분석 */
.prospect-stage-banner.stage-risk-analyze { border-color: #FED7AA; }
.prospect-stage-banner.stage-risk-analyze::before { background: linear-gradient(90deg, #F97316, #FB923C); }
.prospect-stage-banner.stage-risk-analyze.active { background: linear-gradient(145deg, #FFEDD5, #FED7AA); border-color: #F97316; color: #F97316; }

/* 대응전략 */
.prospect-stage-banner.stage-risk-strategy { border-color: #FDE68A; }
.prospect-stage-banner.stage-risk-strategy::before { background: linear-gradient(90deg, #EAB308, #FACC15); }
.prospect-stage-banner.stage-risk-strategy.active { background: linear-gradient(145deg, #FEFCE8, #FEF9C3); border-color: #EAB308; color: #92400E; }

/* 고객설득/접촉 */
.prospect-stage-banner.stage-risk-persuade { border-color: #C4B5FD; }
.prospect-stage-banner.stage-risk-persuade::before { background: linear-gradient(90deg, #8B5CF6, #A78BFA); }
.prospect-stage-banner.stage-risk-persuade.active { background: linear-gradient(145deg, #F5F3FF, #EDE9FE); border-color: #8B5CF6; color: #8B5CF6; }

/* 유지성공 */
.prospect-stage-banner.stage-risk-success { border-color: #86EFAC; }
.prospect-stage-banner.stage-risk-success::before { background: linear-gradient(90deg, #16A34A, #22C55E); }
.prospect-stage-banner.stage-risk-success.active { background: linear-gradient(145deg, #DCFCE7, #BBF7D0); border-color: #16A34A; color: #16A34A; }

/* 조회유지 */
.prospect-stage-banner.stage-risk-hold { border-color: #67E8F9; }
.prospect-stage-banner.stage-risk-hold::before { background: linear-gradient(90deg, #0891B2, #22D3EE); }
.prospect-stage-banner.stage-risk-hold.active { background: linear-gradient(145deg, #CFFAFE, #A5F3FC); border-color: #0891B2; color: #0891B2; }

/* 해지 */
.prospect-stage-banner.stage-risk-cancel { border-color: #D1D5DB; }
.prospect-stage-banner.stage-risk-cancel::before { background: linear-gradient(90deg, #6B7280, #9CA3AF); }
.prospect-stage-banner.stage-risk-cancel.active { background: linear-gradient(145deg, #F3F4F6, #E5E7EB); border-color: #6B7280; color: #6B7280; }

/* 리스크 배너 컨테이너 */
#risk-stage-banners {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 4px 0 8px;
}

/* ── 공통 검색창 X 지우기 버튼 ── */
.srch-wrap { position: relative; }
.srch-x {
  position: absolute;
  right: 7px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  border: none;
  background: #94a3b8;
  color: #fff;
  border-radius: 50%;
  font-size: 9px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background .12s;
  z-index: 2;
}
.srch-x:hover { background: #64748b; }