Trackseries - Dark X by Saadski

/* ==UserStyle==
@name         Trackseries - Dark X
@version      20250409.02.52
@namespace    https://userstyles.world/user/Saadski
@description  Dark theme for Trackseries.tv
@author       Saadski
@license      No License
==/UserStyle== */

@-moz-document domain("trackseries.tv") {
/* Track Series */
/*SCROLLBAR*/
/* width */
::-webkit-scrollbar
{
    height: 10px !important;
    width: 10px !important;
}

/* Track */
/* Scrollbar Corner */
::-webkit-scrollbar-track,
::-webkit-scrollbar-corner
{
    background: #141414 !important;
}

/* Handle */
::-webkit-scrollbar-thumb
{
    background: #3A3A3A !important;
    border-radius: 1px !important;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover
{
    background: #3A3A3A !important;
}

::selection
{
    background: #353535B0 !important;
    color: #000 !important;
}

:root
{
    --dark0: hsl(0, 0%, 13%);
    --dark: hsl(0, 0%, 11%);
    --dark1: hsl(0, 0%, 11%);
    --darker: hsl(0, 0%, 7%);
    --darker2: hsl(0, 0%, 5%);
    --darker3: hsl(0, 0%, 3%);
    --bw: rgb(67, 67, 67);
    --light: rgb(146, 146, 146);
    --light1: rgb(193, 193, 193);
    --lighter: rgb(233, 233, 233);
    --accentts: rgb(95, 95, 95);
    --shadow: rgba(0, 0, 0, 0.07);
    --tp: #fff0;
    --ol: #090909F2;
}

:root
{
    --background: 0, 0%, 11%;
    --foreground: 215.3 25% 26.7%;
    --muted: 0, 0%, 13%;
    --muted-foreground: 215.4 16.3% 46.9%;
    --popover: 0 0% 100%;
    --popover-foreground: 215.3 25% 26.7%;
    --card: 0, 0%, 7%;
    --card-foreground: 215.3 25% 26.7%;
    --border: 214.3 31.8% 91.4%;
    --input: 0 0% 25%;
    --primary: 0, 0%, 5%;
    --primary-foreground: 204 93.8% 93.7%;
    --secondary: 27 96% 61%;
    --secondary-foreground: 204 93.8% 93.7%;
    --accent: 0, 0%, 20%;
    --accent-foreground: 222.2 47.4% 11.2%;
    --destructive: 0 72.2% 50.6%;
    --destructive-foreground: 210 40% 96.1%;
    --ring: 215 20.2% 65.1%;
    --radius: .5rem;
    --fc-small-font-size: .85em;
    --fc-page-bg-color: var(--dark);
    --fc-neutral-bg-color: hsla(0, 0%, 82%, .3);
    --fc-neutral-text-color: grey;
    --fc-border-color: #ddd;
    --fc-button-text-color: #fff;
    --fc-button-bg-color: #2c3e50;
    --fc-button-border-color: #2c3e50;
    --fc-button-hover-bg-color: #1e2b37;
    --fc-button-hover-border-color: #1a252f;
    --fc-button-active-bg-color: #1a252f;
    --fc-button-active-border-color: #151e27;
    --fc-event-bg-color: #3788d8;
    --fc-event-border-color: #3788d8;
    --fc-event-text-color: #fff;
    --fc-event-selected-overlay-color: rgba(0, 0, 0, .25);
    --fc-more-link-bg-color: #d0d0d0;
    --fc-more-link-text-color: inherit;
    --fc-event-resizer-thickness: 8px;
    --fc-event-resizer-dot-total-width: 8px;
    --fc-event-resizer-dot-border-width: 1px;
    --fc-non-business-color: hsla(0, 0%, 84%, .3);
    --fc-bg-event-color: #8fdf82;
    --fc-bg-event-opacity: 0.3;
    --fc-highlight-color: rgba(188, 232, 241, .3);
    --fc-today-bg-color: rgba(255, 220, 40, .15);
    --fc-now-indicator-color: red;
}

*
{
    border-color: var(--dark0) !important;
    color: var(--light)!important;
}

html,
body
{
    background: var(--darker3)
}

.text-primary-foreground,
.topbar-navbar
{
    background: #0000004d !important;
    backdrop-filter: blur(12px) !important
}

.bg-white,
.bg-slate-200,
.bg-slate-100,
.bg-slate-500,
.footer,
.management-navbar-active-item,
.bg-background-200,
.fc .fc-daygrid-day.fc-day-today,
[role="columnheader"]
{
    background: var(--darker2) !important
}

.bg-red-500
{
    background: var(--dark)
}

.hover\:bg-muted\/50:hover,
.data-\[state\=open\]\:zoom-in-95[data-state=open],
.auth .loginOr .spanOr,
.auth .loginOr .hrOr,
.management-navbar ul li a:hover,
.shadow,
.hover\:bg-slate-200:hover,
.\[\&\.active\]\:bg-slate-100.active,
.cc-btn,
.text-foreground,
[class="form-control"],
.form-control
{
    background: var(--dark) !important
}

.\[\&\.active\]\:bg-background-100.active
{
    background: var(--darker)
}

.hover\:bg-background-200:hover
{
    background: var(--darker2)
}

#root > div > div.min-h-screen-container.mt-navbarContainer.flex.flex-grow.flex-col > div.bg-slate-200 > div > div.rounded-lg.border.bg-card.text-card-foreground.shadow-md.hidden.md\:block > div > table > tbody > tr > td > div > div > div
{
    background: var(--bw) !important
}

.max-w-2xl,
.max-h-\[30px\],
.topbar-navbar-logo img
{
    filter: opacity(0.5);
}

[role="menu"],
.cc-window,
.main,
.management-navbar,
.bg-background-100
{
    background: var(--darker) !important;
}

[class="lucide lucide-eye-off"]
{
    color: var(--light) !important
}

.text-secondary-foreground
{
    color: var(--darker2) !important
}

.topbar-navbar-user-profile-picture img
{
    border: 0px solid;
}

[src="https://static.trackseries.tv/banners/placeholder/episode.png"],
[src="https://static.trackseries.tv/banners/placeholder/season_medium.png"]
{
    filteR: invert(0)opacity(0.2)contrast(1) !important;
}

::placeholder
{
    color: var(--bw) !important
}

.hover\:bg-primary-800:hover
{
    background: var(--darker2) !important
}

.auth .btn-facebook,
.auth .btn-twitter,
.auth .btn-google
{
    opacity: 0.5
}

.fa
{
    color: var(--darker3) !important
}

.topbar-navbar-options ul li a:hover,
.topbar-navbar-user-profile ul li a:hover
{
    background: var(--tp);
}

.img-thumbnail
{
    border: 1px solid var(--accent) !important;
}

[alt="profile image"],
.topbar-navbar-user-profile-picture img,
.img-thumbnail
{
    animation: filter-animation 2s infinite;
}

span.visible.flex.items-center.gap-2
{
    color: var(--darker2) !important
}

.text-orange-400
{
    color: rgb(251 146 60) !important;
}

[src="/_build/assets/mission-accomplished-BaoMGBe6.svg"]
{
    filter: invert(1)hue-rotate(0deg)saturate(0)contrast(1)brightness(1)
}

.bg-primary
{
    background-color: var(--dark);
}

.bg-slate-300
{
    background: var(--darker)
}

[class="inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80 absolute bottom-0 right-0 z-10 mb-1 mr-1"]
{
    color: var(--darker3) !important
}

.bg-destructive
{
    background-color: hsla(0, 0%, 49%, .43);
    backdrop-filter: blur(5px)
}

/*.shadow-lg
{
    width: 350px;
}

/*
@keyframes filter-animation {
  0% {
    filter: hue-rotate(20deg);
  }
  
  50% {
    filter: hue-rotate(0deg);
  }
  
  100% {
    filter: hue-rotate(300deg);
  }
}
*/
}