@import url("./vendor/font-bitter/font-bitter.css");
@import url("./vendor/font-awesome/font-awesome.css");
@import url("./css/base-vars.css");
@import url("./css/utilities.css");
@import url("./css/elements.css");
@import url("./css/content-grid.css");
@import url("./css/header-footer.css");
@import url("./css/search.css");
@import url("./css/article.css");
@import url("./css/content.css");
@import url("./css/post-list.css");

/* HACK: vars for themes seem to need to live here to work with theme-selector */

@media (prefers-color-scheme: light) {
  :root {
    --theme-background-color: rgba(238, 238, 238, 1);
    --theme-background-color-transparent: rgba(238, 238, 238, 0.7);
    --theme-highlighted-bg-color: #dfdfdf;
    --theme-dialog-bg-color: rgba(192, 192, 192, 0.8);
    --theme-text-color: #111;
    --theme-border-color: #000;
    --theme-link-color: #383;
  }
}

@media (prefers-color-scheme: dark) {
  :root {
    --theme-background-color: rgba(24, 24, 24, 1);
    --theme-background-color-transparent: rgba(24, 24, 24, 0.7);
    --theme-highlighted-bg-color: #332f33;
    --theme-dialog-bg-color: rgba(0, 0, 0, 0.8);
    --theme-text-color: #eee;
    --theme-border-color: rgba(255, 255, 255, 0.6);
    --theme-link-color: rgba(164, 164, 255, 0.8);
  }
  body {
    --pagefind-ui-primary: #034ad8;
    --pagefind-ui-text: #eee;
    --pagefind-ui-background: rgba(0, 0, 0, 0.7);
    --pagefind-ui-border: rgba(255, 255, 255, 0.6);
    --pagefind-ui-tag: #ddd;  
  }  
}