@import url("https://mwittrien.github.io/BetterDiscordAddons/Themes/SettingsModal/SettingsModal.css");

:root
{
	--mention-colour: 255, 33, 88;

	/* SettingsModal */
	--settingsmodalbackground:     transparent;            /* default:    transparent        (lowest bg color of changed windows, change it in case another theme turns them transparent)    */
    --settingsmodalwidth:         960px;                    /* default:    960px            (width of the settings modal, px/vw)                                                            */
    --settingsmodalheight:         80vh;                    /* default:    80vh            (height of the settings modal, px/vh)                                                           */

    --background-modifier-active: var(--background-tertiary) !important;
    --background-floating: var(--background-secondary) !important;
    --scrollbar-auto-thumb:var(--background-tertiary) !important;
    --scrollbar-auto-track: var(--background-primary) !important;
    --scrollbar-thin-thumb: var(--background-tertiary) !important;
    --activity-card-background: var(--background-secondary) !important;
    --background-modifier-selected: var(--background-tertiary) !important;
    --background-secondary-alt: var(--background-secondary) !important;
    --channeltextarea-background: var(--background-secondary) !important;
    --background-message-hover: var(--background-modifier-hover) !important;
    --custom-app-top-bar-height: 0 !important;
    --input-border: #00000000 !important;
    --guildbar-avatar-size: 48px !important;
    --text-tertiary: var(--extreme-text-color) !important;
}

/* light mode */
.theme-light
{
    --background-primary: #FFFFFF !important;
    --background-primary-translucent: #FFFFFFAA !important;
    --background-secondary: #F7E5E9 !important;
    --background-tertiary: #F9C7D1 !important;
    --extreme-text-color: #000000 !important;

    --background-modifier-hover: #F9EDEF !important;
    --channels-default: black !important;
    --interactive-muted: #777 !important;
}

/* set colours for dark mode */
.theme-dark
{
    --background-primary: #321E28 !important;
    --background-primary-translucent: #321E28AA !important;
    --background-secondary: #28141E !important;
    --background-tertiary: #230F19 !important;
    --extreme-text-color: #FFFFFF !important;

    --background-modifier-hover: #2D1923 !important;
}

/* hi-colour mentions */
.mentioned__5126c
{
    background-color: rgba(var(--mention-colour), 0.08) !important;
    border-bottom-right-radius: 15px;
    border-top-right-radius: 15px;
}

.mentioned__5126c:hover
{
    background-color: rgba(var(--mention-colour), 0.1) !important;
}

div[class*="mentioned"]::before 
{
    width: 4px;
    background-color: rgb(var(--mention-colour));
}

div[class*="replying"]::before 
{
    width: 4px;
}

/* remove stuff we keep clicking on on accident :( */
div.iconWrapper__9293f.clickable__9293f[aria-label="Help"],
div[id="user-context-invite-to-server"],
div[id="user-context-call"],
button[aria-label="Apps"],
button[aria-label="Send a gift"],
.bar_c38106,
.guildSeparator__252b6
{
    display: none !important;
}

/* make image attachments all the way square */
.visualMediaItemContainer_f4758a,
.oneByOneGridSingle_f4758a,
.imageWrapper_af017a
{
    border-radius: 0;
}

/* reorder top bar and make search bar small by default */
.searchBar__97492
{
    width: 200px !important;
    border-radius: 16px !important;
    background: var(--background-secondary) !important;
}

div[aria-label="Clear search"]
{
    margin-right: 4px !important;
}

.recentsIcon_c99c29
{
    order: -1
}

.children__9293f:after
{
    display: none;
}

/* role indicator background on user popout */
.role_dfa8b6
{
    border-radius: 12px;
}

/* server channel list backgrounds */
.link__2ea32
{
    border-radius: 25px;
}

/* red dot unread */
.unread__2ea32
{
    z-index: 1;
    position: absolute;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    top: 42%;
    left: -2px;
    margin-top: 0px;
    background-color: rgba(var(--mention-colour));
}

/* embed round on one side */
.embedFull__623de
{
    border-radius: 0px 15px 15px 0px !important;
    background: var(--background-secondary) !important;
    border: 1px solid var(--background-secondary) !important;
    border-left: 4px solid var(--background-tertiary) !important;
}

/* make message text box round */
.channelTextArea__74017,
.scrollableContainer__74017
{
    border-radius: 28px !important;
    background: var(--bg-overlay-3, var(--background-secondary));
    border: 0px;
}
/*
.messagesWrapper__36d07
{
    margin-bottom: 8px;
}

.channelTextArea_f75fb0
{
    margin-bottom: 8px;
}
/*
.typing_b88801
{
    margin-bottom: 56px;
}*/

.replyBar__841c8
{
    background: none;
}

.hasStackedBar__74017
{
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.stackedBars__74017
{
    background: var(--background-secondary) !important;
    border-top-left-radius: 26px !important;
    border-top-right-radius: 26px !important;
}

/* remove border and change colour members list */
.container_c8ffbb
{
    border: none !important;
    max-width: 240px;
}

.members_c8ffbb
{
    background: var(--background-secondary) !important;
}

/* i know what this does now! */
.member__5d473
{
    background: transparent !important;
    margin-left: 0px !important;
}

/* channel content bg color */
.chatContent_f75fb0
{
    background: var(--background-primary) !important;
}

/* channels list bg color */
.container__2637a,
.privateChannels__35e86,
.scroller__99e7c
{
    background: var(--background-secondary) !important;
    color: var(--extreme-text-color) !important;
}

/* get rid of stupid round bit and border */
.sidebarListRounded_c48ade
{
    border-radius: 0 !important;
}

.sidebarList_c48ade
{
    border: none !important;
}

.animatedContainer_f37cb1
{
    background: #00000000 !important;
}

/* top bar border removal and colour change */
.title_f75fb0,
.container__9293f,
.peopleColumn__133bf
{
    background: var(--background-primary) !important;
}

.chat_f75fb0[data-has-border=true],
.container__133bf
{
    border-top: none !important;
}

/* unfuck servers list */
.wrapper_ef3116
{
    background: var(--background-tertiary) !important;
}

.scrollerBottomSection_ef3116
{
    padding-top: 0 !important;
}

.lowerBadge_cc5dd2
{
    top: 32px;
    left: 32px;
}

.upperBadge_cc5dd2
{
    left: 32px;
}

.topSection_ef3116
{
    padding-bottom: 0 !important;
}

.tree_ef3116
{
    top: 8px !important;
}

svg.svg_cc5dd2
{
    top: 0px !important;
    left: 0px !important;
    border-radius: 24px !important;
}

svg.svg_cc5dd2 mask
{
    display: none !important;
}

svg.svg_cc5dd2 foreignObject
{
    width: 48px !important;
    height: 48px !important;
    x: -4px !important;
    y: -4px !important;
    position: relative !important;

}

.icon__6e9f8
{

    width: 48px !important;
    height: 48px !important;
}

.guildSeparator__252b6
{
    margin-top: 4px;
}

.listItem__650eb
{
    margin-top: 8px !important;
    right: 4px !important;
}

.pill_e5445c
{
    margin-top: 4px !important;
    left: 4px;
}

/* fix floating bar */
.panels_c48ade
{
    border: none !important;
    background: var(--background-primary-translucent) !important;
    backdrop-filter: blur(4px);
    border-radius: 28px !important;
}

.button__67645
{
    border-radius: 16px !important;
}

.sidebar_c48ade:after
{
    background: #00000000 !important;
}

.wrapper_ef3116
{
    margin-bottom: 0 !important;
}
