/* Shared styles for stats tables (sci-fi theme) */

/* Scrollbar styling for DataTables scroll body (Webkit) */
.dataTables_scrollBody::-webkit-scrollbar {
  width: 12px;
}
.dataTables_scrollBody::-webkit-scrollbar-button { display: none; }
.dataTables_scrollBody::-webkit-scrollbar-track {
  background: #0d0d1a;
  box-shadow: inset 0 0 5px #000;
  border-radius: 8px;
  overflow: hidden;
}
.dataTables_scrollBody::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #001f3f, #0074D9);
  border-radius: 12px;
  border: 3px solid #0d0d1a;
  box-shadow: inset 0 0 8px #7FDBFF;
}
.dataTables_scrollBody::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #0074D9, #001f3f);
}
.dataTables_scrollBody { scrollbar-width: thin; scrollbar-color: #0074D9 #0d0d1a; }

/* Reusable table styles */
.stats-table {
  border-collapse: separate; /* allow neon separators */
  border-spacing: 0 6px; /* vertical spacing between rows */
  width: 100%;
  background: transparent;
  color: #BFDFFF;
  font-family: 'Montserrat', system-ui, Arial, sans-serif;
}

.stats-table, .stats-table th, .stats-table td { border: none !important; }

/* Header: target original and DataTables cloned headers */
.stats-table thead th,
table.dataTable thead th,
.dataTables_scrollHead table thead th {
  background: linear-gradient(180deg,#071029 0%, #08142a 100%);
  color: #7FDBFF;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(127,200,255,0.08);
  text-align: left;
  font-weight: 600;
  letter-spacing: 0.6px;
  position: relative; /* for sort indicator */
  padding-right: 30px; /* room for sort icon */
}

.stats-table tbody tr {
  background: linear-gradient(180deg, rgba(9,12,22,0.6), rgba(6,8,15,0.6));
  box-shadow: 0 2px 8px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.02);
  border-radius: 6px;
}

.stats-table tbody td { border: none; padding: 10px 12px; vertical-align: middle; position: relative; }

.stats-table tbody tr:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.7), inset 0 0 14px rgba(127,200,255,0.02);
  background: linear-gradient(180deg, rgba(12,20,36,0.75), rgba(8,12,22,0.75));
}

/* subtle neon separators between columns */
.stats-table tbody td + td::before {
  content: '';
  position: absolute;
  width: 1px;
  height: 60%;
  background: linear-gradient(180deg, rgba(127,200,255,0.08), rgba(127,200,255,0.02));
  margin-left: -6px;
}

/* DataTables sort indicators (custom) */
.stats-table thead th.sorting:after { content: '\25B4\25BE'; font-size: 10px; color: rgba(127,200,255,0.35); position: absolute; right: 10px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.stats-table thead th.sorting_asc:after { content: '\25B4'; color: #7FDBFF; }
.stats-table thead th.sorting_desc:after { content: '\25BE'; color: #7FDBFF; }
.stats-table thead th { cursor: pointer; }

@media (max-width:900px) {
  .stats-table thead th, .stats-table tbody td { padding: 8px; }
}

/* Week picker shared styles (used by DeckMetaStats and CardMetaStats) */
.week-controls{ display:flex; gap:12px; align-items:center; margin-bottom:12px; }
.week-control{ display:flex; gap:8px; align-items:center; }
.week-control label{ color:#BFDFFF; font-weight:600; min-width:100px; display:inline-flex; align-items:center; justify-content:flex-end; padding-right:8px; font-size:14px; line-height:1; }
.select-wrap{ position:relative; display:inline-block; }
.week-select{ margin:0px;width:120px; padding:6px 8px; padding-right:30px; border-radius:4px; background:#071029; color:#BFDFFF; border:1px solid rgba(127,200,255,0.12); box-sizing:border-box; display:inline-block; vertical-align:middle; -webkit-appearance:none; -moz-appearance:none; appearance:none; font-size:14px; line-height:1.2; }
.week-select option{ background:#071029; color:#BFDFFF; }
.week-refresh{ background:#222a44; color:#7FDBFF; border:none; border-radius:4px; padding:6px 12px; cursor:pointer; display:inline-flex; align-items:center; font-size:14px; line-height:1; }
.select-wrap::after{ content:'▾'; position:absolute; right:10px; top:50%; transform:translateY(-50%); pointer-events:none; color:rgba(127,200,255,0.4); font-size:12px; }
@media (max-width:600px){
  .week-controls{ flex-direction:column; align-items:flex-start; }
  .week-control{ width:100%; }
  .week-select{ width:160px; }
}