/* Estilos para el snapshot de un diagnóstico guardado (Monitor de Salud),
   mostrado dentro de #diagSnapshotContent en la ficha del cliente.
   Estas reglas van escopeadas a ese contenedor para no afectar el resto de la página. */

#diagSnapshotContent{
  --green-dim:#1B8F63;
  --gray-dot:#4A5568;
  --good-bg:rgba(52,211,153,0.10);
  --warn-bg:rgba(242,184,75,0.10);
  --bad-bg:rgba(255,92,92,0.10);
  --radius:8px;
  --accent:var(--cyan);
  line-height:1.6;
}

#diagSnapshotContent .panel-title{
  font-family:'Space Grotesk',sans-serif;
  font-size:13px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--text-dim); margin:0 0 18px; display:flex; align-items:center; gap:10px;
}
#diagSnapshotContent .panel-title .tag{
  font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--bg);
  background:var(--accent); padding:2px 7px; border-radius:4px; letter-spacing:0;
}
#diagSnapshotContent .panel{ margin-bottom:26px; }

#diagSnapshotContent .confidence-bar{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  font-family:'IBM Plex Mono',monospace; font-size:12px;
  color:var(--text-dim); margin-bottom:18px; padding:12px 16px;
  background:var(--panel-2); border:1px solid var(--border); border-radius:6px;
}
#diagSnapshotContent #generalConfidenceDias{
  flex-basis:100%; margin-top:4px; padding-top:11px;
  border-top:1px solid var(--border-soft);
}
#diagSnapshotContent .dias-titulo{
  display:block; font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--text-faint); margin-bottom:9px;
}
#diagSnapshotContent .dias-item{ display:flex; align-items:baseline; gap:10px; padding:4px 0; font-size:14px; }
#diagSnapshotContent .dias-item::before{ content:"•"; color:var(--cyan); font-size:15px; line-height:1; }
#diagSnapshotContent .dias-fuente{ color:var(--text); font-weight:700; }
#diagSnapshotContent .dias-valor{ color:var(--cyan); font-weight:700; }
#diagSnapshotContent .chip{ font-weight:700; padding:2px 9px; border-radius:4px; letter-spacing:0.04em; }
#diagSnapshotContent .chip.alta::before{ content:"🟢 "; }
#diagSnapshotContent .chip.media::before{ content:"🟡 "; }
#diagSnapshotContent .chip.baja::before{ content:"🔴 "; }
#diagSnapshotContent .chip.alta{ background:rgba(52,211,153,0.16); color:var(--green); }
#diagSnapshotContent .chip.media{ background:rgba(242,184,75,0.16); color:var(--amber); }
#diagSnapshotContent .chip.baja{ background:rgba(255,92,92,0.16); color:var(--red); }

#diagSnapshotContent .verdict{ border-radius:var(--radius); padding:28px; margin-bottom:26px; border:1px solid var(--border); }
#diagSnapshotContent .verdict.good{ background:var(--good-bg); border-color:var(--green-dim); }
#diagSnapshotContent .verdict.warn{ background:var(--warn-bg); border-color:var(--amber); }
#diagSnapshotContent .verdict.bad{ background:var(--bad-bg); border-color:var(--red); }
#diagSnapshotContent .verdict .label{ font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; opacity:0.85; margin-bottom:10px; }
#diagSnapshotContent .verdict h2{ font-family:'Space Grotesk',sans-serif; font-size:22px; margin:0 0 12px; }
#diagSnapshotContent .verdict p{ margin:0; font-size:14.5px; color:var(--text); }
#diagSnapshotContent .verdict .level-badge{ display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:12px; padding:4px 10px; border-radius:5px; margin-top:14px; background:rgba(255,255,255,0.08); }
#diagSnapshotContent .verdict .note{ margin-top:14px; font-size:13px; color:var(--text-dim); border-top:1px solid rgba(255,255,255,0.08); padding-top:14px; }

