/* ============================================================
   GUARDIAN MESH — PRINT-TAB TOOLBAR
   Sticky 48px toolbar at the top of any page rendered in print
   mode (?print=1). Auto-mounted by js/mesh-print.js. Hidden when
   the user actually prints — only the underlying page content
   ends up in the PDF.
   ============================================================ */

.mesh-print-toolbar {
  position: sticky; top: 0; z-index: 9999;
  height: 48px; flex-shrink: 0;
  background: var(--text-primary, #111);
  color: #fff;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 24px;
  font-family: var(--font-primary, 'Aptos', 'Segoe UI', system-ui, sans-serif);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

.mesh-print-toolbar-meta {
  font-size: 12px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.7);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mesh-print-toolbar-actions {
  display: flex; align-items: center; gap: 8px;
  flex-shrink: 0;
}

.mesh-print-toolbar-btn {
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  padding: 7px 16px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: transparent;
  color: #fff;
  cursor: pointer;
  letter-spacing: 0.02em;
  transition: background 0.12s, border-color 0.12s;
  white-space: nowrap;
}
.mesh-print-toolbar-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.32);
}
.mesh-print-toolbar-btn.primary {
  background: #fff;
  color: var(--text-primary, #111);
  border-color: #fff;
}
.mesh-print-toolbar-btn.primary:hover {
  background: rgba(255, 255, 255, 0.92);
  color: var(--text-primary, #111);
}

/* Mobile — drop the helper text, keep the buttons usable. */
@media (max-width: 640px) {
  .mesh-print-toolbar { padding: 0 16px; }
  .mesh-print-toolbar-meta { display: none; }
  .mesh-print-toolbar-btn { padding: 7px 12px; font-size: 11px; }
}

/* In print mode the toolbar must NOT appear in the snapshot.
   This is the most important rule in this file: the whole point
   of the toolbar is that it's invisible once the user invokes
   their browser's print dialog. */
@media print {
  .mesh-print-toolbar { display: none !important; }
  /* And undo the body padding we added for the toolbar so the
     printed page doesn't have a phantom 48px gutter at the top. */
  body.mesh-print-mode { padding-top: 0 !important; }
}