/* Shared by all sites. Build emits .sth-scroll > table.sth-source, even without JS.
   No forced minimum width: tables keep their natural width (Design, 26 Oct).
   Site adapters set these four variables on :root (solid colours only). */
:root {
  --sticky-table-offset: 0px;
  --sth-background: var(--color-surface, var(--bg, #fff));
  --sth-foreground: var(--color-text, var(--ink, #222));
  --sth-rule: var(--color-border, var(--rule, #ddd));
}
/* These selectors are also the fixture adapters; leads can use :root instead. */
:root[data-table-site="tea"] {
  --sth-background: var(--color-accent);
  --sth-foreground: #fff;
  --sth-radius: 8px; /* Tea's .article-content table corners */
}
:root[data-table-site="netcortex"] {
  --sth-background: #f2efe8; /* existing th colour; no existing token */
}
.sth-scroll {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  /* No height/max-height: vertical swipes continue to scroll the page. */
  margin-block: 1.5rem;
  border-radius: var(--sth-radius, 0); /* the site's table corners; the wrapper clips them */
}
.sth-scroll:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.sth-scroll > table.sth-source {
  display: table !important; /* override each site's phone display:block */
  overflow: visible !important;
  table-layout: auto !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
.sth-source > thead th { position: static !important; }
.sth-float {
  position: fixed;
  z-index: 40; /* below Tea's menu scrim (50) / drawer (60) */
  overflow: hidden;
  pointer-events: none;
  contain: layout paint;
  background: var(--sth-background);
  box-shadow: 0 1px 0 var(--sth-rule);
}
.sth-float[hidden] { display: none !important; }
.sth-float > .sth-cell {
  background: var(--sth-background) !important;
  border-radius: 0 !important;
  border-bottom: 1px solid var(--sth-rule) !important;
}
.sth-float > .sth-cell,
.sth-float > .sth-cell * {
  /* copied inline styles may carry -webkit-text-fill-color, which paints over color */
  color: var(--sth-foreground) !important;
  -webkit-text-fill-color: var(--sth-foreground) !important;
}
@media print {
  .sth-float { display: none !important; }
  .sth-scroll { overflow: visible !important; margin: 0; }
  .sth-scroll > table.sth-source { width: 100% !important; }
  .sth-source thead { display: table-header-group; }
}
