/* AI-generated table materials; all labels, values and interactions remain live.
   Atlas quadrants: header / normal row / alternate row / highlighted row. */
:root {
  --table-material-atlas: url('visual-assets-v4/table-material-atlas-v1.png');
}

.table-shell:has(> table:not(.compare-table)) {
  border-color: #b6cbdc;
  border-radius: 5px;
  background-color: #fafcfe;
  box-shadow: 0 2px 5px #1437570a;
}

.table-shell > table:not(.compare-table) thead {
  background-color: #102d48;
  background-image: var(--table-material-atlas);
  background-size: 200% 200%;
  background-position: 0 0;
  background-repeat: no-repeat;
}

.table-shell > table:not(.compare-table) thead th {
  background-color: transparent;
  background-image: none;
  color: #f5faff;
  border-top-color: #325b7d;
  border-bottom-color: #527da0;
}

.table-shell > table:not(.compare-table) thead :is(button, small),
.table-shell > table:not(.compare-table) thead .sort-button.active {
  color: inherit;
}

/* Sticky headings need an opaque material while other headings share one strip. */
.table-shell > table:not(.compare-table) thead th:is(.name-head, .season-year),
.connected-table-shell > table thead th:first-child,
.connected-table-shell > .prospect-table thead th:is(:nth-child(2), :nth-child(3)),
.pitch-result-shell > .pitch-outcome-table thead th:first-child {
  z-index: 6;
  background-color: #102d48;
  background-image: var(--table-material-atlas);
  background-size: 200% 200%;
  background-position: 0 0;
  background-repeat: no-repeat;
  color: #f5faff;
}

.table-shell > table:not(.compare-table) tbody tr {
  --table-row-color: #fafcfe;
  --table-row-position: 100% 0%;
  background-color: var(--table-row-color);
  background-image: var(--table-material-atlas);
  background-size: 200% 200%;
  background-position: var(--table-row-position);
  background-repeat: no-repeat;
}

.table-shell > table:not(.compare-table) tbody tr:nth-child(even) {
  --table-row-color: #edf4fa;
  --table-row-position: 0% 100%;
}

.table-shell > table:not(.compare-table) tbody tr:is(:hover, .selected-season, .selected-game-player) {
  --table-row-color: #d9eaf7;
  --table-row-position: 100% 100%;
}

.table-shell > table:not(.compare-table) tbody tr > :is(th, td) {
  background-color: transparent;
  background-image: none;
  border-bottom-color: #d9e4ed;
}

/* Keep pinned player / year / pitch labels opaque during horizontal scrolling. */
.table-shell > table:not(.compare-table) tbody :is(.name-cell, .season-year, .pitch-result-type),
.table-shell.connected-table-shell > table tbody td:first-child,
.connected-table-shell > .prospect-table tbody td:is(:nth-child(2), :nth-child(3)) {
  background-color: var(--table-row-color);
  background-image: var(--table-material-atlas);
  background-size: 200% 200%;
  background-position: var(--table-row-position);
  background-repeat: no-repeat;
  box-shadow: 1px 0 0 #c6d8e6;
}

.table-shell > table:not(.compare-table) tbody th {
  color: #294e73;
}

.table-shell:has(> table:not(.compare-table)):focus-visible {
  outline: 2px solid #0865ed;
  outline-offset: 2px;
}

@media (forced-colors: active) {
  .table-shell > table:not(.compare-table) thead,
  .table-shell > table:not(.compare-table) :is(th, td),
  .table-shell > table:not(.compare-table) tbody tr {
    background-image: none !important;
    background-color: Canvas !important;
    color: CanvasText !important;
  }
}

@media print {
  .table-shell > table:not(.compare-table) thead,
  .table-shell > table:not(.compare-table) :is(th, td),
  .table-shell > table:not(.compare-table) tbody tr {
    background-image: none !important;
    background-color: #fff !important;
    color: #102d48 !important;
  }
}