/* Light/Dark Independent Vars */
.theme-default {
    /* Colours */
    --color-bg-header: linear-gradient(180deg, #470e3c 0%, #ffffff00 100%);
    --color-bg-error-msg: #fee;
    --color-txt-h1: #8a0085;
    --color-txt-h1-grad: linear-gradient(135deg, #8a0085 0%, #ff24c1 30%, #ee34cc 55%, #ff00cc 85%);
    --color-txt-header-h2: #afb;
    --color-txt-brand-coder: #274542;
    --color-txt-brand-jason: #fff;
    --color-border-h2: linear-gradient(to left, #00C853, #B2FF59);
    --color-border-error-msg: #c00;
    --color-shadow-brand-cjo: #000000aa;
    --color-shadow-h1: #ffddcc55;
    /** Swatch **/
    --color-btn-primary: #b212c4;
    --color-btn-secondary: #ff24c1;
    --color-btn-active: #339699;
    --color-highlight-primary: #ff7654;
    --color-highlight-secondary: #00C853;
    /* Fonts */
    --font-body: "Montserrat", sans-serif;
    --font-h1: "Gravitas One", serif;
    --font-slogan-slogan: "Ubuntu Sans", serif;
    --font-article: "Montserrat", sans-serif;
    --font-article-title: "Ubuntu Sans", sans-serif;
    --font-connect-title: "Ubuntu Sans", sans-serif;
    --font-example: "Delius", serif;
    --font-menu-item: "Ubuntu Sans", sans-serif;
}

.theme-default.light {
    /* Colours */
    --color-bg-body: rgb(255, 205, 251);
    --color-bg-btn-disabled: #ccc;
    --color-bg-btn-primary: var(--color-btn-primary);
    --color-bg-btn-seconary: var(--color-btn-seconary);
    --color-bg-example-quote: #ccd;
    --color-bg-mnav: #ffffffdd;
    --color-bg-mnav-item: #fff;
    --color-bg-social-hover: #fff;
    --color-bg-sticky: #f3e300;
    --color-bg-sticky-cardinal: rgb(230, 180, 89);
    --color-bg-translucent-low: #ffffff60;
    --color-bg-translucent-mid: #ffffffbb;
    --color-txt: #222;
    --color-txt-article-brand-mrsroe: #a34;
    --color-txt-article-em: var(--color-highlight-primary);
    --color-txt-article-figcaption: #445;
    --color-txt-article-h2: #ff03e6;
    --color-txt-article-h2-grad: linear-gradient(45deg, #ff03e6 27%, #b212c4 50%, #ffc7ff 100%);
    --color-txt-article-h3: #8a0085;
    --color-txt-article-h4: #9f449a;
    --color-txt-article-h5: #777;
    --color-txt-article-source: #555;
    --color-txt-btn-disabled: #666;
    --color-txt-created: #433;
    --color-txt-form-item-selected: #0e9401;
    --color-txt-form-item-unselected: #333;
    --color-txt-idiom-example: #444;
    --color-txt-idiom-example-quote: #337;
    --color-txt-lang-f: #a00;
    --color-txt-lang-m: #00a;
    --color-txt-lang-n: #aa0;
    --color-txt-list-item: #833;
    --color-txt-list-sections: var(--color-highlight-primary);
    --color-txt-mnav-item: #e6657a;
    --color-txt-mnav-item-hover: #974250;
    --color-txt-mnav-item-section: #a67890;
    --color-txt-sentence-translated: #866;
    --color-txt-sentence-target: #733;
    --color-txt-slogan-site: #fee;
    --color-txt-social-hover: #ff00ff;
    --color-txt-socials: #834;
    --color-txt-sticky: #333;
    --color-txt-sticky-cardinal: rgb(143, 73, 15);
    --color-txt-sticky-date: #766;
    --color-txt-update: #fdd;
    --color-border-article-h2: rgb(255, 136, 255);
    --color-border-brand-cjo: #999;
    --color-border-example-quote: #226;
    --color-border-form-item-selected: #0e9401;
    --color-border-form-item-unselected: #aaa;
    --color-border-form-item-unselected-hover: #666;
    --color-border-mnav-item: rgb(196, 74, 165);
    --color-shadow-select-lang: #00000088;
    --color-shadow-select-lang-item: #fff;
    --color-shadow-sticky: #333333dd;
    --color-svg-article-h2: #b212c4;
}