trakt.tv darker by rikka-takarada

/* ==UserStyle==
@name           trakt.tv darker
@namespace      https://userstyles.world/user/rikka-takarada
@author         Rikka Takarada
@description    `Simple dark theme for trakt`
@version        20241029.19.49
@license        CC-BY-SA-4.0
@preprocessor   uso
==/UserStyle== */
@-moz-document domain("trakt.tv") {
    :root {
        --text-color: #ffffffde;
        --text-color-strong: #fffffff7;
        --color-red: #9f42c6;
        --color-red-light:#bf80d9;
        --color-primary-black: #161616;
        --color-secondary-black: #1d1d1d;
        --color-gray: #dddddd;
    }

    /*     apps menu item */
    header#top-nav .with-ul-menu.selected.with-top-arrow::before {
        border-bottom: 6px solid var(--color-secondary-black);
    }
    header#top-nav ul.menu {
        background-color: var(--color-secondary-black);
    }
    header#top-nav ul.menu.with-large-icons li,
    header#top-nav ul.menu.with-large-icons li .description {
        color: var(--text-color);
    }
    header#top-nav ul.menu.with-large-icons li .description {
        opacity: .7;
    }
    header#top-nav ul.menu.with-large-icons a:not(:first-child) li {
        border-top-color: var(--text-color);
    }
    header#top-nav ul.menu.with-large-icons li .icon .apple-tv {
        filter: invert(1);
    }

    /* profile menu */
    header#top-nav .with-ul-menu.with-solid-bg.selected {
        background-color: var(--color-secondary-black);
        color: var(--text-color);
    }
    header#top-nav .with-ul-menu.with-solid-bg.selected a {
        color: var(--text-color) !important;
    }
    header#top-nav ul.menu {
        border-top-color: var(--text-color);
    }
    header#top-nav .with-ul-menu.with-solid-bg.selected ul.menu li a[href$="notes"],
    header#top-nav .with-ul-menu.with-solid-bg.selected ul.menu li a[href$="year"],
    header#top-nav .with-ul-menu.with-solid-bg.selected ul.menu li a[href$="all"],
    header#top-nav .with-ul-menu.with-solid-bg.selected ul.menu li a[href$="widgets"],
    header#top-nav .with-ul-menu.with-solid-bg.selected ul.menu li:nth-child(1 of .divider),
    header#top-nav .with-ul-menu.with-solid-bg.selected ul.menu li.dark-knight {
        display: none;
    }

    /*     dashboard list-wrapper */
    body.dashboard #list-wrapper {
        background: var(--color-primary-black);
    }
    body.dashboard .page-navigator {
        border-color: var(--color-primary-black);
        background-color: var(--color-secondary-black);
        color: var(--text-color);
    }


    .action-buttons .side-btn {
        overflow: hidden;
    }

    section {
        background: var(--color-primary-black);
    }
    .subnav-wrapper,
    #favorites-wrapper,
    #charts-wrapper {
        background-color: var(--color-secondary-black) !important;
    }
    #progress-wrapper {
        background-color: var(--color-primary-black);
    }
    .comment-wrapper {
        background-color: transparent;
    }
    #progress-wrapper .row .main-info .seasons {
        background-color: var(--color-secondary-black);
    }
    body,
    .subnav-wrapper .left h2 .right a,
    .subnav-wrapper .right [class*=" fa-"],
    body:not(.dark-knight) .genre-bars.light .bar label {
        color: var(--text-color);
    }
    .posters .poster,
    .posters > div .quick-icons {
        border-color: var(--color-secondary-black);
    }
    .btn.btn-default.dropdown-toggle {
        background-color: transparent;
        color: var(--text-color);
    }
    
    .show-title a, .titles-link, ul.pagination a  {
        color: var(--text-color-strong) !important;
    }
    
    a {
        color: var(--color-red);
    }
    a:hover,
    a:focus,
    #ondeck-wrapper .ignore:hover {
        color: var(--color-red-light);
    }
    .progress-bar {
        background-color: var(--color-red);
    }
    #progress-wrapper .row .main-info .seasons .season-toggle.link,
    #progress-wrapper .row .main-info .seasons .all-toggle.link {
        color: var(--color-red);
    }
    .btn.btn-recommendations {
        background-color: transparent;
    }
    .btn-recommendations:hover,
    .btn-recommendations.selected {
        background-color: #9f42c6;
    }
    #main-search {
        background-color: var(--color-red);
    }
    .fanarts .fanart h4 {
        background-color: var(--color-red);
    }
    #progress-wrapper .row .main-info .seasons .episodes .episode.delete a {
        color: var(--color-red);
    }
    .filter-dropdown.selected .icon,
    .filter-dropdown.selected .caret,
    .filter-dropdown .selected .icon,
    .filter-dropdown .selected .caret,
    .filter-dropdown li a.selected {
        color: var(--color-red) !important;
    }
    .comment-wrapper .interactions a .text-wrapper .under-count,
    #main-comment .interactions a .text-wrapper .under-count {
        color: #999;
    }
    #progress-wrapper .row .main-info h3.show-title .ignore:hover,
    #progress-wrapper .row .main-info h3.show-title .reset:hover {
        color: var(--color-red);
    }
    .subnav-text {
        background-color: rgba(255, 255, 255, 0.15);
    }
    .pagination > .disabled > span,
    .pagination > .disabled > span:hover,
    .pagination > .disabled > span:focus,
    .pagination > .disabled > a,
    .pagination > .disabled > a:hover,
    .pagination > .disabled > a:focus {
        background-color: rgba(0, 0, 0, .25);
    }
    .pagination > li > a,
    .pagination > li > span {
        color: var(--text-color);
        background-color: rgba(0, 0, 0, .5);
    }
    .pagination .trakt-icon-ellipse {
        color: var(--text-color);
    }
    ul.pagination a:hover {
        color: var(--text-color-strong);
        background-color: var(--color-red);
    }
    .pagination > .active > a,
    .pagination > .active > a:hover,
    .pagination > .active > a:focus,
    .pagination > .active > span,
    .pagination > .active > span:hover,
    .pagination > .active > span:focus {
        color: var(--text-color-strong);
        background-color: var(--color-red);
    }
    .filter-dropdown .icon.trakt-icon-divider  {
        color: var(--text-color);
    }
    .filter-dropdown .metadata .trakt-icon-wand,
    .btn-list-edit-items,
    #btn-list-edit-lists,
    .custom-list .list-info .user-actions .icon.btn-list-clone,
    .custom-list .list-info .user-actions .icon.btn-list-subscribe,
    header#top-nav #header-search #header-search-type a {
        color: var(--text-color);
    }
    .btn-primary {
        background-color: var(--color-red);
        border-color: #8231a4;
    }
    .dropdown-menu {
        background-color: var(--color-secondary-black);
    }
    .dropdown-menu > li > a, .dropdown-menu>li>a:not(.selected) {
        color: var(--text-color) !important;
    }
    .dropdown-menu > li > a:hover,
    .dropdown-menu > li > a:focus {
        background-color: var(--color-primary-black);
        color: var(--text-color-strong);
    }
    .btn-default {
        border-color: #666;
    }
    .btn-default:hover,
    .btn-default:focus,
    .btn-default:active,
    .btn-default.active,
    .open > .btn-default.dropdown-toggle {
        border-color: #777;
    }
    #progress-wrapper .row .main-info .seasons .season-toggle.link .fa,
    #progress-wrapper .row .main-info .seasons .all-toggle.link .fa {
        color: var(--color-red);
    }
    .comment-wrapper .above-comment {
        background-color: var(--color-secondary-black);
    }
    .comment-wrapper .above-comment .date {
        color: #999 !important;
    }
    #info-wrapper .sidebar .external li a {
        background-color: var(--color-primary-black);
        border-color: #666;
    }
    .label-vip {
        background-color: var(--color-red);
    }
    .comment-wrapper.list .above-comment .user-name h4 a.username {
        color: var(--color-gray);
    }
    #info-wrapper .sidebar .poster {
        border-color: var(--color-secondary-black) !important;
    }
    #info-wrapper .sidebar .poster,
    #info-wrapper .sidebar .streaming-links,
    #info-wrapper .sidebar .btn-watch-now {
        box-shadow: none;
    }
    .btn-watch,
    .btn-collect,
    .btn-list,
    .btn-comment,
    .btn-favorites {
        background-color: transparent;
    }

    .summary-activity .tabs .tab.selected {
        background-color: var(--color-secondary-black);
        border-bottom-color: var(--color-secondary-black);
    }
    .summary-activity .tabs .tab {
        border: solid 1px var(--color-secondary-black);
        color: var(--text-color);
    }
    .users-wrapper {
        background-color: var(--color-secondary-black);
        border: solid 1px var(--color-secondary-black);
    }
    .user-avatar img {
        border: solid 2px var(--text-color);
        background-color: var(--text-color);
    }

    #info-wrapper .sidebar .sections li.active a,
    #comments .active h3,
    #replies .active h3 {
        color: var(--color-red);
    }
    #info-wrapper .sidebar .sections li a:hover,
    #info-wrapper .sidebar .sections li a:focus,
    #comments .tab-links h3:hover,
    #replies .tab-links h3:hover {
        color: var(--text-color);
    }
    #actors .tab-links h3:hover,
    #credits .tab-links h3:hover {
        color: var(--text-color);
    }
    #actors .active h3:hover .count,
    #credits .active h3:hover .count,
    #actors .tab-links h3:hover .count,
    #credits .tab-links h3:hover .count {
        border-color: var(--text-color);
        background-color: var(--text-color);
        color: var(--color-primary-black);
    }
    #info-wrapper .info .actors-wrapper .posters ul li .character {
        color: var(--text-color-strong);
    }
    #actors .active h3 .count,
    #credits .active h3 .count {
        border-color: var(--color-red);
        background-color: var(--color-red);
    }
    #info-wrapper .info .actors-wrapper .posters ul:hover li .titles .name {
        color: var(--text-color);
    }
    #info-wrapper .info #overview[data-readmore][aria-expanded=false] .shade {
        backgroun...