/* Espejo del estilo de views/diagnostico.html: si cambia uno, cambiar el otro. */
#diagSnapshotContent .divider-label{
  font-family:'IBM Plex Mono',monospace; font-size:12.5px; font-weight:700; color:var(--cyan);
  letter-spacing:0.1em; text-transform:uppercase; margin:32px 0 14px;
  display:flex; align-items:center; gap:11px;
  text-shadow:0 0 14px rgba(52,216,196,0.32);
}
#diagSnapshotContent .divider-label:first-child{ margin-top:0; }
#diagSnapshotContent .divider-label::before{
  content:""; flex:0 0 3px; width:3px; height:16px;
  background:var(--cyan); border-radius:2px; box-shadow:0 0 9px rgba(52,216,196,0.55);
}
#diagSnapshotContent .divider-label::after{
  content:""; flex:1; height:1px;
  background:linear-gradient(90deg, var(--cyan-dim), var(--border-soft) 45%, transparent);
}
#diagSnapshotContent .divider-label.mini{
  margin:20px 0 10px; font-size:10.5px; letter-spacing:0.08em;
  color:var(--text-dim); text-shadow:none;
}
#diagSnapshotContent .divider-label.mini::before{ height:12px; background:var(--border); box-shadow:none; }
#diagSnapshotContent .divider-label.mini::after{ background:var(--border-soft); }
#diagSnapshotContent .divider-hint{
  text-transform:none; letter-spacing:0; font-family:'Inter',sans-serif;
  font-size:11px; font-weight:400; color:var(--text-faint); text-shadow:none;
}

#diagSnapshotContent .stage-row{ display:grid; grid-template-columns:22px 1fr auto; gap:16px; align-items:start; padding:20px 0; border-bottom:1px solid var(--border-soft); }
#diagSnapshotContent .stage-row:last-child{ border-bottom:none; }
#diagSnapshotContent .dot{ width:12px; height:12px; border-radius:50%; margin-top:5px; flex-shrink:0; }
#diagSnapshotContent .dot.good{ background:var(--green); box-shadow:0 0 6px var(--green); }
#diagSnapshotContent .dot.warn{ background:var(--amber); box-shadow:0 0 6px var(--amber); }
#diagSnapshotContent .dot.bad{ background:var(--red); box-shadow:0 0 6px var(--red); }
#diagSnapshotContent .dot.skip{ background:var(--gray-dot); }
#diagSnapshotContent .stage-main .stage-name{ font-weight:600; font-size:15px; margin-bottom:5px; }
#diagSnapshotContent .stage-main .stage-metric{ font-weight:400; color:var(--text-faint); }
#diagSnapshotContent .stage-main .stage-detail{ font-size:13px; color:var(--text-dim); margin-bottom:8px; }
#diagSnapshotContent .stage-main .stage-formula{
  font-size:12.5px; color:var(--text-faint); margin-bottom:8px;
  font-family:'IBM Plex Mono',monospace; line-height:1.55;
}
#diagSnapshotContent .stage-main .stage-formula strong{ font-family:'Inter',sans-serif; color:var(--text-dim); font-weight:600; }
#diagSnapshotContent .stage-main .stage-fix{ font-size:13px; color:var(--text); }
#diagSnapshotContent .stage-main .stage-fix strong{ color:var(--accent); }
#diagSnapshotContent .stage-value{ text-align:right; font-family:'IBM Plex Mono',monospace; white-space:nowrap; }
#diagSnapshotContent .stage-value .num{ font-size:17px; font-weight:600; }
#diagSnapshotContent .stage-value .range{ display:block; font-size:11px; color:var(--text-faint); margin-top:4px; max-width:220px; white-space:normal; }

#diagSnapshotContent .insight-row{ padding:14px 0; border-bottom:1px solid var(--border-soft); font-size:13.5px; color:var(--text); }
#diagSnapshotContent .insight-row:last-child{ border-bottom:none; }
#diagSnapshotContent .insight-row strong{ color:var(--accent); }

