/**
 * @name         Alan Walker Theme
 * @description  dark theme with Alan Walker's logo as background, credit to DevilBro#4401 for settingsicons, credit to Nyria#3863 for userbuttons in the serverbar and spotifyControls
 * @author       lolpowerluke
 * @version      1.3.7
 * @source       https://github.com/lolpowerluke/bd-themes/blob/main/AlanWalkerTheme/alanWalker.theme.css
 * @website      https://github.com/lolpowerluke
*/

@import url('https://lolpowerluke.github.io/bd-themes/AlanWalkerTheme/main.css');
/*all variables here*/
:root {
  /*Theme Dependent Stuff*/
  --title-bar-content: "DISCORD (Alan Walker Theme)";
  --main-background: url('https://i.imgur.com/tt9snCk.png?1') center right no-repeat;
  --back-selected-dm-pic: url('https://i.imgur.com/tmY77W1.png') center left no-repeat;
  --home-button-background: url('https://i.imgur.com/PrJ5xwf.png');
  --back-pos-dm: 0px;
  --home-button-background-size: 50px;

  /*Other Stuff*/
  --crash-screen-image: url('https://i.imgur.com/z6YF9bI.png');

  /*USRBG*/
  --USRBG-popout-background: url('https://i.imgur.com/tt9snCk.png?1'); /*fallback background for if the user has no usrbg set*/

  /*settings*/
  --settings-max-width: 1650px; /*"unset" for full screen width, "1650px" for default*/
  --settings-myaccount-max-width: 740px; /*"unset" for full screen width, "740px" for default (740px is still full screen width for 1080p monitors or lower)*/

  /*other stuff*/
  --user-buttons-spacing: 8px;
  --standard-account-height: 52px;
  --avatar-radius: 5px;
  --role-circle: 5px;
  --guild-margin-bottom: 135px; /* default: 135px, change to 180px if you have the gameactivitytoggle plugin*/

  /*Border Radius*/
  --border-radius-0: 0;
  --border-radius-xs: 2px;
  --border-radius-s: 4px;
  --border-radius-m: 8px;
  --border-radius-l: 12px;
  --border-radius-xl: 16px;
  --border-radius-xxl: 32px;
  
  /*Transparent Chat Header*/
  --margin-chat-top: 48px; /*On: 48px, off: 0px*/

  /*Member list*/
  --memberlist-no-hover-width: 60px;
  --memberlist-hover-width: 240px;
    
  /*Embeds*/
  --embed-width: 500px;

  /*Settings*/
  --bd-addon-cards-opacity: 1;
  
  /*Streamer mode*/
  --stream-mode-hover-duration: .2s;
  --stream-mode-hover-delay: 1s;

  /*Call overlay minimum values*/
  --call-min-width: 600px;
  --call-min-height: 450px;

  /*Spacing*/
  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;

  /*emoji & gif*/
  --popup-emoji-size: 180px;

  /*smallDMchannelList*/
  --sidebar-no-hover-width: 60px; /*60px for just the channelIcon, 80px for the 1st 2/3 letters of the channel names, 240px to have it like default*/
  --channel-name-no-hover-margin: 15px; /*15px for hidding the name, 0px for showing the name*/
  --channel-name-no-hover-opacity: 0; /*0 for hiding the name, 1 for showing the name*/
  --sidebar-no-hover-call-buttons-width: 0px; /*0px for hiding the buttons, 100% for showing them*/
  --sidebar-no-hover-call-buttons-height: 0px; /*0px for hiding the buttons, 32px for showing them*/

  /*Animations*/ /*set all to 0 to disable transitions*/
  --animation-duration-1: 0.1s;
  --animation-duration-2: 0.25s;
  --animation-duration-3: 0.5s;
  --animation-duration-4: 0.75s;
  --animation-duration-5: 1s;

  /*Version*/
  --version-1-3-7: none;

  /*Window width 700px or smaller*/
  --guild-bar-width-700: 56px;
}
:root .bd-transparency {
  /*Put any variable here you want to apply only if bd's transpareny settings is enabled*/
  --bd-addon-cards-opacity: 0.8;
}
.theme-midnight,
.theme-dark,
#app-mount .theme-midnight,
#app-mount .theme-dark,
:root.theme-midnight,
:root.theme-dark {
  /*title bar*/
  --title-bar-color: rgb(116, 116, 116);

  /*Theme Dependent Stuff*/
  --back-home-button: rgb(145, 145, 151);

  /*borders*/
  --border-color-1: 139, 139, 139;
  --border-opacity-1: 0.5;
  --border-color-hover: 76, 76, 76;
  --border-opacity-hover: 1;

  /*boxes*/
  --back-color-boxes: rgba(73, 73, 73, 0.2);
  --back-color-boxes-hover: rgba(90, 90, 90, 0.4);
  --back-color-danger-boxes: rgba(255, 0, 0, 0.5);
  --back-color-danger-boxes-hover: rgba(255, 0, 0, 0.7);

  /*buttons*/
  --back-color-danger-button: red;
  --back-color-button: #008549fa;
  --home-button-bg-color: black;
  --message-buttons-bg: rgba(0, 0, 0, 0.8);
  
  /*switches*/
  --switch-off: rgba(255, 255, 255, 0.5);
  --switch-on: rgba(65, 65, 65, 0.829);

  /*badges*/
  --back-color-number-badges: rgb(177, 179, 199);

  /*playing card border color*/
  --playing-card-border: rgb(88, 88, 88);
  --spotify-color: rgb(0, 255, 0);
  --separator: 77, 77, 77;

  --back-user-buttons: rgba(255, 255, 255, 0.116);

  /*unread pill*/
  --unread-pill: rgb(145, 145, 151);
  --unread-pill-shadow: rgb(255, 255, 255);

  /*plugin colors*/
  --permission-header: rgb(0, 0, 0);
  --permission-role-side: rgba(0, 0, 0, 0.575);
  --permission-perm-side: rgba(0, 0, 0, 0.678);
  --image-utils-back: black;
  --image-utils-border: rgb(59, 59, 59);
  --back-channel-tabs: rgb(22, 22, 22);
  --back-channel-tabs-selected: rgb(46, 46, 46);

  /*discords integrated colors*/
  --interactive-normal: white;
  --interactive-active: white;
  --interactive-hover: white;
  --channels-default: white;
  --background-primary: rgba(0, 0, 0, 0.5);
  --background-secondary: rgba(35, 35, 39, 0.25);
  --background-secondary-alt: var(--back-color-boxes);
  --background-tertiary: rgb(0, 0, 0);
  --background-floating: rgb(7, 7, 7);
  --background-mentioned: rgba(255, 0, 0, 0.3);
  --background-modifier-hover: rgba(90, 90, 90, 0.2);
  --background-modifier-selected: rgba(45, 45, 45, 0.2);
  --background-modifier-selected-hover: rgb(135, 135, 135, 0.2);
  --info-warning-foreground: red;

  /*Text colors*/
  --text-normal: rgb(240, 240, 240);
  --text-link: #00ff15;
  --text-link-back: black;
  --text-focus: white;
  --dm-color: rgb(182, 182, 182);
  --dm-unread-color: rgb(255, 255, 255);
  --dm-muted-color: rgb(59, 59, 59);
  --dm-selected-color: rgb(189, 189, 189);
  --chat-header-name-color: rgb(182, 182, 182);

  /*servers*/
  --back-expanded-server-folder-icon: rgba(73, 73, 73, 0.548);
  --back-expanded-server-folder: rgba(73, 73, 73, 0.582);
  --back-server-no-img: rgba(66, 66, 66, 0.5);
  --back-server-no-img-hover: rgba(92, 92, 92, 0.5);
  --back-server-no-img-in-folder: rgba(94, 94, 94, 0.5);
  --back-server-no-img-hover-in-folder: rgba(116, 116, 116, 0.5);

  /*other stuff*/
  --channeltextarea-background: rgba(77, 77, 77, 0.425);
  --back-user-area: rgba(0, 0, 0, 0);
  --back-user-area-hover: rgba(77, 77, 77, 0.425);
  --chatbar-placeholder-color: rgb(112, 112, 112);
  --back-color: rgb(0, 0, 0);
  --gr-dm-headers: linear-gradient(to right, transparent, rgb(83, 83, 83));
  --back-selected-dm: black;
  --back-account: black;
  --create-server: rgba(0, 0, 0, 0.911);
  --create-server-text-color: rgb(255, 255, 255);
  --create-server-choices: black;
  --create-server-choices-border: rgb(255, 0, 0);
  --create-server-footer-button: black;
  --create-server-footer-button-hover: rgba(255, 255, 255, 0.123);
  --back-color-search-bar: rgba(83, 83, 83, 0.349);
  --screen-share-main: rgba(0, 0, 0, 0);
  --message-hover: rgba(95, 95, 95, 0.267);
  --typing-border: rgb(122, 122, 122);
  --border-zoom: rgb(121, 121, 121);
  --back-activity-panels: rgb(39, 39, 39);
  --back-gradient-opacity: 1;
  --back-gradient-top: 0, 0, 0;
  --back-gradient-bottom: 40, 40, 40;
  --profile-gradient-button-color: black;
  --back-upload-button: rgb(var(--border-color-1));
  --fill-upload-button: black;
  --mentioned-badge: rgba(255, 0, 0, 0.5);
  --back-call-buttons: rgba(255, 255, 255, 0.25);
  --call-button-green: rgba(0, 128, 0, 0.5);
  --call-button-red: rgba(255, 0, 0, 0.5);
  --jump-to-present-bar: rgba(0, 0, 0, 0.6);
  --jump-to-present-bar-hover: rgba(0, 0, 0, 0.8);
  --channels-roles-options-bg: rgba(0, 0, 0, 0.4);

  /*popouts*/
  --popout-header: black;
  --popout-body: rgba(0, 0, 0);
  --popout-footer: black;
  --popout-scroller: rgb(41, 41, 41);

  /*settings*/
  --back-bd-addon-cards: black;

  /*menu*/
  --menu-item-hover-color: rgb(170, 170, 170);
  --back-color-search-popup: rgba(0, 0, 0, 0.8);

  /*Memberlist*/
  --back-memberlist: 0, 0, 0;
  --back-memberlist-opacity: 0.4;

  /*Frienlist*/
  --back-friendlist-friends: rgba(0, 0, 0, 0.4);
  --back-friendlist-friends-hover: rgba(44, 44, 44, 0.4);
  
  /*forums*/
  --back-color-forum-posts: rgba(7, 7, 7, 0.726);
  --back-color-forum-posts-hover: rgba(34, 34, 34, 0.575);

  /*user popouts*/
  --user-popout: black;
  --user-popout-alt: rgba(0, 0, 255, 0.24);
  --back-small-user-popout-badges: rgba(0, 0, 0, 0.75);
  --user-popout-gradient-color-mix-addition: rgba(0, 0, 0, 0.3);

  /*plugin popups*/
  --back-color-tooltips: black;
  --back-channel-dms: black;
  --back-server-themes-choice-button: black;
  --back-friend-notifications: black;
  --back-better-message-links: black;
  --back-powercord-notices: black;
  --channelTabs-favs-popup-bg: rgba(0, 0, 0, 0.8);

  /*scroller (I think)*/
  --back-color-menu: rgb(0, 0, 0, .8);
  --back-role-scroller: black;

  /*message separator*/
  --message-separator-line: rgba(17, 0, 255, 0.5);
  --unread-message: rgb(255, 0, 0);
  --unread-message-line: rgb(255, 0, 0);

  /*emoji & gif*/
  --back-emoji-etc-picker: black;

  /*other stuff I tried to make work*/
  --scrollbar-auto-scrollbar-color-thumb: red;
  --scrollbar-auto-scrollbar-color-track: blue;

  /*Link Preview*/
  --linkpreview-background: rgb(0, 0, 0, .5);

  /*smallDMchannelList*/
  --back-sidebar: rgba(0, 0, 0, 0.8);

  /*Window width 700px or smaller*/
  --back-user-buttons-700: rgb(0,0,0,0.4);
  --back-user-buttons-hover-700: rgba(255, 255, 255, 0.2);

  /* Update banner*/
  --update-banner-background: rgba(255, 0, 0, 0.4);
}
.theme-midnight .bd-transparency,
.theme-dark .bd-transparency,
.bd-transparency #app-mount .theme-midnight,
.bd-transparency #app-mount .theme-dark,
:root.theme-midnight .bd-transparency,
:root.theme-dark .bd-transparency {
  /*Put any variable here you want to apply only if bd's transpareny settings is enabled*/
  /*boxes*/
  --back-color-boxes: rgba(0, 0, 0, 0.4);

  /*background gradient*/
  --back-gradient-opacity: 0.8;
  --back-gradient-top: 0, 0, 0;
  --back-gradient-bottom: 0, 0, 0;

  /*emoji & gif*/
  --back-emoji-etc-picker: rgba(0, 0, 0, 0.5);
  
  /*popouts*/
  --popout-header: rgba(0, 0, 0, 0.5);
  --popout-body: rgba(0, 0, 0, 0.5);
  --popout-footer: rgba(0, 0, 0, 0.5);
  --popout-scroller: rgb(0, 0, 0);
  
  /*other*/
  --backdrop-opacity: 0.4;

  /*idk*/
  --back-user-buttons: transparent;

  /* Update banner*/
  --update-banner-background: rgba(255, 0, 0, 0.2);
}
#app-mount .theme-light,
.theme-light,
:root.theme-light {
  /*title bar*/
  --title-bar-color: rgb(116, 116, 116);

  /*Theme Dependent Stuff*/
  --back-home-button: rgb(70, 70, 70);

  /*borders*/
  --border-color-1: 116, 116, 116;
  --border-opacity-1: 0.5;
  --border-color-hover: 150, 150, 150;
  --border-opacity-hover: 1;

  /*boxes*/
  --back-color-boxes: rgba(182, 182, 182, 0.2);
  --back-color-boxes-hover: rgba(141, 141, 141, 0.4);
  --back-color-danger-boxes: rgba(255, 0, 0, 0.5);
  --back-color-danger-boxes-hover: rgba(255, 0, 0, 0.7);

  /*buttons*/
  --back-color-danger-button: red;
  --back-color-button: #008549fa;
  --home-button-bg-color: white;
  
  /*switches*/
  --switch-off: rgba(255, 255, 255, 0.5);
  --switch-on: rgba(65, 65, 65, 0.829);

  /*badges*/
  --back-color-number-badges: rgb(177, 179, 199);

  /*playing card border color*/
  --playing-card-border: rgb(88, 88, 88);
  --spotify-color: rgb(0, 255, 0);
  --separator: 77, 77, 77;

  --back-user-buttons: rgba(255, 255, 255, 0.116);

  /*unread pill*/
  --unread-pill: rgb(110, 110, 110);
  --unread-pill-shadow: rgb(0, 0, 0);

  /*plugin colors*/
  --permission-header: rgb(255, 255, 255);
  --permission-role-side: rgba(255, 255, 255, 0.575);
  --permission-perm-side: rgba(255, 255, 255, 0.678);
  --image-utils-back: white;
  --image-utils-border: rgb(196, 196, 196);
  --back-channel-tabs: rgb(233, 233, 233);
  --back-channel-tabs-selected: rgb(209, 209, 209);

  /*discords integrated colors*/
  --interactive-normal: black;
  --interactive-active: black;
  --interactive-hover: black;
  --channels-default: black;
  --background-primary: rgba(255, 255, 255, 0.5);
  --background-secondary: rgba(220, 220, 220, 0.25);
  --background-secondary-alt: var(--back-color-boxes);
  --background-tertiary: rgb(255, 255, 255);
  --background-floating: rgb(248, 248, 248);
  --background-mentioned: rgba(255, 0, 0, 0.1);
  --background-modifier-hover: rgba(90, 90, 90, 0.2);
  --background-modifier-selected: rgba(45, 45, 45, 0.2);
  --background-modifier-selected-hover: rgb(110, 110, 110, 0.2);
  --info-warning-foreground: red;

  /*Text colors*/
  --text-normal: rgb(15, 15, 15);
  --text-link: #007a0a;
  --text-link-back: white;
  --text-focus: black;
  --dm-color: rgb(32, 32, 32);
  --dm-unread-color: black;
  --dm-muted-color: rgb(151, 151, 151);
  --dm-selected-color: rgb(65, 65, 65);
  --chat-header-name-color: rgb(32, 32, 32);
  
  /*server folders*/
  --back-expanded-server-folder-icon: rgba(133, 133, 133, 0.55);
  --back-expanded-server-folder: rgba(150, 150, 150, 0.6);
  --back-server-no-img: rgba(196, 196, 196, 0.5);
  --back-server-no-img-hover: rgba(151, 151, 151, 0.5);
  --back-server-no-img-in-folder: rgba(158, 158, 158, 0.5);
  --back-server-no-img-hover-in-folder: rgba(114, 114, 114, 0.5);

  /*other stuff*/
  --channeltextarea-background: rgba(143, 143, 143, 0.5);
  --back-user-area: rgba(0, 0, 0, 0);
  --back-user-area-hover: rgba(143, 143, 143, 0.5);
  --chatbar-placeholder-color: rgb(92, 92, 92);
  --back-color: white;
  --gr-dm-headers: linear-gradient(to right, transparent, rgb(83, 83, 83));
  --back-selected-dm: white;
  --back-account: white;
  --create-server: rgba(255, 255, 255, 0.9);
  --create-server-text-color: black;
  --create-server-choices: white;
  --create-server-choices-border: rgb(255, 0, 0);
  --create-server-footer-button: white;
  --create-server-footer-button-hover: rgba(0, 0, 0, 0.123);
  --back-color-search-bar: rgba(172, 172, 172, 0.35);
  --screen-share-main: rgba(255, 255, 255, 0);
  --message-hover: rgba(131, 131, 131, 0.25);
  --typing-border: rgb(123, 123, 123);
  --border-zoom: rgb(124, 124, 124);
  --back-activity-panels: rgb(216, 216, 216);
  --back-gradient-opacity: 1;
  --back-gradient-top: 255, 255, 255;
  --back-gradient-bottom: 175, 175, 175;
  --profile-gradient-button-color: white;
  --back-upload-button: rgb(116, 116, 116);
  --fill-upload-button: var(--background-primary);
  --mentioned-badge: rgb(255, 0, 0, 0.5);
  --call-button-green: rgba(0, 128, 0, 0.5);
  --call-button-red: rgba(255, 0, 0, 0.5);
  --jump-to-present-bar: rgba(255, 255, 255, 0.6);
  --jump-to-present-bar-hover: rgba(255, 255, 255, 0.8);
  --channels-roles-options-bg: rgba(255, 255, 255, 0.4);

  /*popouts*/
  --popout-header: black;
  --popout-body: rgba(0, 0, 0);
  --popout-footer: black;
  --popout-scroller: rgb(41, 41, 41);
  
  /*settings*/
  --back-bd-addon-cards: white;

  /*menu*/
  --menu-item-hover-color: rgb(170, 170, 170);
  --back-color-search-popup: rgba(255, 255, 255, 0.8);

  /*Memberlist*/
  --back-memberlist: 0, 0, 0;
  --back-memberlist-opacity: 0.4;
  
  /*Frienlist*/
  --back-friendlist-friends: rgba(255, 255, 255, 0.4);
  --back-friendlist-friends-hover: rgba(211, 211, 211, 0.4);
  
  /*forums*/
  --back-color-forum-posts: rgba(7, 7, 7, 0.726);
  --back-color-forum-posts-hover: rgba(34, 34, 34, 0.575);

  /*user popouts*/
  --user-popout: white;
  --user-popout-alt: rgba(0, 0, 255, 0.24);
  --back-small-user-popout-badges: rgba(255, 255, 255, 0.75);
  --user-popout-gradient-color-mix-addition: rgba(255, 255, 255, 0.3);

  /*plugin popups*/
  --back-color-tooltips: white;
  --back-channel-dms: white;
  --back-server-themes-choice-button: white;
  --back-friend-notifications: white;
  --back-better-message-links: white;
  --back-powercord-notices: white;
  --channelTabs-favs-popup-bg: rgba(255, 255, 255, 0.8);

  /*scroller (I think)*/
  --back-color-menu: rgb(255, 255, 255, .8);
  --back-role-scroller: black;

  /*message separator*/
  --message-separator-line: rgba(17, 0, 255, 0.5);
  --unread-message: rgb(255, 0, 0);
  --unread-message-line: rgb(255, 0, 0);

  /*emoji & gif*/
  --back-emoji-etc-picker: black;

  /*other stuff I tried to make work*/
  --scrollbar-auto-scrollbar-color-thumb: red;
  --scrollbar-auto-scrollbar-color-track: blue;

  /*Link Preview*/
  --linkpreview-background: transparent;

  /*smallDMchannelList*/
  --back-sidebar: rgb(0, 0, 0);

  /*Window width 700px or smaller*/
  --back-user-buttons-700: rgb(0,0,0,0.2);
  --back-user-buttons-hover-700: rgba(255, 255, 255, 0.2);

  /* Update banner*/
  --update-banner-background: rgba(255, 0, 0, 0.4);
}
.theme-light .bd-transparency,
:root.theme-light .bd-transparency,
.bd-transparency #app-mount .theme-light {
  /*Put any variable here you want to apply only if bd's transpareny settings is enabled*/
  /*boxes*/
  --back-color-boxes: rgba(255, 255, 255, 0.4);

  /*background gradient*/
  --back-gradient-opacity: 0.6;
  --back-gradient-top: 255, 255, 255;
  --back-gradient-bottom: 255, 255, 255;

  /*emoji & gif*/
  --back-emoji-etc-picker: rgba(255, 255, 255, 0.5);
  
  /*popouts*/
  --popout-header: rgba(255, 255, 255, 0.5);
  --popout-body: rgba(255, 255, 255, 0.5);
  --popout-footer: rgba(255, 255, 255, 0.5);
  --popout-scroller: rgb(255, 255, 255);
  
  /*other*/
  --backdrop-opacity: 0.4;

  /*idk*/
  --back-user-buttons: transparent;

  /* Update banner*/
  --update-banner-background: rgba(255, 0, 0, 0.2);
}