/* Article colour themes. Loaded only by article pages that have <body class="theme-NAME">.
   Only the hero band and the article body pick up the colour; the header and footer stay the same.
   To go back to one look everywhere: run NDM SEO Articles/tools/apply_article_themes.js --undo (or delete this file's link from the pages). */
.theme-coral .hero, .theme-coral .article { --brand:#B5532E; --brand-dark:#8A3B1E; --brand-soft:#FBEBE3; }
.theme-plum  .hero, .theme-plum  .article { --brand:#6A4C93; --brand-dark:#4B3470; --brand-soft:#EEE8F5; }
.theme-ocean .hero, .theme-ocean .article { --brand:#2F6485; --brand-dark:#1E465F; --brand-soft:#E3EEF5; }
.theme-ochre .hero, .theme-ochre .article { --brand:#9A6A12; --brand-dark:#6E4A0B; --brand-soft:#FBF1DC; }
.theme-rose  .hero, .theme-rose  .article { --brand:#A8456B; --brand-dark:#7A2F4D; --brand-soft:#F8E6EE; }
.theme-coral .article .note-box { border-color:#F0CDBE; }
.theme-plum  .article .note-box { border-color:#D9CCEB; }
.theme-ocean .article .note-box { border-color:#C5DBE8; }
.theme-ochre .article .note-box { border-color:#EBD7A8; }
.theme-rose  .article .note-box { border-color:#EBC5D5; }
/* the short answer box gets a coloured edge so it stands out a little */
.theme-coral .article .answer-box { border-left:5px solid #B5532E; }
.theme-plum  .article .answer-box { border-left:5px solid #6A4C93; }
.theme-ocean .article .answer-box { border-left:5px solid #2F6485; }
.theme-ochre .article .answer-box { border-left:5px solid #9A6A12; }
.theme-rose  .article .answer-box { border-left:5px solid #A8456B; }
/* hub page: a coloured top edge on each card */
.article-card[data-theme="coral"] { border-top:5px solid #B5532E; }
.article-card[data-theme="plum"]  { border-top:5px solid #6A4C93; }
.article-card[data-theme="ocean"] { border-top:5px solid #2F6485; }
.article-card[data-theme="ochre"] { border-top:5px solid #9A6A12; }
.article-card[data-theme="rose"]  { border-top:5px solid #A8456B; }
