/* =============================================================================
 * print.css — print-only rules for the panel and public-page layouts.
 *
 * Loaded with media="print" (see layouts/panel.php and layouts/public.php),
 * so none of this reaches the screen stylesheet and there is no specificity
 * fight with theme.css/panel.css/public.css — it only has to win against
 * itself. Kept as a single @media print block per-file anyway (rather than
 * relying on the link's media attribute alone) so the rules stay correct if
 * this file is ever concatenated with others.
 *
 * Scope: the panel (member/admin dashboard — invoices, traffic tables, any
 * other data-table screen) and public hosted pages (vCard, Menu, Business
 * Page, Digital CV, Link-in-Bio, WiFi, Form). Both wrap real content — an
 * invoice, a table, a card — in app chrome that is meaningless on paper.
 * ========================================================================== */

@media print {

  /* ---- Chrome that never belongs on paper ----
     Panel: sidebar/nav, its mobile toggle, the user/theme/language
     switchers, the fixed footer bar and its legal links, flash/notify
     banners. Public: the floating theme/language switcher stack. Hiding by
     class rather than by layout wrapper keeps this working even if a view
     nests one of these inside its own content. */
  .sidebar,
  .nav-toggle,
  .sidebar-switchers,
  .panel-footer,
  .flash,
  .flash-bar,
  .public-switchers,
  /* The skip link only exists to move keyboard focus; on paper it is a stray
     word floating above the page. */
  .skip-link,
  /* Legal document modal markup (_partials/legal_modal.php) is a <dialog>
     that only shows when opened; belt-and-braces so it can never eat a
     printed page. */
  .legal-modal {
    display: none !important;
  }

  /* ---- Interactive controls that make no sense once ink is involved ----
     Submit/action buttons, filter/search bars, pagination controls and the
     per-column sort links on data tables all exist to change what's on
     screen; on paper they're dead UI taking up space. */
  .btn-primary, .btn-primary-sm, .btn-cancel,
  .btn-action, .btn-action--warn, .btn-action--ok, .btn-action--danger,
  .btn-danger-sm, .btn-ok-sm, .btn-clear, .btn-copy,
  .btn-outline-sm, .btn-outline-xs, .btn-icon,
  .filter-bar,
  /* The menu's dietary filter is revealed by app.js, so it is display:none
     only until then — without this it would print as a row of dead pills.
     The dishes it FILTERED OUT stay filtered out on paper, which is what a
     diner who printed after filtering asked for. */
  .menu-filter,
  .pager, .page-header .back-link,
  [data-copy] {
    display: none !important;
  }
  /* Sortable table headers are `<a>` tags around the label — drop the link
     chrome but keep the label text and its sort arrow, which is real content. */
  .data-table th a {
    color: inherit !important;
    text-decoration: none !important;
    pointer-events: none;
  }

  /* ---- Let tables print in full ----
     .table-responsive exists purely to add a horizontal scrollbar on
     screen; on paper there is no scrollbar, so `overflow-x: auto` just
     clips anything past the page edge instead. Printed tables should
     shrink-to-fit and wrap, not scroll. */
  .table-responsive,
  .inv-items-wrap {
    overflow: visible !important;
    -webkit-overflow-scrolling: visible !important;
  }
  table, .data-table, table.inv-items {
    width: 100% !important;
    table-layout: auto;
  }
  /* Long free-text columns (referer/redirect-to, notes) are usually
     truncated + title="" for the tooltip on screen; on paper there is no
     hover, so let them wrap instead of being clipped mid-word. */
  .text-truncate {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    max-width: none !important;
  }

  /* ---- Force readable print colours ----
     The app is dark-by-default (data-theme="dark") and would otherwise send
     a near-black page background plus light text to the printer: readable
     on screen, a wasted black rectangle (or invisible text) on paper.
     Pinning the light-theme token VALUES here — not just resetting a couple
     of properties — means every rule elsewhere that reads var(--text-1),
     var(--surface-1), etc. automatically resolves to a print-safe colour
     without this file having to know every selector that uses them. */
  /* !important on every custom property: theme_head.php emits an inline
     <style> (no media attribute, so it also applies to print) with the
     brand's --gold/--ink/--bg AFTER this stylesheet in the head, at the
     same `:root`/`:root[data-theme="light"]` specificity — plain
     declarations here would lose to it and the black background would
     come right back. */
  /* data-theme="auto" is listed because a page pinned to auto is stamped
     with it until the head script resolves it — and on a visitor with
     JavaScript off it is never resolved at all. Without this arm the
     print override matched nothing on those pages and the black ground
     this whole block exists to prevent came back on paper. */
  :root, :root[data-theme="dark"], :root[data-theme="light"], :root[data-theme="auto"] {
    color-scheme: light;
    --bg: #ffffff !important;
    --ink: #0a0f16 !important;
    --surface-1: #ffffff !important;
    --surface-2: #ffffff !important;
    --surface-3: #ffffff !important;
    --border-1: #d0d5dd !important;
    --border-2: #d0d5dd !important;
    --border-3: #b8bfc9 !important;
    --text-1: #0f172a !important;
    --text-1b: #1f2937 !important;
    --text-2: #334155 !important;
    --text-3: #475569 !important;
    --text-4: #64748b !important;
    --input-bg: #ffffff !important;
    --input-border: #b8bfc9 !important;
    --gold-text: #7d621b !important;
  }
  html, body, body.panel-body,
  .panel-main, .panel-section, .table-card, .form-card {
    background: #ffffff !important;
    color: #0f172a !important;
  }
  .panel-main {
    padding: 0 !important;
    margin: 0 !important;
  }
  /* color-mix(...) tints (card/section backgrounds, subtle borders) are
     computed from --text-1/--surface-1 at parse time in the screen sheet,
     but those functions don't get a second pass here — pin the handful of
     containers that actually wrap printable content directly instead. */
  .panel-section, .table-card, .form-card {
    border: 1px solid #d0d5dd !important;
  }
  a { color: #0f172a !important; text-decoration: none !important; }
  code, .text-mono { color: #0f172a !important; }

  /* Badges keep their meaning (status) but not their glow — flatten to
     bordered, dark-on-white chips so they still read on a mono printer. */
  [class*="badge-"], .badge {
    background: #ffffff !important;
    color: #0f172a !important;
    border: 1px solid #94a3b8 !important;
  }

  /* ---- Avoid breaking rows/cards across a page edge ----
     Cheap layout hints only — no forced page breaks, since that would
     waste paper on short reports. */
  tr, .table-card, .panel-section, .form-card, .inv-totals .row {
    break-inside: avoid;
  }
  thead {
    display: table-header-group; /* repeat column headers on each printed page */
  }

  /* ---- Hosted public pages ----
     A vCard/Menu/Business Page/CV/WiFi/Form/Link-in-Bio is the entire point
     of the printed page (public.php wraps it in `.card`/`.card--*`); strip
     the decorative screen surface (shadow) but keep a plain border so
     content sections stay visually separated on paper. */
  .card {
    box-shadow: none !important;
    border: 1px solid #d0d5dd !important;
    background: #ffffff !important;
  }
}