/* ============================================================================
   owner-report.css — « Rapport mensuel au propriétaire » (/owner-report)

   The report is a sheet of Letter paper: white, dark ink, in both themes. On
   screen it sits on the page like a document; on paper it fills exactly one
   page. The toolbar above it never prints (print.css hides .no-print).
   ========================================================================== */

/* ---- Toolbar (screen only) ------------------------------------------------ */
.ownrep-bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); margin-bottom: var(--s-2); }
.ownrep-bar__month { display: inline-flex; align-items: center; gap: var(--s-2); min-width: 0; }
.ownrep-bar__month .select { width: auto; min-width: 160px; max-width: 100%; }
.ownrep-sched { margin: 0 0 var(--s-4); font-size: var(--fs-sm); color: var(--muted); overflow-wrap: anywhere; }

/* ---- The sheet ------------------------------------------------------------- */
.ownrep {
  /* Paper colours, the same in light and dark themes. */
  --or-ink: #14181f; --or-ink-2: #3a4250; --or-muted: #5d6676; --or-line: #d9dee6; --or-soft: #f3f5f8;
  --or-accent: #1d5fb8; --or-good: #1a7f4b; --or-bad: #b42318; --or-warn: #b26b00; --or-info: #2a78d6;
  /* The charts read these tokens: pin them to their light-paper values. */
  --c1: #2a78d6; --c2: #eb6834; --c3: #1baf7a; --c4: #eda100;
  --chart-grid: #e6eaf0; --chart-axis: #5d6676; --chart-primary: #2a78d6;
  --muted: var(--or-muted); --ink: var(--or-ink);

  box-sizing: border-box;
  width: 100%; max-width: 216mm; margin: 0 auto;
  padding: 11mm 12mm 8mm;
  background: #fff; color: var(--or-ink);
  border: 1px solid var(--border); border-radius: var(--r-md); box-shadow: var(--shadow-md);
  font-size: 9pt; line-height: 1.35;
  display: flex; flex-direction: column; gap: 4mm;
}
.ownrep * { box-sizing: border-box; }
.ownrep a { color: inherit; text-decoration: none; }
.ownrep a:hover { text-decoration: underline; }

.ownrep__head { display: flex; align-items: flex-start; gap: 6mm; padding-bottom: 3mm; border-bottom: 2px solid var(--or-ink); }
.ownrep__logo { width: 16mm; height: 16mm; object-fit: contain; flex: 0 0 auto; }
.ownrep__co { flex: 1 1 auto; min-width: 0; }
.ownrep__coname { font-size: 15pt; font-weight: 700; letter-spacing: -.01em; line-height: 1.15; overflow-wrap: anywhere; }
.ownrep__doctitle { font-size: 9pt; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--or-muted); margin-top: 1mm; }
.ownrep__meta { text-align: right; font-size: 8.5pt; color: var(--or-muted); flex: 0 0 auto; }
.ownrep__month { font-size: 13pt; font-weight: 700; color: var(--or-ink); text-transform: capitalize; }

.ownrep__h { font-size: 8.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--or-ink); margin: 0 0 2mm; padding-bottom: 1mm; border-bottom: 1px solid var(--or-line); }
.ownrep__hsub { font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--or-muted); margin-left: 1.5mm; }

/* « En bref » */
.ownrep__brief { background: var(--or-soft); border-left: 3px solid var(--or-accent); border-radius: 0 2mm 2mm 0; padding: 2.5mm 4mm; }
.ownrep__brief .ownrep__h { border-bottom: 0; padding-bottom: 0; margin-bottom: 1mm; color: var(--or-accent); }
.ownrep__brief ul { margin: 0; padding-left: 4mm; display: grid; gap: .8mm; }
.ownrep__brief li { font-size: 9.5pt; color: var(--or-ink); }

/* KPI band */
.ownrep__kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2.5mm; }
.ownrep__kpi { border: 1px solid var(--or-line); border-radius: 2mm; padding: 2mm 2.5mm; min-width: 0; }
.ownrep__kpil { font-size: 7pt; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--or-muted); line-height: 1.2; min-height: 2.4em; }
.ownrep__kpiv { font-size: 12.5pt; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; margin: .5mm 0 .8mm; overflow-wrap: anywhere; }
.ownrep__kpisub { font-size: 7.5pt; color: var(--or-muted); line-height: 1.3; }
.ownrep__chg b { font-weight: 700; white-space: nowrap; }
.ownrep__chg[data-tone="good"] b { color: var(--or-good); }
.ownrep__chg[data-tone="bad"] b { color: var(--or-bad); }
.ownrep__chg[data-tone="flat"] b { color: var(--or-muted); }

/* Two columns */
.ownrep__two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6mm; align-items: start; }
.ownrep__two--chart { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); }
.ownrep__two:not(.ownrep__two--chart) { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }

.ownrep__chart .chart text { fill: var(--or-muted); }
.ownrep__chart .legend { margin-top: 1mm; gap: 1mm 4mm; }
.ownrep__chart .legend__i { font-size: 7.5pt; color: var(--or-ink-2); }
.ownrep__cats { margin: 1.5mm 0 0; font-size: 7.5pt; color: var(--or-ink-2); }
.ownrep__cats b { text-transform: capitalize; }

/* Tables */
.ownrep__t { width: 100%; border-collapse: collapse; font-size: 8.5pt; }
.ownrep__t th { text-align: left; font-size: 7pt; text-transform: uppercase; letter-spacing: .04em; color: var(--or-muted); font-weight: 700; padding: 1mm 1.5mm; border-bottom: 1px solid var(--or-line); background: none; }
.ownrep__t td { padding: 1.2mm 1.5mm; border-bottom: 1px solid #edf0f4; vertical-align: top; }
.ownrep__t .r { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ownrep__unit { font-weight: 700; }
.ownrep__sub { display: block; font-size: 7pt; color: var(--or-muted); line-height: 1.25; }
.ownrep__facts td:last-child { font-weight: 700; }

/* Coming up */
.ownrep__coming { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5mm 4mm; }
.ownrep__coming > [data-slot="extras"] { display: contents; }
.ownrep__grp { min-width: 0; }
.ownrep__grph { display: flex; justify-content: space-between; gap: 2mm; font-size: 7.5pt; font-weight: 700; color: var(--or-ink-2); margin-bottom: .8mm; }
.ownrep__count { background: var(--or-soft); border-radius: 99px; padding: 0 1.8mm; font-variant-numeric: tabular-nums; }
.ownrep__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6mm; }
.ownrep__li { display: flex; align-items: center; gap: 1.5mm; font-size: 7.8pt; min-width: 0; }
.ownrep__dot { flex: 0 0 auto; width: 1.8mm; height: 1.8mm; border-radius: 50%; background: var(--or-muted); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.ownrep__dot[data-tone="danger"] { background: var(--or-bad); }
.ownrep__dot[data-tone="warning"] { background: var(--or-warn); }
.ownrep__dot[data-tone="accent"], .ownrep__dot[data-tone="info"] { background: var(--or-info); }
.ownrep__dot[data-tone="success"] { background: var(--or-good); }
.ownrep__lit { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ownrep__lim { flex: 0 0 auto; color: var(--or-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.ownrep__more, .ownrep__none { margin: .6mm 0 0; font-size: 7.3pt; color: var(--or-muted); }

.ownrep__defs { margin: 0; font-size: 6.8pt; color: var(--or-muted); line-height: 1.35; }
.ownrep__foot { display: flex; justify-content: space-between; align-items: center; gap: 4mm; flex-wrap: wrap; border-top: 1px solid var(--or-line); padding-top: 2mm; font-size: 7.5pt; color: var(--or-muted); margin-top: auto; }
/* The sheet is always white: show the wordmark made for light backgrounds. */
.ownrep .brandmark--light { display: inline-block !important; }
.ownrep .brandmark--dark { display: none !important; }
.ownrep__foot .brandmark { height: 13px; width: auto; }

/* ---- Narrow screens -------------------------------------------------------- */
@media screen and (max-width: 820px) {
  .ownrep { padding: 16px; font-size: 13px; }
  .ownrep__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ownrep__two, .ownrep__two--chart, .ownrep__two:not(.ownrep__two--chart) { grid-template-columns: minmax(0, 1fr); }
}
@media screen and (max-width: 480px) {
  .ownrep__head { flex-wrap: wrap; }
  .ownrep__meta { text-align: left; flex-basis: 100%; }
  .ownrep__coming { grid-template-columns: minmax(0, 1fr); }
  .ownrep__kpiv { font-size: 18px; white-space: normal; }
  .ownrep-bar__month { flex: 1 1 100%; }
  .ownrep-bar .spacer { display: none; }
  .ownrep-bar__month .select { flex: 1 1 auto; min-width: 0; }
}

/* ---- Paper: exactly one Letter page ---------------------------------------- */
@media print {
  .ownrep-bar, .ownrep-sched { display: none !important; }
  .ownrep {
    max-width: none; width: 100%; margin: 0; padding: 0;
    border: 0 !important; border-radius: 0; box-shadow: none !important;
    /* print.css: Letter with 14 mm × 12 mm margins leaves 251 mm of height. */
    height: 250mm; max-height: 250mm; overflow: hidden;
    break-inside: avoid; page-break-inside: avoid; break-after: avoid;
  }
  .ownrep__brief, .ownrep__count, .ownrep__chart svg { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .ownrep__kpis { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
  /* Everything keeps its size except the « coming up » row, which gives way
     first — so the footer and the brand always stay on the page. */
  .ownrep > * { flex-shrink: 0; }
  .ownrep > .ownrep__bottom { flex: 0 1 auto; min-height: 0; overflow: hidden; }
  .ownrep__two { display: grid !important; }
  .ownrep__coming { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .ownrep .legend__sw { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
