/* ── Mismo aspecto que el Business Case de Portfolio IA (copiado de apps/portfolio-ia/css/views/
   evaluacion.css y tareas.css, que no cambian): tarjetas de fase, bloques plegables,
   «Estado y decisión» y popup «Decidir». Solo lo cargan las apps de la plantilla. ── */
.tv-fases { display: flex; flex-direction: column; gap: 12px; }
.tv-fase { padding: 0; overflow: visible; }
.tv-fase-cabecera { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; width: 100%; padding: 12px 16px; background: none; border: 0; color: var(--text); font: inherit; text-align: left; cursor: pointer; border-radius: var(--radius); }
.tv-fase-cabecera:hover { background: var(--bg3); }
.tv-fase-cabecera:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.tv-fase-titulo { font-size: 14px; font-weight: 600; }
.tv-fase-cuenta { margin-left: auto; font-size: 12px; color: var(--text2); }
.tv-fase-chevron { width: 16px; height: 16px; color: var(--text2); transition: transform 200ms ease; }
.tv-fase-cabecera.is-open .tv-fase-chevron { transform: rotate(180deg); }
.tv-fase-barra { display: grid; grid-template-columns: 96px minmax(120px, 1fr) auto; gap: 12px; align-items: center; font-size: 12px; }
.tv-fase-barra-etq { color: var(--text2); }
.tv-fase-barra-cifra { color: var(--text2); white-space: nowrap; }
.tv-fase-cuerpo { display: none; padding: 0 16px 16px; border-top: 1px solid var(--border); }
.tv-fase-cuerpo.open, .tv-fase-cuerpo.is-closing { display: block; }
.kcard .khoras { font-size: 11px; color: var(--text2); margin-bottom: 6px; }
@media (max-width: 768px) {
  .tv-fase-barra { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .tv-fase-cuenta { margin-left: 0; }
}

/* Fase plegada: también se ocultan sus tarjetas (el resumen va dentro del cuerpo). */
.tv-fase-resumen { padding: 16px 0 4px; }
.tv-fase-resumen .stat-grid { margin-bottom: 18px; }
.tv-fase-barras { display: flex; flex-direction: column; gap: 12px; }
.tv-fase-barra .progress { height: 10px; border-radius: 999px; }
.eval-cuerpo { display: flex; flex-direction: column; gap: var(--space-3, 12px); }
/* Solo se recorta mientras se anima: abiertos, los desplegables salen por encima de la tarjeta */
.eval-cuerpo.is-animando, .eval-cuerpo.is-closing,
.eval-card-body.is-animando, .eval-card-body.is-closing,
.eval-comentario-panel.is-animando, .eval-comentario-panel.is-closing { overflow: hidden; }
.eval-card, .eval-card .card-body { overflow: visible; }
/* Las tarjetas son siempre `relative`: abrir un desplegable solo sube su z-index (antes cambiaba el
   `position` de la tarjeta entera y obligaba a recalcular y repintar todo su contenido). */
.eval-card { position: relative; z-index: 1; }
.eval-card:has(.ms-wrap.open), .eval-card:focus-within { z-index: 5; }
/* Popup «Decidir»: todas las decisiones a la vista. */
.eval-decision-ops { display: flex; flex-direction: column; gap: 6px; }
.eval-decision-op { display: flex; align-items: flex-start; gap: 10px; padding: 9px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg2); cursor: pointer; transition: border-color var(--transition-fast), background var(--transition-fast); }
.eval-decision-op:hover:not(.is-disabled) { border-color: var(--border2); background: var(--bg3); }
.eval-decision-op:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.eval-decision-op[data-decision="rechazada"]:has(input:checked) { border-color: var(--red); background: var(--red-soft); }
.eval-decision-op:has(input:focus-visible) { outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent); outline-offset: 1px; }
.eval-decision-op.is-disabled { opacity: 0.5; cursor: not-allowed; }
.eval-decision-op input { margin-top: 3px; accent-color: var(--accent); flex: none; }
.eval-decision-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.eval-decision-txt strong { font-size: 13px; color: var(--text); }
.eval-decision-txt small { font-size: 12px; line-height: 1.4; color: var(--text2); }
.eval-decision-req { display: none; }
#ev-decision-comentario-grupo.req .eval-decision-req { display: inline; }
.eval-cuerpo:not(.open):not(.is-closing),
.eval-card-body:not(.open):not(.is-closing),
.eval-comentario-panel:not(.open):not(.is-closing) { display: none; }
/* Estado de la evaluación */
.eval-estado .card-body { display: flex; flex-direction: column; gap: 12px; }

