Oficial Dracula Theme by leozz37

/* ==UserStyle==
@name           Oficial Dracula Theme
@namespace      github.com/dracula/youtube
@version        1.0.0
@description    A dark theme for Youtube
@supportURL     https://github.com/dracula/gitlab/issues
@license        MIT
==/UserStyle== */

@-moz-document domain("youtube.com") {
html {
    --background-primary: #282a36;
    --background-secondary: #21222C;
    --background-tertiary: #191A21;
    --current-line: #44475a;
    --selection: #44475a;
    --foreground: #f8f8f2;
    --comment: #6272a4;
    --cyan: #8be9fd;
    --green: #50fa7b;
    --orange: #ffb86c;
    --pink: #ff79c6;
    --purple: #bd93f9;
    --red: #ff5555;
    --yellow: #f1fa8c;
}
    
html:not(.style-scope)[dark], :not(.style-scope)[dark]
{
  --yt-spec-brand-background-primary: var(--background-secondary);
  --yt-spec-brand-background-secondary: var(--background-tertiary);
  --yt-spec-brand-background-solid: var(--background-primary);
  --yt-spec-general-background-a: var(--background-tertiary);
  --yt-spec-general-background-b: var(--background-secondary);
  --yt-spec-general-background-c: var(--background-primary);
  --yt-spec-error-background: #f9f9f9;
  --yt-spec-text-primary: var(--foreground);
  --yt-spec-text-primary-inverse: var(--background-primary);
  --yt-spec-text-secondary: var(--comment);
  --yt-spec-text-disabled: var(--selection);
  --yt-spec-call-to-action: var(--purple);
  --yt-spec-icon-active-other: var(--purple);
  --yt-spec-icon-inactive: var(--comment);
  --yt-spec-icon-disabled: var(--selection);
  --yt-spec-badge-chip-background: rgba(255, 255, 255, 0.1);
  --yt-spec-verified-badge-background: rgba(255, 255, 255, 0.25);
  --yt-spec-suggested-action: #252a3a;
  --yt-spec-button-chip-background-hover: rgba(255, 255, 255, 0.2);
  --yt-spec-touch-response: #fff;
  --yt-spec-paper-tab-ink: rgba(255, 255, 255, 0.3);
  --yt-spec-filled-button-text: #030303;
  --yt-spec-call-to-action-inverse: #065fd4;
  --yt-spec-brand-icon-active: #fff;
  --yt-spec-brand-icon-inactive: #909090;
  --yt-spec-brand-button-background: #ff5555;
  --yt-spec-brand-link-text: #ff5555;
  --yt-spec-filled-button-focus-outline: rgba(255, 255, 255, 0.7);
  --yt-spec-call-to-action-button-focus-outline: rgba(62, 166, 255, 0.3);
  --yt-spec-brand-text-button-focus-outline: rgba(255, 78, 69, 0.3);
  --yt-spec-inactive-text-button-focus-outline: #606060;
  --yt-spec-ad-indicator: #00aaa7;
  --yt-spec-brand-subscribe-button-background: var(--yt-spec-brand-button-background);
  --yt-spec-wordmark-text: #fff;
  --yt-spec-10-percent-layer: rgba(255, 255, 255, 0.1);
  --yt-spec-selected-nav-text: #fff;
  --yt-spec-themed-blue: #673AB7;
  --yt-spec-themed-green: #50fa7b;
  --yt-spec-themed-overlay-background: rgba(0, 0, 0, 0.8);
}
    
tp-yt0app-drawer {
    background: var(--background-primary)
}

ytd-masthead
{
  --paper-input-container-input-align: baseline;
  display: block;
  width: 100%;
  background: var(--yt-spec-brand-background-primary);
}

paper-toggle-button[checked]:not([disabled]) .toggle-bar.paper-toggle-button
{
  opacity: 1;
  background-color: #5f6282;
}

.guide-entry-badge.ytd-guide-entry-renderer
{
  color: var(--yt-spec-brand-link-text);
}

#progress.ytd-thumbnail-overlay-resume-playback-renderer
{
  background-color: var(--yt-spec-themed-blue);
}

#notification-count.ytd-notification-topbar-button-renderer
{
  background-color: var(--yt-spec-themed-blue);
}

.sbdd_b, .sbsb_a, .sbfl_b, .sbsb_c
{
  background: var(--yt-spec-brand-background-primary);
}

.gsfs, .sbfl_b
{
  color: #fff;
}

.sbsb_d
{
  background-color: var(--yt-spec-general-background-c);
}

.sbdd_b
{
  border: 1px solid transparent;
}
    
.sbpqs_a {
    color: #bd93f9;
}
    
.sbsb_i {
    color: #8be9fd;
}
    
.sbfl_b {
     color: #8be9fd;   
}
}