/*----------------------------------------*/
/* ----- Begin Gabe's Custom Styles ----- */
/*----------------------------------------*/

/* ---------- Table Styling --------- */

/**
 * General selector for table:
 *  #content .user_conent table:has(tr:nth-child(2)):has(tr:first-child td:nth-child(2))
 *
 * Breakdown:
 *  #content = Target the content of the page (not the menus, etc.)
 *  .user_content = Target the user-generated content area
 *  table
 *    :has(tr:nth-child(2)) = Target only tables with at least 2 rows
 *    :has(tr:first-child td:nth-child(2)) = Target only tables with at least 2 columns
 */

/* Top-level table itself: remove built-in table border */
#content .user_content table:has(tr:nth-child(2)):has(tr:first-child td:nth-child(2)) {
  border: none !important;
}

/* Cells of first row: style as header row */
#content .user_content table:has(tr:nth-child(2)):has(tr:first-child td:nth-child(2)) tr:first-child td {
  /* Colorful background */
  background-color: #1782C5 !important;

  /* A little cell padding */
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;

  /* White bold text */
  color: white !important;
  font-weight: bold !important;
}

/* All cells: borders, spacing, alignment */
#content .user_content table:has(tr:nth-child(2)):has(tr:first-child td:nth-child(2)) td {
  /* Subtle cell border */
  border: 0.07rem solid black !important;

  /* A little cell padding */
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;

  /* Canvas usually middle-aligns table cells, we're overriding this: */
  vertical-align: top !important;
}

/* Top left cell: remove borders and background if empty */
#content .user_content table:has(tr:nth-child(2)):has(tr:first-child td:nth-child(2)) tr:first-child td:first-child:empty {
  border-top: none !important;
  border-left: none !important;
  background: transparent !important;
}

/* First column: style as header column if top left cell is empty */
#content .user_content table:has(tr:nth-child(2)):has(tr:first-child td:nth-child(2)):has(tr:first-child td:first-child:empty) tr td:first-child {
  font-weight: bold !important;
}

/*----------------------------------------*/
/* ------ End Gabe's Custom Styles ------ */
/*----------------------------------------*/