/* Herramientas de negocio de advise.ec (14-nov-2026): días de cartera, retorno de automatizar un proceso y qué proceso
   automatizar primero. Complementa css/herramientas.css (usa sus variables --hz-*). Prefijo hzn-. Móvil primero. */
.hzn [hidden] { display: none !important; }
.hzn .hz-label { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.hzn .hz-field { align-content: start; } /* en columnas, que la etiqueta no se estire: los campos quedan alineados */
.hzn-opc { font-size: 12.5px; font-weight: 600; color: var(--hz-ink2); background: rgba(2,22,47,.06); border-radius: 999px; padding: 1px 8px; }

/* Unidad dentro del campo (USD, %, días) */
.hzn-af { position: relative; min-width: 0; }
.hzn-af-t { position: absolute; top: 50%; transform: translateY(-50%); font-size: 15px; font-weight: 600; color: var(--hz-ink2); pointer-events: none; }
.hzn-af-t-pre { left: 14px; }
.hzn-af-t-suf { right: 14px; }
.hzn-af-pre .hz-input { padding-left: 54px; }
.hzn-af-suf .hz-input { padding-right: 40px; }
.hzn-af-suf-l .hz-input { padding-right: 58px; }

/* Bloques del formulario */
.hzn-bloque { border: 0; margin: 0 0 20px; padding: 0; min-width: 0; }
.hzn-bloque-t { float: left; width: 100%; padding: 0; margin: 0 0 12px; font-weight: 700; font-size: 16px; color: var(--hz-navy); }
.hzn-bloque-t + * { clear: both; }
.hzn-modo { border: 0; margin: 0; padding: 0; min-width: 0; }
.hzn-modo legend { float: left; width: 100%; padding: 0; margin: 0 0 6px; }
.hzn-modo legend + * { clear: both; }

/* Selector de dos opciones (por personas / monto directo) */
.hzn-seg { display: grid; grid-template-columns: 1fr 1fr; border: 1.5px solid rgba(2,22,47,.22); border-radius: 12px; overflow: hidden; background: #fff; }
.hzn-seg label { position: relative; display: block; min-width: 0; }
.hzn-seg input, .hzn-escala input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.hzn-seg span { display: flex; align-items: center; justify-content: center; min-height: 46px; padding: 8px 10px; text-align: center;
  font-weight: 600; font-size: 15px; cursor: pointer; color: var(--hz-ink); }
.hzn-seg label + label span { border-left: 1.5px solid rgba(2,22,47,.22); }
.hzn-seg input:checked + span { background: var(--hz-navy); color: #fff; }
.hzn-seg input:focus-visible + span { box-shadow: inset 0 0 0 3px var(--hz-acc); }

/* Priorizar: tarjetas de proceso y escala del 1 al 5 */
.hzn-ref { margin: 0 0 18px; border: 1px solid var(--hz-hair); border-radius: 12px; padding: 0 14px; }
.hzn-ref summary { cursor: pointer; font-weight: 600; padding: 12px 0; color: var(--hz-acc-ink); }
.hzn-ref dl { margin: 0 0 8px; }
.hzn-ref dt { font-weight: 700; margin-top: 10px; color: var(--hz-ink); }
.hzn-ref dd { margin: 2px 0 0; font-size: 14.5px; color: var(--hz-ink2); }
.hzn-ref > .hz-ayuda { margin: 0 0 12px; }
.hzn-procs { display: grid; gap: 14px; }
.hzn-proc { border: 1px solid var(--hz-hair); border-radius: 16px; margin: 0; padding: 14px 14px 16px; min-width: 0; background: #fff; }
@media (min-width: 720px) { .hzn-proc { padding: 18px 20px 20px; } }
.hzn-proc-t { float: left; width: 100%; padding: 0; margin: 0 0 12px; font-weight: 700; font-size: 16px; color: var(--hz-navy); }
.hzn-proc-in { clear: both; display: grid; gap: 16px; }
@media (min-width: 720px) { .hzn-proc-in { grid-template-columns: 1fr 1fr; gap: 16px 22px; } .hzn-proc-in > .hz-field:first-child { grid-column: 1 / -1; } }
.hzn-crit { border: 0; margin: 0; padding: 0; min-width: 0; }
.hzn-crit legend { float: left; width: 100%; padding: 0; margin: 0 0 8px; }
.hzn-escala { clear: both; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.hzn-escala label { position: relative; display: block; min-width: 0; }
.hzn-num { display: flex; align-items: center; justify-content: center; min-height: 44px; border: 1.5px solid rgba(2,22,47,.22); border-radius: 10px;
  font-weight: 700; font-size: 16px; cursor: pointer; background: #fff; color: var(--hz-ink); }
.hzn-escala label:hover .hzn-num { border-color: var(--hz-acc); }
.hzn-escala input:checked + .hzn-num { background: var(--hz-navy); border-color: var(--hz-navy); color: #fff; }
.hzn-escala input:focus-visible + .hzn-num { outline: 2px solid var(--hz-acc); outline-offset: 2px; }
.hzn-desc { margin: 6px 0 0; min-height: 1.5em; }
.hzn-peso { font-size: 13px; font-weight: 600; color: var(--hz-acc-ink); background: rgba(14,128,196,.1); border-radius: 999px; padding: 1px 8px; }
.hzn-quitar { min-height: 40px; padding: 10px 16px; font-size: 15px; }
.hzn-quitar-fila { grid-column: 1 / -1; }
.hz-btn:disabled { opacity: .45; cursor: not-allowed; }
.hzn-max { margin: 8px 0 0; }

/* Resultado */
.hzn .hz-res-t { flex-wrap: wrap; }
.hzn .hz-big { overflow-wrap: anywhere; }
.hzn-big-mal { color: var(--hz-mal) !important; }
.hzn-lectura { margin: 0 0 14px; font-size: 16px; color: var(--hz-ink); }
.hzn-vacio { margin: 0; color: var(--hz-ink2); }
/* Filas etiqueta–valor: si el valor no cabe al lado (teléfono), baja a su propia línea, alineado a la derecha */
.hzn-tabla, .hzn-tabla tbody { display: block; }
.hzn-tabla tr { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 2px 14px;
  padding: 9px 0; border-bottom: 1px solid var(--hz-hair); }
.hzn-tabla tr:last-child { border-bottom: 0; }
.hzn-tabla th, .hzn-tabla td { display: block; padding: 0; border: 0; }
.hzn-tabla th { flex: 1 1 160px; width: auto; }
.hzn-tabla td { flex: 0 1 auto; margin-left: auto; max-width: 100%; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.hzn-tabla tr.hzn-total th, .hzn-tabla tr.hzn-total td { color: var(--hz-navy); font-weight: 700; }
.hzn-aviso { margin: 12px 0 0; font-size: 14.5px; font-weight: 600; color: var(--hz-aviso); }
.hzn-pista { margin: 10px 0 0; font-size: 14.5px; color: var(--hz-ink2); }
.hzn-porque { margin: 16px 0 0; }
.hzn-sub { margin: 16px 0 8px; font-size: 14.5px; font-weight: 600; color: var(--hz-ink2); }

/* Ranking */
.hzn-rank { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.hzn-rank-i { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px 12px; align-items: center; background: #fff;
  border-radius: 12px; padding: 12px 14px; }
.hzn-rank-i.hzn-gana { box-shadow: inset 0 0 0 2px var(--hz-acc); }
.hzn-pos { font-weight: 800; font-size: 18px; color: var(--hz-navy); min-width: 2em; }
.hzn-rank-n { margin: 0; min-width: 0; font-weight: 700; overflow-wrap: anywhere; }
.hzn-rank-chip { grid-column: 2 / -1; justify-self: start; white-space: nowrap; }
.hzn-rank-tot { font-weight: 800; font-size: 18px; color: var(--hz-navy); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hzn-de5 { font-size: 13px; font-weight: 600; color: var(--hz-ink2); }
.hzn-barra { grid-column: 1 / -1; display: block; height: 6px; border-radius: 999px; background: rgba(2,22,47,.08); overflow: hidden; }
.hzn-barra > span { display: block; height: 100%; width: 0; background: var(--hz-acc); border-radius: inherit; }
.hzn-fuera .hzn-barra > span { background: rgba(2,22,47,.3); }
.hzn-fuera .hzn-pos, .hzn-fuera .hzn-rank-tot { color: var(--hz-ink2); }
.hz-chip.hzn-chip-ok { background: rgba(15,122,74,.12); color: var(--hz-ok); }
.hz-chip.hzn-chip-avisa { background: rgba(154,103,0,.12); color: var(--hz-aviso); }
.hz-chip.hzn-chip-mal { background: rgba(180,35,24,.1); color: var(--hz-mal); }