.eval-resumen .stat-grid { margin-bottom: 0; }

/* Tarjetas de criterios */
.eval-card .card-header { gap: 12px; flex-wrap: wrap; }
.eval-card-derecha { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; margin-left: auto; min-width: 0; }
.eval-card-resumen { color: var(--text2); font-size: 12px; }
.eval-card-resumen:empty { display: none; }
.eval-card:has(.eval-card-body:not(.open)) .card-header { border-bottom-color: transparent; }
.eval-plegar {
  display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0;
  border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg2); color: var(--text2); cursor: pointer;
  transition: border-color var(--transition-fast), color var(--transition-fast), background var(--transition-fast);
}
.eval-plegar svg { width: 16px; height: 16px; transform: rotate(180deg); transition: transform 0.32s cubic-bezier(.34, 1.56, .64, 1); }
.eval-plegar[aria-expanded="false"] svg { transform: rotate(0deg); }
.eval-plegar:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.eval-plegar:hover svg { transform: rotate(180deg) translateY(2px); }
.eval-plegar[aria-expanded="false"]:hover svg { transform: translateY(2px); }
.eval-acciones { display: flex; justify-content: flex-end; gap: 8px; }
.eval-ed { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.eval-ed-panel {
  --ed: var(--accent);
  --ed-texto: color-mix(in srgb, var(--ed) 72%, var(--text));
  display: flex; flex-direction: column; gap: 8px; min-width: 0; padding: 14px 16px; border-radius: var(--radius-sm);
  border: 1px solid color-mix(in srgb, var(--ed) 38%, transparent);
  background: color-mix(in srgb, var(--ed) 11%, var(--bg2));
}
.eval-ed-panel[data-tono="valor"] { --ed: var(--green); }
.eval-ed-panel[data-tono="aviso"] { --ed: var(--warning); }
.eval-ed-panel[data-tono="riesgo"] { --ed: var(--red); }
.eval-ed-faltan:empty { display: none; }
.eval-ed-tag {
  align-self: flex-start; padding: 2px 10px; border-radius: var(--radius-pill); font-size: 11px; font-weight: 700;
  letter-spacing: .03em; color: var(--ed-texto); background: color-mix(in srgb, var(--ed) 22%, transparent);
}
.eval-ed-titulo { font-size: 18px; font-weight: 700; line-height: 1.2; color: var(--ed-texto); }
.eval-ed-meta { font-size: 12px; color: var(--text2); }
.eval-ed-texto { margin: 0; font-size: 13px; line-height: 1.5; color: var(--text2); }
.eval-ed-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.eval-ed-chip {
  padding: 3px 10px; border-radius: var(--radius-pill); font-size: 12px; color: var(--text);
  background: var(--bg2); border: 1px solid color-mix(in srgb, var(--ed) 38%, transparent);
}
.eval-ed-nota { display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: var(--text); }
.eval-ed-nota-titulo { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ed-texto); }
.eval-ed-cita { margin: 0; padding: 6px 12px; border-radius: var(--radius-sm); background: var(--bg2); font-size: 13px; font-style: italic; color: var(--text2); }
.eval-ed-vigente { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text2); }
.eval-ed-vigente svg { width: 14px; height: 14px; flex: none; color: var(--green); }
.eval-ed-acciones { display: flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 10px; border-top: 1px dashed color-mix(in srgb, var(--ed) 45%, transparent); }
.eval-ed-hueco { flex: 1; }
@media (max-width: 720px) { .eval-ed { grid-template-columns: minmax(0, 1fr); } }
.eval-req-marca svg { width: 12px; height: 12px; }

