/*
 * Hereafter.rip — Theme
 * Color palette based on W3.CSS Blue Grey
 * https://www.w3schools.com/lib/w3-theme-blue-grey.css
 */

:root {
    /* Blue-grey palette */
    --bg-l5:        #f5f7f8;   /* page background */
    --bg-l4:        #dfe5e8;   /* cards, panels */
    --bg-l3:        #becbd2;   /* borders, dividers */
    --bg-l2:        #9eb1bb;   /* muted elements */
    --bg-l1:        #7d97a5;   /* secondary text */
    --bg-base:      #607d8b;   /* primary buttons, links */
    --bg-d1:        #57707d;   /* button hover */
    --bg-d2:        #4d636f;
    --bg-d3:        #435761;
    --bg-d4:        #3a4b53;   /* footer */
    --bg-d5:        #303e45;   /* header / navbar */

    /* Semantic aliases */
    --color-header-bg:      var(--bg-d5);
    --color-header-text:    #ffffff;
    --color-footer-bg:      var(--bg-d4);
    --color-footer-text:    #ffffff;
    --color-page-bg:        var(--bg-l5);
    --color-card-bg:        #ffffff;
    --color-card-border:    var(--bg-l3);
    --color-primary:        var(--bg-base);
    --color-primary-hover:  var(--bg-d1);
    --color-text:           #212121;
    --color-text-muted:     var(--bg-l1);
    --color-link:           var(--bg-base);
    --color-link-hover:     var(--bg-d1);
}