/* Public reports (opened from an email link): one readable column, phone friendly, printable. */

.report-page { background: var(--mc-bg); }
.report-shell { min-height: 100vh; display: flex; flex-direction: column; }
.report-topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; max-width: 62rem; width: 100%; margin: 0 auto; padding: 1rem 1.25rem 0; }
[data-bs-theme='dark'] .report-brand img { background: #fff; border-radius: var(--mc-radius-sm); padding: 0.2rem 0.45rem; }
.report { width: 100%; max-width: 62rem; margin: 0 auto; padding: 1rem 1.25rem 3rem; flex: 1; display: grid; gap: 1.25rem; align-content: start; }
.report-footer { padding: 1.25rem; text-align: center; color: var(--mc-muted); font-size: 0.8125rem; }

.report-hero {
  display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; padding: 1.5rem;
  border: 1px solid var(--mc-border); border-radius: var(--mc-radius-lg); background: var(--mc-surface); box-shadow: var(--mc-shadow-sm);
  border-top: 4px solid var(--mc-accent);
}
.report-hero-text { flex: 1 1 16rem; min-width: 0; }
.report-hero .eyebrow { margin: 0 0 0.25rem; font-size: 0.75rem; font-weight: 650; letter-spacing: 0.09em; text-transform: uppercase; color: var(--mc-brand); }
.report-hero h1 { margin: 0; font-size: clamp(1.4rem, 3.5vw, 2rem); overflow-wrap: anywhere; }
.report-meta { display: flex; flex-wrap: wrap; gap: 0.25rem 0.85rem; margin: 0.5rem 0 0; color: var(--mc-muted); font-size: 0.9375rem; }
.report-meta span + span::before { content: '·'; margin-right: 0.85rem; color: var(--mc-border-strong); }
.report-campaign-logo { max-height: 4.5rem; max-width: 9rem; object-fit: contain; }

.score-ring { --size: 7.5rem; width: var(--size); height: var(--size); border-radius: 50%; flex: none; display: grid; place-items: center;
  background: conic-gradient(var(--ring) calc(var(--p) * 1%), var(--mc-surface-2) 0); --ring: var(--mc-brand); }
.score-ring.good { --ring: var(--mc-success); }
.score-ring.fair { --ring: var(--mc-warning); }
.score-ring.poor { --ring: var(--mc-danger); }
.score-ring-inner { width: calc(var(--size) - 1.1rem); height: calc(var(--size) - 1.1rem); border-radius: 50%; background: var(--mc-surface); display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.1; }
.score-ring-inner strong { font-size: 1.6rem; letter-spacing: -0.02em; }
.score-ring-inner span { font-size: 0.75rem; color: var(--mc-muted); }

.report .stat-grid { margin-bottom: 0; }

.report-card { border: 1px solid var(--mc-border); border-radius: var(--mc-radius-lg); background: var(--mc-surface); box-shadow: var(--mc-shadow-sm); padding: 1.25rem 1.5rem; }
.report-card h2 { display: flex; align-items: center; gap: 0.5rem; margin: 0 0 1rem; font-size: 1.0625rem; }
.report-card h2 svg { color: var(--mc-brand); }
.report-empty { margin: 0; color: var(--mc-muted); }
.report-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.report-stack { display: grid; gap: 1.25rem; }
@media (max-width: 767.98px) { .report-columns { grid-template-columns: minmax(0, 1fr); } .report-hero { padding: 1.1rem; } }

/* Category performance */
.category-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.category-list li { display: flex; align-items: center; gap: 0.9rem; }
.cat-icon { position: relative; flex: none; width: 3rem; height: 3rem; border-radius: 50%; overflow: hidden; background: var(--mc-brand-soft); color: var(--mc-brand); display: grid; place-items: center; font-weight: 700; border: 2px solid var(--mc-surface-2); }
.cat-icon img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #fff; }
.cat-body { flex: 1; min-width: 0; }
.cat-head { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.9375rem; }
.cat-head strong { overflow-wrap: anywhere; }
.cat-body small { color: var(--mc-muted); }
.meter { height: 0.6rem; margin: 0.3rem 0 0.25rem; border-radius: 999px; background: var(--mc-surface-2); overflow: hidden; }
.meter span { display: block; height: 100%; border-radius: 999px; background: var(--mc-brand); }
.meter .good { background: var(--mc-success); }
.meter .fair { background: var(--mc-warning); }
.meter .poor { background: var(--mc-danger); }

/* Rankings */
.podium { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; align-items: end; }
.podium li { display: flex; flex-direction: column; align-items: center; gap: 0.2rem; padding: 0.9rem 0.4rem 0.8rem; border-radius: var(--mc-radius); background: var(--mc-surface-2); text-align: center; overflow-wrap: anywhere; }
.podium .place-1 { order: 2; padding-top: 1.4rem; padding-bottom: 1.2rem; background: color-mix(in srgb, #f5b301 18%, var(--mc-surface)); }
.podium .place-2 { order: 1; background: color-mix(in srgb, #98a2b3 20%, var(--mc-surface)); }
.podium .place-3 { order: 3; background: color-mix(in srgb, #c2410c 14%, var(--mc-surface)); }
.podium .medal { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--mc-ink); color: var(--mc-surface); font-weight: 700; }
.podium .place-1 .medal { background: #f5b301; color: #3b2a00; }
.podium .score { color: var(--mc-muted); font-size: 0.8125rem; }
.ranking { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.ranking li { display: flex; align-items: center; gap: 0.75rem; padding: 0.5rem 0.75rem; border-radius: var(--mc-radius-sm); background: var(--mc-surface-2); }
.ranking .rank { flex: none; width: 1.7rem; height: 1.7rem; display: grid; place-items: center; border-radius: 50%; background: var(--mc-surface); border: 1px solid var(--mc-border-strong); font-size: 0.8125rem; font-weight: 650; }
.ranking .name { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.ranking .score { color: var(--mc-muted); font-variant-numeric: tabular-nums; }

.report-table { margin: 0; }
.report-table td, .report-table th { vertical-align: middle; }
.result { display: inline-flex; align-items: center; gap: 0.35rem; font-weight: 550; }
.result.good { color: var(--mc-success); }
.result.poor { color: var(--mc-danger); }
.result-text { font-size: 0.8125rem; }

@media print {
  /* Always printed on white, whatever the screen theme */
  [data-bs-theme] {
    --mc-bg: #fff; --mc-surface: #fff; --mc-surface-2: #f2f4f7; --mc-border: #d0d5dd; --mc-border-strong: #b6bcc7;
    --mc-ink: #101828; --mc-ink-2: #344054; --mc-muted: #667085; --mc-brand: #c2410c; --mc-brand-soft: #fff1e8;
    --mc-success: #067647; --mc-warning: #b54708; --mc-danger: #b42318; --mc-shadow-sm: none;
  }
  body.report-page { background: #fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .report-actions { display: none !important; }
  .report-card, .report-hero, .stat-card { box-shadow: none; break-inside: avoid; }
  .category-list li, .podium, .ranking li { break-inside: avoid; }
  .report-topbar, .report { max-width: none; padding-left: 0; padding-right: 0; }
  .report-columns { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}