/* Hub radar — tooltips, hover, ciclo automático, ícones */

.finax-hub-core {
    z-index: 4;
    pointer-events: none;
  }
  
  .finax-hub-radar-grid {
    z-index: 1;
  }
  
  .finax-hub-orbit {
    z-index: 6;
    list-style: none;
    margin: 0;
    padding: 0;
  }
  
  .finax-hub-node {
    z-index: 5;
    border-radius: 9999px;
    padding: 0.4375rem 0.75rem 0.4375rem 0.5rem;
    pointer-events: auto;
    cursor: pointer;
    transition:
      transform 280ms cubic-bezier(0.22, 1, 0.36, 1),
      border-color 280ms ease,
      box-shadow 280ms ease,
      background 280ms ease;
  }
  
  .finax-hub-node-icon {
    position: relative;
    z-index: 1;
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    color: rgba(0, 198, 94, 0.55);
    transition: color 280ms ease, transform 280ms ease;
  }
  
  .finax-hub-node-icon svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  
  .finax-hub-node.is-active,
  .finax-hub-node.is-hovered,
  .finax-hub-node:hover,
  .finax-hub-node:focus-visible {
    z-index: 20;
    transform: translate(-50%, -50%) scale(1.06);
    animation-play-state: paused;
    border-color: rgba(0, 198, 94, 0.38);
    background: rgba(255, 255, 255, 0.07);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.1),
      0 0 0 1px rgba(0, 198, 94, 0.22),
      0 8px 28px rgba(0, 198, 94, 0.16),
      0 4px 16px rgba(0, 0, 0, 0.2);
  }
  
  .finax-hub-node.is-active .finax-hub-node-icon,
  .finax-hub-node.is-hovered .finax-hub-node-icon,
  .finax-hub-node:hover .finax-hub-node-icon,
  .finax-hub-node:focus-visible .finax-hub-node-icon {
    color: rgba(0, 223, 110, 0.95);
    transform: scale(1.05);
  }
  
  .finax-hub-node.is-active .finax-hub-node-label,
  .finax-hub-node.is-hovered .finax-hub-node-label,
  .finax-hub-node:hover .finax-hub-node-label,
  .finax-hub-node:focus-visible .finax-hub-node-label {
    color: rgba(241, 245, 249, 0.92);
  }
  
  .finax-hub-node.is-near {
    border-color: rgba(0, 198, 94, 0.14);
  }
  
  .finax-hub-node.is-near .finax-hub-node-label {
    color: rgba(241, 245, 249, 0.62);
  }
  
  .finax-hub-node.is-active {
    animation: finax-node-pulse-shadow 3s ease-in-out infinite;
  }
  
  @keyframes finax-node-pulse-shadow {
    0%,
    100% {
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 0 0 1px rgba(0, 198, 94, 0.28),
        0 6px 24px rgba(0, 198, 94, 0.14),
        0 4px 16px rgba(0, 0, 0, 0.18);
    }
    50% {
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 0 0 1px rgba(0, 198, 94, 0.42),
        0 10px 32px rgba(0, 198, 94, 0.22),
        0 6px 20px rgba(0, 0, 0, 0.22);
    }
  }
  
  .finax-hub-node .finax-hub-node-tooltip {
    position: absolute;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    min-width: 10.5rem;
    max-width: 13.5rem;
    padding: 0.625rem 0.875rem;
    border-radius: 0.75rem;
    text-align: left;
    white-space: normal;
    background: rgba(16, 24, 32, 0.94);
    border: 1px solid rgba(0, 198, 94, 0.18);
    box-shadow:
      0 12px 32px rgba(0, 0, 0, 0.35),
      0 0 24px rgba(0, 198, 94, 0.08);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 30;
    transition:
      opacity 240ms ease,
      visibility 240ms ease,
      transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
  }
  
  /* Acima */
  .finax-hub-node--tip-top .finax-hub-node-tooltip {
    left: 50%;
    bottom: calc(100% + 0.75rem);
    transform: translateX(-50%) translateY(4px);
  }

  /* Análise (direita) e Fechamento (esquerda): sobem na borda, sem cruzar a logo */
  .finax-hub-node--4.finax-hub-node--tip-top .finax-hub-node-tooltip {
    left: auto;
    right: 0;
    transform: translateX(0) translateY(4px);
  }

  .finax-hub-node--7.finax-hub-node--tip-top .finax-hub-node-tooltip {
    left: 0;
    right: auto;
    transform: translateX(0) translateY(4px);
  }
  
  /* Abaixo */
  .finax-hub-node--tip-bottom .finax-hub-node-tooltip {
    left: 50%;
    top: calc(100% + 0.75rem);
    transform: translateX(-50%) translateY(-4px);
  }
  
  /* À direita (para o centro, em nós da borda esquerda) */
  .finax-hub-node--tip-right .finax-hub-node-tooltip {
    left: calc(100% + 0.75rem);
    top: 50%;
    transform: translateY(-50%) translateX(-4px);
  }
  
  /* À esquerda (para o centro, em nós da borda direita) */
  .finax-hub-node--tip-left .finax-hub-node-tooltip {
    right: calc(100% + 0.75rem);
    left: auto;
    top: 50%;
    transform: translateY(-50%) translateX(4px);
  }
  
  .finax-hub-node-tooltip-title {
    display: block;
    font-family: "Outfit", sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: rgba(0, 223, 110, 0.92);
    margin-bottom: 0.25rem;
  }
  
  .finax-hub-node-tooltip-desc {
    display: block;
    font-family: "Outfit", sans-serif;
    font-size: 0.6875rem;
    font-weight: 400;
    line-height: 1.45;
    color: rgba(241, 245, 249, 0.72);
  }
  
  .finax-hub-node--tip-top:hover .finax-hub-node-tooltip,
  .finax-hub-node--tip-top.is-hovered .finax-hub-node-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
  }

  .finax-hub-node--4.finax-hub-node--tip-top:hover .finax-hub-node-tooltip,
  .finax-hub-node--4.finax-hub-node--tip-top.is-hovered .finax-hub-node-tooltip {
    transform: translateX(0) translateY(0);
  }

  .finax-hub-node--7.finax-hub-node--tip-top:hover .finax-hub-node-tooltip,
  .finax-hub-node--7.finax-hub-node--tip-top.is-hovered .finax-hub-node-tooltip {
    transform: translateX(0) translateY(0);
  }
  
  .finax-hub-node--tip-bottom:hover .finax-hub-node-tooltip,
  .finax-hub-node--tip-bottom.is-hovered .finax-hub-node-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
  }
  
  .finax-hub-node--tip-right:hover .finax-hub-node-tooltip,
  .finax-hub-node--tip-right.is-hovered .finax-hub-node-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) translateX(0);
  }
  
  .finax-hub-node--tip-left:hover .finax-hub-node-tooltip,
  .finax-hub-node--tip-left.is-hovered .finax-hub-node-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) translateX(0);
  }
  
  .finax-hub-link.is-active,
  .finax-hub-link.is-hovered {
    stroke: rgba(0, 223, 110, 0.92);
    stroke-width: 0.2;
    filter: drop-shadow(0 0 4px rgba(0, 198, 94, 0.4));
  }
  
  .finax-hub-link-energy.is-active,
  .finax-hub-link-energy.is-hovered {
    stroke-width: 0.34;
    opacity: 1;
    animation: finax-hub-energy-flow 2.6s linear infinite;
  }
  
  .finax-hub {
    width: 100%;
  }
  
  @media (min-width: 768px) {
    .finax-login-grid > .finax-login-visual {
      overflow: visible;
      position: relative;
      z-index: 2;
    }

    .finax-login-grid > .finax-login-panel {
      position: relative;
      z-index: 1;
      overflow: auto;
    }
  }
  
  .finax-visual-glow--a,
  .finax-visual-glow--b {
    opacity: 0.28;
  }
  
  .finax-logo-glow,
  .finax-logo-halo {
    opacity: 0.35;
  }
  
  .finax-hub-core-glow {
    opacity: 0.85;
  }
  
  [data-theme="light"] .finax-hub-node .finax-hub-node-tooltip {
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(0, 198, 94, 0.2);
    box-shadow:
      0 12px 28px rgba(16, 24, 32, 0.1),
      0 0 20px rgba(0, 198, 94, 0.06);
  }
  
  [data-theme="light"] .finax-hub-node-tooltip-title {
    color: #007a3d;
  }
  
  [data-theme="light"] .finax-hub-node-tooltip-desc {
    color: rgba(16, 24, 32, 0.68);
  }
  
  [data-theme="light"] .finax-hub-node.is-active,
  [data-theme="light"] .finax-hub-node.is-hovered,
  [data-theme="light"] .finax-hub-node:hover,
  [data-theme="light"] .finax-hub-node:focus-visible {
    background: rgba(255, 255, 255, 0.92);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 1),
      0 0 0 1px rgba(0, 198, 94, 0.22),
      0 8px 24px rgba(0, 198, 94, 0.1),
      0 4px 12px rgba(16, 24, 32, 0.06);
  }
  
  [data-theme="light"] .finax-hub-node-icon {
    color: rgba(0, 122, 61, 0.72);
  }
  
  [data-theme="light"] .finax-hub-node.is-active .finax-hub-node-icon,
  [data-theme="light"] .finax-hub-node.is-hovered .finax-hub-node-icon,
  [data-theme="light"] .finax-hub-node.is-cycle-open .finax-hub-node-icon,
  [data-theme="light"] .finax-hub-node:hover .finax-hub-node-icon,
  [data-theme="light"] .finax-hub-node:focus-visible .finax-hub-node-icon {
    color: #00a84d;
  }
  
  /* Tema claro: labels escuros em todos os estados (evita texto branco do dark) */
  [data-theme="light"] .finax-hub-node.is-active .finax-hub-node-label,
  [data-theme="light"] .finax-hub-node.is-hovered .finax-hub-node-label,
  [data-theme="light"] .finax-hub-node.is-cycle-open .finax-hub-node-label,
  [data-theme="light"] .finax-hub-node:hover .finax-hub-node-label,
  [data-theme="light"] .finax-hub-node:focus-visible .finax-hub-node-label {
    color: rgba(16, 24, 32, 0.92);
  }
  
  [data-theme="light"] .finax-hub-node.is-near .finax-hub-node-label {
    color: rgba(16, 24, 32, 0.58);
  }
  
  [data-theme="light"] .finax-hub-link {
    stroke: rgba(0, 108, 54, 0.62);
    stroke-width: 0.15;
  }
  
  [data-theme="light"] .finax-hub-link.is-active,
  [data-theme="light"] .finax-hub-link.is-hovered {
    stroke: rgba(0, 148, 72, 0.95);
    stroke-width: 0.2;
  }
  
  @media (prefers-reduced-motion: reduce) {
    .finax-hub-node {
      transition: border-color 200ms ease, box-shadow 200ms ease, background 200ms ease;
    }
  
    .finax-hub-node.is-active,
    .finax-hub-node.is-hovered,
    .finax-hub-node:hover,
    .finax-hub-node:focus-visible {
      transform: translate(-50%, -50%);
      animation: none;
    }
  
    .finax-hub-node.is-active {
      animation: none;
    }
  
    .finax-hub-node--tip-top .finax-hub-node-tooltip,
    .finax-hub-node--tip-bottom .finax-hub-node-tooltip {
      transition: opacity 200ms ease, visibility 200ms ease;
      transform: translateX(-50%);
    }
  
    .finax-hub-node--tip-right .finax-hub-node-tooltip,
    .finax-hub-node--tip-left .finax-hub-node-tooltip {
      transition: opacity 200ms ease, visibility 200ms ease;
      transform: translateY(-50%);
    }
  
    .finax-visual-glow--a,
    .finax-visual-glow--b,
    .finax-logo-glow,
    .finax-logo-halo {
      animation: none;
    }
  }