/* =========================================================
   Acrux Dashboards — Design Tokens
   Paleta consistente con la suite MexiApps (Acrux Sheets/Decks)
   ========================================================= */
:root{
  --acx-navy:#0B2545;
  --acx-navy-2:#13315C;
  --acx-blue:#2E6FF2;
  --acx-blue-bg:#EAF1FE;
  --acx-green:#16A34A;
  --acx-green-bg:#E7F8EE;
  --acx-yellow:#C9820A;
  --acx-yellow-bg:#FFF6E0;
  --acx-red:#D9363E;
  --acx-red-bg:#FDEAEA;
  --acx-bg:#F4F6FA;
  --acx-border:#E3E8F0;
  --acx-text:#101828;
  --acx-text-2:#5B6472;
  --acx-text-3:#8A93A3;
  --acx-radius:14px;
  --acx-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* La UI de "subir archivo / home" ahora vive en uploader.css.
   Este archivo se enfoca solo en el resultado renderizado. */

/* =========================================================
   DASHBOARD (resultado renderizado)
   ========================================================= */
.acruxd-dashboard{ font-family:var(--acx-font); color:var(--acx-text); background:var(--acx-bg); padding:20px; border-radius:16px; }

.acruxd-header{
  background:linear-gradient(120deg, var(--acx-navy) 0%, var(--acx-navy-2) 100%);
  border-radius:16px; padding:20px 24px; display:flex; align-items:center; justify-content:space-between;
  gap:16px; flex-wrap:wrap; margin-bottom:16px;
}
.acruxd-header-left{ display:flex; align-items:center; gap:14px; }
.acruxd-avatar{
  width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.14);
  border:1.5px solid rgba(255,255,255,.35); color:#fff; font-weight:800; font-size:18px;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.acruxd-eyebrow{ color:#8FB2F5; font-size:11px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; }
.acruxd-name{ color:#fff; font-size:22px; font-weight:800; line-height:1.2; }
.acruxd-meta{ color:#B9C8E8; font-size:13px; margin-top:2px; }
.acruxd-header-right{ display:flex; align-items:center; gap:14px; }
.acruxd-score-label{ color:#B9C8E8; font-size:11px; font-weight:700; text-transform:uppercase; text-align:right; }
.acruxd-score-value{ color:#fff; font-size:30px; font-weight:800; text-align:right; line-height:1.1; }
.acruxd-score-value span{ font-size:14px; font-weight:500; color:#B9C8E8; }
.acruxd-status-pill{ background:#fff; border-radius:20px; padding:8px 16px; font-weight:700; font-size:13px; }

.acruxd-banner{
  background:var(--acx-blue-bg); border:1px solid #CFE0FB; border-radius:12px;
  padding:14px 18px; display:flex; gap:10px; align-items:flex-start; margin-bottom:16px;
}
.acruxd-banner p{ margin:0; font-size:15px; line-height:1.5; font-weight:600; color:var(--acx-navy); }

/* Performance Evolution (Fase 3) — comparación vs. el run anterior ------- */
.acruxd-evolution-strip{
  background:#F8F9FB; border:1px solid var(--acx-border); border-radius:12px;
  padding:11px 18px; display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  margin-bottom:16px; font-size:13px; color:var(--acx-text-2);
}
.acruxd-evolution-score{ display:flex; align-items:center; gap:7px; font-weight:700; color:var(--acx-navy); }
.acruxd-evolution-delta{ font-weight:800; padding:2px 9px; border-radius:999px; font-size:12px; }
.acruxd-evolution-delta--up{ background:var(--acx-green-bg); color:var(--acx-green); }
.acruxd-evolution-delta--down{ background:var(--acx-red-bg); color:var(--acx-red); }
.acruxd-evolution-delta--flat{ background:#EEF0F3; color:var(--acx-text-3); }

.acruxd-kpi-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(150px,1fr)); gap:12px; margin-bottom:16px; }
.acruxd-kpi-card{
  background:#fff; border:1px solid var(--acx-border); border-left:4px solid var(--accent, var(--acx-blue));
  border-radius:12px; padding:14px 16px;
}
.acruxd-kpi-card .k-label{ font-size:11px; font-weight:700; color:var(--acx-text-2); text-transform:uppercase; letter-spacing:.3px; }
.acruxd-kpi-card .k-value{ font-size:26px; font-weight:800; color:var(--acx-navy); margin-top:4px; }
.acruxd-kpi-card .k-value small{ font-size:13px; font-weight:600; color:var(--acx-text-3); }
.acruxd-kpi-card .k-sub{ font-size:12px; color:var(--acx-text-3); margin-top:2px; }
.acruxd-kpi-card .k-delta{ display:inline-block; font-size:11px; font-weight:800; margin-top:6px; padding:1px 8px; border-radius:999px; }
.acruxd-kpi-card .k-delta--up{ background:var(--acx-green-bg); color:var(--acx-green); }
.acruxd-kpi-card .k-delta--down{ background:var(--acx-red-bg); color:var(--acx-red); }
.acruxd-kpi-card .k-delta--flat{ background:#EEF0F3; color:var(--acx-text-3); }

.acruxd-card{ background:#fff; border:1px solid var(--acx-border); border-radius:14px; padding:18px; margin-bottom:16px; }
.acruxd-sec-title{ font-size:15px; font-weight:800; color:var(--acx-navy); margin:0 0 14px; }
.acruxd-sec-title .tag{ font-weight:400; color:var(--acx-text-3); font-size:12px; margin-left:6px; }

.acruxd-charts-row{ display:grid; grid-template-columns:1fr 1.4fr; gap:16px; margin-bottom:16px; }
@media (max-width:720px){ .acruxd-charts-row{ grid-template-columns:1fr; } }
.acruxd-gauge-svg{ width:100%; max-width:280px; margin:0 auto; display:block; }
.acruxd-gauge-state{ text-align:center; font-weight:800; font-size:16px; margin-top:-10px; }
.acruxd-radar-wrap{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.acruxd-radar-svg{ width:220px; flex-shrink:0; }
.acruxd-radar-legend{ list-style:none; margin:0; padding:0; flex:1; min-width:160px; }
.acruxd-radar-legend li{ display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px solid #F0F2F6; font-size:13px; color:var(--acx-text-2); }
.acruxd-radar-legend li b{ color:var(--acx-navy); }

.acruxd-bar-row{ display:flex; align-items:center; gap:10px; padding:8px 0; }
.bar-name{ width:34%; font-size:13px; font-weight:600; }
.bar-name small{ color:var(--acx-text-3); font-weight:400; }
.bar-track{ flex:1; height:10px; background:#F0F2F6; border-radius:6px; position:relative; }
.bar-fill{ height:100%; border-radius:6px; }
.bar-ref{ position:absolute; top:-3px; bottom:-3px; width:1px; background:#98A2B3; }
.bar-pct{ width:60px; text-align:right; font-weight:800; font-size:13px; }

.acruxd-chip-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(160px,1fr)); gap:8px; }
.acruxd-chip{ background:#F8F9FB; border-radius:8px; padding:8px 12px; display:flex; flex-direction:column; gap:2px; }
.acruxd-chip .c-name{ font-size:12px; font-weight:600; }
.acruxd-chip .c-val{ font-size:13px; font-weight:800; }

.acruxd-row-2col{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
@media (max-width:720px){ .acruxd-row-2col{ grid-template-columns:1fr; } }

.acruxd-list-item{ display:flex; gap:10px; padding:8px 0; border-bottom:1px solid #F0F2F6; }
.acruxd-list-item:last-child{ border-bottom:none; }
.badge{ width:22px; height:22px; border-radius:50%; color:#fff; font-weight:800; font-size:11px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.badge-green{ background:var(--acx-green); } .badge-red{ background:var(--acx-red); }
.li-top{ display:flex; justify-content:space-between; gap:8px; font-size:13px; }
.li-top span{ color:var(--acx-text-2); font-weight:600; white-space:nowrap; }
.li-com{ font-size:12px; color:var(--acx-text-3); margin-top:1px; }

.acruxd-prio-item{ display:flex; gap:12px; align-items:center; border:1px solid var(--acx-border); border-radius:10px; padding:12px 14px; margin-bottom:10px; }
.prio-num{ font-size:22px; font-weight:800; color:var(--acx-blue); width:26px; text-align:center; flex-shrink:0; }
.prio-body{ flex:1; }
.pname{ font-weight:700; font-size:14px; }
.pmeta{ font-size:12px; color:var(--acx-text-2); }
.pact{ font-size:12px; color:var(--acx-navy); margin-top:2px; }
.prio-impact{ text-align:center; flex-shrink:0; }
.prio-impact .pnum{ font-size:18px; font-weight:800; color:var(--acx-green); }
.prio-impact .plbl{ font-size:10px; color:var(--acx-text-3); }

.acruxd-insight-text{ font-size:14px; line-height:1.6; color:#28303D; margin:0; }
.acruxd-reco-item{ display:flex; gap:10px; font-size:13px; line-height:1.5; padding:5px 0; }
.reco-num{ width:20px; height:20px; border-radius:50%; background:var(--acx-blue-bg); color:var(--acx-blue); font-weight:800; font-size:11px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }

/* Decision Copilot (Fase 4) — "Pregúntale a tu Dashboard" ---------------- */
.acruxd-copilot-buttons{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:4px; }
.acruxd-copilot-btn{
  background:var(--acx-blue-bg); color:var(--acx-blue); border:none; border-radius:999px;
  padding:8px 15px; font-size:12.5px; font-weight:700; cursor:pointer; font-family:inherit;
}
.acruxd-copilot-btn:hover{ background:#DCE9FD; }
.acruxd-copilot-btn:disabled{ opacity:.5; cursor:not-allowed; }
.acruxd-copilot-btn.is-loading{ opacity:.6; cursor:wait; }

.acruxd-copilot-thread{ margin-top:12px; display:flex; flex-direction:column; gap:10px; }
.acruxd-copilot-msg{ max-width:88%; padding:10px 14px; border-radius:14px; font-size:13.5px; line-height:1.5; }
.acruxd-copilot-msg--question{
  align-self:flex-end; background:var(--acx-navy); color:#fff; border-bottom-right-radius:4px;
}
.acruxd-copilot-msg--answer{
  align-self:flex-start; background:#F4F6FA; color:var(--acx-text); border-bottom-left-radius:4px;
}
.acruxd-copilot-msg--error{ align-self:flex-start; background:var(--acx-red-bg); color:var(--acx-red); border-bottom-left-radius:4px; }
.acruxd-copilot-msg--loading{ align-self:flex-start; background:#F4F6FA; color:var(--acx-text-3); font-style:italic; }

.acruxd-copilot-form{ display:flex; gap:8px; margin-top:14px; }
.acruxd-copilot-form input{
  flex:1; border:1.5px solid var(--acx-border); border-radius:12px; padding:10px 14px;
  font-size:13.5px; font-family:inherit; color:var(--acx-text);
}
.acruxd-copilot-form input:focus{ outline:none; border-color:var(--acx-blue); }
.acruxd-copilot-form .acruxd-btn-primary{ width:auto; flex-shrink:0; padding:10px 20px; font-size:13.5px; white-space:nowrap; }

.acruxd-footer{ text-align:center; font-size:11px; color:var(--acx-text-3); padding-top:8px; }

/* =========================================================
   EXPORT A4 (impresión / "Guardar como PDF" del navegador)
   ========================================================= */
@media print{
  @page{ size:A4 portrait; margin:10mm; }
  body *{ visibility:hidden; }
  .acruxd-dashboard, .acruxd-dashboard *{ visibility:visible; }
  .acruxd-dashboard{ position:absolute; left:0; top:0; width:100%; background:#fff; padding:0; }
  .acruxd-card, .acruxd-kpi-card{ break-inside:avoid; }
}
.acruxd-dashboard.is-print{ max-width:190mm; margin:0 auto; }