html, body {
  font-family: Verdana, sans-serif;
  padding: 0;
}

:root {
  --accent-color: #009879;
}

a:link, a:visited, a:active {
  text-decoration: none;
}
a:hover {
  color: var(--accent-color);
  text-decoration: underline;
}

a:focus {
  color: var(--accent-color);
  outline: none;
  text-decoration: underline;
}

h1 {
  font-size: 1.5rem;
  color: black;
  margin: 1rem 0;
}

.high {
  background-color: gold;
  font-weight: bold;
}

/* table-styles.css - drop into your external stylesheet */

:root {
  --accent-color: #009879;
  --group1-a: #e7f5ff; /* both genders - base */
  --group1-b: #d8eefc; /* both genders - stripe */
  --group2-a: #ecf9ee; /* man - base */
  --group2-b: #dff3d9; /* man - stripe */
  --group3-a: #fff0f6; /* woman - base */
  --group3-b: #ffdbe9; /* woman - stripe */
  --hover-color: rgba(255, 245, 157, 0.95); /* soft yellow hover */
}

table {
  border-collapse: collapse;
  box-shadow: 0 2px 5px rgba(0, 152, 121, 0.15);
  margin: 0.5rem 0;
}

/* Header */
thead th {
  background-color: var(--accent-color);
  color: #fff;
  padding: 0.6rem 0.5rem;
  text-align: center;
  border: 1px solid #ddd;
}

/* Cells */
th, td {
  border: 1px solid #ddd;
  padding: 0.45rem 0.6rem;
  text-align: center;
  vertical-align: middle;
}

/* Keep first column left-aligned (Gender and Age) */
thead th:first-child,
tbody td:first-child {
  text-align: left;
}
tbody td:nth-child(2) {
  text-align: left;
}

/* =========================
   Row groups (tbody)
   =========================
   Note: tbody tr:nth-child(1) is the first data row (header is in thead)
   Group 1 = tbody rows 1..7
   Group 2 = tbody rows 8..14
   Group 3 = tbody rows 15..21
*/

/* Group 1: rows 1–7 (Both genders) */
tbody tr:nth-child(-n+7) {
  background-color: var(--group1-a);
}
tbody tr:nth-child(-n+7):nth-child(even) {
  background-color: var(--group1-b);
}

/* Group 2: rows 8–14 (Man) */
tbody tr:nth-child(n+8):nth-child(-n+14) {
  background-color: var(--group2-a);
}
tbody tr:nth-child(n+8):nth-child(-n+14):nth-child(even) {
  background-color: var(--group2-b);
}

/* Group 3: rows 15–21 (Woman) */
tbody tr:nth-child(n+15):nth-child(-n+21) {
  background-color: var(--group3-a);
}
tbody tr:nth-child(n+15):nth-child(-n+21):nth-child(even) {
  background-color: var(--group3-b);
}

/* Hover - overrides group stripe with a stronger highlight */
tbody tr {
  transition: background-color 0.15s ease-in-out;
}
tbody tr:hover {
  background-color: var(--hover-color) !important;
}

/* Optional: make the numeric columns align right for readability */
tbody td:nth-child(n+3) {
  text-align: right;
  white-space: nowrap;
}