/* ─── pnl2: 손익 관리 2 ─── */

.pnl2-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--cs2-bg-2, #f5f5f3);
}

/* 데이터 영역 — 단일 스크롤 컨테이너 (손익관리1과 동일 패턴) */
.pnl2-data-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: auto;
  min-height: 0;
  background: var(--cs2-bg, #fff);
}

/* 테이블 컨테이너 — overflow 없음, 자연 높이 */
.pnl2-tbl-wrap {
  background: var(--cs2-bg, #fff);
}

/* 컨트롤 바 */
.pnl2-ctrl {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  background: var(--bg, #fff);
  border-bottom: 1px solid var(--border, #eaeaea);
  flex-wrap: wrap;
  min-height: 44px;
}
.pnl2-ctrl-label {
  font-size: 13px;
  color: var(--txt2, #3a3a3a);
  white-space: nowrap;
}
.pnl2-ctrl-date {
  font-size: 13px;
  font-weight: 600;
  color: var(--txt, #1a1a1a);
  background: var(--bg2, #f5f5f5);
  border: 1px solid var(--border, #eaeaea);
  border-radius: 6px;
  padding: 4px 12px;
  cursor: pointer;
}
.pnl2-ctrl-meta {
  font-size: 11px;
  color: var(--txt3, #9a9a9a);
}
.pnl2-ctrl-spacer { flex: 1; }

/* 프리셋 버튼 그룹 */
.pnl2-presets {
  display: flex;
  gap: 6px;
  margin-left: 8px;
}
.pnl2-preset-btn {
  font-size: 12px;
  padding: 4px 14px;
  border-radius: 18px;
  border: 1px solid var(--border, #eaeaea);
  background: var(--bg, #fff);
  color: var(--txt2, #3a3a3a);
  cursor: pointer;
  white-space: nowrap;
  font-family: inherit;
  transition: all .1s;
}
.pnl2-preset-btn:hover {
  background: var(--bg2, #f5f5f5);
  border-color: var(--border-strong, #d4d4d4);
}
.pnl2-preset-btn.active {
  background: #E6F1FB;
  border-color: #85B7EB;
  color: #0C447C;
  font-weight: 600;
}
.pnl2-btn {
  font-size: 12px;
  padding: 5px 14px;
  border-radius: 6px;
  border: 1px solid var(--border, #eaeaea);
  background: var(--bg, #fff);
  color: var(--txt, #1a1a1a);
  cursor: pointer;
  white-space: nowrap;
  font-weight: 500;
  transition: background .1s;
}
.pnl2-btn:hover { background: var(--bg2, #f5f5f5); }
.pnl2-btn-accent {
  background: #D97706;
  color: #fff;
  border-color: #D97706;
}
.pnl2-btn-accent:hover { background: #B45309; }

/* 쇼핑몰 필터 pills */
.pnl2-pills {
  display: flex;
  gap: 6px;
  padding: 8px 20px;
  background: var(--bg, #fff);
  border-bottom: 1px solid var(--border, #eaeaea);
  flex-wrap: wrap;
}
.pnl2-pill {
  font-size: 12px;
  padding: 4px 14px;
  border-radius: 20px;
  border: 1px solid var(--border, #eaeaea);
  background: var(--bg, #fff);
  color: var(--txt2, #3a3a3a);
  cursor: pointer;
  transition: all .1s;
  white-space: nowrap;
}
.pnl2-pill:hover { border-color: var(--border-strong, #d4d4d4); }
.pnl2-pill.active {
  background: var(--txt, #1a1a1a);
  color: #fff;
  border-color: transparent;
}
.pnl2-pill .pnl2-pill-cnt {
  font-size: 11px;
  margin-left: 4px;
  opacity: .7;
}

/* 요약 카드 */
.pnl2-cards {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  padding: 14px 20px;
  background: var(--cs2-bg-2, #f5f5f3);
  border-bottom: 1px solid var(--border, #eaeaea);
  flex-shrink: 0;
}
.pnl2-card {
  background: var(--cs2-bg, #fff);
  border-radius: 8px;
  padding: 12px 14px;
  border: 1px solid var(--cs2-border, #eaeaea);
}
.pnl2-card-label {
  font-size: 11px;
  color: var(--txt3, #9a9a9a);
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.pnl2-card-val {
  font-size: 18px;
  font-weight: 700;
  color: var(--txt, #1a1a1a);
}
.pnl2-card-sub {
  font-size: 11px;
  color: var(--txt3, #9a9a9a);
  margin-top: 4px;
  line-height: 1.6;
}
.pnl2-card--profit {
  background: #E6F1FB;
}
.pnl2-card--profit .pnl2-card-label { color: #0C447C; }

/* 테이블 상단 바 */
.pnl2-tbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 20px;
  background: var(--bg, #fff);
  border-bottom: 1px solid var(--border, #eaeaea);
  flex-shrink: 0;
}
.pnl2-tbar-left {
  font-size: 13px;
  color: var(--txt2, #3a3a3a);
}
.pnl2-tbar-right {
  display: flex;
  gap: 8px;
  align-items: center;
}
.pnl2-tbar-right input[type="text"] {
  font-size: 12px;
  height: 30px;
  padding: 0 10px;
  border: 1px solid var(--border, #eaeaea);
  border-radius: 6px;
  width: 200px;
  background: var(--bg, #fff);
  color: var(--txt, #1a1a1a);
}
.pnl2-tbar-right select {
  font-size: 12px;
  height: 30px;
  padding: 0 8px;
  border: 1px solid var(--border, #eaeaea);
  border-radius: 6px;
  background: var(--bg, #fff);
  color: var(--txt, #1a1a1a);
}



/* 테이블 */
.pnl2-tbl {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
  table-layout: fixed;
  min-width: 1800px;
}
/* 1행 헤더 */
.pnl2-tbl thead tr:first-child th {
  position: sticky;
  top: 0;
  z-index: 6 !important;
  background: #FAFAF8;
  font-weight: 700;
  text-align: left;
  padding: 11px 12px;
  border-bottom: 1px solid var(--cs2-border, #EAEAEA);
  border-right: 1px solid var(--cs2-border, #EAEAEA);
  white-space: nowrap;
  font-size: 12px;
  color: var(--cs2-ink, #1A1A1A);
}
/* 2행 헤더 */
.pnl2-tbl thead tr.pnl2-thead-row2 th {
  position: sticky;
  z-index: 5 !important;
  background: #FAFAF8;
  font-weight: 700;
  text-align: left;
  padding: 11px 12px;
  border-bottom: 1px solid var(--cs2-border, #EAEAEA);
  border-right: 1px solid var(--cs2-border, #EAEAEA);
  white-space: nowrap;
  font-size: 12px;
  color: var(--cs2-ink, #1A1A1A);
}
.pnl2-tbl td {
  padding: 12px 12px;
  border-bottom: 1px solid var(--cs2-border, #EAEAEA);
  border-right: 1px solid var(--cs2-border, #EAEAEA);
  white-space: nowrap;
  font-size: 13px;
  text-align: left;
  vertical-align: middle;
  color: var(--cs2-ink, #1A1A1A);
}
.pnl2-tbl tbody tr:hover td {
  background: var(--cs2-bg-chat, #FAFAFA);
}
.pnl2-num { text-align: right; font-variant-numeric: tabular-nums; }

/* 그룹 헤더 */
.pnl2-grp {
  text-align: center;
  font-weight: 600;
  font-size: 11px;
  cursor: pointer;
  user-select: none;
  letter-spacing: 0.3px;
  padding: 6px 4px;
}
.pnl2-grp-sales  { background: #E6F1FB; color: #0C447C; }
.pnl2-grp-fee    { background: #FAECE7; color: #712B13; }
.pnl2-grp-sett   { background: #E1F5EE; color: #085041; }
.pnl2-grp-cogs   { background: #EEEDFE; color: #3C3489; }
.pnl2-grp-ad     { background: #FAEEDA; color: #633806; }
.pnl2-grp-result { background: #EAF3DE; color: #27500A; }

/* 채널 배지 */
.pnl2-ch {
  display: inline-block;
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 600;
  white-space: nowrap;
}
.pnl2-ch-rg  { background: #E6F1FB; color: #0C447C; }
.pnl2-ch-3p  { background: #FAEEDA; color: #633806; }
.pnl2-ch-ss  { background: #E1F5EE; color: #085041; }
.pnl2-ch-et  { background: #FBEAF0; color: #72243E; }
.pnl2-ch-c24 { background: #EEEDFE; color: #3C3489; }

/* 경고/상태 */
.pnl2-warn {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 11px;
  color: #C0392B;
}
.pnl2-pos { color: #0F6E56; }
.pnl2-neg { color: #C0392B; }
.pnl2-muted { color: var(--txt3, #9a9a9a); }

/* 상품명 셀 */
.pnl2-td-product {
  white-space: normal;
  line-height: 1.5;
  text-align: left !important;
  vertical-align: top;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.pnl2-product-line {
  font-size: 13px;
  font-weight: 600;
  color: var(--txt, #1a1a1a);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pnl2-option {
  color: #2E86AB;
  font-weight: 700;
}
.pnl2-unmapped {
  color: #C0392B;
  font-size: 11px;
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 3px;
  font-weight: 600;
}
.pnl2-unmapped-icon {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #C0392B;
  color: #fff;
  text-align: center;
  line-height: 14px;
  font-size: 10px;
  font-weight: 700;
  flex-shrink: 0;
}

/* 로딩 */
.pnl2-loading {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: var(--txt3, #9a9a9a);
  padding: 60px;
}

/* 빈 상태 */
.pnl2-empty {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: var(--txt3, #9a9a9a);
  padding: 60px;
  text-align: center;
}

/* 컬럼 리사이즈 핸들 호버 */
.pnl2-tbl th > div[style*="col-resize"]:hover {
  background: rgba(217, 119, 6, 0.3);
}

/* frozen 컬럼 hover 배경 */
.pnl2-tbl tbody tr:hover td[style*="sticky"] {
  background: var(--bg-tertiary, #fafafa) !important;
}