/**
 * @name Soppo
 * @description a theme
 * @author Tenryu#8561
 * @version 0.0.2
 * @authorId 213487937042513930
 * @invite Jx3TjNS
 * @donate https://www.paypal.me/MircoWittrien
 * @patreon https://www.patreon.com/MircoWittrien
 * @website https://mwittrien.github.io/
 * @source https://github.com/mwittrien/BetterDiscordAddons/tree/master/Themes/BasicBackground/
 */

@import url(https://8xs4qxklp8.execute-api.us-east-2.amazonaws.com/release/gorawgit?giturl=/puckzxz/NotAnotherAnimeTheme/master/css/tcsl.css);


/* To make editing this theme easier I recommend using Notepad++ , you can download it for free here - https://notepad-plus-plus.org/download/ */


/* Any images you use MUST end with .jpg or .png or any other image extension */
/* This is NOT a valid link, https://imgur.com/a/ycjL2 */
/* THIS IS A VALID LINK https://i.imgur.com/rCqnrQ7.jpg */

/* If you find an image I would STRONGLY recommend rehosting the image on imgur https://imgur.com/upload */


:root {
    /* Edit this to change your background */
    --background-image: url(https://i.imgur.com/RU4fuLq.jpg); /* format is url(IMAGE URL HERE) */
    /* Edit this to change your friends icon picture, picture  */
    --friends-icon: url(https://i.imgur.com/gepwsLx.png?1); /* format is url(IMAGE URL HERE) */
    /* Edit this to change your friends icon picture, position  */
    --friends-icon-position: center center; /* default: center center */
    /* Edit this to change your friends icon picture, zoom  */
    --friends-icon-zoom: 100%; /* default: 100% */
    /* Change the main color */
    --main-color: rgb(67, 181, 129); /* default: rgb(67, 181, 129); */
    /* Chande global transparency */
    --main-transparency: rgba(0, 0, 0, 0.7); /* default: rgba(0, 0, 0, 0.8); */ 

    /* Change the unread server animation. Replace it with "none" in order to remove any animations */
    --unread-server-animation: rainbow;
    /* Change background color when you hover members or friends */
    --hover-list-bg-color: rgba(255,255,255, .15); /* default: rgba(255,255,255, .15) */
    /* Change the tiny border lines color */
    --border-lines-color: hsla(0,0%,100%,.1); /* default: hsla(0,0%,100%,.1);*/
    /* Change the scroll bar color appearence */
    --scroll-bar-color: rgba(255,255,255, .15); /* default: rgba(255,255,255, .15);*/

    /* Change chat messages font size, you can use any unit: px, em, rem, %, etc. */
    --font-size: 16px; /* default: 16px */
    /* Edit this to change the color of a selected text or voice join */
    --selected-text-voice-color: #f6f6f7; /* default: #f6f6f7 */
    /* Edit this to change the color when you hover over a text channel */
    --text-hover-color: #b7d2ff; /* default: #b9bbbe */
    /* Edit this to change the color when you hover over a voice channel */
    --voice-hover-color: #f6f6f7; /* default: #f6f6f7 */
    /* Edit this to change the color of an unread text channel color */
    --unread-text-color: #dcddde; /* default: #dcddde */
}


.theme-dark .circleIconButton-1XqULR {
    background: rgba(0,0,0,.4);
    border-color: rgba(255,255,255,.3);
    color: rgba(255,255,255,.15);
}

.scroller-2FKFPG > .listItem-1hlISG:first-child > .listItemWrapper-3X98Pc > .wrapper-25eVIn {
    background: var(--friends-icon) !important;
    background-position: var(--friends-icon-position) !important;
    background-repeat: no-repeat !important;
    background-size: var(--friends-icon-zoom) !important;
    border-radius: 100%;
}

.tutorialContainer-2sGCg9 .listItem-1hlISG .listItemWrapper-3X98Pc .wrapper-25eVIn {
    background: var(--friends-icon) !important;
    background-position: var(--friends-icon-position) !important;
    background-repeat: no-repeat !important;
    background-size: var(--friends-icon-zoom) !important;
    border-radius: 100%;
}

.tutorialContainer-2sGCg9 .listItem-1hlISG .listItemWrapper-3X98Pc .wrapper-25eVIn svg {
    opacity: 0;
}

.tutorialContainer-2sGCg9 .listItem-1hlISG {
    right: 3px;
}

.wrapper-3NnKdC .scroller-1Bvpku > div.listItem-1hlISG:nth-child(1) {
    width: 100% !important;
    margin-bottom: 8px;
    margin-left: 2px;
}

.wrapper-3NnKdC .scroller-1Bvpku > div.listItem-1hlISG:nth-child(1) .item-2hkk8m {
    opacity: 0 !important;
}

.wrapper-3NnKdC .scroller-1Bvpku > div:not(.listItem-1hlISG) > div {
    width: 50px;
    margin-left: 9px;
}

.listItem-1hlISG {
    width: auto;
    margin-left: 0px;
}

.listItem-1hlISG.da-listItem:hover .item-2hkk8m {
    border-radius: 18px;
    border: none;
    transition: none !important;
}

.scroller-2FKFPG > .listItem-1hlISG:first-child > .listItemWrapper-3X98Pc > .wrapper-25eVIn > svg {
    opacity: 0;
}

.expandedGuilds-1JMD4M .listItem-1hlISG .pill-31IEus {
    left: -5px;
    position: absolute;
    top: -2px;
}

.wrapper-3NnKdC
  .scroller-1Bvpku
  > div.listItem-1hlISG:nth-child(1)
  .item-2hkk8m {
  opacity: 0 !important;
}

.wrapper-3NnKdC .scroller-1Bvpku div .listItem-1hlISG .pill-1Z5PKm .item-2hkk8m {
	opacity: 0 !important;
}

.tutorialContainer-2sGCg9 .listItem-1hlISG .listItemWrapper-KhRmzM .wrapper-1BJsBx {
    background: var(--friends-icon) !important;
    background-position: var(--friends-icon-position) !important;
    background-repeat: no-repeat !important;
    background-size: var(--friends-icon-zoom) !important;
    border-radius: 100%;
}

.tutorialContainer-2sGCg9 .listItem-1hlISG .listItemWrapper-KhRmzM .wrapper-1BJsBx .childWrapper-anI2G9 {
	background-color: transparent;
}

.tutorialContainer-2sGCg9 .listItem-1hlISG .listItemWrapper-KhRmzM .wrapper-1BJsBx svg {
    opacity: 0;
}

.wrapper-3NnKdC .scroller-1Bvpku .guildSeparator-EOYZLM {
    position: relative;
    width: 100%;
    margin-top: 12px;
}

.theme-dark .guildSeparator-EOYZLM:after {
    background: var(--border-lines-color);
}

.guildSeparator-EOYZLM:after {
    height: 1px;
}

.guildSeparator-EOYZLM {
    background: hsla(0,0%,100%,.1);
    height: 0.5px;
}

.wrapper-3NnKdC .scroller-1Bvpku .guildSeparator-EOYZLM {
    position: relative;
    margin-top: 10px;
    width: 134px;
    display: block;
    margin: 10px auto 5px;
    margin-left: 24px;
}

