/* This file gets loaded when colors mode is 'light' or 'os'. */

#main_nav {
    background-color: var(--bs-gray-800);
}

.user-colors-mode-light .d-light-none {
    display: none !important;
}
@media (prefers-color-scheme: light) {
    .user-colors-mode-os .d-light-none {
        display: none !important;
    }
}
@media (prefers-color-scheme: dark) {
    .user-colors-mode-os .d-dark-none {
        display: none !important;
    }
}

.activity-watching {
    background-color: #007eb9;
}
.activity-ptw {
    background-color: rgb(128, 191, 220);
}
.activity-stopped {
    background-color: rgb(255, 255, 255);
    border: 1px solid rgb(150, 150, 150);
}

.score-th8a {
    background-color: #c90d0d;
    border: 1px solid #c90d0d;
}
.score-highly, .score-highly-favorable {
    background-color: rgb(214, 74, 74);
    border: 1px solid rgb(214, 74, 74);
}
.score-favorable {
    background-color: rgb(228, 134, 134);
    border: 1px solid rgb(228, 134, 134);
}
.score-neutral {
    /*background-color: rgb(217, 217, 217);*/
    background-color: rgb(255, 255, 255);
    border: 1px solid rgb(150, 150, 150);
}
.score-unfavorable {
    background-color: rgb(64, 64, 64);
    border: 1px solid rgb(96, 96, 96);
}

.second-nav-bar {
    background-color: #eeeeee !important;
}

@media (prefers-color-scheme: dark) {

    .user-colors-mode-os .second-nav-bar {
        background-color: #444 !important;
    }

}

.third-nav-bar {
    background-color: #fff;
}

@media (prefers-color-scheme: dark) {

    .user-colors-mode-os .third-nav-bar {
        background-color: #222;
    }

}

@media (prefers-color-scheme: dark) {
    .home-nav-card .card-header {
        background-color: rgba(var(--bs-body-color-rgb), 0.08); /* lighter .card-header */
    }
}

.mood-emoji-favorable-color {
    color: #eecb62;
}
.mood-emoji-heart-eyes-color {
    color: crimson;
}
.mood-emoji-dark-mouth-color {
    color: #664301;
}
.mood-emoji-light-mouth-color {
    color: #aaaaaa;
}
.mood-emoji-neutral-color {
    color: #bbbbbb;
}
.mood-emoji-unfavorable-color {
    color: #555555;
}
