/**
 * @name Pywal
 * @author Mark Hoekveen
 * @version 1.0
 * @description change discord theme accordingly to pywal
*/

/* Left most element */
.scroller-2FKFPG.systemPad-3UxEGl.scroller-2TZvBN.da-scroller.da-systemPad,
/* Ping, connection status, hang up button  */
.container-1giJp5.da-container,
/* Your nickname, avatar n' stuff  */
.container-3baos1.da-container,
/* background of message separator */
.content-1o0f9g.da-content,
/* server header */
.header-2o-2hj.da-header,
/* video background */
.videoBackground-3AY_fu.da-videoBackground,
/* settings background */
.scroller-2FKFPG.da-scroller.systemPad-3UxEGl.da-systemPad,
/* find or start conversation button */
.searchBarComponent-32dTOx.da-searchBarComponent,
/* top-right search bar */
.search-36MZv-.da-search .search-2oPWTC.da-search .searchBar-3dMhjb.da-searchBar,
/* better discord settings menu */
.scroller-2FKFPG.firefoxFixScrollFlex-cnI2ix.contentRegionScroller-26nc1e.content-region-scroller.scroller, 
/* user Popout */
/* input bg */
.footer-1fjuF6.da-footer,
/* avatar bg */
.flex-1xMQg5.flex-1O1GKY.da-flex.da-flex.vertical-V37hAW.flex-1O1GKY.directionColumn-35P_nr.justifyCenter-3D2jYp.alignCenter-1dQNNs.noWrap-3jynv6.headerTop-3C2Zn0.da-headerTop
{{
  /* background-color: {background}; */
  background: linear-gradient(
      rgba(0, 0, 0, 0.8),
      rgba(0, 0, 0, 0.8)
    ),
    {color3}; 
}}
/* name of server */
.container-1r6BKw.da-container.themed-ANHk51.da-themed,
.children-19S4PO.da-children::after,
/* find or start conversation background */ 
.searchBar-6Kv8R2.da-searchBar,
/* mebers of group chat  */
.scroller-2FKFPG.da-scroller.systemPad-3UxEGl.da-systemPad.members-1998pB.da-members,
/* user poput quick message input */
.quickMessage-2XpSaN.da-quickMessage.quickMessage-1yeL4E.da-quickMessage,
/* private messages */
.scroller-2FKFPG.da-scroller.systemPad-3UxEGl.da-systemPad.scroller-1JbKMe,
/* modal when click channel name */
.flex-1xMQg5.flex-1O1GKY.da-flex.da-flex.horizontal-1ae9ci.horizontal-2EEEnY.flex-1O1GKY.directionRow-3v3tfG.justifyStart-2NDFzi.alignCenter-1dQNNs.noWrap-3jynv6.header-2tA9Os.da-header.header-1TKi98.da-header
{{
  /*background: linear-gradient(
      rgba(255, 255, 255, 0.05),
      rgba(255, 255, 255, 0.05)
    ),
    {background}; */
  background: linear-gradient(
    rgba(0, 0, 0, 0.8),
    rgba(0, 0, 0, 0.8)
  ),
  {color1}; 
  /* this linear-gradient thing is a trick to change color of --background just slightly, 
   * if you know better way to do this pls let me know */
}}

/* area behind chat input*/
.form-2fGMdU.da-form,
.form-2fGMdU.da-form::before,
/* background of messages */
.scroller-2FKFPG.da-scroller.systemPad-3UxEGl.da-systemPad.messages-3amgkR.scroller-3sQKXg.da-scroller {{
  /*background: linear-gradient(
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.1)
    ),
    {background};*/
  background: linear-gradient(
      rgba(0, 0, 0, 0.8),
      rgba(0, 0, 0, 0.8)
    ),
    {color2}; 
}}
/* top-right search placeholder */
.searchBar-3dMhjb.da-searchBar .DraftEditor-root .public-DraftEditorPlaceholder-root,
.notranslate.public-DraftEditor-content div ,
/* toolbar: call , video call, pin etc */
.toolbar-1t6TWx.da-toolbar svg,
/* icon to the left of name of the server */
.iconWrapper-2OrFZ1.da-iconWrapper svg,
/* user poput quick message input */
.quickMessage-2XpSaN.da-quickMessage.quickMessage-1yeL4E.da-quickMessage::placeholder,
/* Find or start a conversation text */
.searchBarComponent-32dTOx.da-searchBarComponent {{
  color: {color4};
}}
/* input */
.inner-MADQqc.da-inner,
input,
.scrollableContainer-2NUZem.webkit-HjD9Er.da-webkit {{
  background: linear-gradient(
      rgba(255, 255, 255, 0.15),
      rgba(255, 255, 255, 0.15)
    ),
    {background}; 
}}

/* chat messages with embeded html  */
.grid-1nZz7S.da-grid.hasThumbnail-3FJf1w.da-hasThumbnail {{
  background-color: {background};
  filter: brightness(90%);
}}
/* add and search server buttons */
.circleIconButton-jET_ig.da-circleIconButton {{
  background-color: {foreground};
}}

.wrapper-1BJsBx.selected.bZ3Lue .childWrapper-anI2G0, .wrapper-1BJsBx:hover .childWrapper-anI2G9,
.newMessagesBar-mujexs {{
  background-color: {color1};
}}

.isUnread-3Ef-o9,
.unreadPill-2HyYtt {{
  border-color: {color2};
  background-color: {color2};
}}

.unreadPillCapStroke-7rkHbg {{
  color: {color2};
  fill: {color2};
}}

.scroller-2FKFPG.systemPad-3UxEGl.scroller-2TZvBN.da-scroller.da-systemPad {{
  background: linear-gradient(
      {background},
      {color3} 
    );
    
}}

.header-2o-2hj,
.markup-2BOw-j {{
  color: {foreground};
}}