variable-intellisense {
    --primary: #36393f;
    --accent: #2f3136;
    --secondary: #202225;
    --text: #dcddde;
    --contrast-text: #eeeeee;
    --muted-text: #72767d;
    --contrast-border: #dcddde;
    --input: #40444b;
    --error: #f44336;
    --highlight: rgba(184, 134, 11, 0.2);
    --active: rgba(0, 255, 255, 0.1);
    --grades: #8bc34a;
    --border-radius: 5px;
    --border-size: 1px;
    --padding: 10px;
    --theme-is-dark: 1;
    --cal1: #457da5;
    --cal2: #547c41;
    --cal3: #926c37;
    --cal4: #7c3d6b;
    --cal5: #0b4c9c;
    --cal6: #00209c;
    --cal7: #004a09;
    --cal8: #72721a;
    --cal9: #44233e;
    --cal10: #683131;
    --cal11: #770a0a;
    --cal12: #a72413;
    --cal13: #e0024c;
    --cal14: #188c16;
    --cal15: #bd7304;
    --cal16: #80168c;
    --cal17: #164152;
    --cal18: #00543f;
    --cal19: #633e11;
    --cal20: #461b2d;
    --cal21: #00427c;
    --cal22: #603073;
    --cal23: #8b1941;
    --cal24: #970c0c;
    --cal25: #9c3b07;
    --cal26: #685203;
    --cal27: #2a5f16;
    --cal28: #09584f;
    --cal29: #005a75;
    --cal30: #4d5557;
}