/* Tarjetas por fase de Business Case e IA Act (mismo patrón que Tareas, tareas.css · .tv-fase). */
.eval-fases-tarjetas { margin-bottom: 16px; }
.eval-fase-tarjeta-cab { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding-right: 12px; }
.eval-fase-tarjeta-cab .tv-fase-cabecera { flex: 1 1 260px; min-width: 260px; }
.eval-fase-tarjeta-cab .tv-fase-cabecera .badge { white-space: nowrap; }
.eval-fase-tarjeta-cab .tv-fase-cuenta { white-space: nowrap; }
.eval-fase-tarjeta-cab .eval-acciones { flex: 0 1 auto; margin: 0 0 0 auto; flex-wrap: wrap; padding: 6px 0; }
.eval-fase-tarjeta.is-actual { border-color: var(--border2, var(--border)); }
.eval-fase-tarjeta .tv-fase-cuerpo, .eval-fase-tarjeta .eval-fase-tarjeta-cuerpo { padding: 16px; border-top: 1px solid var(--border); }
@media (max-width: 768px) {
  .eval-fase-tarjeta-cab { padding: 0 12px 12px 0; }
  .eval-fase-tarjeta-cab .tv-fase-cabecera { min-width: 0; flex-basis: 100%; }
  .eval-fase-tarjeta-cab .eval-acciones { width: 100%; padding-left: 16px; }
}
/* ── Propio de la plantilla: tablas editables de esfuerzo y costes, valoración ── */
.pf-bc-valoracion { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pf-bc-tabla-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg2); }
.pf-bc-tabla { width: 100%; border-collapse: collapse; font-size: 13px; }
.pf-bc-tabla.is-editable { min-width: 820px; }
.pf-bc-tabla th { padding: 9px 12px; text-align: left; font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text3); background: var(--bg3); border-bottom: 1px solid var(--border); white-space: nowrap; }
.pf-bc-tabla td { padding: 8px 12px; vertical-align: top; border-bottom: 1px solid var(--border); }
.pf-bc-tabla tbody tr:last-child td { border-bottom: 0; }
.pf-bc-tabla .col-number { text-align: right; white-space: nowrap; }
.pf-bc-tabla td.col-number { padding-top: 16px; }
.pf-bc-tabla .form-input, .pf-bc-tabla .form-select { width: 100%; min-width: 0; box-sizing: border-box; }
.pf-bc-tabla input[type="number"] { text-align: right; }
.pf-bc-tabla .col-acciones { width: 1%; }
.pf-bc-proveedor { display: grid; gap: 6px; }
.pf-bc-aviso { margin: 0 0 12px; padding: 9px 12px; border-radius: var(--radius-sm); background: var(--warning-soft); color: color-mix(in srgb, var(--warning) 70%, var(--text)); font-size: 13px; line-height: 1.5; }
.pf-bc-nota { margin: 0; font-size: 13px; }
@media (max-width: 900px) { .pf-bc-valoracion { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .eval-fase-tarjeta-cab .tv-fase-cabecera { min-width: 0; } .eval-acciones { width: 100%; } .eval-acciones > button { flex: 1 1 auto; } }

/* ── Esfuerzo y Costes previstos con el aspecto de Portfolio IA (evaluacion.css): líneas en
   tarjeta, cálculo de cada línea (.eval-rl, color por frecuencia) y resumen de costes. ── */
.eval-anadir-mas.detail-add-icon { min-width: 40px; height: 30px; padding: 0 12px; }
.eval-card-derecha .eval-anadir-mas { order: -1; }
.eval-esfuerzo-linea, .eval-linea { display: flex; flex-direction: column; gap: 10px; padding: 12px; margin-bottom: 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg2); }
.pf-bc-linea .form-group { display: flex; flex-direction: column; gap: 6px; margin: 0; min-width: 0; }
.pf-bc-linea .form-input, .pf-bc-linea .form-select { width: 100%; box-sizing: border-box; }
.pf-bc-linea input[type="number"] { text-align: right; }
.pf-bc-linea-fila { display: grid; grid-template-columns: minmax(140px, 1fr) minmax(0, 2fr) 34px; gap: 12px; align-items: end; }
.pf-bc-linea-campos { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px 12px; align-items: end; }
.eval-rl-host:empty { display: none; }
.eval-linea[data-frec="unico"], .eval-rl[data-frec="unico"] { --frec-c: var(--frec-unico); }
.eval-linea[data-frec="recurrente"], .eval-rl[data-frec="recurrente"] { --frec-c: var(--frec-recurrente); }
.eval-linea[data-frec="horas"], .eval-rl[data-frec="horas"] { --frec-c: var(--frec-horas); }
.eval-rl {
  --frec-texto: color-mix(in srgb, var(--frec-c) 72%, var(--text));
  display: flex; flex-direction: column; gap: 10px; padding: 12px 16px;
  border: 1px solid color-mix(in srgb, var(--frec-c) 38%, transparent); border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--frec-c) 11%, var(--bg2));
}
.eval-rl-ecuacion { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 12px; }
.eval-rl-factor { display: inline-flex; align-items: baseline; gap: 6px; min-width: 0; white-space: nowrap; font-family: var(--font-mono); }
.eval-rl-factor b { font-size: 15px; font-weight: 700; color: var(--frec-texto); }
.eval-rl-op { font-family: var(--font-mono); font-size: 16px; font-weight: 600; color: var(--frec-texto); opacity: .6; }
.eval-rl-igual { margin-left: auto; }
.eval-rl-total b { font-size: 20px; }
.eval-rl.is-solo-total .eval-rl-total { margin-left: auto; }
.eval-totales { margin-top: 12px; border-top: 1px solid var(--border); padding-top: 8px; }
.eval-total-fila { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; font-size: 13px; color: var(--text2); }
.eval-total-final { color: var(--text); font-weight: 600; font-size: 14px; }
.pf-bc-contingencia { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 16px; margin-top: 4px; }
.pf-bc-contingencia .form-group { display: flex; flex-direction: column; gap: 6px; margin: 0; width: 180px; }
.pf-bc-contingencia .text-xs { padding-bottom: 10px; }
.pf-bc-resumen-costes { margin-top: 12px; }
.pf-bc-barra { display: flex; height: 14px; overflow: hidden; border-radius: 999px; background: var(--bg3); gap: 2px; }
.pf-bc-barra-seg { width: var(--pf-bc-peso, 0%); min-width: 4px; background: var(--pf-bc-c); transition: width .4s ease; }
.pf-bc-punto { display: inline-block; width: 10px; height: 10px; margin-right: 8px; border-radius: 3px; background: var(--pf-bc-c); vertical-align: -1px; }
.pf-bc [data-tono="interno"] { --pf-bc-c: var(--accent); }
.pf-bc [data-tono="externo"] { --pf-bc-c: var(--view-6, var(--accent)); }
.pf-bc [data-tono="capex"] { --pf-bc-c: var(--capex); }
.pf-bc [data-tono="opex"] { --pf-bc-c: var(--opex); }
.pf-bc [data-tono="contingencia"] { --pf-bc-c: var(--text3); }
.pf-bc-total-fila.is-cero { opacity: .55; }
@media (max-width: 640px) {
  .pf-bc-linea-fila { grid-template-columns: minmax(0, 1fr) 34px; }
  .pf-bc-linea-fila > .form-group { grid-column: 1; }
  .pf-bc-linea-fila > button { grid-column: 2; grid-row: 1; }
  .eval-rl-igual { display: none; }
  .eval-rl:not(.is-solo-total) .eval-rl-total { flex-basis: 100%; padding-top: 8px; border-top: 1px dashed color-mix(in srgb, var(--frec-c) 45%, transparent); }
}