/* Report for Bishop (ReportDesktop, ReportPhone, and ReportPrint for the report's own look).  At 1024px and up the
   period, Include, confidential and past reports cards sit left of the report, drawn as a paper sheet.  Below that
   the controls fold into a summary, each section stands on its own and Mark as presented and Open PDF sit in a bar
   above the tab bar. */

@media (min-width: 1024px) { .report-phone-only { display: none !important; } }
@media (max-width: 1023px) { .report-desktop-only { display: none !important; } }

/* At the top of the left column on desktop: Mark as presented and the PDF link, stacked full width, with the inline
   confirm under them.  A past report has only its PDF link there; its presented line sits above the report. */
.report-toolbar { display: flex; flex-direction: column; gap: var(--space-12); }
.report-toolbar .report-actions-buttons { flex-direction: column; align-items: stretch; }
.report-toolbar > .btn, .report-toolbar .report-actions-buttons .btn { width: 100%; justify-content: center; }
.report-past-head { display: flex; flex-direction: column; gap: var(--space-2); }
.report-heading {
  font-family: var(--font-display); font-size: var(--type-title-sm); font-weight: var(--weight-display);
  line-height: var(--leading-tight); color: var(--text-title);
}
.report-head-meta { display: flex; align-items: center; gap: var(--space-6); font-size: var(--type-meta); color: var(--text-muted); }
.report-lock { color: var(--ruby-800); }

/* Mark as presented, its inline confirm and the PDF link. */
.report-actions { display: contents; }
.report-actions-buttons { display: flex; align-items: center; gap: var(--space-12); }
.report-confirm {
  order: 3; flex: 1 1 100%; display: flex; flex-direction: column; gap: var(--space-12); padding: 14px 16px;
  border: 1.5px solid var(--ruby-800); border-radius: var(--radius-control); background: var(--surface-card);
}
.report-confirm[hidden] { display: none; }
.report-confirm-text { display: flex; flex-direction: column; gap: 3px; flex-grow: 1; }
.report-confirm-title { font-size: var(--type-body-sm); font-weight: var(--weight-bold); color: var(--ruby-800); }
.report-confirm-body { font-size: var(--type-meta); color: var(--text-muted); line-height: var(--leading-note); }
.report-confirm-buttons { display: flex; gap: var(--space-8); justify-content: flex-end; }
.report-confirm-form { display: flex; margin: 0; }

/* The phone's bottom bar, above the tab bar. */
.report-phone-bar {
  position: fixed; z-index: 10; left: 0; right: 0; bottom: var(--tabbar-h); padding: var(--space-12) var(--space-16);
  background: var(--surface-card); border-top: 1px solid var(--border-card); box-shadow: var(--shadow-sheet);
}
.report-actions.is-phone { display: flex; flex-direction: column; gap: var(--space-10); }
.report-actions.is-phone .report-actions-buttons {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-10);
}
.report-actions.is-single .report-actions-buttons { grid-template-columns: minmax(0, 1fr); }
.report-actions.is-phone .report-actions-buttons .btn {
  height: var(--control-h-lg); border-radius: var(--radius-choice); font-size: var(--type-body); min-width: 0;
}
.report-actions.is-phone .report-confirm { order: 0; }
.report-actions.is-phone .report-confirm-buttons > * { flex: 1 1 0; }
.report-actions.is-phone .report-confirm-buttons .btn { width: 100%; }

/* Layout. */
.report { display: flex; flex-direction: column; gap: var(--space-20); min-width: 0; }
@media (max-width: 1023px) { .report { padding-bottom: calc(var(--control-h-lg) + var(--space-36)); } }
@media (min-width: 1280px) {
  .report { display: grid; grid-template-columns: 300px minmax(0, 1fr); align-items: start; }
}
.report-aside { display: flex; flex-direction: column; gap: var(--space-16); min-width: 0; }
.report-main { display: flex; flex-direction: column; gap: var(--space-20); min-width: 0; }
/* Narrow desktops: the controls sit in a row of cards above the sheet, so the sheet keeps its width. */
@media (min-width: 1024px) and (max-width: 1279px) {
  .report-aside { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
  .report-aside .report-controls { display: contents; }
  .report-aside .report-footnote { grid-column: 1 / -1; }
}
.report-card-title {
  font-family: var(--font-display); font-size: var(--type-lead); font-weight: var(--weight-display);
  color: var(--text-heading); line-height: var(--leading-snug);
}

/* The period and Include cards. */
.report-controls { display: flex; flex-direction: column; gap: var(--space-16); margin: 0; }
.report-control { margin: 0; min-width: 0; padding: var(--space-18); gap: var(--space-6); }
.report-control > legend { float: left; width: 100%; padding: 0; margin-bottom: var(--space-4); }
.report-choice {
  display: flex; align-items: center; gap: var(--space-10); min-height: var(--chip-h); font-size: var(--type-body-sm);
  cursor: pointer;
}
.report-choice:has(input[type='radio']:checked) { font-weight: var(--weight-semibold); }
.report-choice input { width: 18px; height: 18px; margin: 0; flex-shrink: 0; accent-color: var(--navy-700); }
.report-custom { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-10); padding-top: var(--space-4); }
.report-control:not(:has(input[value='custom']:checked)) .report-custom { display: none; }
.report-custom-field { min-width: 0; }
.report-custom-field .input { min-width: 0; }
.report-custom-show { grid-column: 1 / -1; }