#diagSnapshotContent .health-chip{
  display:inline-block; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:15px;
  padding:6px 14px; border-radius:6px; letter-spacing:0.01em; margin-bottom:16px;
}
#diagSnapshotContent .health-chip.malo::before{ content:"🔴 "; }
#diagSnapshotContent .health-chip.salvable::before{ content:"🟠 "; }
#diagSnapshotContent .health-chip.bueno::before{ content:"🟢 "; }
#diagSnapshotContent .health-chip.muybueno::before{ content:"🌟 "; }
#diagSnapshotContent .health-chip.malo{ background:rgba(255,92,92,0.14); color:var(--red); }
#diagSnapshotContent .health-chip.salvable{ background:rgba(242,184,75,0.14); color:var(--amber); }
#diagSnapshotContent .health-chip.bueno{ background:rgba(52,211,153,0.14); color:var(--green); }
#diagSnapshotContent .health-chip.muybueno{ background:rgba(52,216,196,0.14); color:var(--cyan); }

#diagSnapshotContent #finalParagraph{ font-size:14.5px; color:var(--text); margin:0 0 10px; }
#diagSnapshotContent #finalActions{ margin:0; padding-left:22px; }
#diagSnapshotContent #finalActions li{ font-size:13.5px; color:var(--text); margin-bottom:12px; line-height:1.6; }
#diagSnapshotContent #finalActions li::marker{ color:var(--accent); font-family:'IBM Plex Mono',monospace; font-weight:600; }
#diagSnapshotContent #finalStructure{ font-size:14px; color:var(--text); background:var(--panel-2); border:1px solid var(--border); border-radius:6px; padding:16px 18px; margin:0; }
#diagSnapshotContent .narrative-item{ font-size:13.5px; color:var(--text); line-height:1.65; margin:0 0 16px; padding-left:14px; border-left:2px solid var(--border); }
#diagSnapshotContent .narrative-item:last-child{ margin-bottom:0; }
#diagSnapshotContent .conclusion-box{
  font-size:14.5px; color:var(--text); line-height:1.65; margin:0;
  background:linear-gradient(180deg, rgba(52,216,196,0.06), rgba(52,216,196,0.01));
  border:1px solid var(--cyan-dim); border-radius:6px; padding:18px 20px;
}
#diagSnapshotContent .no-actions{ font-size:13.5px; color:var(--text-dim); font-style:italic; }

#diagSnapshotContent .adset-result-card{ border:1px solid var(--border); border-radius:6px; padding:18px 20px; margin-bottom:16px; background:var(--panel-2); }
#diagSnapshotContent .adset-result-header{ display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; gap:10px; flex-wrap:wrap; }
#diagSnapshotContent .adset-result-header .name{ font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:15px; }
#diagSnapshotContent .adset-result-header .tipo{ color:var(--text-faint); font-size:12px; font-weight:400; margin-left:6px; }
#diagSnapshotContent .adset-result-header .health-chip{ margin:0; font-size:12px; padding:4px 10px; }
#diagSnapshotContent .adset-stage-mini{ display:flex; align-items:flex-start; gap:8px; padding:9px 0; border-bottom:1px solid var(--border-soft); font-size:12.5px; }
#diagSnapshotContent .adset-stage-mini:last-child{ border-bottom:none; }
#diagSnapshotContent .adset-stage-mini .dot{ margin-top:3px; width:9px; height:9px; }
#diagSnapshotContent .adset-stage-mini .m-name{ font-weight:600; color:var(--text); }
#diagSnapshotContent .adset-stage-mini .m-value{ margin-left:auto; font-family:'IBM Plex Mono',monospace; white-space:nowrap; }
#diagSnapshotContent .adset-comparison{
  background:var(--panel-2); border:1px solid var(--border); border-radius:6px; padding:18px 20px; margin-bottom:18px;
  font-size:13.5px; color:var(--text); line-height:1.6;
}
#diagSnapshotContent .adset-comparison strong{ color:var(--accent); }

/* ---- Bloque de tendencia (antes vs. últimos 7 días) ----
   Espejo de las reglas de views/diagnostico.html: si cambia una, cambiar la otra. */
