/* https://phabricator.wikimedia.org/source/mediawiki/browse/master/resources/src/mediawiki.legacy/shared.css;1fd66a67edcd233de90560105bebf6a708e3b734 */
table, th, td {
    background-color: #070605;
    color: #ddd;
    margin: 1em 0;
    border: 1px solid #5d564e;
    border-collapse: collapse;
}

table {
    border-width: 2px;
}
tr > th, tr > td {
    padding: 0.2em 0.4em;
}
tr > th {
    background-color: #23211f;  /* #15130f */
}
td.coloured {
    background-color: #181512;
}
table.first-male th {
    background-color: #00407f;
}
table.first-male td.coloured {
    background-color: #001933;
}
table.first-female th {
    background-color: #7f002b;
}
table.first-female td.coloured {
    background-color: #330011;
}
table.first-neutral th {
    background-color: #006600;  /* #197f19 */
}
table.first-neutral td.coloured {
    background-color: #003300;  /* #0a330a */
}
table.parent-names th {
    background-color: #2d1159;  /* #42257c, #210056 */
}
table.parent-names td.coloured {
    background-color: #190e30;
}
table.trait-main th, table.trait-neutral th {
    background-color: #660a0a;  /* #7f100e | Originally olive green */
}
table.trait-main td.coloured, table.trait-neutral td.coloured {
    background-color: #300505;  /* Originally olive green */
}
table.profession th {
    background-color: #005166;  /* #00657f */
}
table.profession td.coloured {
    background-color: #002630;
}
table.word-mix th, table.word-mix-re th {
    background-color: #594400;  /* #7a5f00, #685000 */
}
table.word-mix td.coloured, table.word-mix-re td.coloured {
    background-color: #302600;
}
td.green {
    background-color: #032603;  /* #092609 */
}
td.red {
    background-color: #260303;  /* #260909 */
}

/* Light theme */
@media (prefers-color-scheme: light) {
    table, th, td {
        background-color: #f8f9fa;
        color: #222;
        border-color: #a2a9b1;
    }
    tr > th {
        background-color: #dfe0e1;  /* #eaecf0 */
        text-align: center;
    }
    td.coloured {
        background-color: #eaecf0;  /* #dfe0e1 */
    }
    table.first-male th {
        background-color: #a0d8ff;
    }
    table.first-male td.coloured {
        background-color: #d8ecff;
    }
    table.first-female th {
        background-color: #ffa0d0;
    }
    table.first-female td.coloured {
        background-color: #ffd8e8;
    }
    table.first-neutral th {
        background-color: #9fff9f;
    }
    table.first-neutral td.coloured {
        background-color: #d8ffd8;
    }
    table.parent-names th {
        background-color: #c6c6ff;  /* #b8b8ff */
    }
    table.parent-names td.coloured {
        background-color: #e2e2ff;  /* #d8d8ff */
    }
    table.trait-main th, table.trait-neutral th {
        background-color: #afc87a;  /* #9bbb59 */
    }
    table.trait-main td.coloured, table.trait-neutral td.coloured {
        background-color: #e1eacd;  /* #ebf1de */
    }
    table.profession th {
        background-color: #6fbcd1;  /* #4bacc6 */
    }
    table.profession td.coloured {
        background-color: #c9e6ed;  /* #daeef3 */
    }
    table.word-mix th, table.word-mix-re th {
        background-color: #ffd8b0;
    }
    table.word-mix td.coloured, table.word-mix-re td.coloured {
        background-color: #ffecd8;
    }
    td.green {
        background-color: #cbffcb;
        text-align: center;
    }
    td.red {
        background-color: #ffbfbf;
        text-align: center;
    }
}

/* This seems to actually make it display line-by-line on mobile, however larger tables would need to be scrolled. */
.first-names {
    display: inline-block;
    /*width: 33%;*/
    margin-right: 10em;
}
.first-names h4 {
    margin-top: 0.2em;
}