/**
 * Stats Migrate Table Visual Styles
 * Visual styling for data tables (colors, borders, typography)
 * Base/structural styles remain in stats-tables-base.css
 *
 * This is the compiled CSS from _stats-tables-visual.scss
 *
 * Default styling uses grey shades only.
 * Theme can override with color variables.
 */

/* ==========================================================================
   Tabs Interface
   ========================================================================== */

.stats-tabs .tab-headers-bar {
  border-bottom: 2px solid #ccc;
}

.stats-tabs .tab-header {
  background: #e6e6e6;
  border: 1px solid #ccc;
}

.stats-tabs .tab-header.active {
  background: #ccc;
  font-weight: bold;
}

.stats-tabs .stats-tabs__tab {
  border-bottom: 2px solid transparent;
}

.stats-tabs [role="tab"][aria-selected="true"] {
  border-bottom-color: #666;
  font-weight: 600;
}

/* ==========================================================================
   Table Visual Styles
   ========================================================================== */

.stats-table {
  background: #fff;
}

/* Table Header */
.stats-table thead tr {
  background-color: #666;
}

.stats-table thead th {
  background-color: #666;
  color: #fff;
  font-weight: bold;
  background-clip: padding-box;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.stats-table thead th a,
.stats-table thead th a:visited {
  color: #fff;
  text-decoration: underline;
}

.stats-table thead th a:hover {
  text-decoration: none;
}

/* Table Body */
.stats-table tbody {
  border: none;
}

.stats-table tbody tr {
  border-bottom: 1px solid #ccc;
}

.stats-table tbody tr.row-odd {
  background-color: #f9f9f9;
}

.stats-table tbody tr.row-even {
  background-color: transparent;
}

/* Blank separator rows */
.stats-table tbody tr.blank {
  background-color: #f5f5f5;
  border: none;
  border-bottom: 1px solid #ccc;
}

/* Bottom section header rows (e.g., "Annual Data") */
.stats-table tbody tr.head {
  background-color: #fff;
  border-bottom: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  font-weight: bold;
  font-size: 1.2rem;
}

.stats-table tbody tr.head td {
  background-color: #fff;
}


/* ==========================================================================
   Column-Specific Visual Styles
   ========================================================================== */

/* Sub-annual table columns */
.stats-table--sub-annual .col-year,
.stats-table--sub-annual .col-period {
  background-color: #fff;
}

.stats-table--sub-annual thead th.col-year,
.stats-table--sub-annual thead th.col-period {
  background-color: #666;
}

.stats-table--sub-annual tbody tr.row-odd td:first-child,
.stats-table--sub-annual tbody tr.row-odd td:nth-child(2) {
  background-color: #efefef; /* 4% darker than row-odd */
}

.stats-table--sub-annual tbody tr.row-even td:first-child,
.stats-table--sub-annual tbody tr.row-even td:nth-child(2) {
  background-color: #f5f5f5; /* 4% darker than white */
}

.stats-table--sub-annual tbody tr.head td:first-child,
.stats-table--sub-annual tbody tr.head td:nth-child(2),
.stats-table--sub-annual tbody tr.head td:nth-child(3) {
  background-color: #fff;
}

.stats-table--sub-annual .col-calc {
  font-style: italic;
}

/* Additional sticky columns for minimal CSS */
.stats-table--sub-annual th:first-child,
.stats-table--sub-annual td:first-child {
  background-color: #f2f2f2;
}

.stats-table--sub-annual th:nth-child(2),
.stats-table--sub-annual td:nth-child(2) {
  background-color: #f2f2f2;
}

.stats-table--sub-annual thead th:first-child,
.stats-table--sub-annual thead th:nth-child(2) {
  background-color: #666;
}

/* Annual table columns */
.stats-table--annual .col-series {
  background-color: #fff;
}

.stats-table--annual thead th.col-series {
  background-color: #666;
}

.stats-table--annual tbody tr.row-odd td:first-child {
  background-color: #efefef; /* 4% darker than row-odd */
}

.stats-table--annual tbody tr.row-even td:first-child {
  background-color: #f5f5f5; /* 4% darker than white */
}

.stats-table--annual tbody tr.head td:first-child {
  background-color: #fff;
}

.stats-table--annual .col-pct-change {
  font-weight: 600;
}

/* Additional sticky columns for minimal CSS */
.stats-table--annual th:first-child,
.stats-table--annual td:first-child {
  background-color: #fff;
}

.stats-table--annual thead th:first-child {
  background-color: #666;
}

/* Adhoc table columns */
.stats-table--adhoc .col-label {
  background-color: #fff;
}

.stats-table--adhoc thead th.col-label {
  background-color: #666;
}

.stats-table--adhoc tbody tr.row-odd td:first-child {
  background-color: #efefef; /* 4% darker than row-odd */
}

.stats-table--adhoc tbody tr.row-even td:first-child {
  background-color: #f5f5f5; /* 4% darker than white */
}

.stats-table--adhoc tbody tr.head td:first-child {
  background-color: #fff;
}

/* Additional sticky columns for minimal CSS */
.stats-table--adhoc th:first-child,
.stats-table--adhoc td:first-child {
  background-color: #fff;
}

.stats-table--adhoc thead th:first-child {
  background-color: #666;
}

/* ==========================================================================
   Missing Data Indicator
   ========================================================================== */

.stats-table .not-available {
  color: #999;
  cursor: help;
}

/* ==========================================================================
   Sticky Header Clone (from JS)
   ========================================================================== */

.sticky-header-clone {
  background: #fff;
}

.sticky-header-clone table thead {
  background-color: #666;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.sticky-header-clone table thead th {
  background-color: #666;
  color: #fff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}