:root[modern="true"] {
    --modern-border: var(--border-size) solid var(--contrast-border);

    // General

    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p {
        color: var(--text) !important;
    }

    pre {
        background-color: var(--input);
        color: var(--text);
    }

    body {
        background: var(--primary) !important;
        background-color: var(--primary) !important;
    }

    #youtube-disclaimer {
        color: var(--text) !important;
        background-color: var(--secondary) !important;
        padding: var(--padding) !important;
        margin-top: var(--padding) !important;
        border-radius: var(--border-radius) !important;
    }

    textarea,
    select,
    optgroup,
    input[type="text"] {
        background-color: var(--input) !important;
        color: var(--text) !important;
        border: none !important;
        border-radius: var(--border-radius) !important;
    }

    // All user-styled elements -- should be for override user styles only
    &[style-override="true"] {
        .s-edge-feed .edge-item *[style] {
            color: var(--text) !important;
            background: none !important;
        }

        .discussion-view {
            .discussion-prompt *[style],
            .comment-body-wrapper *[style] {
                color: var(--text) !important;
                background: none !important;
            }
        }

        #important-post-body *[style],
        #main-inner .info-container *[style],
        .standard-page .s-page-content-full *[style],
        .discussion-prompt *[style],
        .comment-comment .comment-body-wrapper *[style],
        .instructions-content *[style],
        .lrn_stimulus .lrn_stimulus_content *[style],
        .lrn-possible-answer *[style],
        .folder-description *[style],
        .item-info *[style] {
            color: var(--text) !important;
            background: none !important;
        }
    }

    ul.context-menu-list {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
        border-color: var(--accent) !important;

        li.context-menu-item {
            background-color: var(--secondary) !important;
            color: var(--text) !important;
            border-color: var(--accent) !important;

            &:hover {
                background-color: var(--active) !important;
            }
        }
    }

    .menu-459.group-discussion-left-menu {
        background-color: var(--primary) !important;
    }

    * {
        &::-webkit-scrollbar {
            background: transparent !important;
            width: 15px;
        }

        &::-webkit-scrollbar-track-piece {
            background: var(--accent) !important;
        }

        &::-webkit-scrollbar-button,
        &::-webkit-scrollbar-corner {
            display: none !important;
        }

        &::-webkit-scrollbar-thumb {
            background: var(--input) !important;
            border-radius: var(--border-radius) !important;
        }

        scrollbar-color: var(--input) var(--accent) !important;
        scrollbar-width: 15px !important;
        scrollbar-arrow-color: var(--contrast-text) !important;
    }

    #body {
        background-color: var(--primary) !important;
    }

    iframe:not([id^="firefox-screenshots-"]) {
        // iframe must be white, because we can't change styles within it
        background-color: white !important;
    }

    #main-content-wrapper {
        background-color: var(--accent) !important;
        color: var(--text) !important;
        border: none !important;
        border-bottom-left-radius: var(--border-radius) !important;
        border-bottom-right-radius: var(--border-radius) !important;
    }

    #right-column-inner {
        > div:not(:empty) {
            background-color: var(--secondary) !important;
            border: none !important;
            border-radius: var(--border-radius) !important;
            padding: var(--padding) !important;
        }

        > div[id^="sgyReactRenders_comp_"] {
            display: none;
        }
    }

    #center-top {
        background: unset !important;
        background-color: var(--accent) !important;
        color: var(--text) !important;
        border: none !important;
    }

    .has-right-col #center-inner {
        background: none !important;
    }

    body {
        a.link-btn,
        button.link-btn {
            box-shadow: none !important;
            background: none !important;
            background-color: var(--secondary) !important;
            color: var(--text) !important;
            border: none !important;
            border-radius: var(--border-radius) !important;
        }
    }

    .inline-popup-wrapper {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
        border: var(--modern-border) !important;
        border-radius: var(--border-radius) !important;

        .arrow-top {
            display: none !important;
        }
    }

    .s-polls-results-overlay {
        background-color: var(--input) !important;
    }

    .s-notifications-mini .edge-sentence {
        color: var(--text);
    }

    .drGks a {
        &:hover,
        &:focus {
            background-color: var(--highlight);
        }
    }

    .grade-data {
        color: var(--grades) !important;
    }

    #main .s-notifications-mini {
        .edge-time,
        .created {
            color: var(--muted-text) !important;
        }
    }

    // Hover over Links in Schoology's Native Notifications
    .drGks a {
        &:hover,
        &:focus {
            background-color: var(--highlight);
        }
    }

    .splus-modal-title {
        color: var(--contrast-text) !important;
    }

    .submit-span-wrapper {
        color: var(--contrast-text) !important;

        input {
            &[type="button"],
            &[type="submit"] {
                color: var(--contrast-text) !important;
            }
        }
    }

    :not(.submit-span-wrapper) > input {
        &[type="button"],
        &[type="submit"] {
            color: var(--contrast-text) !important;
        }
    }

    footer li a {
        color: var(--link-color) !important;
    }

    .splus-modal-footer-text {
        color: var(--contrast-text) !important;

        a {
            color: var(--contrast-text) !important;
        }
    }

    body a.link-btn.active,
    div.courses-left-menu,
    .portfolio-list a.btn,
    a._3_bfp,
    #header > header nav li a.util-menu-row-link-2dTZi,
    #header > header nav li a._1Z0RM,
    #header > header nav li button._1Z0RM {
        color: var(--contrast-text) !important;
    }

    footer {
        color: var(--contrast-text) !important;

        button {
            color: var(--contrast-text) !important;
        }
    }

    .Header-header-button-1EE8Y,
    .Header-header-button-active-GnvKh,
    .StandardHeader-header-button-1562K,
    [class*="StandardHeader-header-drop-menu-item-"],
    [class*="StandardHeader-header-drop-menu-"] li a *,
    .StandardHeader-header-button-active-mEoTJ,
    .LGaPf svg {
        color: var(--contrast-text) !important;
    }

    .StandardHeader-header-drop-menu-YShpU._1Z0RM {
        background-color: var(--hover-color) !important;
    }

    div[role="menu"] ._2awxe._3skcp._1tpub a {
        color: var(--link-color) !important;
    }

    .close {
        color: var(--contrast-text) !important;
        opacity: 0.8 !important;

        &:hover,
        &:focus {
            opacity: 1 !important;
            color: var(--contrast-text) !important;
        }
    }

    .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
        border-radius: var(--border-radius) !important;
        background-blend-mode: screen;
    }

    .action-links-unfold {
        background-image: none !important;
        background-color: var(--secondary) !important;
        border-radius: var(--border-radius) !important;
    }

    &[dark="false"] .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
    }

    .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text:hover,
    .action-links-unfold:hover {
        background-color: var(--muted-text) !important;
    }

    &[dark="false"] {
        .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text:hover,
        .action-links-unfold:hover {
            background-color: var(--muted-text) !important;
        }
    }

    &[dark="true"]
        #header
        > header
        li
        svg.util-v2-icon-height-2N1T4:not(.splus-svg-icon-processed) {
        filter: Hue-Rotate(200deg) Invert(1) Saturate(2);
    }

    // Schoology Popups

    .popups-box .popups-body,
    #popups-loading div {
        background-color: var(--primary) !important;
        color: var(--text) !important;
        border: none !important;
    }

    .popups-box {
        .submit-buttons {
            background-color: var(--accent) !important;
            border-top: none !important;
        }

        .popups-title {
            background-color: var(--secondary) !important;
            color: var(--text) !important;
            border: none !important;
        }
    }

    .popups-close {
        &:hover a {
            background-color: var(--input) !important;
        }

        a {
            background-position-y: calc(-80px - (20px * var(--theme-is-dark))) !important;
            border-radius: 2px !important;
        }
    }

    .likers li:not(.last) {
        border-bottom: var(--modern-border) !important;
    }

    fieldset div div div label span {
        color: var(--text) !important;
    }

    ._2WC16 span._24avl._17Z60 {
        color: var(--accent) !important;
    }

    .popups-buttons-inner {
        background: var(--secondary) !important;
    }

    .popups-tab,
    .popups-tabs {
        background: var(--accent) !important;
    }

    .popups-tab.active {
        background: var(--primary) !important;
    }

    ._pendo-step-container-styles {
        background-color: var(--accent) !important;
    }

    .pendo-mock-flexbox-element:nth-child(2) > button {
        background-color: var(--primary) !important;
        border-color: var(--contrast-border) !important;
        color: var(--text) !important;
    }

    .popups-box {
        &.popups-library #resources-left-menu-wrapper {
            background: var(--accent) !important;
        }

        #library-wrapper {
            background: var(--primary) !important;
            border-bottom-left-radius: var(--border-radius) !important;
        }
    }

    div.error,
    tr.error {
        background-color: var(--error) !important;
        border-color: var(--error) !important;
        color: var(--text);
    }

    // Courses and Groups Dropdown

    .splus-courses-navbar-button div[role="menu"],
    .splus-groups-navbar-button div[role="menu"] {
        background-color: var(--accent) !important;
    }

    .splus-coursesdropdown-reorder-btn {
        filter: Invert(var(--theme-is-dark)) !important;
    }

    .splus-courses-navbar-button article,
    .splus-groups-navbar-button article {
        border: var(--border-size) solid transparent !important;
        outline: none !important;

        a {
            border: var(--border-size) solid transparent !important;
            outline: none !important;
        }
    }

    .JoinCard-card-1qWtS {
        border: var(--border-size) solid transparent !important;
        outline: none !important;
    }

    .splus-courses-navbar-button article a:hover,
    .splus-groups-navbar-button article a:hover,
    .JoinCard-card-1qWtS:hover {
        border: var(--modern-border) !important;
        border-radius: var(--border-radius) !important;
    }

    .Card-card-image-uV6Bu {
        border-top-left-radius: var(--border-radius) !important;
        border-top-right-radius: var(--border-radius) !important;
    }

    .Card-card-data-17m6S {
        border-bottom-left-radius: var(--border-radius) !important;
        border-bottom-right-radius: var(--border-radius) !important;

        div {
            border-bottom-left-radius: var(--border-radius) !important;
            border-bottom-right-radius: var(--border-radius) !important;
        }
    }

    .splus-courses-navbar-button article a div,
    .splus-groups-navbar-button article a div {
        background-color: var(--primary) !important;
    }

    .splus-courses-navbar-button article a div div._1wP6w,
    .splus-groups-navbar-button article a div div._1wP6w {
        color: var(--text) !important;
    }

    .splus-courses-navbar-button article a div div._2wOCj,
    .splus-groups-navbar-button article a div div._2wOCj {
        color: var(--muted-text) !important;
    }

    #darktheme-toggle-navbar-button {
        &[data-popup="true"] {
            position: relative;
            background-color: var(--highlight) !important;

            .explanation-popup {
                display: block;
                position: absolute;
                top: 100%;
                left: 0;
                padding: var(--padding);
                background-color: var(--secondary);
                border: var(--modern-border);
                border-radius: var(--border-radius);
                color: var(--text);
                line-height: normal !important;
                text-transform: none !important;
                text-align: left !important;
                width: 250px;
                pointer-events: none;

                h3 {
                    float: right;
                    padding: 5px 20px 5px;
                    margin-top: 5px;
                    border-radius: var(--border-radius);
                    background-color: var(--accent);
                    pointer-events: all;

                    &:hover {
                        background-color: var(--active);
                    }
                }
            }
        }
    }

    #header > header div.Je0RK button._1SIMq {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
        border-radius: var(--border-radius) !important;
    }

    ._1DD87,
    ._3gfrT:focus:not(:active),
    .oUq3j:hover:not(:active) {
        border: var(--modern-border) !important;
    }

    .JoinCard-card-1qWtS ._1Z0RM {
        background-color: var(--primary) !important;
    }

    // Calendar Page

    .fcalendar-filter-menu-wrapper {
        background-color: var(--secondary) !important;
        border-radius: var(--border-radius);
    }

    // Does not fix the left-pointing arrow, as that is a PNG

    .color-codes-box {
        background-color: var(--accent) !important;
    }

    .fcalendar-filter-menu-wrapper .checkbox.filter-selected {
        background-position-y: -19px !important;
    }

    body .fc-event-skin {
        color: var(--text);
    }

    .color-default-personal,
    .color-default-groups,
    .color-default-courses,
    .color-default-school,
    .color-1,
    .color-2,
    .color-3,
    .color-4,
    .color-5,
    .color-6,
    .color-7,
    .color-8,
    .color-9,
    .color-10,
    .color-11,
    .color-12,
    .color-13,
    .color-14,
    .color-15,
    .color-16,
    .color-dark-1,
    .color-dark-2,
    .color-dark-3,
    .color-dark-4,
    .color-dark-5,
    .color-dark-6,
    .color-dark-7,
    .color-dark-8,
    .color-dark-9,
    .color-dark-10 {
        border-color: rgba(0, 0, 0, 0.4) !important;
    }

    .fc-event-skin.ev-course,
    .legend-course {
        background: var(--cal3);
        border-color: rgba(0, 0, 0, 0.4) !important;
    }

    .fc-event-skin.ev-group,
    .legend-group {
        background: var(--cal2);
        border-color: rgba(0, 0, 0, 0.4) !important;
    }

    .fc-event-skin.ev-user,
    .legend-user {
        background: var(--cal1);
        border-color: rgba(0, 0, 0, 0.4) !important;
    }

    .fc-event-skin.ev-school,
    .legend-school {
        background: var(--cal4);
        border-color: rgba(0, 0, 0, 0.4) !important;
    }

    .color-default-personal {
        background: var(--cal1) !important;
    }

    .color-default-groups {
        background: var(--cal2) !important;
    }

    .color-default-courses {
        background: var(--cal3) !important;
    }

    .color-default-school {
        background: var(--cal4) !important;
    }

    .color-1 {
        background: var(--cal5) !important;
    }

    .color-2 {
        background: var(--cal6) !important;
    }

    .color-3 {
        background: var(--cal7) !important;
    }

    .color-4 {
        background: var(--cal8) !important;
    }

    .color-5 {
        background: var(--cal9) !important;
    }

    .color-6 {
        background: var(--cal10) !important;
    }

    .color-7 {
        background: var(--cal11) !important;
    }

    .color-8 {
        background: var(--cal12) !important;
    }

    .color-9 {
        background: var(--cal13) !important;
    }

    .color-10 {
        background: var(--cal14) !important;
    }

    .color-11 {
        background: var(--cal15) !important;
    }

    .color-12 {
        background: var(--cal16) !important;
    }

    .color-13 {
        background: var(--cal17) !important;
    }

    .color-14 {
        background: var(--cal18) !important;
    }

    .color-15 {
        background: var(--cal19) !important;
    }

    .color-16 {
        background: var(--cal20) !important;
    }

    .color-dark-1 {
        background: var(--cal21) !important;
    }

    .color-dark-2 {
        background: var(--cal22) !important;
    }

    .color-dark-3 {
        background: var(--cal23) !important;
    }

    .color-dark-4 {
        background: var(--cal24) !important;
    }

    .color-dark-5 {
        background: var(--cal25) !important;
    }

    .color-dark-6 {
        background: var(--cal26) !important;
    }

    .color-dark-7 {
        background: var(--cal27) !important;
    }

    .color-dark-8 {
        background: var(--cal28) !important;
    }

    .color-dark-9 {
        background: var(--cal29) !important;
    }

    .color-dark-10 {
        background: var(--cal30) !important;
    }

    .fc-state-default {
        background-color: var(--primary) !important;
        border-color: none !important;
        color: var(--text) !important;
        border-width: var(--border-size) !important;

        .fc-button-inner {
            background-color: var(--primary) !important;
            border-color: none !important;
            color: var(--text) !important;
            border-width: var(--border-size) !important;
        }
    }

    .fc-button {
        &.fc-corner-left {
            border-bottom-left-radius: var(--border-radius) !important;
            border-top-left-radius: var(--border-radius) !important;
        }

        &.fc-corner-right {
            border-bottom-right-radius: var(--border-radius) !important;
            border-top-right-radius: var(--border-radius) !important;
        }
    }

    .fc-state-disabled {
        background-color: var(--secondary) !important;
        color: var(--muted-text) !important;
        border-color: none !important;

        .fc-button-inner {
            background-color: var(--secondary) !important;
            color: var(--muted-text) !important;
            border-color: none !important;
        }
    }

    .fc-state-active {
        background-color: var(--active) !important;

        .fc-button-inner {
            background-color: var(--active) !important;
        }
    }

    // Navbar menus

    div.les2-,
    #header > header ul.util-width-thirty-nine-1B-gb {
        background-color: var(--secondary) !important;

        ._3skcp {
            border-color: var(--contrast-border) !important;
        }

        ._1wP6w {
            color: var(--text) !important;
        }

        ._2wOCj {
            color: var(--muted-text) !important;
        }
    }

    .util-hover-background-color-cloud-grey-wHghL:hover,
    .util-focus-background-color-cloud-grey-3x07X:focus,
    ._33zXx {
        background-color: var(--active) !important;
    }

    div.les2- h3 {
        color: var(--text) !important;
    }

    // Modal Red Color

    .close-button,
    .restore-defaults {
        color: var(--error) !important;
    }

    .setting-highlight {
        background-color: var(--highlight) !important;
    }

    // Home Page

    .splus-modal-body {
        background-color: var(--primary) !important;
        color: var(--text) !important;
    }

    .is-home {
        #right-column-inner div,
        #home-feed-container {
            background-color: var(--accent) !important;
            color: var(--text) !important;
            border-radius: var(--border-radius) !important;
        }

        #center div#main,
        #main-inner,
        #main-content-wrapper {
            background-color: var(--primary) !important;
            color: var(--text) !important;
        }
    }

    #basic-user-warning {
        background-color: var(--highlight) !important;
        border: none !important;
        border-radius: var(--border-radius) !important;
    }

    .date-header h4 span,
    .s-poll-option-title,
    .s-like-sentence {
        color: var(--text) !important;
    }

    .comment-body-wrapper {
        color: var(--text) !important;
    }

    .s-polls-poll-option,
    #edge-filters-menu {
        background: none !important;
        background-color: var(--secondary) !important;
        color: var(--text) !important;
        border: var(--modern-border) !important;
        border-radius: var(--border-radius) !important;
    }

    #edge-filters {
        background: none !important;
        border: none !important;
    }

    #edge-filters-btn,
    .feed-comments {
        background-position-y: calc(-576px - 18px * var(--theme-is-dark)) !important;
        background-color: var(--primary) !important;
        color: var(--text) !important;
        border: none !important;
        border-radius: var(--border-radius) !important;
        opacity: unset !important;
    }

    #edge-filters-menu .edge-filter-option {
        background-position: 0 calc(-237px - 20px * var(--theme-is-dark)) !important;

        &:hover,
        &.active:hover {
            background-color: var(--active) !important;
            color: var(--text) !important;
        }
    }

    .gray,
    .upcoming-time {
        color: var(--muted-text) !important;
    }

    img.splus-logo-inline {
        filter: brightness(var(--theme-is-dark)) !important;
    }

    .splus-broadcast-post {
        background-color: var(--active) !important;
    }

    .theme-2016 .date-header h4,
    #home-feed-container #smart-box {
        border-bottom: var(--modern-border) !important;
    }

    .view-file-popup,
    .view-btn-disabled,
    .edit-external-tool-attachment {
        border-left: var(--modern-border) !important;
    }

    .sgy-tabbed-navigation {
        border-bottom: var(--modern-border) !important;

        li.active {
            border-bottom: 5px solid var(--contrast-border) !important;
        }
    }

    .s-edge-type-update-post .update-body,
    .s-edge-type-update-poll .update-body {
        color: var(--text) !important;
    }

    .user span.name-wrapper {
        background: var(--secondary) !important;
    }

    .selected-realm .name-text {
        color: var(--text) !important;
    }

    .selected-realm .name-wrapper {
        background: var(--secondary) !important;
        border-radius: var(--border-radius) !important;
    }

    .userlist_input input,
    .userlist_input_shadow,
    .userlist_input input[type="text"] {
        background-color: var(--input) !important;
        border-radius: var(--border-radius) !important;
        color: white;
    }

    #edge-filters-btn {
        background-color: var(--text) !important;
        color: var(--secondary) !important;
        filter: Invert(var(--theme-is-dark)) !important;
        background-position-y: -577px !important;
        background-position-x: right !important;
        background-image: url("/sites/all/themes/schoology_theme/images/btn-sprite.png?2f89e2e4127348b5") !important;
    }

    &[dark="false"] #edge-filters-btn {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
        filter: none !important;
        background-image: url("/sites/all/themes/schoology_theme/images/btn-sprite.png?5f89e2e4127348b5") !important;
    }

    // Immersive reader button

    .immersive-reader-button-container {
        span svg path {
            fill: var(--text);
        }

        button {
            background-color: var(--primary);
            color: var(--text);
            border: var(--modern-border);

            &:hover,
            &:focus {
                background-color: var(--active);
            }
        }
    }

    // Grades Page

    .gradebook-course.hierarchical-grading-report {
        .period-row .grade-column,
        .category-row .grade-column,
        .item-row .grade-column {
            color: var(--grades) !important;
        }

        .item-row .title-column .title {
            color: var(--text) !important;
        }
    }

    .grade-active-color,
    .awarded-grade span {
        color: var(--grades) !important;
    }

    .due-date,
    .gradebook-course.hierarchical-grading-report .grade-column .max-grade,
    .percentage-contrib,
    span.comment,
    .grade-none-color,
    .course-grade-text,
    .total-points-wrapper *,
    .percentage-grade,
    .comment-body-wrapper,
    .no-grade {
        color: var(--text) !important;
    }

    div.summary-course {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
        border: none !important;
        border-radius: var(--border-radius) !important;
    }

    .grade-edit-indicator {
        filter: Grayscale(var(--theme-is-dark)) Invert(var(--theme-is-dark)) !important;
    }

    .gradebook-course.hierarchical-grading-report {
        .item-row .td-content-wrapper {
            border-top: var(--border-size) dotted var(--contrast-border) !important;
        }

        .period-row .td-content-wrapper,
        .final-row .td-content-wrapper,
        .td-content-wrapper {
            border-top: var(--modern-border) !important;
        }
    }

    .item-row.added-fake-assignment {
        background-color: var(--highlight) !important;
    }

    .splus-grade-help-btn .icon-help {
        background-position: calc(0px - 22px * var(--theme-is-dark)) -127px !important;
    }

    .gradebook-course.hierarchical-grading-report {
        .childrenCollapsed .title-column {
            &:hover .expandable-icon-grading-report {
                position: absolute !important;
                clip: rect(
                    calc(15px - (15px * var(--theme-is-dark))),
                    calc(30px - (15px * var(--theme-is-dark))),
                    calc(30px - (15px * var(--theme-is-dark))),
                    0
                ) !important;
                top: calc(0px + (16px * var(--theme-is-dark))) !important;
                left: -20px !important;
                opacity: 1 !important;
            }

            .expandable-icon-grading-report {
                position: absolute !important;
                clip: rect(
                    calc(15px - (15px * var(--theme-is-dark))),
                    calc(30px - (15px * var(--theme-is-dark))),
                    calc(30px - (15px * var(--theme-is-dark))),
                    0
                ) !important;
                top: calc(0px + (16px * var(--theme-is-dark))) !important;
                left: -20px !important;
                opacity: 0.8 !important;
            }
        }

        .title-column {
            .expandable-icon-grading-report {
                position: absolute !important;
                clip: rect(
                    calc(46px - (11px * var(--theme-is-dark))),
                    calc(60px - (45px * var(--theme-is-dark))),
                    calc(80px - (30px * var(--theme-is-dark))),
                    0
                ) !important;
                top: calc(-32px + (16px * var(--theme-is-dark))) !important;
                left: -20px !important;
                opacity: 0.8 !important;
            }

            &:hover .expandable-icon-grading-report {
                position: absolute !important;
                clip: rect(
                    calc(46px - (11px * var(--theme-is-dark))),
                    calc(60px - (45px * var(--theme-is-dark))),
                    calc(80px - (30px * var(--theme-is-dark))),
                    0
                ) !important;
                top: calc(-32px + (16px * var(--theme-is-dark))) !important;
                left: -20px !important;
                opacity: 1 !important;
            }
        }
    }

    .empty.grades-empty {
        color: var(--muted-text) !important;
    }

    .download-grade-wrapper a.link-btn {
        background-color: var(--primary) !important;
    }

    #past-selector .item-list a.link-btn.active {
        background-color: var(--active) !important;
    }

    body ul.primary {
        li {
            &.active a {
                border-color: var(--contrast-border) !important;
                border-width: var(--border-size) !important;

                &:hover {
                    border-color: var(--contrast-border) !important;
                    border-width: var(--border-size) !important;
                }
            }

            a {
                border-color: var(--contrast-border) !important;
                border-width: var(--border-size) !important;

                &:hover,
                &:visited {
                    border-color: var(--contrast-border) !important;
                    border-width: var(--border-size) !important;
                }
            }
        }

        border-color: var(--contrast-border) !important;
        border-width: var(--border-size) !important;
    }

    .gradebook-course,
    .attendance-course {
        border-top: var(--modern-border) !important;
    }

    .attendance-course-attendance table {
        th,
        td {
            border: var(--modern-border) !important;
        }
    }

    // Mastery Page

    #s-js-student-mastery-report-view-content {
        background-color: var(--accent) !important;
    }

    .s-js-chart-and-pager-area .empty {
        border-top: var(--modern-border) !important;
    }

    .highcharts-container > svg > rect {
        fill: var(--primary);
    }

    .highcharts-axis-labels > text {
        color: var(--text) !important;
        fill: var(--text) !important;
    }

    .score-value {
        color: var(--text) !important;
    }

    // Courses Page

    .course-action-btns,
    .group-action-btns {
        padding: var(--padding) !important;
        border-radius: var(--border-radius) !important;
    }

    #secondary-tabs-wrapper {
        border-right: none !important;
        background-color: var(--accent) !important;
    }

    body {
        > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div {
            background-color: var(--primary) !important;

            button {
                span._24avl._17Z60 {
                    color: var(--text) !important;
                }
            }

            .Card-card-2rORL {
                background-color: var(--accent) !important;
                border: none !important;
                border-radius: var(--border-radius) !important;
            }

            div {
                color: var(--text) !important;

                &._2wOCj {
                    color: var(--muted-text) !important;
                }
            }
        }

        #right-column-inner {
            button.link-btn,
            a.link-btn {
                background-color: var(--primary) !important;
            }
        }
    }

    #reorder-ui button.link-btn span {
        filter: Invert(var(--theme-is-dark)) !important;
    }

    .course-list-view #secondary-tabs-wrapper ul {
        border-bottom: none !important;
    }

    .no-courses {
        color: var(--muted-text) !important;
    }

    .tabs.secondary li {
        a {
            background: var(--secondary) !important;
            color: var(--text) !important;
            border: none !important;
            border-radius: var(--border-radius) !important;
        }

        &.active a {
            background: none !important;
            color: var(--text) !important;
            background-color: var(--active) !important;
            border-radius: var(--border-radius) !important;
            border: none !important;
        }
    }

    .listing .course-item.list-item,
    .courses-listing.mycourses h3 {
        border-bottom: var(--modern-border) !important;
    }

    #main .courses-listing.listing {
        border-top: var(--modern-border) !important;
    }

    .sgy-course-search-form__submit-row {
        background: none !important;
        border-color: none !important;
    }

    .sgy-react-select {
        .Select-control,
        .Select-menu-outer {
            color: var(--text) !important;
            border-color: none !important;
            border-radius: var(--border-radius) !important;
        }

        .Select-control {
            background-color: var(--input) !important;
        }

        .Select-placeholder {
            color: var(--text) !important;
        }

        .Select-menu-outer {
            background-color: var(--accent) !important;
        }

        .Select-option {
            color: var(--text);

            &:hover {
                background-color: var(--active);
            }
        }
    }

    // Members Page

    .enrollment-search .go-btn {
        background-color: inherit !important;
    }

    .roster-top {
        border-bottom: var(--modern-border) !important;
    }

    body {
        .enrollment-filters span.active,
        .grading-groups-list .grading-group.active {
            background-color: var(--active) !important;
        }
    }

    .enrollment-filters span:hover {
        background-color: var(--active) !important;
    }

    // Breadcrumbs

    #site-navigation-breadcrumbs nav {
        background-color: var(--accent) !important;

        li {
            a,
            span {
                color: var(--text) !important;
            }
        }
    }

    // Resources Page

    #library-main {
        border-right: none !important;
    }

    #library-wrapper {
        background-color: var(--accent) !important;
        border: none !important;
        border-bottom-left-radius: var(--border-radius) !important;
        border-bottom-right-radius: var(--border-radius) !important;

        a.active:not(.item-title),
        .library-collections a:hover {
            background-color: var(--active) !important;
        }
    }

    #library-left td:hover {
        background-color: var(--active) !important;
    }

    #library-search-form-container div {
        background-color: var(--secondary) !important;

        &::before {
            display: none !important;
        }
    }

    #collection-view-contents .collection-row-empty td {
        color: var(--text) !important;
    }

    body.library-view #library-main {
        border-left: var(--modern-border) !important;
    }

    #collection-toolbar {
        border-top: var(--modern-border) !important;
    }

    #collection-view-contents {
        border-top: var(--modern-border) !important;

        th,
        td {
            border-bottom: var(--modern-border) !important;
        }
    }

    #library-left .collections-list-wrapper {
        border-bottom: var(--modern-border) !important;
    }

    body.library-view #library-left {
        border-right: var(--modern-border) !important;
    }

    #collection-toolbar .action-links-unfold {
        box-shadow: none !important;
        border: none !important;
        background: var(--secondary) !important;
        border-radius: var(--border-radius) !important;
        color: var(--text) !important;

        &:hover {
            background-color: var(--muted-text) !important;
        }
    }

    #reorder-collections-btn {
        color: var(--text) !important;

        &:hover {
            background-color: var(--active) !important;
            color: var(--text) !important;
        }
    }

    .action-links > li > span {
        color: var(--text) !important;
    }

    .progressContainer,
    .link-attachment,
    .attachment-block,
    .resource-attachment {
        background: var(--primary) !important;
    }

    .options-reorder-btn,
    .options-auto-arrange-btn {
        color: var(--text) !important;
    }

    .options-reorder-btn:hover,
    .options-auto-arrange-btn:hover {
        background-color: var(--active) !important;
    }

    // Profile Page

    .right-block-big-wrapper {
        padding: var(--padding) !important;
        border-radius: var(--border-radius) !important;
    }

    #sidebar-left #left-nav #menu-s-main ul li a.active {
        background-color: var(--accent) !important;
        border: var(--modern-border) !important;
        border-right: none !important;
        border-top-left-radius: var(--border-radius) !important;
        border-bottom-left-radius: var(--border-radius) !important;
    }

    .app-link-wrapper .active {
        background-color: var(--accent) !important;
        border: var(--modern-border) !important;
        border-right: none !important;
        border-top-left-radius: var(--border-radius) !important;
        border-bottom-left-radius: var(--border-radius) !important;

        &:hover {
            background-color: var(--accent) !important;
            border: var(--modern-border) !important;
            border-right: none !important;
            border-top-left-radius: var(--border-radius) !important;
            border-bottom-left-radius: var(--border-radius) !important;
        }
    }

    #sidebar-left #menu-s-main .active-trail .active-trail a.course-materials-left-menu {
        background-color: var(--accent) !important;
        border: var(--modern-border) !important;
        border-right: none !important;
        border-top-left-radius: var(--border-radius) !important;
        border-bottom-left-radius: var(--border-radius) !important;
    }

    th.profile-header {
        color: var(--text) !important;
    }

    #profile-form-tab {
        background-color: var(--accent);
    }

    .tab-nav {
        &:hover {
            background-color: var(--hover-color);
        }

        &.active {
            background-color: var(--input);

            &:hover {
                background-color: var(--input);
            }
        }
    }

    #ui-datepicker-div {
        background-color: var(--input) !important;
    }

    .ui-datepicker-days-cell a {
        background-color: var(--primary) !important;
        border-color: var(--border-color) !important;
    }

    .ui-datepicker-unselectable {
        background-color: var(--accent) !important;
    }

    .ui-datepicker-days-cell.ui-datepicker-current-day a {
        background-color: var(--active) !important;
    }

    .ui-datepicker-days-cell-over a {
        background-color: var(--hover-color) !important;
    }

    .ui-datepicker-links {
        > div {
            > a {
                background-color: var(--input);
                background-blend-mode: screen;
                border: var(--modern-border);
                border-radius: var(--border-radius);
            }
            &:hover {
                > a {
                    background-color: var(--hover-color);
                }
            }
        }
    }

    // Course Page

    .action-links,
    .comment.no-comments,
    .materials-filter-wrapper {
        background-color: var(--secondary) !important;
        border: var(--modern-border) !important;
        border-radius: var(--border-radius) !important;
        color: var(--text) !important;
    }

    #wrapper {
        background-color: var(--primary) !important;
    }

    .navigator-buttons a.navbtn.link-btn {
        background-color: var(--primary) !important;
        border-radius: var(--border-radius) !important;
        color: var(--text) !important;
    }

    .has-folder-player #center-top .content-top-upper,
    .has-materials-player #center-top .content-top-upper {
        background-color: var(--secondary) !important;
        border: none !important;
    }

    #course-profile-materials {
        background-color: var(--accent) !important;
    }

    .materials-filter-wrapper .action-links-wrapper .action-links-unfold {
        color: var(--text) !important;
    }

    .action-links-wrapper-gearless .action-links-unfold {
        &.active,
        &:active {
            color: var(--text) !important;
        }
    }

    .action-links .selected {
        background-position: 0 calc(-237px - 20px * var(--theme-is-dark)) !important;
    }

    body .action-links a:hover {
        background-color: var(--active) !important;
        color: var(--text) !important;
    }

    .materials-top,
    #folder-contents-table td,
    #right-column h3,
    .left-block-wrapper h3 {
        border: none !important;
        border-bottom: var(--modern-border) !important;
    }

    .s-edge-feed {
        > li {
            border-top: var(--modern-border) !important;
        }

        .edge-item li {
            color: var(--text) !important;
        }

        table[bgcolor] {
            background-color: var(--accent) !important;
        }
    }

    .s-like-sentence:not(:last-child) {
        border-bottom: var(--modern-border) !important;
    }

    .pre-fill,
    .upcoming-list .empty,
    .readonly-title,
    .no-attendance-status-dates {
        color: var(--muted-text) !important;
    }

    .subevent-count {
        background-color: var(--secondary) !important;
    }

    #edit-course-switcher-select-nid-menu {
        border: var(--modern-border) !important;
        background-color: var(--secondary);
        border-radius: var(--border-radius) !important;

        .ui-selectmenu-group li a:hover {
            color: var(--text) !important;
            background-color: var(--active) !important;
        }
    }

    #edit-course-switcher-select-nid-button {
        border: none !important;
        background: none !important;
        background-color: var(--secondary) !important;
        border-radius: var(--border-radius) !important;

        &:not(.ui-state-active) .edit-course-inline-dropdown-arrow {
            filter: Invert(var(--theme-is-dark)) !important;
        }
    }

    .messages {
        .messages-close-btn {
            color: var(--text) !important;
        }

        &.warning {
            background: var(--highlight) !important;
            color: var(--text) !important;
            border: none !important;
        }

        &.status {
            background: var(--active) !important;
            color: var(--text) !important;
            border: none !important;
        }
    }

    span#updates-count {
        color: var(--text) !important;
        background-color: var(--active) !important;
    }

    .link_view .page-title a:hover .external-link-icon {
        background-position: 0 -1425px !important;
    }

    .access-code.left-block-wrapper,
    #roster-wrapper .parent-code {
        background-color: var(--accent);
        color: var(--text);
    }

    // Date Picker

    #ui-datepicker-div {
        background-color: var(--input) !important;

        .ui-datepicker-days-cell {
            a {
                background-color: var(--primary) !important;
                border-color: var(--modern-border) !important;
            }

            .ui-datepicker-current-day a {
                background-color: var(--highlight) !important;
            }

            &.ui-datepicker-days-cell-over a {
                background-color: var(--active) !important;
            }
        }

        .ui-datepicker-links > div {
            &:hover > a {
                background-color: var(--hover-color);
            }

            & > a {
                background-color: var(--input);
                background-blend-mode: screen;
                border: var(--modern-border);
                border-radius: var(--border-radius);
            }
        }

        .ui-datepicker-unselectable {
            background-color: var(--accent) !important;
        }
    }

    // Photo Albums

    .shuffleParent div.sshuffleContainer,
    .shuffleParent .mediaThumbContainer {
        background: var(--secondary) !important;
        border: var(--modern-border) !important;
        border-radius: var(--border-radius) !important;
    }

    .s-media-album-content-container {
        background-color: var(--secondary) !important;
        border-radius: var(--border-radius) !important;
        padding: var(--padding) !important;
    }

    .created {
        color: var(--muted-text) !important;
    }

    .album-comments {
        background: var(--accent) !important;
        border: none !important;
    }

    // Messages

    .privatemsg-list {
        td {
            background-color: var(--accent) !important;
        }

        .privatemsg-unread td {
            background-color: var(--active) !important;
        }
    }

    table.privatemsg-list {
        border-top: var(--modern-border) !important;

        td.no-messages {
            color: var(--muted-text) !important;
        }
    }

    #attachment-selector {
        background: var(--secondary) !important;
        border: none !important;
        border-bottom-left-radius: var(--border-radius) !important;
        border-bottom-right-radius: var(--border-radius) !important;

        li {
            border-right: none !important;
        }
    }

    #ids {
        background: none !important;
        border: none !important;

        .userlist_input {
            border: none !important;
        }

        .name-wrapper {
            background: var(--secondary) !important;
            color: var(--text) !important;
        }
    }

    .ac_results {
        background: var(--secondary) !important;
        color: var(--text) !important;

        ul li {
            background: var(--secondary) !important;
            border-color: var(--contrast-border) !important;
        }
    }

    .ac-name,
    .ac-top {
        color: var(--text) !important;
    }

    .ac-row {
        .ac-bot,
        .ac-school {
            color: var(--muted-text) !important;
        }
    }

    .ac_results .ac_over {
        border-color: var(--contrast-border) !important;
        background: var(--active) !important;
    }

    #sUserAutocomplete-recipient-helper {
        background-color: var(--secondary) !important;
        color: var(--muted-text) !important;
        border: var(--modern-border) !important;
        border-radius: var(--border-radius) !important;
    }

    .message-participants {
        color: var(--muted-text) !important;
    }

    .message-title,
    .message-view-row {
        border-bottom: var(--modern-border) !important;
    }

    // Discussion Board

    .discussion-require-post-notice .warning {
        background: var(--highlight) !important;
        border: none !important;
        border-radius: var(--border-radius) !important;
    }

    .discussion-view {
        .sticky-wrapper h2.page-title {
            background: var(--primary) !important;
        }

        #content-wrapper {
            border: none !important;
            border-radius: var(--border-radius) !important;
            background: var(--accent) !important;
        }

        #center-top h2.page-title {
            border: none !important;
        }

        #s_comments .s_comments_level .comment.on-top,
        #main #s_comments .s_comments_level .s_comments_level .comment.on-top {
            background-color: var(--active) !important;
        }
    }

    .discussion-view .discussion-content .comment #comment-reply-form-wrapper #s-comment-reply-form,
    .discussion-view
        .s-comments-post-form-new
        .comment
        #comment-reply-form-wrapper
        #s-comment-reply-form {
        background: var(--accent) !important;
    }

    .grade-title {
        color: var(--text) !important;
    }

    .received-grade {
        color: var(--grades) !important;
    }

    .grading-grade .max-points {
        color: var(--muted-text) !important;
    }

    .assignment-details,
    .extra-details {
        border-bottom: var(--modern-border) !important;
    }

    .discussion-view .sticky-wrapper {
        .s-comments-post-form,
        .s-comments-post-form-new {
            background: var(--primary) !important;
            border-bottom-left-radius: var(--border-radius) !important;
            border-bottom-right-radius: var(--border-radius) !important;
        }
    }

    .discussion-action-bar {
        background: var(--secondary) !important;
        border: none !important;
        border-bottom-left-radius: var(--border-radius) !important;
        border-bottom-right-radius: var(--border-radius) !important;
    }

    .discussion-view {
        .discussion-content #s_comments .discussion-card {
            background: var(--primary) !important;
            box-shadow: none !important;
            border-radius: var(--border-radius) !important;
        }

        #content-wrapper {
            .discussion-content div#s_comments .s_comments_level .s_comments_level,
            .s-comments-post-form-new div#s_comments .s_comments_level .s_comments_level {
                background: var(--accent) !important;
                border: none !important;
                border-bottom-left-radius: var(--border-radius) !important;
                border-bottom-right-radius: var(--border-radius) !important;
            }
        }

        .expander-bar {
            background: var(--accent) !important;
            border: none !important;
            border-top-left-radius: var(--border-radius) !important;
        }
    }

    .post-count {
        color: var(--muted-text) !important;
    }

    .discussion-view .discussion-content {
        border-top: var(--modern-border) !important;
    }

    .bar-right-wrapper,
    .comment-counts {
        border-color: var(--contrast-border) !important;
    }

    .discussion-view #comment-placeholder {
        background: var(--accent) !important;
        border-radius: var(--border-radius) !important;
        border: none !important;
        color: var(--muted-text) !important;
    }

    .content-top-wrapper .info-container.not-admin .link-btn {
        background: var(--secondary) !important;
        border: none !important;
        border-radius: var(--border-radius) !important;
    }

    #comment-navigator td {
        background: var(--primary) !important;
        border: none !important;

        &.slide-toggler-cell {
            background: var(--secondary) !important;
        }
    }

    .num-comments-wrapper {
        color: var(--muted-text) !important;
    }

    // User Page

    .info-tab {
        th,
        td {
            color: var(--muted-text) !important;
            border-bottom: var(--modern-border) !important;
        }
    }

    .enrollment-view-wrapper {
        td,
        th {
            color: var(--muted-text) !important;
            border-bottom: var(--modern-border) !important;
        }
    }

    .info-tab .profile-header {
        color: var(--text) !important;
    }

    .private-profile {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
        border-color: var(--contrast-border) !important;

        h3 {
            border-color: var(--contrast-border) !important;
        }
    }

    .portfolio-list {
        border: none !important;
    }

    .tw-bs {
        .portfolio-list__no-portfolios-text {
            color: var(--muted-text) !important;
        }

        .portfolio-list__add-new,
        .portfolio-view__add-new {
            background: transparent !important;
        }

        .portfolio-list__add-new-bg,
        .portfolio-view__add-new-bg {
            border-bottom: var(--modern-border) !important;
        }

        .btn:hover {
            background-color: var(--hover-color) !important;
        }

        .dropdown-menu {
            background-color: var(--primary) !important;
        }
    }

    .portfolio-route-content {
        border: var(--modern-border) !important;
        border-radius: var(--border-radius) !important;
        background: var(--secondary) !important;
    }

    .tw-bs .portfolio-title-bar {
        background: var(--secondary) !important;
    }

    .portfolio-view__content {
        background: var(--accent) !important;
    }

    .portfolio-card,
    .item-card {
        background: var(--primary) !important;
    }

    // Portfolio

    .tw-bs {
        .portfolio-card__item-count-num {
            color: var(--contrast-text) !important;
        }

        .btn {
            background-color: var(--primary) !important;
            border: var(--modern-border) !important;
            border-radius: var(--border-radius) !important;
            color: var(--contrast-text) !important;
        }

        .item-form__title-inline .sgy-autosave-input .form-group:hover label {
            &,
            & span {
                color: var(--muted-text) !important;
            }
        }

        .portfolio-list__list-view > .ui-state-highlight,
        .portfolio-item-list > .ui-state-highlight {
            background: var(--primary) !important;
            border-radius: var(--border-radius) !important;
        }

        .portfolio-card__item-count-num {
            color: var(--contrast-text) !important;
        }

        .btn {
            background-color: var(--primary) !important;
            border: var(--modern-border) !important;
            border-radius: var(--border-radius) !important;
            color: var(--contrast-text) !important;

            &:hover {
                background-color: var(--hover-color) !important;
            }
        }

        .dropdown-menu {
            background-color: var(--primary) !important;
        }

        .item-form__title-inline .sgy-autosave-input .form-group:hover {
            label,
            label span {
                color: var(--muted-text) !important;
            }
        }

        .remaining-char-len {
            color: var(--text) !important;
        }

        .add-item-dropdown__add-new-icon::before,
        .portfolio-list__add-new-icon::before {
            background-color: var(--primary) !important;
            border-color: var(--border-color) !important;
        }

        .item-view-container,
        .item-form__title-bar,
        .item-page {
            background-color: var(--background-color) !important;
            border-color: var(--border-color) !important;
            outline-color: var(--border-color) !important;
        }

        .item-card__title-link {
            color: var(--link-color) !important;
        }
    }

    .sgy-autosave-input.sgy-autosave-input--editing {
        label span,
        .form-group:hover label span {
            color: var(--text) !important;
        }
    }

    // School / Group Page

    #school-events {
        padding: var(--padding) !important;
        border-radius: var(--border-radius) !important;
    }

    #main {
        background-color: var(--accent) !important;
    }

    .left-block {
        dd {
            color: var(--text) !important;
        }

        dt {
            color: var(--muted-text) !important;
        }
    }

    .enrollment-view-wrapper,
    .roster-top,
    .active-loader {
        background-color: var(--accent) !important;
    }

    #s-user-realm-profile-notification-setting-form label:hover {
        background: none !important;
        background-color: var(--active) !important;
    }

    #content-left .s-enrollment-realm-actions {
        border-top: var(--modern-border) !important;
    }

    // Unsure if this is used on other pages too, but it should fix there too if present

    #edit-body_fontsizeselect_text {
        background: transparent;
    }

    // Course Dashboard

    .course-dashboard {
        section {
            border: none !important;
            border-radius: var(--border-radius) !important;

            &.sgy-card {
                background-color: var(--accent) !important;
                border-radius: var(--border-radius) !important;
            }
        }

        .sgy-card-lens {
            background-color: var(--accent) !important;
            border-radius: var(--border-radius) !important;
        }

        .sgy-card {
            border: var(--border-size) solid transparent !important;

            &:hover {
                border: var(--modern-border) !important;

                .sgy-card-lens::after {
                    display: none !important;
                }
            }
        }

        section.sgy-card {
            .sgy-multiline-ellipsis__split-part {
                color: var(--text) !important;
            }

            .sgy-card-subcontext {
                color: var(--muted-text) !important;
            }
        }

        .ui-state-highlight {
            border: var(--border-size) dashed var(--contrast-border) !important;
            background-color: var(--secondary) !important;
        }
    }

    // Search Bar

    ul.Search-dropdown-3huUv {
        border: none !important;
        background-color: var(--accent) !important;
    }

    .Search-dropdown-3huUv {
        // svg {
        //     filter: Invert(var(--theme-is-dark)) !important;
        // }

        input {
            background-color: var(--input) !important;
            color: var(--text) !important;
            border-bottom: var(--border-size) solid transparent !important;
        }
    }

    // Settings Page

    ul.primary,
    .with-tabs #center-top {
        background: unset !important;
        background-color: var(--secondary) !important;
    }

    ul.primary li {
        a,
        .link-wrapper a {
            background: unset !important;
            background-color: var(--secondary) !important;
            color: var(--text) !important;
        }

        &.active {
            a,
            .link-wrapper a {
                background-color: var(--accent) !important;
                color: var(--text) !important;
            }
        }
    }

    .email-notify,
    fieldset {
        background-color: var(--accent) !important;
        color: var(--text) !important;
    }

    .sticky-header *,
    .ui-selectmenu-status {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
    }

    div.cellphone-container {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
        border-radius: var(--border-radius) !important;
    }

    #s-user-set-notifications-form thead tr:hover {
        background-color: var(--accent) !important;
    }

    #s-user-custom-notifications-form {
        #edit-select-all-wrapper label {
            background: var(--accent) !important;
        }

        label {
            border-bottom: var(--modern-border) !important;
        }
    }

    .ui-selectmenu {
        border: none !important;
        border-radius: var(--border-radius) !important;
        background: none !important;
    }

    .ui-selectmenu-menu {
        background: var(--secondary) !important;
        border: var(--modern-border) !important;
        border-radius: var(--border-radius) !important;

        li {
            a {
                color: var(--text) !important;
            }

            &:hover a {
                background-color: var(--active) !important;
            }
        }

        .ui-selectmenu-item-focus a {
            background-color: var(--active) !important;
        }

        .ui-selectmenu-item-selected a:after {
            background-position: 0 calc(-242px - 20px * var(--theme-is-dark)) !important;
        }
    }

    .settings-table tbody td {
        &.selected {
            background-color: var(--active) !important;

            &:hover {
                background-color: var(--active) !important;
            }
        }

        background-color: var(--primary) !important;

        &.realm-disabled {
            background: none !important;

            &:hover {
                background: none !important;
            }
        }

        &.area-disabled {
            background: none !important;
        }
    }

    .terms-msg {
        color: var(--text) !important;
    }

    // Error Page

    #error-page {
        background-color: var(--secondary) !important;
        color: var(--text) !important;
    }

    .porcelain_pattern {
        background: var(--accent) !important;
    }

    // Calendar

    .fc-state-highlight {
        background: var(--active) !important;
    }

    .fc-view-month td:hover {
        background-color: var(--highlight) !important;
    }

    table.fc-border-separate {
        td {
            border: var(--modern-border) !important;
        }

        .fc-widget-header {
            border-bottom: var(--modern-border) !important;
        }
    }

    .fc-agenda-slots {
        td,
        th {
            border-color: var(--contrast-border) !important;
        }
    }

    body .fc-widget-header,
    .fc-agenda-allday th {
        border-color: var(--contrast-border) !important;
    }

    body .fc-widget-header .fc-agenda-divider-inner {
        background: var(--contrast-border) !important;
        border-color: var(--contrast-border) !important;
    }

    .update-comments-pagenation {
        background-color: var(--accent);
    }

    .feed-comments-viewall-container {
        color: var(--link-color);
    }

    // Assignment page

    #dropbox-viewer-right-toggle {
        border: var(--border-size) solid var(--input) !important;
        background-color: var(--secondary) !important;
    }

    #dropbox-viewer-right {
        background: var(--primary) !important;
        color: var(--text) !important;
    }

    #dropbox-viewer-comments {
        background: var(--accent) !important;
        border-bottom: var(--border-size) solid var(--input) !important;
    }

    #dropbox-viewer-wrapper {
        .dropbox-viewer-submission-activity,
        .dropbox-viewer-submission-activity-inner {
            background-color: var(--primary) !important;
            color: var(--text) !important;
        }
    }

    .popups-dropbox-viewer .popups-close a {
        background-color: var(--secondary) !important;
        border: var(--modern-border) !important;
        height: 16px !important;
    }

    ul#attachment-selector li:hover > a {
        background-color: var(--accent);
    }

    .popups-box.popups-library #resources-left-menu-wrapper {
        background-color: var(--primary);
    }

    .drop-items li:hover {
        background: var(--accent);
    }

    table#collection-view-contents tbody tr td {
        background-color: var(--primary);
    }

    .s_comments_level {
        background: var(--accent) !important;
        border-color: var(--contrast-border) !important;
    }

    .discussion-card > .s_comments_level {
        background: var(--secondary) !important;
        border: none !important;
        border-radius: var(--border-radius) !important;
    }

    .comment-container {
        border-color: var(--contrast-border) !important;
    }

    .update-comments-pagenation {
        background-color: var(--accent);
    }

    .feed-comments-viewall-container {
        color: var(--link-color);
    }

    .dropbox-viewer-item-wrapper {
        background-color: var(--primary);
    }

    #grading-rubric-edit-grades-slider .bottom,
    #district-mastery-grading-rubric-edit-grades-slider .bottom,
    .s-slider .right-column,
    .rubric-scroll .rubric-table tbody {
        background-color: var(--primary);
        color: var(--text);
    }

    .view-only .rubric-table .rubric-row-rating {
        span.input-top,
        .input-bottom {
            color: var(--text);
        }
    }

    .s_grade_item_assessment .assessment-status-wrapper,
    .grading-grade-translated {
        color: var(--muted-text) !important;
    }

    .grading-info {
        background: var(--secondary) !important;
        border: var(--modern-border) !important;
        border-radius: var(--border-radius) !important;
    }

    .not-editable .score-grade-score span,
    .param-name {
        color: var(--text) !important;
    }

    .assignment-param {
        color: var(--muted-text) !important;
    }

    // New Layout

    ._1wP6w,
    ._2pDDZ:hover:not(:active),
    ._3senP:focus:not(:active),
    .wL3MX:active {
        color: var(--text);
    }

    ._1IGEH:focus:not(:active),
    ._1oxpz:hover:not(:active),
    #wrapper ._1Z0RM,
    .Dkh_K:active {
        background-color: var(--accent);
        color: var(--text);
    }

    .StudentTable-table-wrapper-classname-2qr2_ > div {
        background-color: var(--primary) !important;
        color: var(--text);
    }

    img#loader {
        filter: Grayscale(var(--theme-is-dark)) brightness(0.3) !important;
    }

    // Blog Page

    .active-trail > div > a {
        background-color: var(--accent) !important;
    }

    // Google Docs

    .modal-modal-1369068783,
    .layout-row-inner-3835588998 {
        background: var(--accent) !important;
    }

    .typography-button-secondary-button-3933442342 {
        background: var(--primary) !important;
        color: var(--text) !important;
        border-color: var(--contrast-border) !important;
    }

    // Assesments

    ._1IGEH:focus:not(:active),
    ._1oxpz:hover:not(:active),
    #wrapper ._1Z0RM,
    .Dkh_K:active {
        background-color: var(--accent) !important;
    }

    ._2q19q {
        background-color: var(--primary) !important;
    }

    ._1wP6w,
    ._2pDDZ:hover:not(:active),
    ._3senP:focus:not(:active),
    .wL3MX:active {
        color: var(--text) !important;
    }

    ._3dHTa {
        background: var(--active) !important;
    }

    .UELBU {
        background: var(--primary) !important;
    }

    .lrn {
        color: var(--text) !important;
    }

    .lrn_widget {
        .lrn_valid,
        .lrn_selected {
            background-color: var(--highlight) !important;
        }
    }

    // Quizzes

    #s-assessment-view-submission-form {
        .selected.correct span.option-span {
            background-color: var(--active) !important;
            color: var(--text) !important;
        }

        .incorrect span.option-span {
            &.legacy-true-false-question,
            &.legacy-multiple-choice-question {
                background-color: var(--highlight) !important;
                color: var(--text) !important;
            }
        }
    }

    // Common Assesment (New Schoology Assessments)

    &[dark="true"] #assessment-darktheme-warning-message {
        &[data-popup="true"] {
            display: block !important;
            text-align: center;
            width: 50%;
            margin-left: 25%;
            font-size: 16px;
            padding: var(--padding);
            background-color: var(--highlight);
            border: var(--border-size) solid rgba(0, 0, 0, 0.5);
            border-radius: var(--border-radius);
        }

        .click-to-hide {
            padding-top: 10px !important;

            span {
                text-decoration: underline;
                cursor: pointer;
            }
        }
    }

    button.nav-tab-selected-3323184817 {
        background-color: var(--background-color) !important;
    }

    button.nav-tab-tab-325229968 {
        &:hover {
            background-color: var(--active) !important;
        }
    }

    // LaTeX Math Formulas
    .mathquill-formula {
        filter: Invert(var(--theme-is-dark)) !important;
    }

    .ca-assessment-delivery-take-assessment,
    .lrn-assess > div {
        background-color: var(--primary) !important;
    }

    .lrn {
        &.lrn-assess .lrn-right-region .right-wrapper .menu-overlay {
            background-color: var(--input) !important;
            color: var(--text) !important;
        }

        .pagination > li > {
            a,
            span {
                background-color: var(--input) !important;
            }

            a,
            span {
                background-color: var(--input);
                color: var(--text) !important;
            }
        }

        &.lrn-assess {
            .lrn-horizontal-toc {
                .pagination .lrn-assess-btn {
                    &:focus,
                    &:hover {
                        background: var(--input) !important;
                        color: var(--accent) !important;
                    }
                }

                .lrn-assess-pagination .lrn-assess-btn {
                    &:focus,
                    &:hover {
                        background: var(--input) !important;
                        color: var(--accent) !important;
                    }
                }
            }

            .test-title-text {
                color: var(--text) !important;
            }

            .lrn-right-region .right-wrapper .lrn_btn.menu-expand-button {
                box-shadow: none !important;
            }

            .app-panel.review-screen {
                .panel-content {
                    border: var(--border-size) solid var(--input) !important;
                    background-color: var(--primary) !important;
                    border: var(--modern-border) !important;
                    background-color: var(--primary) !important;
                }

                .item-card .overlay {
                    background: var(--primary);
                }

                .item-number {
                    color: var(--text) !important;
                }

                .panel-content .panel-footer {
                    background-color: var(--input);
                }
            }

            .lrn-right-region .right-wrapper {
                .lrn_btn.lrn_active,
                .lrn_widget.lrn_feature > button.lrn_active,
                .lrn_btn.lrn_btn_blue.lrn_active {
                    border: var(--border-size) solid var(--text) !important;
                    border: var(--modern-border) !important;
                    background: var(--input) !important;
                    box-shadow: none;
                }
            }
        }
    }

    .lrn-assess .item-count {
        color: var(--text) !important;
    }

    .lrn.lrn-assess .app-panel.review-screen {
        .panel-content .panel-footer {
            background-color: var(--primary);
        }

        .item-card {
            background-color: var(--input) !important;

            //Unattempted
        }
    }

    .lrn-assess-switch .lrn-assess-switch-trigger {
        background: var(--input);

        // Unattempted Legend
    }

    .lrn.lrn-assess {
        .app-panel.review-screen .panel-content .panel-footer {
            background-color: var(--primary) !important;
        }

        .lrn-right-region .right-wrapper {
            .lrn_btn,
            .lrn_widget.lrn_feature > button,
            .lrn_btn.lrn_btn_blue {
                background-color: var(--accent) !important;
                border: none !important;
            }

            &.menu-with-scroll:after {
                background-image: none !important;
            }

            .lrn_btn {
                &:before,
                .btn-label {
                    color: var(--text) !important;

                    // Menu Icons Color
                }
            }

            .lrn_widget.lrn_feature > button {
                &:before,
                .btn-label {
                    color: var(--text) !important;

                    // Menu Icons Color
                }
            }

            .lrn_btn.lrn_btn_blue {
                &:before,
                .btn-label {
                    color: var(--text) !important;

                    // Menu Icons Color
                }
            }
        }

        .lrn-region:not(.lrn-items-region) .lrn_btn_blue:before,
        .dialogs .lrn_btn_blue:before {
            color: var(--text) !important;
        }

        .lrn-region:not(.lrn-items-region) .lrn_btn,
        .dialogs .lrn_btn {
            color: var(--text) !important;
        }
    }

    .menumask > ::-webkit-scrollbar-track-piece {
        background: white !important;
    }

    .lrn.lrn-assess .app-panel.review-screen .item-card {
        border: none !important;
        color: var(--contrast-text) !important;
        border: var(--modern-border) !important;
    }

    .lrn-region.lrn-right-region {
        border: none !important;
    }

    .lrn.lrn-assess .app-panel.review-screen .panel-header {
        border-bottom: var(--border-size) solid var(--primary) !important;
    }

    .lrn_btn.item-prev.pos-right {
        background-color: var(--secondary) !important;
        border: none !important;
    }

    .lrn.lrn-assess .app-panel.review-screen button.lrn_btn.lrn-assess-close-review-screen-btn {
        background: var(--accent) !important;
    }

    .lrn-assess {
        background: var(--primary) !important;

        > div ::-webkit-scrollbar-thumb {
            background: var(--primary) !important;
            box-shadow: inset 1px 1px 2px black;
        }
    }

    .lrn {
        .modal-content {
            background-color: var(--accent) !important;

            // Timeout Alert
        }

        &.lrn-assess {
            .lrn-region:not(.lrn-items-region) .lrn_btn,
            .dialogs .lrn_btn {
                background-color: var(--accent) !important;
            }
        }
    }

    .lrn_widget.lrn_mcq .lrn_response .lrn_mcqgroup-block {
        .lrn-mcq-option {
            .lrn-label {
                background-color: var(--accent) !important;

                // MC Questions
                color: var(--text) !important;
            }

            &.lrn_selected .lrn-label {
                background-color: var(--highlight) !important;
            }
        }

        .lrn_choiceLabel {
            background-color: var(--accent) !important;

            // MC Questions
            color: var(--text) !important;
        }
    }

    .lrn {
        .lrn_possibilityList,
        .lrn_possibilityListContainer {
            // Drag Blank
            background-color: var(--accent) !important;
        }

        .lrn_possibilityList,
        .lrn_possibilityListContainer {
            border-top: none !important;
        }

        .lrn_possibilityList.lrn_list_bottom:before,
        .lrn_possibilityListContainer.lrn_list_bottom:before {
            border-bottom: 12px solid var(--muted-text) !important;

            // Just trust me, it's needed for contrast
        }
    }

    .lrn_dropzone {
        background-color: var(--primary) !important;
    }

    .lrn .lrn_btn_drag {
        background-color: var(--primary) !important;
        color: var(--text) !important;
    }

    .lrn-annotations-c-modal--notepad {
        background: var(--accent) !important;
    }

    .lrn .lrn-mask rect {
        fill: var(--primary) !important;

        // Remove Options Tool
    }

    .lrn_calc_column {
        background: var(--accent) !important;

        // Calculator tool
    }

    .lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc {
        .lrn_calc_btn_opt {
            background-color: var(--accent) !important;
            color: var(--text) !important;

            &:disabled:hover {
                background-color: var(--accent) !important;
                color: var(--text) !important;
            }
        }

        .lrn_calc_btn_opt_dark {
            background-color: var(--input) !important;
            color: var(--text) !important;
        }

        .lrn_calc_cover {
            background: var(--secondary) url(../../images/calc-cover.png) no-repeat center center !important;
        }
    }

    .lrn_calc_column > .lrn_btn_grid {
        background: var(--primary) !important;
    }

    .lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc .lrn_btn_grid {
        background-color: var(--primary);
        color: var(--text) !important;
    }

    .lrn .lrn_btn_sort {
        background-color: var(--accent) !important;

        // Reorder Choices
        color: var(--text) !important;
    }

    .lrn_box_skin_wrapper {
        background-color: var(--accent) !important;

        // Audio recording

        .lrn_audioblock_right {
            background-color: var(--accent) !important;

            .lrn_audiomiclevelmask {
                background-color: var(--accent) !important;
            }

            border-left: none !important;
        }
    }

    .lrn_wfgraphic.lrn_wfcanvas {
        background-color: var(--accent) !important;
    }

    .lrn_toolbar,
    .lrn .lrn_btn {
        background-color: var(--input) !important;
        color: var(--text) !important;
    }

    .lrn_box_skin_wrapper .lrn_widget_footer .lrn_toolbar_left .lrn_btn {
        border-right: none !important;
    }

    .lrn-audio-content {
        background-color: var(--accent) !important;
    }

    .lrn_waveform {
        filter: Invert(var(--theme-is-dark)) !important;
    }

    .lrn_qr.lrn_video .lrn-video-display {
        background: var(--input) !important;

        // Webcam Record
    }

    // Text Box for Assesments

    .lrn_response_input_wrapper {
        border-radius: var(--border-radius) !important;
        border: var(--modern-border) !important;
        border: none !important;
    }

    .lrn_widget {
        &.lrn_texteditor {
            border-radius: var(--border-radius) !important;
            border: var(--modern-border) !important;
            border: none !important;
        }

        &.lrn_chemistryessayV2 .lrn_texteditor_editable.wysihtml-placeholder,
        &.lrn_formulaessayV2 .lrn_texteditor_editable.wysihtml-placeholder,
        &.lrn_longtextV2 .lrn_texteditor_editable.wysihtml-placeholder {
            color: var(--text) !important;
            background: var(--accent) !important;
            border: none !important;
        }
    }

    .lrn_texteditor_editable.lrn_editor_area.lrn_longtextinput.wysihtml-sandbox.wysihtml-editor {
        color: var(--text) !important;
        background: var(--input) !important;
        border: none !important;
    }

    .lrn-wysihtml-toolbar.lrn_clearfix {
        color: var(--text) !important;
        background: var(--secondary) !important;
        border: none !important;
    }

    .lrn-toolbar {
        background: var(--secondary) !important;
        border: none !important;
    }

    .lrn_icon {
        &.lrn-icon-bold,
        &.lrn-icon-italic,
        &.lrn-icon-underline,
        &.lrn-icon-list-bulleted,
        &.lrn-icon-list-numbered {
            color: var(--text) !important;
            background: transparent !important;
        }
    }

    .lrn-toolbar-footer.lrn_clearfix {
        background: var(--accent) !important;
        color: var(--text) !important;
        border: none !important;
    }

    .lrn_word_count,
    .lrn_word_limit {
        color: var(--text) !important;
        border: none !important;
    }

    // Assesesment Rubric

    .clock,
    .lrn-assess .timer,
    .counter,
    .max-time,
    .lrn-assess .timer {
        color: var(--text) !important;
    }

    // Assesment Rubric

    #grading-rubric-edit-slider .controls,
    #district-mastery-grading-rubric-edit-slider .controls {
        // Left side Menu
        background: var(--accent) !important;
        color: var(--text) !important;
        border: none !important;
    }

    .rubric-row.ng-scope {
        background: var(--acent) !important;

        // rubric Background color
    }

    #grading-rubric-edit-slider .rubric-table .input-top,
    .rubric-table span.input-bottom,
    #district-mastery-grading-rubric-edit-slider .rubric-table .input-top,
    .rubric-table span.input-bottom {
        color: var(--contrast-text) !important;

        // Top part of each row
    }

    #grading-rubric-edit-slider .rubric-table tr.header-row,
    #district-mastery-grading-rubric-edit-slider .rubric-table tr.header-row {
        border-top: var(--border-size) solid var(--input) !important;

        // Border for header
        border-bottom: var(--border-size) solid var(--input) !important;
        border: none !important;
    }

    #grading-rubric-edit-slider .rubric-table .header-row th,
    #district-mastery-grading-rubric-edit-slider .rubric-table .header-row th {
        background-color: var(--accent) !important;

        // Header Color
    }

    .rubric-scroll {
        background: var(---accent) !important;
    }

    #grading-rubric-edit-slider .bottom-ctrls-wrapper,
    #district-mastery-grading-rubric-edit-slider .bottom-ctrls-wrapper {
        background: var(--accent) !important;
        border: none !important;
        color: var(--text) !important;
    }

    .s-slider.s-grading-rubric-edit-slider.s-grading-rubric.ng-scope.ui-resizable.opened.grade-setup-rubric-edit.new-rubric-edit.read-only {
        border: none !important;
    }

    // Assesment Review

    .lrn_widget {
        .lrn_valid,
        .lrn_selected {
            background-color: var(--input) !important;
        }

        .lrn_incorrect {
            background-color: var(--highlight) !important;
        }

        .lrn_correct {
            background-color: var(--active) !important;
        }
    }

    .lrn_assoc_table {
        background-color: var(--accent) !important;
    }

    .lrn_assoc_col2.lrn_disabled.lrn_dragdrop.lrn_dropzone.lrn_incorrect_marker.lrn_response_container
        > .lrn_btn_drag.lrn_draggable.lrn_incorrect {
        background-color: var(--highlight) !important;
    }

    .lrn_qr.lrn_association .lrn_possibilityList.lrn_list_bottom {
        margin-top: 0 !important;
    }

    .lrn_widget {
        .lrn_correctAnswers {
            background-color: var(--primary) !important;
            color: var(--text) !important;
        }

        .lrn_correctAnswerList > li {
            background-color: var(--input) !important;
        }
    }

    .lrn_btn_sort.lrn_sortable.lrn_button.lrn_correct.lrn_sort_block.lrn_draggable.lrn-dragdrop-group-516 {
        background-color: var(--active) !important;
    }

    .lrn_display_correct_answer_enabled {
        padding: 20px !important;
    }

    .lrn_texteditor_editable.lrn_editor_area.lrn_longtextinput.lrn_response_input_wrapper {
        background-color: var(--input) !important;
    }

    .lrn_assoc_col2.lrn_correct_marker.lrn_disabled.lrn_dragdrop.lrn_dropzone.lrn_response_container
        > .lrn_btn_drag.lrn_draggable.lrn_correct {
        background-color: var(--active) !important;
    }

    .lrn_btn_sort.lrn_sortable.lrn_button.lrn_incorrect.lrn_sort_block.lrn_draggable.lrn-dragdrop-group-516 {
        background-color: var(--highlight) !important;
    }

    .lrn_widget .lrn_suggested_answer_item {
        background: var(--accent) !important;
    }

    .lrn_suggested_answer_item.lrn_clearfix
        > .lrn_suggested.lrn_btn_sort.lrn_btn_no_handle.lrn_disabled.lrn_sort_block.lrn_button {
        background-color: var(--active) !important;
    }

    .lrn_response.lrn_clearfix.lrn_style_button
        > .lrn-response-validate-wrapper.lrn_response_input.lrn_incorrect {
        background-color: var(--accent) !important;
    }

    .lrn-response-validation-wrapper > .lrn_correctAnswers {
        background-color: var(--active) !important;
    }

    // Quizzes

    #s-assessment-view-submission-form .selected.correct span.option-span {
        background-color: var(--active) !important;
        color: var(--text) !important;
    }

    .layout-row-outer-1441760367,
    .profile-header-2536997237,
    .profile-container-4015500229 {
        background-color: var(--primary) !important;
    }

    .content-box-container-3232021855 {
        background-color: var(--accent) !important;
        border-radius: var(--border-radius) !important;
        border: var(--modern-border) !important;
        font-family: muli !important;
    }

    .rubric-table-row-row-3856304603.rubric-table-row-zebraStripe-4015500229.fjQuT.uQOmx._2NVPS._1Sb_q.WnfJn._3ARYD._3t4oF,
    .rubric-grader-header-header-212800519 {
        background-color: var(--accent) !important;
    }

    .typography-smallheader-light-bg-text-1999437409 {
        color: var(--text) !important;
    }

    .rubric-grader-manage-rubric-studentLabel-3923154451 {
        color: var(--cal1) !important;
    }

    .rubric-grader-scrollContainer-634066954 {
        background-color: var(--accent) !important;
    }

    .rubric-criteria-drawer-handle-drawerHandleActive-30552431 {
        background-color: var(--accent) !important;
        color: var(--text) !important;
    }

    .rubric-criteria-drawer-handle-copy-1446048478 {
        color: var(--text) !important;
    }

    .rubric-grader-gradebook-comment-gradebookCommentContainer-1923026448 {
        background-color: var(--accent) !important;
    }

    .rubric-grader-gradebook-comment-container-3347344084 {
        color: var(--text) !important;
    }

    .chart-wrapper .highchart-obj .no-data-overlay {
        background: transparent !important;
    }

    .no-data-message-wrapper {
        background: var(--secondary) !important;
        color: var(--text) !important;
        padding: 3px !important;
        border-radius: var(--border-radius);
    }

    // Text Boxes for Discussions

    .s_comments_level {
        background: var(--primary) !important;
        border-radius: var(--border-radius) !important;
        padding: var(--padding) !important;
    }

    .discussion-card > .s_comments_level {
        background: var(--input) !important;
    }

    .iziToast-body img {
        max-width: 24px !important;
    }

    .iziToast.iziToast-theme-dark .iziToast-message {
        color: var(--contrast-text) !important;
        opacity: 0.7;
    }

    // Fix for comment Reply

    #main .s_comments_level #s-comment-reply-form {
        background: var(--accent) !important;
    }

    #s-comment-reply-form {
        width: auto !important;
        border-radius: var(--border-radius) !important;
        border: none !important;
    }

    .compose-message.sMessagingProcessed fieldset {
        padding: 20px !important;
        border-radius: var(--border-radius) !important;
    }

    #ids .name-wrapper {
        background: transparent !important;
    }

    // Standard Popup Window Background Fix

    .s-slider.rubric-grades-edit .rating-wrapper.selected {
        background-color: var(--active) !important;
    }

    // Discussion Edit Icon Fix

    .discussion-view .action-links-wrapper-junior .action-links-unfold,
    .discussion-view .action-links-wrapper-junior .action-links-unfold:hover,
    .discussion-view .action-links-wrapper-junior .active.action-links-unfold,
    .discussion-view .action-links-wrapper-junior .active.action-links-unfold:hover {
        background-image: url(https://asset-cdn.schoology.com/sites/all/themes/schoology_theme/images/sprite_discussion.png?5f9c91b5354f0ec1) !important;
        /* Makes Icon Visble */
    }

    .s-js-comment-action-links.sActionLinksVisible
        > .action-links-wrapper.action-links-wrapper-junior.aligned-right
        > .action-links-unfold {
        /* Changes Color When Hovered Over */
        background-color: var(--accent) !important;
    }

    // Button tiles
    .splus-button-tile.active {
        background-color: var(--active) !important;
    }

    //
    // Teacher Areas
    //
    //  Test Setup
    .settings-label {
        color: var(--text);
    }

    // Buttons
    .s-grade-item-assignment-submission-app {
        background-color: var(--primary);
        color: var(--text);
    }

    // Button Hover
    ._2mytC:hover a,
    ._2mytC:focus a,
    .Oq4U1:hover:not(:active),
    .Oq4U1:focus,
    .s-grade-item-assignment-submission-app:hover,
    .s-grade-item-assignment-submission-app:focus,
    span[role="button"]:hover,
    span[role="button"]:focus,
    #grading-rubric-edit-slider .large-submit-buttons button.btn.submit.ng-binding:hover,
    #grading-rubric-edit-slider .large-submit-buttons button.btn.submit.ng-binding:focus,
    .sort-handle:hover,
    .sort-handle:focus {
        background-color: var(--hover-color);
    }

    // Active Buttons
    .Oq4U1:active {
        background-color: var(--active);
    }

    .s-share-checkbox-form-wrapper .checkboxes-wrapper {
        background-color: var(--primary);
    }

    #attachment-selector #toggle-copy:hover {
        background-color: var(--hover-color);
    }

    .comments-list .comment {
        background: var(--primary);
        border: var(--modern-border);
        border-color: var(--border-color);
        color: var(--text);
    }

    .comment-date {
        color: var(--muted-text);
    }

    //                       //
    // Course Materials Page //
    //                       //
    .unpublished,
    #folder-contents-table .unpublished .folder-contents-cell {
        background-color: var(--primary);
    }

    .masquerade-box {
        background-color: var(--secondary);
        border: var(--modern-border);
    }

    div.grade-assignment-popup .description,
    #sEditGradeTable tr th {
        color: var(--text);
        background-color: var(--primary);
    }

    //                             //
    //  Badges & Attendance Pages  //
    //                             //
    #badges-fullscreen-btn {
        background-color: var(--primary);
        border: var(--modern-border);
        border-radius: var(--border-radius);
    }

    .even .badge-course-table-cell,
    #s-attendance-edit-form tbody td,
    #s-attendance-edit-form tbody td div,
    #s-attendance-edit-form tbody th {
        background-color: var(--primary);
    }

    th.badge-course-table-cell,
    #s-badge-table-main .sticky-header th,
    #s-attendance-edit-form thead th {
        background: var(--secondary);
    }

    th.badge-course-table-cell .action-links-unfold {
        background-color: var(--input) !important;
    }

    th.badge-course-table-cell .action-links-unfold span,
    .date-chooser a.prev span,
    .date-chooser a.next span {
        filter: contrast(5%);
    }

    #s-attendance-taken-row .attendance-taken-label {
        color: var(--text);
    }

    #s-attendance-taken-row.odd td,
    #s-attendance-taken-row.even td {
        background-color: var(--accent);
    }

    #s-attendance-edit-form tbody tr:hover th,
    #s-attendance-edit-form #s-attendance-taken-row .attendance-taken-status:hover,
    #s-attendance-edit-form #s-attendance-taken-row .attendance-taken-status:focus {
        background-color: var(--hover-color);
    }

    #s-attendance-edit-form #s-attendance-taken-row .edited {
        background-color: var(--highlight);
    }

    #attendance-comment-field {
        background-color: var(--accent);
        border: var(--modern-border);
    }

    .comment-status-label {
        color: var(--text);
    }

    #s-attendance-edit-form #s-attendance-taken-row .attendance-taken-status--start {
        background-color: var(--active);
        border-color: var(--contrast-border);
    }

    .footer-buttons .date-chooser-calendar,
    .header-buttons .date-chooser-calendar,
    .footer-buttons .infotip,
    .header-buttons .infotip {
        background: var(--primary);
        border: var(--modern-border);
        border-radius: var(--border-radius);
    }

    a.prev:hover,
    a.prev:focus,
    a.next:hover,
    a.next:focus {
        background: var(--hover-color);
    }

    a.prev,
    a.next {
        background: var(--primary);
    }

    a.prev {
        border-radius: var(--border-radius) 0 0 var(--border-radius);
    }

    a.next {
        border-radius: 0 var(--border-radius) var(--border-radius) 0;
    }

    //                    //
    //  Grade Setup Page  //
    //                    //
    .scale-level-scale {
        background-color: var(--highlight);
        border: var(--modern-border);
    }

    #s-grading-category-add-form .form-item,
    #s-grading-category-add-form fieldset {
        background-color: var(--primary);
    }

    #grading-rubric-edit-slider .right-column {
        border-color: var(--border-color);
    }

    #grading-rubric-edit-slider .large-submit-buttons {
        background-color: var(--secondary);
        border-color: var(--border-color);
    }

    #grading-rubric-edit-slider .large-submit-buttons button.btn.submit.ng-binding {
        background-color: var(--primary);
        box-shadow: 0px 2px 0px var(--highlight);
    }

    .sort-handle {
        background-color: var(--accent);
    }

    #grading-rubric-edit-slider .ui-sortable-helper,
    #district-mastery-grading-rubric-edit-slider .ui-sortable-helper,
    #grading-rubric-edit-slider .ui-sortable-helper td,
    #district-mastery-grading-rubric-edit-slider .ui-sortable-helper td {
        background-color: var(--active) !important;
    }

    .rubric-editor-add-criteria,
    .rubric-editor-add-objectives {
        color: text;
    }

    #grading-rubric-edit-slider .large-submit-buttons .btn.cancel.ng-scope {
        color: var(--muted-text);
    }

    #grading-rubric-edit-slider .large-submit-buttons .btn.cancel.ng-scope:hover,
    #grading-rubric-edit-slider .large-submit-buttons .btn.cancel.ng-scope:focus {
        color: var(--text);
    }

    .alignment-form-container .header {
        background-color: var(--secondary);
    }

    .guid-item:active,
    .alignment-form-container .header .search-tab.active,
    .alignment-form-container li.active,
    .alignment-form-container div.active {
        background-color: var(--active);
    }

    .alignment-breadcrumbs .breadcrumb-item:first-child,
    .alignment-breadcrumbs .breadcrumb-item,
    .alignment-form-container li,
    .selected-container .selected-item {
        color: var(--link-color);
        border-color: var(--contrast-border);
    }

    .alignment-form-container li .gray,
    .alignment-form-container div .gray {
        color: var(--text) !important;
    }

    .empty {
        color: var(--muted-text);
    }

    .add-criteria-text {
        color: var(--text);
    }

    //                //
    //  MEMBERS PAGE  //
    //                //
    .parent-names-list.description {
        color: var(--muted-text);
    }

    .s-enrollment-invite-form .metadata-wrapper,
    #grading-group-create {
        color: var(--text);
    }

    .s-enrollment-invite-form .user-invite-wrapper {
        background-color: var(--accent);
        color: var(--text);
    }

    .s-enrollment-invite-form .user-name-wrapper,
    .people-filters .selected-users,
    .people-filters .show-all-users {
        color: var(--link-color);
    }

    .people-filters .selected-users.active,
    .people-filters .show-all-users.active {
        color: var(--contrast-text);
        background-color: var(--active);
    }

    .term-item-tag,
    .locked-question .tag-item {
        color: var(--text);
        background-color: var(--secondary);
        border-color: var(--border-color);
    }

    .link-btn {
        background: var(--secondary);
        color: var(--text);
        border: var(--modern-border);
        border-radius: var(--border-radius);
        border-color: var(--border-color);
    }

    .s-enrollment-invite-form .s-enrollment-invite-list-wrapper,
    .s-enrollment-invite-form #network-selected {
        background-color: var(--primary);
        border-color: var(--border-color);
    }

    .submit-btn {
        background: var(--primary);
        color: var(--contrast-text);
        border-radius: var(--border-radius);
    }

    .cancel-btn {
        background: var(--accent) !important;
        color: var(--muted-text) !important;
        border-radius: var(--border-radius);
    }

    .submit-btn:hover,
    .submit-btn:focus,
    .cancel-btn:hover,
    .cancel-btn:focus {
        background: var(--hover-color) !important;
        color: var(--text) !important;
    }

    //                //
    // Gradebook Page //
    //                //
    .s-js-grid-loading-cover {
        background-color: var(--primary);
    }

    .grader-grid-table-header-wrapper .grader-grid-header-cell,
    .grader-grid-table-header-wrapper
        .grader-grid-header-cell.hidden-grade
        .gradebook__major-period-title,
    .grader-grid-table-header-wrapper
        .grader-grid-header-cell.showing-unpublished
        .gradebook__major-period-title {
        background-color: var(--secondary);
        color: var(--text);
    }

    .enhanced-gb-body
        .grid-table-col-header-static-content
        .select2-container:not(.select2-dropdown-open)
        .select2-choice
        > .select2-chosen,
    .enhanced-gb-body
        .s-js-grades-gradebook-options-bar
        .select2-container:not(.select2-dropdown-open)
        .select2-choice
        > .select2-chosen {
        color: var(--text) !important;
    }

    .grader-grid--crosshair-line-column,
    .grader-grid--crosshair-line-row,
    .grader-grid--crosshair-center {
        background-color: var(--hover-color) !important;
    }

    .gradebook__grade-custom-override + .grader-grid-col-header-gp,
    .gradebook__grade-custom-override + .grader-grid-col-header-overall {
        background-color: var(--primary);
    }

    .grader-grid-cell:not(.gradebook__grade-custom-override)
        .grader-grid-cell-block:not(.updated)
        .grade-value,
    .grader-grid-cell:not(.gradebook__grade-custom-override)
        .grader-grid-cell-block:not(.updated)
        .s-js-grader-grid-cell-display,
    .grader-grid-table-header-wrapper
        .gradebook__major-grade-period-header
        .gradebook__subperiod-element-calculated,
    .grader-grid-table-header-wrapper
        .gradebook__major-grade-period-header
        .grading-period-override-column {
        color: var(--text);
    }

    .gradebook__subperiod-element-calculated.has-override-column,
    .grading-period-override-column {
        background-color: var(--accent);
    }

    .enhanced-gb-body
        .s-js-grades-gradebook-options-bar
        .select2-container.select2-dropdown-open.select2-container-active
        span {
        color: var(--link-color);
    }

    .enhanced-gb-body
        .s-js-grades-gradebook-options-bar
        .select2-container.select2-dropdown-open.select2-container-active {
        background-color: var(--primary);
        border-radius: var(--border-radius);
    }

    #autocomplete.grading-scale-ac-popup ul li,
    .enhanced-gb-body #main-content-wrapper .action-links a,
    .enhanced-gb-body #main-content-wrapper .action-links button,
    .enhanced-gb-body .s-course-csm-toggler.select2-toggle.select2-drop .select2-result-label,
    .enhanced-gb-body
        .s-grades-grader-filters-dropdown.select2-toggle.select2-drop
        .select2-result-label {
        background-color: var(--secondary);
        color: var(--text);
    }

    #autocomplete.grading-scale-ac-popup ul li:hover,
    .enhanced-gb-body #main-content-wrapper .action-links a:hover,
    .enhanced-gb-body #main-content-wrapper .action-links button:hover,
    .enhanced-gb-body .s-course-csm-toggler.select2-toggle.select2-drop .select2-result-label:hover,
    .enhanced-gb-body
        .s-grades-grader-filters-dropdown.select2-toggle.select2-drop
        .select2-result-label:hover,
    #autocomplete.grading-scale-ac-popup ul li:focus,
    .enhanced-gb-body #main-content-wrapper .action-links a:focus,
    .enhanced-gb-body #main-content-wrapper .action-links button:focus,
    .enhanced-gb-body .s-course-csm-toggler.select2-toggle.select2-drop .select2-result-label:focus,
    .enhanced-gb-body
        .s-grades-grader-filters-dropdown.select2-toggle.select2-drop
        .select2-result-label:focus {
        background-color: var(--hover-color);
    }

    #grade-comment-field {
        background-color: var(--primary);
    }

    .splus-modern-border-radius {
        border-radius: var(--border-radius);
    }

    .splus-modern-padding {
        padding: var(--padding);
    }
}
