/* TendenciasFX · Correlación de divisas · estilos de la herramienta v1.0 (16-10-2026)
   Va después de _comun/herramientas.css (usa sus variables y sus clases tfx-herr-*) y solo trae lo propio de esta
   herramienta (tfx-co-*), para no tocar la hoja común. Verde = se mueven juntos; dorado = al revés. */

.tfx-co { --co-p3: #3d7a14; --co-p2: #9ccb73; --co-p1: #dcecc9; --co-n1: #f9ecc0; --co-n2: #f1cf6a; --co-n3: #a86f00; }
.tfx-co-frase { margin: 0 0 10px; font-size: 18px; line-height: 1.55; color: var(--tinta); }
.tfx-co-sello { margin: 0 0 16px; font: 500 14px/1.45 var(--quick); color: var(--tinta2); }
.tfx-co-controles { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px 32px; margin: 0 0 14px; }
.tfx-co-controles[hidden], .tfx-co-buscador[hidden], .tfx-co-resultado[hidden], .tfx-co-estado[hidden] { display: none; }
.tfx-co-grupo .tfx-herr-etiqueta { margin: 0 0 6px; }
.tfx-co-estado { margin: 0 0 12px; font: 500 14px/1.45 var(--quick); color: var(--tinta2); }

/* el buscador de un par */
.tfx-co-buscador { margin: 0 0 16px; padding: 14px 16px; background: var(--t-alterna); border: 1px solid var(--t-borde); }
.tfx-co-buscador > .tfx-herr-etiqueta { margin: 0 0 6px; }
.tfx-co-buscar-fila { display: flex; flex-wrap: wrap; gap: 8px; align-items: stretch; }
.tfx-co-buscar-fila .tfx-herr-entrada { flex: 1 1 200px; max-width: 320px; }
.tfx-co-buscar-fila .tfx-herr-entrada input { text-transform: uppercase; font-weight: 600; letter-spacing: .02em; }
.tfx-co-buscar-fila .tfx-herr-boton { flex: 0 0 auto; height: 48px; }
.tfx-co-todos { margin: 10px 0 0; }
.tfx-co-todos input { cursor: pointer; }

/* lo que devuelve el buscador */
.tfx-co-resultado { margin: 0 0 18px; padding: 14px 18px 6px; background: #fff; border: 1px solid var(--t-borde); box-shadow: 0 4px 16px rgba(0,0,0,.05); }
.tfx-co-resultado:focus { outline: 2px solid var(--nominal); outline-offset: 2px; }
.tfx-co-resultado > .tfx-herr-h3 { margin: 0 0 10px; }
.tfx-co-listas { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 4px 28px; }
.tfx-co-h4 { margin: 8px 0 4px; font: 600 15px/1.35 var(--quick); color: var(--tinta2); }
.tfx-co-lista-r { margin: 0 0 10px; padding: 0; list-style: none; }
.tfx-co-lista-r li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 0; padding: 6px 0; border-top: 1px solid #e7e8ea; }
.tfx-co-par { margin: 0; padding: 0; border: 0; background: none; font: 600 15px/1.3 var(--quick); color: var(--tinta); text-decoration: underline dotted #a3a6ad; text-underline-offset: 3px; cursor: pointer; }
.tfx-co-par:hover { color: var(--verde-texto); text-decoration-color: currentColor; }
.tfx-co-v { display: inline-block; min-width: 3.6em; padding: 2px 6px; text-align: center; font: 600 13px/1.4 var(--quick); font-variant-numeric: tabular-nums; border: 1px solid rgba(0,0,0,.08); }
.tfx-co-etq { font: 600 12px/1.3 var(--quick); color: var(--tenue); }
.tfx-co-aviso { margin: 0 0 10px; padding: 10px 12px; background: #fdf6dc; border: 1px solid #c9a100; color: #5c4700; font: 600 15px/1.5 var(--quick); }

/* la tabla */
.tfx-co-marco { margin: 0 0 14px; }
.tfx-co-tabla { width: auto; min-width: 100%; font-size: 12px; }
.tfx-co-tabla th, .tfx-co-tabla td { padding: 0; border: 1px solid #fff; text-align: center; vertical-align: middle; }
.tfx-co-tabla thead th { padding: 0; background: var(--t-cab); border-bottom: 1px solid var(--t-borde); }
.tfx-co-tabla tbody tr:nth-child(even) { background: transparent; }
.tfx-co-tabla .tfx-co-esq { position: sticky; left: 0; z-index: 3; min-width: 70px; padding: 0 8px; text-align: left; vertical-align: bottom; font: 600 12px/1 var(--quick); background: var(--t-cab); }
.tfx-co-tabla .tfx-co-col { min-width: 32px; height: 80px; vertical-align: bottom; }
.tfx-co-col span { display: inline-block; padding: 6px 0; writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; font: 600 12px/1 var(--quick); color: var(--tinta); }
.tfx-co-tabla tbody th.tfx-co-fila { position: sticky; left: 0; z-index: 2; min-width: 70px; padding: 0 8px; text-align: left; font: 600 12px/1 var(--quick); color: var(--tinta); background: var(--t-cab); white-space: nowrap; }
.tfx-co-fila .tfx-co-par { display: block; width: 100%; min-height: 30px; text-align: left; font-size: 12px; text-decoration: none; }
.tfx-co-fila .tfx-co-par:hover { text-decoration: underline; }
.tfx-co-tabla .tfx-co-c { min-width: 32px; height: 30px; font-variant-numeric: tabular-nums; font-weight: 600; }
.tfx-co-p3 { background: var(--co-p3); color: #fff; }
.tfx-co-p2 { background: var(--co-p2); color: #1f3a0a; }
.tfx-co-p1 { background: var(--co-p1); color: #2f4a15; }
.tfx-co-z { background: #fff; color: var(--tenue); font-weight: 500; }
.tfx-co-n1 { background: var(--co-n1); color: #5c4700; }
.tfx-co-n2 { background: var(--co-n2); color: #4a3800; }
.tfx-co-n3 { background: var(--co-n3); color: #fff; }
.tfx-co-diag { background: var(--t-cab); color: #9a9ca1; font-weight: 400; }
.tfx-co-nd { background: #f4f4f4; color: #9a9ca1; font-weight: 400; }
.tfx-co-leyenda { margin: 4px 0 8px; font-size: 14px; line-height: 1.55; color: var(--tinta2); }
.tfx-co-clave { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 0; padding: 0; list-style: none; font-size: 13.5px; color: var(--tinta2); }
.tfx-co-clave li { display: flex; align-items: center; gap: 8px; margin: 0; }
.tfx-co-clave i { display: inline-block; flex: none; width: 16px; height: 16px; border: 1px solid #d9dadd; }

@media (max-width: 640px) {
  .tfx-co-listas { grid-template-columns: 1fr; }
  .tfx-co-frase { font-size: 16.5px; }
  .tfx-co-buscador { padding: 12px; }
  .tfx-co-buscar-fila .tfx-herr-entrada { max-width: none; }
  .tfx-co-buscar-fila .tfx-herr-boton { flex: 1 1 100%; }
  .tfx-co-tabla .tfx-co-esq, .tfx-co-tabla tbody th.tfx-co-fila { padding: 0 6px; }
}