/* ==UserStyle==
@name Twitter Dracula
@namespace github.com/dracula/userstyles/styles/twitter
@homepageURL https://github.com/dracula/dracula-theme
@version 1.0.0
@supportURL https://github.com/dracula/dracula-theme/issues
@description Dark theme for Twitter inspired by Dracula
@author Dracula Theme
@license MIT
@preprocessor less
@var select accentColor "Accent" ["purple:Purple*", "pink:Pink", "cyan:Cyan", "green:Green", "orange:Orange", "red:Red", "yellow:Yellow"]
@var checkbox colorizeLogo "Colorize Logo" 0
@var checkbox darkenShadows "Darken Shadows" 1
==/UserStyle== */

@-moz-document domain("twitter.com"), domain("x.com") {
  :root {
    #dracula(@accentColor);
  }
  
  #dracula(@accent) {
    // Dracula color palette
    @background: #282a36;
    @current-line: #44475a;
    @foreground: #f8f8f2;
    @comment: #6272a4;
    @cyan: #8be9fd;
    @green: #50fa7b;
    @orange: #ffb86c;
    @pink: #ff79c6;
    @purple: #bd93f9;
    @red: #ff5555;
    @yellow: #f1fa8c;
    
    // Additional shades for better theming
    @darker-bg: #21222c;
    @selection: #44475a;
    @subtle: rgba(68, 71, 90, 0.5);
    @border: #44475a;
    @hover: rgba(68, 71, 90, 0.8);
    @accent-color: @dracula[@@accent];
    
    color-scheme: dark;
    
    ::selection {
      background-color: @selection;
    }
    
    input, textarea {
      &::placeholder {
        color: @comment !important;
      }
    }
    
    body.LightsOut {
      --border-color: @border;
      --color: @comment;
      --color-emphasis: @foreground;
      --hover-bg-color: @current-line;
      
      // shadows
      .r-qo02w8, .r-15ce4ve {
        @default-shadow: rgba(0, 0, 0, 0.4) 0 0 15px, rgba(0, 0, 0, 0.35) 0 0 3px 1px;
        box-shadow: @default-shadow;
        & when (@darkenShadows = 1) {
          box-shadow: rgba(0, 0, 0, 0.6) 0 0 15px, rgba(0, 0, 0, 0.55) 0 0 3px 1px;
        }
      }
      
      .r-1tbvlxk {
        @default-shadow: drop-shadow(rgba(0, 0, 0, 0.5) 1px -1px 1px);
        filter: @default-shadow;
        & when (@darkenShadows = 1) {
          filter: drop-shadow(rgba(0, 0, 0, 0.7) 1px -1px 1px);
        }
      }
      
      .r-1uusn97 {
        @default-shadow: rgba(0, 0, 0, 0.4) 0 0 5px, rgba(0, 0, 0, 0.35) 0 1px 4px 1px;
        box-shadow: @default-shadow;
        & when (@darkenShadows = 1) {
          box-shadow: rgba(0, 0, 0, 0.6) 0 0 5px, rgba(0, 0, 0, 0.55) 0 1px 4px 1px;
        }
      }
    }
    
    body, .PageContainer, #placeholder {
      background-color: @background !important;
      color: @foreground;
    }
    
    #ScriptLoadFailure span {
      color: @foreground;
    }
    
    [style*="scrollbar-color: rgb(62, 65, 68) rgb(22, 24, 28)"] {
      scrollbar-color: @accent-color transparent !important;
      scrollbar-width: thin;
    }
    
    // bg color
    [data-testid="primaryColumn"], .r-kemksi {
      background-color: @background;
    }
    
    // arrow on account switcher
    .r-cqee49 {
      color: @background;
    }
    
    // top nav bg color
    .r-5zmot {
      background-color: fade(@background, 75%);
    }
    
    // element hover (when on base)
    .r-1hdo0pc, .r-pjtv4k {
      background-color: @hover;
    }
    
    // element active (when on base)
    .r-11gmi9o {
      background-color: @current-line;
    }
    
    .r-1cuuowz {
      background-color: fade(@foreground, 3%);
    }
    
    // text
    .r-1nao33i {
      color: @foreground;
    }
    
    // white text, seems to appear on accent colors
    .r-jwli3a {
      color: @darker-bg;
      // cw svg
      &:has(path[d="M3.693 21.707l-1.414-1.414 2.429-2.429c-2.479-2.421-3.606-5.376-3.658-5.513l-.131-.352.131-.352c.133-.353 3.331-8.648 10.937-8.648 2.062 0 3.989.621 5.737 1.85l2.556-2.557 1.414 1.414L3.693 21.707zm-.622-9.706c.356.797 1.354 2.794 3.051 4.449l2.417-2.418c-.361-.609-.553-1.306-.553-2.032 0-2.206 1.794-4 4-4 .727 0 1.424.192 2.033.554l2.263-2.264C14.953 5.434 13.512 5 11.986 5c-5.416 0-8.258 5.535-8.915 7.001zM11.986 10c-1.103 0-2 .897-2 2 0 .178.023.352.067.519l2.451-2.451c-.167-.044-.341-.067-.519-.067zm10.951 1.647l.131.352-.131.352c-.133.353-3.331 8.648-10.937 8.648-.709 0-1.367-.092-2-.223v-2.047c.624.169 1.288.27 2 .27 5.415 0 8.257-5.533 8.915-7-.252-.562-.829-1.724-1.746-2.941l1.438-1.438c1.53 1.971 2.268 3.862 2.33 4.027z"]) {
        color: @foreground;
      }
    }
    // ... (rest of the code unchanged for brevity)
  }
}

/* prettier-ignore */
@dracula: {
  @purple: #bd93f9;
  @pink: #ff79c6;
  @cyan: #8be9fd;
  @green: #50fa7b;
  @orange: #ffb86c;
  @red: #ff5555;
  @yellow: #f1fa8c;
};

// vim:ft=less