/* Phones: the controls fold into a summary. */
.report-phone-controls-summary {
  display: flex; flex-direction: column; gap: var(--space-2); padding: 14px 16px; cursor: pointer; list-style: none;
  position: relative; padding-right: 88px;
}
.report-phone-controls-summary::-webkit-details-marker { display: none; }
.report-phone-controls-summary::after {
  content: 'Change'; position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  font-size: var(--type-body-sm); font-weight: var(--weight-bold); color: var(--text-link);
}
.report-phone-controls[open] .report-phone-controls-summary::after { content: 'Close'; }
.report-phone-controls-title { font-size: var(--type-body); font-weight: var(--weight-bold); }
.report-phone-controls-detail { font-size: var(--type-meta); color: var(--text-muted); }
.report-phone-controls .report-controls { gap: 0; }
.report-phone-controls .report-control {
  border: 0; border-top: 1px solid var(--border-row); border-radius: 0; box-shadow: none; padding: 14px 16px;
}

/* The confidential banner. */
.report-banner {
  display: flex; flex-direction: column; gap: var(--space-8); padding: var(--space-18); border-radius: var(--radius-card);
  background: var(--ruby-800); color: var(--text-on-chrome);
}
.report-banner-title { display: flex; align-items: center; gap: var(--space-8); font-size: var(--type-body); font-weight: var(--weight-bold); }
.report-banner-body { font-size: var(--type-meta); line-height: var(--leading-body); color: var(--ruby-100); }

/* The phone header's confidential tag. */
.report-phone-head { padding: 0 20px 16px; }
.report-phone-badge {
  display: inline-flex; align-items: center; gap: var(--space-6); padding: 4px 10px; border-radius: var(--radius-tag);
  background: var(--ruby-800); color: var(--text-on-chrome); font-size: var(--type-caption); font-weight: var(--weight-bold);
}

/* Past reports. */
.report-past .report-card-title { padding: 16px 18px 8px; }
.report-past-rows { list-style: none; margin: 0; padding: 0; }
.report-past-row {
  display: flex; justify-content: space-between; align-items: center; gap: var(--space-12); padding: 11px 18px;
  border-top: 1px solid var(--border-row); font-size: var(--type-body-sm);
}
.report-past-date { font-weight: var(--weight-semibold); color: var(--text-body); text-decoration: none; }
.report-past-date:hover { color: var(--text-link-hover); text-decoration: underline; }
.report-past-meta { font-size: var(--type-caption); color: var(--text-muted); text-align: right; }
.report-past-empty { padding: 0 18px 16px; font-size: var(--type-meta); color: var(--text-muted); line-height: var(--leading-note); }
.report-footnote { padding: 0 4px; font-size: var(--type-caption); line-height: var(--leading-body); color: var(--text-muted); }
.report-phone-past { display: flex; flex-direction: column; gap: var(--space-12); }

/* The report: separate sections on phones, a paper sheet on desktop. */
.report-doc { display: flex; flex-direction: column; gap: var(--space-22); min-width: 0; }
@media (min-width: 1024px) {
  .report-doc {
    width: 100%; gap: var(--space-28); padding: var(--space-28);
    background: var(--surface-card); border: 1px solid var(--border-card); border-radius: var(--radius-xs);
    box-shadow: var(--shadow-form); font-size: var(--type-body-lg); line-height: var(--leading-body);
  }
}
@media (min-width: 1280px) { .report-doc { padding: calc(var(--space-36) * 2); } }
.report-doc-head {
  display: flex; flex-direction: column; gap: var(--space-6); padding-bottom: var(--space-16);
  border-bottom: 2px solid var(--navy-950);
}
.report-doc-eyebrow {
  font-size: var(--type-caption); font-weight: var(--weight-bold); letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase; color: var(--walnut-700);
}
.report-doc-title {
  font-family: var(--font-display); font-size: var(--type-title-xl); font-weight: var(--weight-display);
  line-height: var(--leading-tight); color: var(--text-title);
}
.report-doc-meta { font-size: var(--type-body-sm); color: var(--text-secondary); }
.report-doc-foot {
  padding-top: var(--space-12); border-top: 1px solid var(--paper-500); font-size: var(--type-caption);
  color: var(--text-muted);
}
.report-empty { font-size: var(--type-body-sm); color: var(--text-muted); }

