/* Wrap tables so they scroll horizontally on small screens */
.table-wrapper {
  width: 100%;
  overflow-x: auto;
}

/* Base discography table styling */
table.discography {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
  margin: 1.5rem 0;
  border: 2px solid #000;   /* OUTER BORDER */
}

/* Table header */
table.discography thead {
  background: #111;
  color: #fff;
}

table.discography th,
table.discography td {
  padding: 0.5rem 0.75rem;
  text-align: left;
  border: 1px solid #ccc;   /* CELL BORDERS */
  vertical-align: top;
}

/* Optional: thicker bottom border on header */
table.discography thead th {
  border-bottom: 2px solid #000;
}

/* Zebra striping */
table.discography tbody tr:nth-child(even) {
  background: #f7f7f7;
}

/* Hover effect */
table.discography tbody tr:hover {
  background: #eaeaea;
}

/* Make Year column a bit narrower on wider screens */
@media (min-width: 700px) {
  table.discography th:first-child,
  table.discography td:first-child {
    width: 4rem;
    white-space: nowrap;
  }
}

/* Buttons in Listen column */
table.discography td:last-child a {
  display: inline-block;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  text-decoration: none;
  font-size: 0.85rem;
  border: 1px solid #333;
}

table.discography td:last-child a.primary-listen {
  background: #333;
  color: #fff;
}

table.discography td:last-child a.secondary-listen {
  background: transparent;
  color: #333;
}

/* Small screens */
@media (max-width: 500px) {
  table.discography th,
  table.discography td {
    padding: 0.4rem 0.5rem;
    font-size: 0.85rem;
  }

  table.discography th:nth-child(4),
  table.discography td:nth-child(4) {
    white-space: nowrap;
  }
}

/* Tracklist styling */
table.discography .tracklist {
  margin: 0;
  padding-left: 1.25rem;
  font-size: 0.85rem;
}

table.discography .tracklist li {
  margin: 0;
  line-height: 1.3;
}
.small-image {
  width: 200px;      /* or 150px, 250px, etc. */
  height: auto;      /* keep aspect ratio */
}
header {
  text-align: center;
}