/*
  Table with grey background - sales numbers
*/

table {
    border-collapse: collapse;
}

.table-min-width {
    min-width: 310px;
}

th {
    background-color: lightgrey;
    border: 1px solid white;
    text-align: left;
    white-space: nowrap;
    padding: 6px;
}

th.white {
    background-color: white;
}

td {
    background-color: #f0f0f0;
    border: 1px solid white;
    text-align: left;
    white-space: nowrap;
    padding: 4px;
}

/*
  Every other row a darker grey, so rows are easier to follow. Tables in
  forms (labels and choices) keep one colour, and so do tables with class
  no-stripes. In tables with class row-hover, the row under the mouse gets
  the darker grey. Gold, silver and bronze cells keep their colour.

  Only rows with data cells (td) are counted, so the first row after the
  header rows is always light grey, however many header rows there are.
*/

tr:nth-child(even of :has(> td)) td:not(.gold, .silver, .bronze) {
    background-color: #e2e2e2;
}

form tr:nth-child(even of :has(> td)) td:not(.gold, .silver, .bronze),
table.no-stripes tr:nth-child(even of :has(> td)) td:not(.gold, .silver, .bronze) {
    background-color: #f0f0f0;
}

/* ":has(> td)" to win over the rule above */
table.row-hover tr:hover:has(> td) td:not(.gold, .silver, .bronze) {
    background-color: #e2e2e2;
}

/*
  Blue table - header and alternating row colours (as in show_segment.php)
*/

table.blue th {
    background-color: #a2a6d5;
}

table.blue tbody tr:nth-child(odd) td {
    background-color: #f1f4f8;
}

table.blue tbody tr:nth-child(even) td {
    background-color: #dae1eb;
}

/*
  Cells with long text that should wrap instead of widening the table
*/

td.wrap {
    white-space: normal;
    max-width: 350px;
}

/*
  Column alignments
*/

.left-align {
    text-align: left;
}

.right-align {
    text-align: right;
}

.center-align {
    text-align: center;
}

.nowrap {
    white-space: nowrap;
}

/*
  Gold, silver and bronze for ranks 1, 2 and 3 (tdrc() in table_tools.php)
*/

td.gold   { background-color: #FFD700; }
td.silver { background-color: #C0C0C0; }
td.bronze { background-color: #CC9966; }