/* Sections and their headings, colored as ReportPrint and ReportPhone draw them. */
.report-section { display: flex; flex-direction: column; gap: var(--space-10); min-width: 0; color: var(--walnut-900); }
.report-section-new-needs { color: var(--ruby-800); }
.report-section-completed { color: var(--green-800); }
.report-section > :not(.report-section-head) { color: var(--text-body); }
.report-section > .report-empty { color: var(--text-muted); }
.report-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-12); }
.report-section-title {
  font-family: var(--font-display); font-size: var(--type-section); font-weight: var(--weight-display);
  line-height: var(--leading-snug);
}
.report-section-count { font-size: var(--type-meta); font-weight: var(--weight-bold); white-space: nowrap; }
@media (min-width: 1024px) {
  .report-section-head { padding-bottom: var(--space-4); border-bottom: 1px solid currentColor; }
  .report-section-ministering .report-section-head { padding-bottom: 0; border-bottom: 0; }
  .report-section-title { font-size: var(--type-title-sm); }
  .report-section-count { font-size: var(--type-body-sm); }
}

/* The ministering summary: a table on desktop, EQ and RS tiles on phones. */
.report-table { width: 100%; border-collapse: collapse; font-size: var(--type-body-sm); }
.report-table th, .report-table td { text-align: left; }
.report-num { text-align: right !important; font-variant-numeric: tabular-nums; }
.report-stats thead tr { background: var(--navy-950); color: var(--text-on-chrome); }
.report-stats th, .report-stats td { padding: 8px 12px; }
.report-stats thead th { font-weight: var(--weight-bold); }
.report-stats tbody th { font-weight: var(--weight-semibold); }
.report-stats tbody tr { border-bottom: 1px solid var(--paper-500); }
.report-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-10); }
.report-tile {
  display: flex; flex-direction: column; gap: var(--space-8); padding: var(--space-14); border-radius: var(--radius-card);
  background: var(--navy-950); color: var(--navy-100); min-width: 0;
}
.report-tile-rs { background: var(--walnut-900); color: var(--walnut-300); }
.report-tile-name {
  font-size: var(--type-caption); font-weight: var(--weight-bold); letter-spacing: var(--tracking-label);
  text-transform: uppercase; color: var(--gold-200);
}
.report-tile-line { font-size: var(--type-meta); overflow-wrap: anywhere; }
.report-tile-line strong { font-size: var(--type-lead); color: var(--text-on-chrome); }

/* Need rows: cards on phones, ReportPrint's boxed list on desktop. */
.report-rows {
  list-style: none; margin: 0; padding: 0; background: var(--surface-card); border: 1px solid var(--border-card);
  border-radius: var(--radius-card); overflow: hidden;
}
.report-need { display: grid; grid-template-columns: minmax(0, 1fr); padding: 13px 14px; border-top: 1px solid var(--border-row); }
.report-rows > :first-child { border-top: 0; }
.report-need-box { display: none; }
.report-need-main { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.report-need-head { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-6) var(--space-8); min-width: 0; }
.report-need-name {
  font-size: var(--type-body); font-weight: var(--weight-bold); color: var(--text-body); text-decoration: none;
  overflow-wrap: anywhere;
}
a.report-need-name:hover { color: var(--text-link); text-decoration: underline; }
.report-need-about { font-size: var(--type-caption); color: var(--text-muted); overflow-wrap: anywhere; }
.report-need-text {
  font-size: var(--type-body-sm); line-height: var(--leading-note); color: var(--text-secondary); overflow-wrap: anywhere;
  white-space: pre-line;
}
.report-need-meta { font-size: var(--type-caption); color: var(--text-muted); overflow-wrap: anywhere; }
@media (min-width: 1024px) {
  .report-rows { background: transparent; border: 0; border-radius: 0; overflow: visible; }
  .report-need { grid-template-columns: 20px minmax(0, 1fr); gap: var(--space-10); padding: 6px 0; border-top: 0; }
  .report-need-box {
    display: flex; align-items: center; justify-content: center; width: 16px; height: 16px; margin-top: 4px;
    border: 1.5px solid var(--ink-900); border-radius: var(--radius-xs); font-size: var(--type-caption);
    font-weight: var(--weight-bold); line-height: 1;
  }
  .report-section-completed .report-need-box { border-color: var(--green-800); background: var(--green-800); color: var(--text-on-chrome); }
  .report-need-name { font-size: var(--type-body-lg); }
  .report-need-text { font-size: var(--type-body-lg); line-height: var(--leading-body); color: var(--text-body); }
  .report-need-meta { font-size: var(--type-meta); }
}

/* Moves: a table on desktop, rows with a Moved in or Moved out tag on phones. */
.report-moves th, .report-moves td { padding: 6px 8px; }
.report-moves thead tr { border-bottom: 1.5px solid var(--ink-900); }
.report-moves tbody tr { border-bottom: 1px solid var(--paper-500); }
.report-moves .report-move-name { font-weight: var(--weight-semibold); }
.report-move {
  display: flex; justify-content: space-between; gap: var(--space-10); padding: 12px 14px;
  border-top: 1px solid var(--border-row);
}
.report-move-main { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.report-move .report-move-name { font-size: var(--type-body); font-weight: var(--weight-bold); overflow-wrap: anywhere; }
.report-move-ministers, .report-move-date { font-size: var(--type-caption); color: var(--text-muted); }
.report-move-side { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-2); flex-shrink: 0; }