/* ------ COLORS ------ */

/* Color setting */
:root {
    /* The background of the text section */
    --background: #F2D8D8;
    --background-pattern: url("./images/groovepaper.png");
    /* The background for the header and footer */
    --header-footer-background: #F6B7CE;
    --header-footer-pattern: url("./images/transparent-square-tiles.png");
    /* Regular text color */
    --text: black;
    /* Bonus Color (tm). Horizontal rules, borders, etc. */
    --accent: #58132C;
    /* Background of highlighted and marked text */
    --highlight: #efe4d3;
    /* Link text */
    --unvisited-link: #58132C;
    --visited-link: #3a2471;
}
/* Dark mode  colors*/
@media screen and (prefers-color-scheme: dark) {
    :root {
    /* The background of the text section */
    --background: #520727;
    --background-pattern: none;
    /* The background for the header and footer */
    --header-footer-background: #69163a;
    --header-footer-text: #ffffff;
    /* Regular text color */
    --text: #ffffffff;
    /* Bonus Color (tm). Horizontal rules, borders, etc. */
    --accent:  #ffffffff;
    /* Background of highlighted and marked text */
    --highlight: #221111;
    /* Link text */
    --unvisited-link: #FFADFC;
    --visited-link: #C7CCFF;
    }
}

/* ------ FONTS ------ */

body {
    /* System font stack + dyslexia fonts
     * and Atkinson Hyperlegible (if installed on user system) */
    font-family: Dyslexie, OpenDyslexic, 'Atkinson Hyperlegible', Verdana, Ubuntu, roboto, noto, Arial, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, -apple-system, BlinkMacSystemFont, Sans-Serif;
    /* Font size = user's browser font size preference (1em) */
    font-size: 1em;
}

/* Header title font */
header h1 {font-family: Dyslexie, OpenDyslexic, 'Abril Fatface', Serif; word-spacing: 0.1em;}

/* abril-fatface-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Abril Fatface';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/abril-fatface-v23-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

/* Dark mode tweaks */
@media screen and (prefers-color-scheme: dark) {
    h1, h2, h3, h4, h5, h6, dt, mark {color: var(--header-footer-text);}
    mark {padding: 2px 5px;}
    /* Mouse-highlighted text */
    ::selection {color: var(--header-footer-text); background: var(--highlight);}
}