#diagSnapshotContent .trend-block{
  margin-top:14px; padding:13px 15px; border-radius:6px;
  background:var(--panel-2); border-left:3px solid var(--border);
}
#diagSnapshotContent .trend-block.good{ border-left-color:var(--green); }
#diagSnapshotContent .trend-block.warn{ border-left-color:var(--amber); }
#diagSnapshotContent .trend-block.bad{ border-left-color:var(--red); }
#diagSnapshotContent .trend-block.info,
#diagSnapshotContent .trend-block.neutro{ border-left-color:var(--border); }
#diagSnapshotContent .trend-title{
  font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--text-faint); margin:0 0 10px;
}
#diagSnapshotContent .trend-row{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:8px 14px; padding:7px 0; border-bottom:1px solid var(--border-soft);
}
#diagSnapshotContent .trend-row:last-of-type{ border-bottom:none; }
#diagSnapshotContent .trend-metric{ font-size:13.5px; font-weight:700; flex-shrink:0; }
#diagSnapshotContent .trend-values{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
#diagSnapshotContent .trend-side{ display:flex; flex-direction:column; line-height:1.25; }
#diagSnapshotContent .trend-side-label{ font-size:10.5px; color:var(--text-faint); }
#diagSnapshotContent .trend-side-value{ font-family:'IBM Plex Mono',monospace; font-size:13px; font-weight:700; }
#diagSnapshotContent .trend-arrow{ color:var(--text-faint); font-size:14px; }
#diagSnapshotContent .trend-pct{
  font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:700;
  padding:2px 8px; border-radius:4px; white-space:nowrap;
}
#diagSnapshotContent .trend-pct.mejor{ background:rgba(52,211,153,0.16); color:var(--green); }
#diagSnapshotContent .trend-pct.peor{ background:rgba(255,92,92,0.16); color:var(--red); }
#diagSnapshotContent .trend-pct.igual{ background:rgba(139,150,168,0.16); color:var(--text-dim); }
#diagSnapshotContent .trend-verdict{ margin:12px 0 0; font-size:13.5px; line-height:1.6; }
#diagSnapshotContent .trend-verdict.good{ color:var(--green); }
#diagSnapshotContent .trend-verdict.warn{ color:var(--amber); }
#diagSnapshotContent .trend-verdict.bad{ color:var(--red); }
#diagSnapshotContent .trend-verdict.info{ color:var(--text-dim); }
#diagSnapshotContent .trend-nota,
#diagSnapshotContent .trend-aviso{ margin:10px 0 0; font-size:12.5px; line-height:1.55; color:var(--text-dim); }
#diagSnapshotContent .trend-aviso{ margin:0; }

/* Cartel de "todavía es pronto" y explicación de fuentes del veredicto. */
#diagSnapshotContent .alerta-datos{
  margin-bottom:16px; padding:14px 16px; border-radius:6px;
  background:rgba(242,184,75,0.10); border:1px solid var(--amber);
  color:var(--text); font-size:13.5px; line-height:1.6;
}
#diagSnapshotContent .alerta-datos strong{ color:var(--amber); }
#diagSnapshotContent .fuentes-nota{
  margin:0 0 4px; padding:11px 14px; border-radius:6px;
  background:var(--panel-2); border-left:3px solid var(--cyan-dim);
  font-size:13px; line-height:1.65; color:var(--text-dim);
}
#diagSnapshotContent .fuentes-nota strong{ color:var(--text); }

#diagSnapshotContent details.bench{ margin-top:30px; }
#diagSnapshotContent details.bench summary{ cursor:pointer; font-size:13px; color:var(--text-dim); font-family:'IBM Plex Mono',monospace; }
#diagSnapshotContent details.bench table{ width:100%; border-collapse:collapse; margin-top:16px; font-size:12.5px; }
#diagSnapshotContent details.bench th, #diagSnapshotContent details.bench td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--border-soft); color:var(--text-dim); }
#diagSnapshotContent details.bench th{ color:var(--text-faint); font-weight:500; font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.05em; }
