/* ==========================================================================
   Synegen Zoho CRM Portal — Print Stylesheet
   Enqueued with media="print" (see synegen-zoho-crm-portal.php), so every
   rule here is only ever active when the page is being printed.

   Covers: My Assignments, Assignment Detail, Other Contract Deliverables,
   Expenses, and Expense Detail. Those five templates reuse a small, fairly
   consistent set of class names (.szcp-mobile-container, .szcp-back-btn,
   .szcp-badge-*, etc.), so one shared stylesheet handles all of them.

   The WP theme chrome selectors below (site header/footer/admin bar) are a
   best-effort guess based on common WordPress + Blocksy conventions — this
   plugin doesn't own the active theme's markup, so verify these on staging
   and adjust if the theme's actual header/footer classes differ.
   ========================================================================== */

#wpadminbar,
.site-header,
.site-footer,
.ct-header,
.ct-footer,
nav.main-navigation {
  display: none !important;
}

html, body {
  background: #fff !important;
  margin: 0 !important;
  padding: 0 !important;
}

@page {
  size: landscape;
  margin: 12mm;
}

/* --------------------------------------------------------------------------
   Neutralize the app-shell scroll containers.
   On screen these are height:100vh (or min-height:100vh) with a sticky
   header, and on the two listing pages, overflow:hidden — which would
   silently clip everything below the fold when printed as-is.
   -------------------------------------------------------------------------- */
.szcp-mobile-container,
.szcp-detail-mobile,
.szcp-detail-form-container,
.szcp-related-deliverables-page,
.szcp-add-form-container,
.szcp-dashboard-container {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  display: block !important;
  background: #fff !important;
}

.szcp-cards-wrapper,
.szcp-detail-sections {
  overflow: visible !important;
  padding: 0 !important;
}

/* --------------------------------------------------------------------------
   Headers: flatten the purple gradient to plain black-on-white and unstick.
   -------------------------------------------------------------------------- */
.szcp-mobile-header,
.szcp-detail-header,
.szcp-detail-form-header,
.szcp-related-header,
.szcp-add-form-header,
.szcp-dashboard-header {
  position: static !important;
  background: #fff !important;
  background-image: none !important;
  box-shadow: none !important;
  border-bottom: 2px solid #000 !important;
  padding: 6px 0 10px !important;
  color: #000 !important;
  display: block !important;
}

.szcp-mobile-header h1,
.szcp-detail-title,
.szcp-related-header h1,
.szcp-dashboard-header h1 {
  color: #000 !important;
}

/* --------------------------------------------------------------------------
   Hide interactive-only chrome: nav, filters, action buttons, forms.
   -------------------------------------------------------------------------- */
