/* TendenciasFX · Horario forex · estilos propios v1.0 (16-10-2026). Va DESPUÉS de _comun/herramientas.css (v2.5),
   que pone todo lo común (cabecera, tarjetas, tablas, calculadora, mentoría, pie). Aquí, solo lo de esta herramienta:
   el reloj, la línea de las sesiones, la lista de cambios de hora, el bróker y las dos tablas por país. Va en su
   fichero para no tocar la hoja común mientras se montan otras herramientas a la vez; se puede pasar a la común
   como un apartado más cuando se quiera. Color nunca solo: cada sesión lleva su nombre y cada línea su leyenda. */
/* sin los botones de modo de las calculadoras, el formulario empieza en la segunda fila, al lado del resultado */
@media (min-width: 860px) {
  [data-tfx-herr="horario"].tfx-herr-app .tfx-herr-form { grid-row: 2 / span 3; }
  [data-tfx-herr="horario"].tfx-herr-app .tfx-herr-resultado { grid-row: 2; }
}
/* en el móvil, la respuesta justo debajo del país; los cambios de hora y el bróker, después */
@media (max-width: 859px) {
  [data-tfx-herr="horario"] .tfx-herr-form { display: contents; }
  [data-tfx-herr="horario"] .tfx-herr-grupo { order: 1; margin: 0; }
  [data-tfx-herr="horario"] .tfx-herr-resultado { order: 2; }
  [data-tfx-herr="horario"] .tfx-hf-cambios { order: 3; margin: 0; }
  [data-tfx-herr="horario"] .tfx-herr-mas { order: 4; margin: 0; }
  [data-tfx-herr="horario"] .tfx-herr-compartir { order: 5; }
  [data-tfx-herr="horario"] .tfx-herr-aviso { order: 6; }
}
.tfx-hf-cambios { margin: 0 0 16px; background: #fff; border: 1px solid var(--t-borde); }
.tfx-hf-cambios-tit { margin: 0; padding: 10px 14px; background: var(--t-cab) var(--t-raya); border-bottom: 1px solid var(--t-borde); font: 600 13px/1.35 var(--quick); letter-spacing: .06em; text-transform: uppercase; color: var(--tinta); }
.tfx-hf-cambios ul { margin: 0; padding: 10px 14px 4px; list-style: none; }
.tfx-hf-cambios li { margin: 0 0 8px; font-size: 14.5px; line-height: 1.45; color: var(--tinta2); }
.tfx-hf-cambios strong { color: var(--tinta); font-weight: 600; }

/* el reloj y el estado del mercado */
.tfx-hf-ahora { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin: 0 0 14px; }
.tfx-hf-reloj { font: 300 36px/1 var(--oswald); color: var(--tinta); font-variant-numeric: tabular-nums; letter-spacing: .01em; }
.tfx-hf-hoy { font: 500 15px/1.3 var(--quick); color: var(--tinta2); }
.tfx-hf-estado { margin-left: auto; padding: 3px 10px; font: 600 13px/1.4 var(--quick); letter-spacing: .04em; text-transform: uppercase; border: 1px solid; }
.tfx-hf-abierto { color: var(--nominal); border-color: var(--nominal); background: #f1f8ea; }
.tfx-hf-cerrado-txt { color: var(--tinta2); border-color: var(--borde); background: var(--fondo); }
.tfx-hf-tuyo > * { background: #fbf3dc !important; }
.tfx-hf-tuyo th { font-weight: 700 !important; color: var(--tinta) !important; }

/* la línea de las sesiones de hoy (0:00 a 24:00 de la hora elegida) */
.tfx-hf-linea { position: relative; margin: 10px 0 6px; padding: 22px 0 0; }
.tfx-hf-eje { position: absolute; left: 92px; right: 0; top: 0; height: 18px; font: 12px/18px var(--texto); color: var(--tenue); font-variant-numeric: tabular-nums; }
.tfx-hf-eje span { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; }
.tfx-hf-eje span:first-child { transform: none; }
.tfx-hf-eje span:last-child { transform: translateX(-100%); }
.tfx-hf-fila { display: grid; grid-template-columns: 92px minmax(0, 1fr); align-items: center; height: 26px; }
.tfx-hf-fila .tfx-hf-nombre { font: 600 13.5px/1 var(--quick); color: var(--tinta2); }
.tfx-hf-pista { position: relative; height: 16px; background: #f1f1f2; border-left: 1px solid #d9dadd; border-right: 1px solid #d9dadd; background-image: linear-gradient(90deg, transparent calc(25% - .5px), #dcdde0 calc(25% - .5px), #dcdde0 calc(25% + .5px), transparent calc(25% + .5px), transparent calc(50% - .5px), #dcdde0 calc(50% - .5px), #dcdde0 calc(50% + .5px), transparent calc(50% + .5px), transparent calc(75% - .5px), #dcdde0 calc(75% - .5px), #dcdde0 calc(75% + .5px), transparent calc(75% + .5px)); }
.tfx-hf-barra { position: absolute; top: 0; bottom: 0; }
.tfx-hf-sidney .tfx-hf-barra, .tfx-hf-sesiones .tfx-hf-sidney::before { background: #9a9ca1; }
.tfx-hf-tokio .tfx-hf-barra, .tfx-hf-sesiones .tfx-hf-tokio::before { background: #c48a00; }
.tfx-hf-londres .tfx-hf-barra, .tfx-hf-sesiones .tfx-hf-londres::before { background: #4d8316; }
.tfx-hf-nuevayork .tfx-hf-barra, .tfx-hf-sesiones .tfx-hf-nuevayork::before { background: #474c55; }
.tfx-hf-capa { position: absolute; left: 92px; right: 0; top: 22px; bottom: 0; pointer-events: none; }
.tfx-hf-cerrado { position: absolute; top: 0; bottom: 0; background: repeating-linear-gradient(135deg, rgba(47,50,58,.22) 0 3px, rgba(255,255,255,.35) 3px 8px); }
.tfx-hf-cierre { position: absolute; top: -4px; bottom: -4px; width: 3px; margin-left: -1.5px; background: var(--oro); }
.tfx-hf-marca-ahora { position: absolute; top: -8px; bottom: -4px; width: 2px; margin-left: -1px; background: var(--error); }
.tfx-hf-marca-ahora::before { content: ""; position: absolute; top: -2px; left: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--error); }
.tfx-hf-leyenda { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 4px 0 10px; font-size: 13px; line-height: 1.4; color: var(--tinta2); }
.tfx-hf-leyenda span { display: inline-flex; align-items: center; gap: 6px; }
.tfx-hf-leyenda i { display: inline-block; width: 14px; height: 10px; }
.tfx-hf-l-cierre { background: var(--oro); width: 4px !important; }
.tfx-hf-l-ahora { background: var(--error); width: 3px !important; }
.tfx-hf-l-cerrado { background: repeating-linear-gradient(135deg, rgba(47,50,58,.35) 0 3px, #fff 3px 6px); border: 1px solid #d9dadd; }

/* la lista de las sesiones: abierta o cerrada, y cuándo cambia */
.tfx-hf-sesiones { margin: 6px 0 0; padding: 0; list-style: none; }
.tfx-hf-sesiones li { position: relative; margin: 0; padding: 7px 0 7px 20px; border-top: 1px solid #ecedef; font-size: 14.5px; line-height: 1.45; color: var(--tinta2); }
.tfx-hf-sesiones li::before { content: ""; position: absolute; left: 2px; top: 13px; width: 10px; height: 10px; }
.tfx-hf-sesiones .tfx-hf-nombre { font-weight: 600; color: var(--tinta); }
.tfx-hf-sesiones .tfx-hf-activa b { color: var(--nominal); }

/* el bróker */
.tfx-hf-broker { margin: 4px 0 14px; padding: 10px 12px; background: var(--fondo); border: 1px solid #e7e8ea; font-size: 14.5px; line-height: 1.5; }
.tfx-hf-broker p { margin: 0 0 8px; }
.tfx-hf-broker p:last-child { margin: 0; }
.tfx-herr-app input[type="time"] { font-variant-numeric: tabular-nums; }

/* Navidad y Año Nuevo */
.tfx-hf-festivos { margin: 0 0 14px 1.2em; padding: 0; }
.tfx-hf-festivos li { margin: 0 0 4px; }

/* las dos tablas por país */
.tfx-hf-paises td:nth-child(2) { white-space: nowrap; font: 300 22px/1.1 var(--oswald); color: var(--tinta); }
.tfx-hf-paises td:nth-child(3) { font-size: 14.5px; line-height: 1.5; color: var(--tinta2); }
.tfx-hf-sesiones-tabla { min-width: 560px; }
.tfx-hf-sesiones-tabla td { white-space: nowrap; font-variant-numeric: tabular-nums; }
.tfx-hf-sesiones-tabla tbody th { position: sticky; left: 0; z-index: 1; background: #fff; }
.tfx-hf-sesiones-tabla tbody tr:nth-child(even) th { background: var(--t-alterna); }
.tfx-hf-casos td:last-child { white-space: normal; }
@media (max-width: 640px) {
  /* en el móvil, cada país en una ficha corta: el nombre y la hora en una línea, los cambios debajo */
  .tfx-hf-paises tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .tfx-hf-paises tbody th { grid-column: 1; border-bottom: 0; }
  .tfx-hf-paises td:nth-child(2) { grid-column: 2; padding: 8px 12px; background: var(--t-cab); }
  .tfx-hf-paises td:nth-child(2)::before { display: none; }
  .tfx-hf-paises td:nth-child(3) { grid-column: 1 / -1; padding: 8px 12px 10px; }
  .tfx-hf-paises td:nth-child(3)::before { display: none; }
  .tfx-hf-sesiones-tabla tbody th { max-width: 132px; white-space: normal; }
  .tfx-hf-reloj { font-size: 32px; }
  .tfx-hf-fila { grid-template-columns: 70px minmax(0, 1fr); }
  .tfx-hf-eje, .tfx-hf-capa { left: 70px; }
  .tfx-hf-fila .tfx-hf-nombre { font-size: 12.5px; }
}
@media print { .tfx-hf-linea, .tfx-hf-leyenda { display: none; } }