@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap");

body {
    --font-interface: "IBM Plex Serif", serif;
    --font-text: "IBM Plex Serif", serif;
    --font-monospace: "IBM Plex Mono", monospace;
}

/* Light Mode styling */
.theme-light {
    --background-primary: #fffcf0; /* paper */
    --background-secondary: #f2f0e5; /* 50 */

    --text-normal: #100f0f; /* black */
    --text-muted: #6f6e69; /* 600 */
    --text-faint: #b7b5ac; /* 300 */

    --text-accent: #205ea6; /* blue */
    --text-link: #205ea6; /* blue */
    --text-link-hover: #4385be; /* blue light */

    --interactive-accent: #205ea6;
    --background-modifier-border: #e6e4d9; /* 100 */
}

/* Dark Mode styling */
.theme-dark {
    --background-primary: #100f0f; /* black */
    --background-secondary: #1c1b1a; /* 950 */

    --text-normal: #cecdc3; /* 200 */
    --text-muted: #878580; /* 500 */
    --text-faint: #575653; /* 700 */

    --text-accent: #4385be; /* blue light */
    --text-link: #4385be; /* blue light */
    --text-link-hover: #205ea6; /* blue */

    --interactive-accent: #4385be;
    --background-modifier-border: #282726; /* 900 */
}