/**
 * Per-timetable colour override.
 *
 * Each wrapper that gets `timetable-colour-{name}` declares the two
 * tokens below. The four rulesets under them style headings, hr, day
 * selectors, and book-now buttons for every colour from one place.
 *
 * Palette mirrors resources/css/components/page-colour.css.
 *
 * Specificity beats body.page-colour-X even when the theme stylesheet
 * loads after this one.
 */

.timetable.timetable-colour-blue    { --timetable-bg: #003c55; --timetable-accent: #0077aa; }
.timetable.timetable-colour-teal    { --timetable-bg: #005e59; --timetable-accent: #00b3aa; }
.timetable.timetable-colour-red     { --timetable-bg: #c41022; --timetable-accent: #ef3a4c; }
.timetable.timetable-colour-green   { --timetable-bg: #00391f; --timetable-accent: #008e4e; }
.timetable.timetable-colour-purple  { --timetable-bg: #40386c; --timetable-accent: #6155a4; }
.timetable.timetable-colour-orange  { --timetable-bg: #b43e0b; --timetable-accent: #f26122; }
.timetable.timetable-colour-darkred { --timetable-bg: #60102f; --timetable-accent: #a81d52; }
.timetable.timetable-colour-pink    { --timetable-bg: #921b5d; --timetable-accent: #d72b8a; }
.timetable.timetable-colour-lime    { --timetable-bg: #668b27; --timetable-accent: #96c93d; }
.timetable.timetable-colour-yellow  { --timetable-bg: #b58b00; --timetable-accent: #ffc60b; }

body .timetable[class*="timetable-colour-"] h1,
body .timetable[class*="timetable-colour-"] h2,
body .timetable[class*="timetable-colour-"] h3,
body .timetable[class*="timetable-colour-"] h4,
body .timetable[class*="timetable-colour-"] h5,
body .timetable[class*="timetable-colour-"] h6,
body .timetable[class*="timetable-colour-"] a
{
    color: var(--timetable-accent);
}
body .timetable[class*="timetable-colour-"] hr
{
    border-color: var(--timetable-accent);
}
body .timetable[class*="timetable-colour-"] .timetable-day-selector,
body .timetable[class*="timetable-colour-"] .book-now-button
{
    background: var(--timetable-bg);
}
body .timetable[class*="timetable-colour-"] .timetable-day-selector.today-date,
body .timetable[class*="timetable-colour-"] .book-now-button:hover
{
    background-color: var(--timetable-accent);
}