/* report.css — Estilos específicos del reporte generado.
   Se carga después de grader.css. */

.report-hero__gauge { justify-self: end; }
.report-hero__gauge .score-num { color: var(--color-fg); }

.share-line {
  margin: 22px 0 0; padding: 10px 16px; display: inline-block;
  border: 1.5px solid var(--bno-slack-black); border-radius: var(--radius-pill);
  background: var(--bno-paper); font-size: 15px; font-weight: 650;
}
.share-line strong { font-weight: 850; }
.report-emailed { margin: 14px 0 0; font-size: 14px; color: var(--color-fg-muted); }

/* Lo que ya está funcionando */
.whats-working { max-width: 820px; margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.whats-working li { position: relative; padding-left: 34px; font-size: 17px; line-height: 1.45; font-weight: 600; }
.whats-working li::before {
  content: ""; position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: 50%;
  background: var(--grade-great);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9.55 17.6 4 12l1.4-1.4 4.15 4.15L18.6 5.3 20 6.7z'/%3E%3C/svg%3E") center/15px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9.55 17.6 4 12l1.4-1.4 4.15 4.15L18.6 5.3 20 6.7z'/%3E%3C/svg%3E") center/15px no-repeat;
}

/* Primera impresión */
.first-impression {
  max-width: 860px; margin: 0; padding: 28px 32px;
  border-left: 5px solid var(--bno-fiery-orange);
  background: var(--bno-paper); border-radius: 0 8px 8px 0; box-shadow: var(--en-shadow);
  font: italic 450 clamp(20px, 2.6vw, 28px)/1.4 var(--font-display); color: var(--color-fg);
}

/* Bloque de riesgo portal */
.portal-risk {
  max-width: 820px; padding: 24px 28px; border-radius: 8px;
  background: var(--grade-poor-soft); border: 1.5px solid var(--grade-poor-ink);
  display: grid; gap: 10px;
}
.portal-risk h3 { margin: 0; font: 650 22px/1.05 var(--font-display); color: var(--grade-poor-ink); }
.portal-risk p { margin: 0; font-size: 16px; line-height: 1.5; color: var(--color-fg); }

/* Quick wins */
.quickwins { max-width: 880px; margin: 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.quickwin { display: grid; grid-template-columns: 40px 1fr; gap: 16px; align-items: start;
  padding: 20px; background: var(--bno-paper); border: 1.5px solid var(--bno-slack-black); border-radius: 8px; box-shadow: var(--en-shadow); }
.quickwin-n { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center;
  background: var(--bno-fiery-orange); color: var(--bno-slack-black); font: 850 17px/1 var(--font-sans); }
.quickwin strong { display: block; margin-bottom: 3px; font-size: 17px; }
.quickwin div { color: var(--color-fg-muted); line-height: 1.45; }
.quickwin div strong { color: var(--color-fg); }

/* Sin sitio — callout especial */
.no-website-callout {
  max-width: 820px; padding: 22px 26px; border-radius: 8px;
  background: var(--en-soft-yellow); border-left: 5px solid var(--bno-mellow-yellow);
  font-size: 16px; line-height: 1.5;
}
.no-website-callout strong { display: block; margin-bottom: 4px; font-size: 18px; }

/* No pudimos verificar */
.could-not-verify { max-width: 820px; margin: 0; padding-left: 20px; color: var(--color-fg-muted); line-height: 1.6; }

@media (max-width: 760px) {
  .report-hero__gauge { justify-self: start; }
}