/* =============================================================
   print.css — Shared print-optimized stylesheet
   Include on pages that need print support:
   invoice, dispatch, fulfillment, aging-report, analytics
   ============================================================= */

@media print {

  /* ── Page setup ────────────────────────────────────── */
  @page {
    margin: 12mm 10mm;
    size: A4;
  }

  /* ── Force light colours for ink saving ─────────────── */
  html, body {
    background: white !important;
    color: #111 !important;
    font-size: 11pt;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* Remove dark-mode class effects */
  html:not(.jn-light) {
    --jl-text: #111;
    --jl-text-secondary: #374151;
    --jl-text-muted: #6b7280;
    --jl-text-dimmed: #9ca3af;
    --jl-surface: #fff;
    --jl-surface-hover: #f9fafb;
    --jl-bg: #fff;
    --jl-border: #e5e7eb;
    --jl-accent: #16a34a;
    --jl-brand: #1c5636;
    --jl-brand-hover: #153d28;
  }

  /* ── Hide navigation & chrome ──────────────────────── */
  /* Shared nav */
  .jn-sidebar,
  .jn-header,
  .jn-mobile,
  .jn-overlay,
  .jn-bell,
  nav,
  header {
    display: none !important;
  }

  /* Footer */
  .jl-page-footer,
  footer {
    display: none !important;
  }

  /* ── Hide interactive elements ─────────────────────── */
  /* Buttons, filters, search bars, export buttons */
  .page-actions,
  .export-btn,
  .btn-secondary,
  .btn-primary,
  .btn-green,
  .btn-outline,
  .btn-remind,
  .period-btn,
  .vt-btn,
  .print-btn,
  button[onclick*="Export"],
  button[onclick*="export"],
  button[onclick*="Refresh"],
  button[onclick*="sync"],
  button[onclick*="Sync"],
  button[onclick*="print"],
  #searchInput,
  #statusFilter,
  #merchantFilter,
  #sourceFilter,
  #sortFilter,
  #cityFilter,
  #datePicker,
  #viewToggle,
  .qa-wrap,
  .qa-modal-backdrop,
  .sv-bar,
  .repeat-dropdown,
  .mob-bottom-bar,
  #selectAll {
    display: none !important;
  }

  /* Hide modals, slide panels, toasts, spinners */
  .modal-overlay,
  .modal-backdrop,
  .modal-panel,
  .slide-panel,
  .slide-backdrop,
  .toast-msg,
  .toast,
  .spinner,
  .bulk-bar,
  #offlineBanner,
  #onlineBanner,
  #shipheroHealthBanner,
  #cycleCountReminder {
    display: none !important;
  }

  /* Hide checkboxes in tables */
  input[type="checkbox"] {
    display: none !important;
  }

  /* ── Layout — full width, no sidebar space ─────────── */
  main {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body {
    padding: 0 !important;
    margin: 0 !important;
  }

  /* ── Remove decorative backgrounds & shadows ────────── */
  .stat-card,
  .section-card,
  .tw-wrap,
  .tw-card,
  .job-card,
  .vehicle-lane,
  .inv-preview {
    background: white !important;
    box-shadow: none !important;
    border-color: #d1d5db !important;
  }

  /* Cards keep their borders for structure */
  .stat-card {
    border: 1px solid #d1d5db !important;
    break-inside: avoid;
  }

  /* ── Table print optimization ──────────────────────── */
  table {
    border-collapse: collapse;
    width: 100%;
  }

  thead {
    display: table-header-group;
  }

  tr {
    break-inside: avoid;
  }

  th, td {
    padding: 6px 8px !important;
    font-size: 10pt;
    border-bottom: 1px solid #e5e7eb;
  }

  th {
    background: #f3f4f6 !important;
    color: #111 !important;
    font-weight: 600;
  }

  /* Restore hidden columns for print (tablet/mobile hides them) */
  #ordersTable th,
  #ordersTable td,
  #agingTable th,
  #agingTable td,
  #carrierTable th,
  #carrierTable td {
    display: table-cell !important;
  }

  /* Hide the Actions column in print */
  .col-actions,
  th:last-child:empty {
    display: none !important;
  }

  /* ── Links — show URLs ─────────────────────────────── */
  a[href^="http"]::after,
  a[href^="https"]::after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    color: #6b7280;
    font-weight: 400;
  }

  /* Don't show URL for nav links or buttons */
  nav a::after,
  .jn-sidebar a::after,
  button a::after,
  a[href^="/"]::after,
  a[href^="#"]::after {
    content: none !important;
  }

  /* ── Page break helpers ────────────────────────────── */
  h1, h2, h3 {
    break-after: avoid;
  }

  .section-card,
  .stat-card {
    break-inside: avoid;
  }

  /* ── Chart canvases — ensure they render ────────────── */
  canvas {
    max-width: 100% !important;
    break-inside: avoid;
  }

  /* ── Grid adjustments for print ────────────────────── */
  /* Stat card grids: keep 5-col for stats, they're compact enough */
  #statGrid {
    grid-template-columns: repeat(5, 1fr) !important;
  }

  #overviewSection {
    grid-template-columns: repeat(5, 1fr) !important;
  }

  /* ── Print-only header (hidden on screen, shown on print) ── */
  .print-header {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 12px;
    margin-bottom: 16px;
    border-bottom: 2px solid #1c5636;
  }

  .print-header img {
    height: 36px;
  }

  .print-header .print-header-right {
    text-align: right;
    font-size: 9pt;
    color: #6b7280;
    line-height: 1.5;
  }

  .print-date {
    display: block !important;
    text-align: right;
    font-size: 8pt;
    color: #9ca3af;
    margin-top: 8px;
  }

  /* ═══════════════════════════════════════════════════════
     PAGE-SPECIFIC RULES
     ═══════════════════════════════════════════════════════ */

  /* ── Invoice ───────────────────────────────────────── */
  .form-view,
  #formView {
    display: none !important;
  }

  .preview-view,
  #previewView {
    display: block !important;
  }

  .inv-preview {
    border: none !important;
    padding: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  .inv-table th {
    background: #1c5636 !important;
    color: white !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* Page break between multiple invoices */
  .inv-preview + .inv-preview {
    break-before: page;
  }

  /* ── Dispatch ──────────────────────────────────────── */
  /* Hide date nav buttons, booking button, TV link */
  button[onclick*="navPrev"],
  button[onclick*="navNext"],
  button[onclick*="goToToday"],
  button[onclick*="openBookingModal"],
  button[onclick*="toggleRepeatDropdown"],
  a[href*="dispatch-tv"],
  .relative:has(#repeatDropdown) {
    display: none !important;
  }

  /* Only show the active view */
  #weekView,
  #monthView,
  #yearView,
  #mapView,
  #mapContainer,
  .map-sidebar,
  .route-summary {
    display: none !important;
  }

  /* Show day view by default (most useful for drivers) */
  #dayView {
    display: block !important;
  }

  .job-card {
    border-left-width: 4px !important;
    padding: 8px 10px !important;
    margin-bottom: 6px !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* Keep status colours on job cards */
  .job-card.status-REQUESTED { border-left-color: #a855f7 !important; }
  .job-card.status-CONFIRMED { border-left-color: #3b82f6 !important; }
  .job-card.status-IN_PROGRESS { border-left-color: #f59e0b !important; }
  .job-card.status-COMPLETED { border-left-color: #22c55e !important; }

  .status-badge {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .vehicle-lane {
    break-inside: avoid;
    margin-bottom: 12px !important;
  }

  #statsRow {
    display: none !important;
  }

  /* ── Fulfillment (pick lists) ──────────────────────── */
  .tw-wrap,
  #twWrap,
  #twShowBtn {
    display: none !important;
  }

  #ordersTable {
    table-layout: auto !important;
    font-size: 9pt;
  }

  .order-row {
    break-inside: avoid;
  }

  /* Hide checkbox column (1st) and Actions column (last) */
  #ordersTable th:first-child,
  #ordersTable td:first-child,
  #ordersTable th:last-child,
  #ordersTable td:last-child {
    display: none !important;
  }

  /* Hide action buttons and pagination */
  .action-btn,
  #paginationRow {
    display: none !important;
  }

  /* Show all badge colours */
  .badge,
  .badge-blue,
  .badge-amber,
  .badge-green,
  .badge-red {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    border: 1px solid #d1d5db;
  }

  /* ── Aging Report ──────────────────────────────────── */
  /* Hide the Actions column (last column) */
  #agingTable th:last-child,
  #agingTable td:last-child {
    display: none !important;
  }

  #agingTable .btn-remind {
    display: none !important;
  }

  .sort-header::after {
    display: none !important;
  }

  /* ── Analytics ─────────────────────────────────────── */
  .period-btn,
  .period-btn.active {
    display: none !important;
  }

  /* Charts: give them enough room */
  .section-card {
    break-inside: avoid;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    padding: 12px !important;
    margin-bottom: 12px !important;
    background: white !important;
    box-shadow: none !important;
  }

}

/* ── Print button style (visible on screen, hidden on print) ── */
.print-btn {
  background: none;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 6px 10px;
  cursor: pointer;
  color: #6b7280;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  font-weight: 500;
  transition: background 0.15s, color 0.15s;
  font-family: inherit;
}

.print-btn:hover {
  background: #f3f4f6;
  color: #374151;
}

/* Dark mode print button */
html:not(.jn-light) .print-btn {
  border-color: #334155;
  color: #94a3b8;
}

html:not(.jn-light) .print-btn:hover {
  background: #1e293b;
  color: #e2e8f0;
}

/* Print header is hidden on screen */
.print-header {
  display: none;
}

.print-date {
  display: none;
}