/* Dashboard-specific overrides and components that aren't expressible as
   Tailwind utilities. Loaded after tailwind.css. Depends on tokens.css. */

html, body { background: #0d1117; color: #e6edf3; overflow-x: hidden !important; max-width: 100vw; }
main { max-width: min(80rem, 100vw); overflow-x: hidden; }
main > section, #filter-bar { max-width: 100%; min-width: 0; }
.tabular-nums { font-variant-numeric: tabular-nums; }
.arrow-cell { display: flex; align-items: baseline; }
.arrow-slot { flex: 0 0 0.85em; text-align: center; font-size: 10px; }

/* Subtle vertical separators between table columns */
#portfolio-table td, #portfolio-table th,
#technicals-table td, #technicals-table th,
#fundamentals-table td, #fundamentals-table th {
  border-right: 1px solid rgba(48, 54, 61, 0.5);
}
#portfolio-table td:last-child, #portfolio-table th:last-child,
#technicals-table td:last-child, #technicals-table th:last-child,
#fundamentals-table td:last-child, #fundamentals-table th:last-child {
  border-right: none;
}
table th { cursor: pointer; user-select: none; white-space: nowrap; }
#portfolio-table th:not(.text-left), #technicals-table th:not(.text-left), #fundamentals-table th:not(.text-left) { text-align: center; }
#portfolio-table td, #technicals-table td, #fundamentals-table td { text-align: center; }
#portfolio-table td:first-child, #technicals-table td:first-child, #fundamentals-table td:first-child { text-align: left; }
table th:hover { color: #58a6ff; }

/* Table scroll containers — internal scroll (both axes), hidden scrollbar,
   constrained height so sticky thead works within the container. Touch-swipe
   on mobile, scroll-wheel on desktop. */
.table-scroll {
  overflow: auto;
  max-height: 70vh;
  scrollbar-width: none;           /* Firefox */
  -ms-overflow-style: none;        /* IE/Edge */
}
.table-scroll::-webkit-scrollbar { display: none; } /* Chrome/Safari */

/* Sticky table chrome for the three data tables. */
#portfolio-table thead th, #technicals-table thead th, #fundamentals-table thead th { position: sticky; top: 0; background: #0d1117; z-index: 10; }
#portfolio-table td:first-child, #technicals-table td:first-child, #fundamentals-table td:first-child,
#portfolio-table thead th:first-child, #technicals-table thead th:first-child, #fundamentals-table thead th:first-child { position: sticky; left: 0; z-index: 5; background: #0d1117; }
#portfolio-table thead th:first-child, #technicals-table thead th:first-child, #fundamentals-table thead th:first-child { z-index: 15; }
tr:hover > td:first-child { background: rgba(22,27,34,0.5) !important; }
.sort-asc::after { content: ' ▲'; font-size: 0.7em; }
.sort-desc::after { content: ' ▼'; font-size: 0.7em; }

/* Column-help tooltips — positioned by js/column-help.js using fixed
   coordinates to avoid contributing to overflow-x:auto scroll widths. */
.tip {
  display: none;
  position: fixed; left: 0; top: 0;
  white-space: normal; width: max-content; max-width: 220px;
  background: #21262d; color: #e6edf3; border: 1px solid #30363d;
  font-size: 0.65rem; font-weight: 400; font-family: 'IBM Plex Sans', sans-serif;
  line-height: 1.4;
  padding: 4px 8px; border-radius: 4px;
  pointer-events: none;
  z-index: 50;
}
.tip.tip-show { display: block; }
.col-help { display: inline-flex; align-items: center; justify-content: center; width: 14px; height: 14px; border-radius: 50%; font-size: 9px; font-weight: 600; font-family: 'IBM Plex Sans', sans-serif; color: #8b949e; background: transparent; border: 1px solid #30363d; cursor: pointer; margin-left: 4px; vertical-align: middle; line-height: 1; }
.col-help:hover { color: #58a6ff; border-color: #58a6ff; }

/* Language toggle button in the header. */
.lang-toggle {
  padding: 0.3rem 0.6rem; border-radius: 4px; font-size: 0.65rem; font-weight: 600;
  font-family: 'JetBrains Mono', monospace; letter-spacing: 0.08em;
  background: transparent; color: #8b949e; border: 1px solid #30363d;
  cursor: pointer; transition: color 0.2s, border-color 0.2s;
}
.lang-toggle:hover { color: #e6edf3; border-color: #8b949e; }

/* Loading overlay spinner. */
@keyframes spin { to { transform: rotate(360deg); } }
.spinner { width: 32px; height: 32px; border: 3px solid #30363d; border-top-color: #58a6ff; border-radius: 50%; animation: spin 0.8s linear infinite; }

/* Keep ticker + badges on one line so rows don't bloat vertically. */
table td:first-child > span:first-child,
table td:first-child { white-space: nowrap; }

/* Mobile tweaks */
@media (max-width: 640px) {
  table th, table td { font-size: 0.7rem; padding: 0.4rem 0.35rem !important; }
  .tab-btn { white-space: nowrap; }
}

/* Allow tab row to scroll horizontally if it overflows */
.tabs-scroll { overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
.tabs-scroll::-webkit-scrollbar { display: none; }
