/* =======================================================================
   print.css — Report-Grade Print Styling, Page Breaks, Monochrome
   Advanced Solar Load Calculator — Production CSS Architecture
   ======================================================================= */

@media print {
  /* ── Reset for print ───────────────────────────────────────────── */
  *, *::before, *::after {
    box-shadow: none !important;
    text-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html, body {
    height: auto;
    background: #fff;
    color: #111;
    font-size: 11pt;
    direction: rtl;
  }

  /* ── Hide non-print elements ───────────────────────────────────── */
  .sidebar,
  .sidebar-toggle,
  .header,
  .toast-container,
  .modal-root,
  .btn,
  .btn-icon,
  .tab-group,
  .hero-actions,
  .view-actions,
  .inventory-filters,
  .form-actions,
  nav {
    display: none !important;
  }

  /* ── Layout ────────────────────────────────────────────────────── */
  .app-shell {
    display: block;
  }

  .main-area {
    display: block;
    overflow: visible;
  }

  .content-area {
    overflow: visible;
  }

  .view {
    padding: 0;
    max-width: none;
    animation: none;
  }

  /* ── Background reset ──────────────────────────────────────────── */
  .panel,
  .card,
  .kpi-card,
  .metric-card,
  .stage-card,
  .stat-card,
  .data-table-wrap,
  .chart-panel,
  .form-section,
  .hero-banner {
    background: #fff !important;
    border: 1px solid #ddd !important;
    color: #111 !important;
    box-shadow: none !important;
  }

  .hero-banner::before,
  .hero-banner::after {
    display: none;
  }

  /* ── Typography ────────────────────────────────────────────────── */
  h1, h2, h3, h4 { color: #111 !important; }
  p, li, td, th, span, label { color: #333 !important; }

  .view-header h2 { font-size: 18pt; }
  .panel-title { font-size: 12pt; color: #111 !important; }
  .hero-title { font-size: 20pt; color: #111 !important; }
  .hero-desc { color: #555 !important; }

  /* ── Table print ───────────────────────────────────────────────── */
  .data-table,
  .schedule-table,
  .report-table {
    font-size: 9pt;
    border-collapse: collapse;
  }

  .data-table thead,
  .schedule-table thead {
    background: #f5f5f5 !important;
    color: #333 !important;
    position: static;
    backdrop-filter: none;
  }

  .data-table th,
  .data-table td,
  .schedule-table th,
  .schedule-table td {
    padding: 4px 8px;
    border: 1px solid #ddd !important;
    color: #333 !important;
  }

  .data-table tbody tr:hover,
  .schedule-table tbody tr:hover {
    background: transparent !important;
  }

  /* ── Badges / chips ────────────────────────────────────────────── */
  .cat-badge, .crit-badge, .badge {
    border: 1px solid #999 !important;
    background: #f5f5f5 !important;
    color: #333 !important;
  }

  /* ── KPI cards ─────────────────────────────────────────────────── */
  .kpi-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }

  .kpi-card {
    break-inside: avoid;
  }

  .kpi-label { color: #666 !important; }
  .kpi-value { color: #111 !important; }
  .kpi-sub   { color: #888 !important; }

  /* ── Metric cards ──────────────────────────────────────────────── */
  .metric-label { color: #666 !important; }
  .metric-value { color: #111 !important; }

  /* ── Insights ──────────────────────────────────────────────────── */
  .insight-item {
    background: #f9f9f9 !important;
    border: 1px solid #ddd !important;
    break-inside: avoid;
  }
  .insight-icon { color: #333 !important; }
  .insight-text { color: #333 !important; }

  /* ── Page breaks ───────────────────────────────────────────────── */
  h2 { page-break-after: avoid; }
  h3 { page-break-after: avoid; }
  .panel { page-break-inside: avoid; }
  .kpi-card { page-break-inside: avoid; }
  .metric-card { page-break-inside: avoid; }
  .chart-panel { page-break-inside: avoid; }
  table { page-break-inside: auto; }
  tr { page-break-inside: avoid; }

  /* ── Print footer ──────────────────────────────────────────────── */
  .print-footer {
    display: block;
    margin-top: 2rem;
    padding-top: 0.5rem;
    border-top: 1px solid #ddd;
    font-size: 8pt;
    color: #888;
  }

  /* ── Color overrides for specific values ────────────────────────── */
  .text-orange-300, .text-amber-300, .text-emerald-300,
  .text-blue-300, .text-red-300, .text-pink-300,
  .text-violet-300, .text-cyan-300, .text-purple-300,
  .text-indigo-300, .text-yellow-300, .text-rose-300,
  .text-sky-300, .text-fuchsia-300, .text-teal-300 {
    color: #333 !important;
  }

  /* ── Charts ────────────────────────────────────────────────────── */
  .chart-container canvas {
    max-width: 100%;
    height: auto;
  }

  /* ── Links ─────────────────────────────────────────────────────── */
  a {
    color: #333;
    text-decoration: underline;
  }

  /* ── Print margin ──────────────────────────────────────────────── */
  @page {
    margin: 15mm 12mm;
    size: A4;
  }

  /* ── Print-specific: show report content clearly ────────────────── */
  .report-section-title {
    border-right-color: #333 !important;
    color: #111 !important;
  }

  /* ── Mono text ─────────────────────────────────────────────────── */
  .mono {
    font-family: 'Courier New', monospace;
  }
}