/* ==========================================================================
   STEP 4: 리포트 내보내기 & 편의 기능 (인쇄 / PNG / 검색)
   대비: 다크·라이트 모두 텍스트 4.5:1 이상 목표 (색상값은 계산 근거 주석)
   ========================================================================== */

.print-only { display: none; }

/* --- 헤더 버튼 줄바꿈 / 모바일 가로 스크롤 방지 --- */
.header-actions { flex-wrap: wrap; gap: 8px; }

/* --- PNG 저장 버튼 --- */
.png-save-btn {
  font: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
  padding: 6px 12px; border-radius: var(--radius-full);
  background: transparent; color: var(--primary-light);   /* dark: #818CF8 on card ≈ 6:1 */
  border: 1px solid var(--border-focus);
  transition: background 0.18s ease, transform 0.18s ease;
  white-space: nowrap; align-self: flex-start;
}
.png-save-btn:hover { background: var(--primary-strong); color: #FFFFFF; transform: translateY(-1px); }
.png-save-btn:focus-visible, .search-input:focus-visible,
#csvDownloadBtn:focus-visible, #printReportBtn:focus-visible {
  outline: 3px solid var(--secondary); outline-offset: 2px;
}
[data-theme="light"] .png-save-btn { color: #4338CA; }  /* ≈ 8:1 on white */

/* --- 검색창 --- */
.table-search { padding: 0 4px 12px; }
.search-input {
  width: 100%; max-width: 100%; box-sizing: border-box;
  font: inherit; font-size: 14px; padding: 10px 14px;
  border-radius: var(--radius-full);
  background: var(--bg-surface-elevated); color: var(--text-main);
  border: 1px solid var(--border-subtle);
}
.search-input::placeholder { color: var(--text-muted); }
.search-empty { margin: 10px 4px 0; font-size: 13px; color: var(--text-muted); overflow-wrap: anywhere; }
.search-empty[hidden] { display: none; }
mark.search-hit {
  background: #FDE047; color: #1F2937;                   /* ≈ 11:1 */
  padding: 0 2px; border-radius: 3px;
}
tr[hidden] { display: none; }

@media (max-width: 600px) {
  .header-actions { width: 100%; }
  .header-actions .action-btn { flex: 1 1 auto; justify-content: center; }
  .card-title-bar { flex-wrap: wrap; gap: 8px; }
  .table-search, .search-input { min-width: 0; }
}

/* ==========================================================================
   beforeprint 시점용(화면 스타일): 숨김 탭의 Chart.js 캔버스가 0 크기로 남지 않도록
   step4.js가 body.is-printing 을 붙인 뒤 차트를 resize 한다. (인쇄 레이아웃과 동일 폭/높이)
   ========================================================================== */
body.is-printing { width: 190mm; }
body.is-printing .dashboard-container { max-width: 100%; padding: 0; }
body.is-printing .tab-panel { display: block; animation: none; }
body.is-printing .charts-grid-main, body.is-printing .charts-grid-sub { grid-template-columns: 1fr; }
body.is-printing .chart-container-box { height: 240px; }

/* ==========================================================================
   @media print — A4, 배경 유지, 3개 탭 전체 출력
   ========================================================================== */
@page { size: A4; margin: 10mm; }

@media print {
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  html, body { background: var(--bg-base, #0B0F19) !important; width: 190mm; }
  .dashboard-container { max-width: 100% !important; padding: 0 !important; }

  /* 인쇄 머리글 */
  .print-only { display: block !important; margin-bottom: 12px; color: var(--text-main); }
  .print-title { font-size: 20px; margin: 0 0 4px; }
  .print-meta p { font-size: 12px; margin: 0; color: var(--text-muted); }

  /* 숨김: 필터·탭·토글·버튼·검색 */
  .header-actions, .filter-toolbar, .subnav-tabs, .tab-group,
  .png-save-btn, .table-search, .dashboard-footer .footer-subtitle { display: none !important; }
  .dashboard-header h1 { font-size: 16px; }

  /* 3개 탭 모두 출력 */
  .tab-panel { display: block !important; opacity: 1 !important; visibility: visible !important;
               animation: none !important; margin-bottom: 14px; }

  /* 레이아웃: 1열, 페이지 중간 잘림 방지, 효과 제거 */
  .kpi-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .charts-grid-main, .charts-grid-sub, .rfm-summary-grid, .highlight-cards-grid {
    grid-template-columns: 1fr !important; }
  .rfm-summary-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .kpi-card, .chart-card, .rfm-card, .highlight-card, .target-gauge-card, tr {
    break-inside: avoid; page-break-inside: avoid;
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
    transform: none !important; animation: none !important; transition: none !important;
    box-shadow: none !important;
  }
  .chart-container-box { height: 240px !important; }
  .gauge-fill { transition: none !important; }
  .table-responsive { overflow: visible !important; }
}