.szcp-back-btn,
.szcp-print-btn,
.szcp-print-button,
.szcp-print-wrapper,
.szcp-related-deliverables-btn,
.szcp-btn-expense-compact,
.szcp-btn-add,
.szcp-filter-actions,
.szcp-filters-row select,
.szcp-toggle-chip,
.szcp-pagination-mobile,
.szcp-pagination-controls,
#pagination,
.szcp-add-attachment-form,
.szcp-add-note-form,
.szcp-attachment-type-selector,
.szcp-toggle-form-btn,
.szcp-section-toggle,
.szcp-completion-control select,
.szcp-completion-note {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Detail-page accordions: force every section open for print, regardless
   of whatever .active state the user left it in on screen.
   -------------------------------------------------------------------------- */
.szcp-section-content {
  max-height: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  padding: 4px 0 !important;
}

/* --------------------------------------------------------------------------
   Assignment Detail: the on-screen field layout (one field per row, each
   with generous label/value spacing) was built for a touch UI and runs to
   7-8 printed pages as-is. Force a dense 2-column grid with minimal padding
   regardless of viewport width, since print engines don't reliably evaluate
   min-width media queries against the @page size.
   -------------------------------------------------------------------------- */
.szcp-section {
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  margin-bottom: 4px !important;
  page-break-inside: avoid;
  break-inside: avoid;
}

.szcp-section-header {
  padding: 2px 0 !important;
}

.szcp-section-header h3 {
  font-size: 11px !important;
}

.szcp-field-group {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap: 20px !important;
  row-gap: 0 !important;
}

.szcp-field {
  padding: 2px 0 !important;
  gap: 1px !important;
  border-bottom: none !important;
  min-height: 0 !important;
}

.szcp-field-label {
  font-size: 7px !important;
  min-width: 0 !important;
  margin-bottom: 0 !important;
}

.szcp-field-value {
  font-size: 9px !important;
  line-height: 1.25 !important;
}

/* --------------------------------------------------------------------------
   Expense Detail: same problem, worse — each field renders as its own
   bordered/padded "input box" (built to look editable even though it's
   read-only), and with several line items each repeating 5-6 of those
   boxes, a multi-line-item expense report runs to 10+ printed pages.
   Flatten to dense label/value rows.
   -------------------------------------------------------------------------- */
.szcp-detail-form {
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
  max-width: none !important;
  border-radius: 0 !important;
}

.szcp-form-group {
  margin-bottom: 2px !important;
}

.szcp-form-group label {
  margin-bottom: 0 !important;
  font-size: 7px !important;
}

.szcp-form-group .szcp-field-value {
  padding: 0 !important;
  border: none !important;
  border-bottom: 1px solid #ccc !important;
  border-radius: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  font-size: 9px !important;
  line-height: 1.25 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.szcp-expense-line {
  background: transparent !important;
  padding: 2px 0 !important;
  border: none !important;
  border-top: 1px solid #000 !important;
  border-radius: 0 !important;
  margin-bottom: 2px !important;
  page-break-inside: avoid;
  break-inside: avoid;
}

.szcp-expense-line-header {
  margin-bottom: 2px !important;
  padding-bottom: 1px !important;
  border-bottom: 1px solid #000 !important;
}

.szcp-expense-line-number {
  font-size: 10px !important;
}

/* --------------------------------------------------------------------------
   Status badges rely on background-fill color, which most browsers don't
   print unless "background graphics" is enabled in the print dialog.
   Redesign as outlined text labels so status stays legible either way.
   -------------------------------------------------------------------------- */
.szcp-badge-inline,
.szcp-badge-green,
.szcp-badge-blue,
.szcp-badge-orange,
.szcp-badge-gray,
.szcp-badge-red,
.szcp-badge-upcoming,
.szcp-badge-status,
.szcp-related-status {
  background: #fff !important;
  color: #000 !important;
  border: 1px solid #000 !important;
  box-shadow: none !important;
  padding: 0 4px !important;
  font-size: 8px !important;
}

/* --------------------------------------------------------------------------
   Other Contract Deliverables: same padded/bordered/shadowed "card" problem
   as the two detail pages, just repeated once per row instead of once per
   field. Strip the card chrome so each deliverable is 2 dense lines instead
   of a whole boxed card, and stack the service/instructor line side by side.
   -------------------------------------------------------------------------- */
.szcp-related-list {
  gap: 1px !important;
}

.szcp-related-card {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 2px 0 !important;
  page-break-inside: avoid;
  break-inside: avoid;
}

.szcp-related-card:hover {
  transform: none !important;
}

.szcp-related-card-header {
  margin-bottom: 1px !important;
}

.szcp-related-link {
  font-size: 10px !important;
}

.szcp-related-date {
  font-size: 8px !important;
}

.szcp-related-meta {
  grid-template-columns: 2fr 1fr !important;
  gap: 1px 16px !important;
  padding-top: 0 !important;
  border-top: none !important;
  font-size: 9px !important;
}

.szcp-related-meta strong {
  min-width: 0 !important;
}

/* --------------------------------------------------------------------------
   Listing pages (My Assignments, Expenses): hide the card grid and show
   the dense print-only table instead. Print-only elements are marked
   style="display:none" inline in the markup so they never show on screen;
   this is what turns that back on for print.
   -------------------------------------------------------------------------- */
.szcp-cards-grid {
  display: none !important;
}

.szcp-print-header {
  display: block !important;
}

table.szcp-print-table {
  display: table !important;
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 10px;
}

.szcp-print-table th,
.szcp-print-table td {
  border: 1px solid #000;
  padding: 3px 6px;
  text-align: left;
  vertical-align: top;
}

.szcp-print-table th {
  background: #eee !important;
  font-weight: 700;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.szcp-print-header {
  margin-bottom: 8px;
}

.szcp-print-header h2 {
  margin: 0 0 2px;
  font-size: 16px;
}

.szcp-print-header .szcp-print-meta {
  font-size: 11px;
  color: #333;
}