/* Derived Colors (common to all themes) */
:root {
  --accent: #3ca8e7;
  --notice: #c9ebf9;
  --notice-text: #1e7ea5;
  --assignment: #ea1313;
  --warning: #FDF1B4;
  --error: lavenderblush;
  --error-text: #b94a48;
  --form-submit: #415499;
  --form-submit-text: white;
  --primary: orange;
  --primary-text: #593302;


  --primary-muted: color-mix(in srgb, var(--primary) 80%, var(--primary-text));
  --primary-dull: color-mix(in srgb, var(--primary) 30%, var(--background));
  --background-muted: color-mix(in srgb, var(--background) 94%, var(--text));
  --background-extra-muted: color-mix(in srgb, var(--background) 98%, var(--text));
  --important-background-muted: color-mix(in srgb, var(--background) 50%, var(--important-background));
  --important-background-extra-muted: color-mix(in srgb, var(--background) 90%, var(--important-background));
  --warning-text: color-mix(in srgb, black 90%, var(--warning));
  --notice-text-muted: color-mix(in srgb, var(--notice) 70%, var(--notice-text));

  --text-muted: color-mix(in srgb, var(--text) 40%, var(--background));
  --text-semi-muted: color-mix(in srgb, var(--text) 70%, var(--background));
  --border-color: color-mix(in srgb, var(--text) 10%, var(--background));

  /* Status Colors */
  --success: var(--important-background);
  --info: var(--notice);
  --info-text: var(--notice-text);

  /* Highlight Colors */
  --highlight: color-mix(in srgb, var(--text) 50%, var(--background)); 
  --highlight-light: color-mix(in srgb, var(--background) 90%, var(--text));
  --fore-highlight: var(--background);

  /* List Header */
  --list-header-background: color-mix(in srgb, var(--text) 70%, var(--background));
  --list-header-fore: var(--background);

  /* Form Submit */
  --form-submit-hover: color-mix(in srgb, var(--form-submit) 90%, var(--text));
  --form-submit-border: var(--form-submit-text);
}

/* Light Mode */
html.theme-light {
  --background: #ffffff;
  --text: black;
  --important-background: #fffae7;
  --important-background-text: black;
  --banner-background: var(--background-extra-muted);
  --banner-text: var(--text);

  --link: #5583d9;
}

/* Dark Mode */
html.theme-dark {
  --background: #181818;
  --text: #f5f5f5;
  --link: #6d93db;
  --banner-background: var(--background);
  --fore-highlight: var(--text);
  --highlight: color-mix(in srgb, var(--text) 20%, var(--background));
  --important-background: #2b2719;
  --important-background-text: #f6ffb2;
  --banner-background: var(--background-extra-muted);
  --banner-text: var(--text);
  --notice: #032a3b;
  --notice-text: #7ec9e7;
  
  --list-header-background: color-mix(in srgb, var(--text) 20%, var(--background));
  --list-header-fore: var(--text);
  
 	--blue-text: rgb(116, 157, 231);
 	--green-text: #7abb2e;
 	--assignment: #fa5858;

    
}

/* Dark Mode Specific Fixes */
html.theme-dark #trixEditorHolder span[style*="background-color: yellow"],
html.theme-dark #mainArticle span[style*="background-color: yellow"] {
  color: black;
}

html.theme-dark .logoReg {
    /* filter: contrast(1.9) drop-shadow(0px 0px 7px #ffffff6b); */
    filter: invert(1) grayscale(1) brightness(1.5);
}

html.theme-dark .logoSmall {
/*    filter: contrast(1.9) drop-shadow(0px 0px 7px #ffffff6b); */
    filter: invert(1) grayscale(1) brightness(1.5);
}

html.theme-dark .cover {
  background-color: rgba(0, 0, 0, 0.6) !important;
}

html.theme-dark .faIcon {
  filter: brightness(1.2);
}