/**
 * @name Garo Theme
 * @author Garo | Astonish
 * @authorLink https://twitter.com/WyvernZu
 * @version 1.0
 * @description A mod of an existing theme.
 * @source https://github.com/AlexisJonsson/AlexisJonsson.github.io/tree/master/BetterDiscordAddons/Themes
 * @website https://alexisjonsson.com/
*/

@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
	/* amount of spacing and padding */
	--spacing: 12px;
	/* radius of round corners */
	--roundness: 16px;

	/* font, change to 'gg sans' for default discord font*/
	--font: 'figtree';

	/* color of green online dot, change to #23a55a for default green */
	--online-indicator: var(--accent-2);

	/* color of links */
	--accent-1: hsl(190, 80%, 60%);
	/* color of unread dividers and some indicators */
	--accent-2: hsl(190, 80%, 48%);
	/* color of accented buttons */
	--accent-3: hsl(190, 80%, 42%);
	/* color of accented buttons when hovered */
	--accent-4: hsl(190, 80%, 36%);
	/* color of accented buttons when clicked */
	--accent-5: hsl(190, 80%, 30%);

	/* color of mentions and messages that mention you */
	--mention: hsla(190, 80%, 52%, 0.1);
	/* color of mentions and messages that mention you when hovered */
	--mention-hover: hsla(190, 80%, 52%, 0.05);

	/* color of bright text on colored buttons */
	--text-1: hsl(220, 40%, 90%);
	/* color of headings and important text */
	--text-2: hsl(220, 25%, 70%);
	/* color of normal text */
	--text-3: hsl(220, 15%, 60%);
	/* color of icon buttons and channels */
	--text-4: hsl(220, 15%, 40%);
	/* color of muted channels/chats and timestamps */
	--text-5: hsl(220, 15%, 25%);

	/* color of dark buttons when clicked */
	--bg-1: hsl(220, 15%, 20%);
	/* color of dark buttons */
	--bg-2: hsl(220, 15%, 16%);
	/* color of spacing around panels and secondary elements */
	--bg-3: hsl(220, 15%, 13%);
	/* main background color */
	--bg-4: hsl(220, 15%, 10%);

	/* color of channels and icon buttons when hovered */
	--hover: hsla(230, 20%, 40%, 0.1);
	/* color of channels and icon buttons when clicked or selected */
	--active: hsla(220, 20%, 40%, 0.2);
	/* color of messages when hovered */
	--message-hover: hsla(220, 0%, 0%, 0.1);

	/* top left icon */
	--moon-icon: block; /* change to 'none' to hide moon icon */
	--discord-icon: none; /* change to 'block' to show default discord icon */
}

:root {
	--font-primary: var(--font), 'Noto Sans', 'Helvetica Neue', Helvetica, Arial,
		sans-serif;
	--font-display: var(--font), 'Noto Sans', 'Helvetica Neue', Helvetica, Arial,
		sans-serif;
}

/* modify colors */
#app-mount .container__590e2 /* channel list */,
.privateChannels__93473 /* dms list */,
#app-mount .container_ca50b9 /* user panel inner */,
.container_b2ce9c /* member list */,
.members__9f47b /* member list inner */,
.member_aa4760 /* member list members */,
.searchResultsWrap__9f374 /* search results */,
.searchHeader__19d87 /* search results header */,
.chat__52833.container_d3a736 /* message requests */,
#app-mount .panels__58331 > div /* user panel children */,
.container_d667ff /* vc panel */,
.sidebarRegionScroller__1fa7e /* settings left */,
.theme-dark .container__10dc7 /* browse channels container */,
.theme-dark .header__60bef /* browse channels header */,
.theme-dark .container__7590f /* browse channels inner */,
.chat__52833.background_cb0a80 /* server guide body */,
.theme-dark .scrollerContainer_bf5dbd /* channels and roles customize */,
.shop_b31ed2 /* shop */,
.wrapper_bd2abe.minimum_ebf000 /* private call */ {
	background: var(--bg-4);
}
.mainCard__8a660 /* forum post */ {
	background: var(--bg-3);
}
.folderIconWrapper__72239 /* closed folder */ {
	background: var(--bg-3) !important;
}
.theme-dark .outer_a41cf3.interactive__01cfa:hover, .theme-dark .outer_a41cf3.active__76f42 /* friend activity cards on hover */ {
	background: var(--bg-2);
}
#app-mount .searchAnswer_b452e7, /* search filter answer */
#app-mount .searchFilter__118cb /* search filter */ {
	background: var(--bg-1);
}
.container__871ba /* settings checkbuttons default */ {
	background: var(--bg-1) !important;
}
.chat__52833 /* chat + member list */,
.sidebar_ded4b5 /* channel sidebar */,
.privateChannels__93473 .scroller__4b984 /* dms list inner */,
.theme-dark .innerHeader_afca2f:after /* channels and roles header shadow */ {
	background: none;
}
.selected__0b1ad .header__104ca, .clickable__2d589 .header__104ca:hover /* server name hover */ {
	background: var(--message-hover);
}
.message__80c10.replying_d7b6ad.selected_fd9051, .mouse-mode.full-motion .replying_d7b6ad:hover /* fix reply message hover */ {
	background: var(--background-message-highlight-hover);
}
div.message__80c10.replying_d7b6ad::before /* change reply message bar to neutral */ {
	background: var(--text-2);
}
.activeButtonChild__6e162 {
	color: var(--accent-2);
}
.container_ca50b9 /* user panel button strikethroughs */,
.numberBadge__50328 /* unread number badge */,
.toolbar__88c63 /* toolbar button strikethroughs */ {
	--status-danger: var(--accent-2);
}
.expandedFolderIconWrapper__458cf > svg {
	color: var(--accent-2) !important;
}
.divider_b9338f /* unread divider */ {
	--status-danger: var(--accent-3);
}
.message__80c10.mentioned__58017:before /* mention message left edge */ {
	background: var(--accent-3);
}
.container__871ba.checked__6bdb0 /* settings checkbuttons */ {
	background: var(--accent-3) !important;
}
path[fill='rgba(35, 165, 90, 1)'] {
	fill: var(--accent-3);
}
.container_a308ae:last-child .icon__28d6c /* explore discoverable servers icon color */ {
	background-color: #3ba55c;
	filter: hue-rotate(56deg) saturate(1.43);
}
.container_a308ae:first-child .icon__28d6c {
	filter: hue-rotate(304deg) saturate(0.84) brightness(1.2);
}
.lookFilled__19298.colorBrand_b2253e .defaultColor__77578 /* vc choose an activity button */ {
	color: var(--white-500);
}

/* change online indicator color */
rect[fill='#23a55a'] {
	fill: var(--online-indicator) !important;
}
.status__1c26d[style='background-color: var(--green-360);'],
.status__1c26d[style='background-color: currentcolor;'] {
	background-color: var(--online-indicator) !important;
}

/* separate header bar */
.title_b7d661.themed_b152d4 /* remove bg */ {
	background: none;
}
.searchResultsWrap__9f374 /* allow overflow */ {
	overflow: visible;
}
.container__93316::before /* main chat */,
.membersWrap__90226::before /* member list */,
.searchResultsWrap__9f374::before /* search results */,
.profilePanel__12596::before /* dm profile */ {
	content: '';
	position: absolute;
	margin-top: -48px;
	background: var(--background-primary);
	width: 100%;
	height: 48px;
	border-radius: var(--roundness) var(--roundness) 0 0;
}
.wrapper_bd2abe.minimum_ebf000 ~ .content__1a4fe .container__93316::before /* remove when in private call */ {
	display: none;
}

/* rearrange toolbar */
a[href="https://support.discord.com"] /* hide help */
{
	display: none;
}
.search__07df0 {
	order: 1;
	margin: 0 4px 0 12px;
}
.chat__52833:has(.searchResultsWrap__9f374) .searchBar_e0c60b {
	width: 394px !important;
	margin-left: calc(var(--spacing) + 8px);
}
.chat__52833:has(.profilePanel__12596) .searchBar_e0c60b {
	width: 316px !important;
	margin-left: calc(var(--spacing) + 8px);
}
.chat__52833:has(.membersWrap__90226) .searchBar_e0c60b {
	width: 216px !important;
	margin-left: calc(var(--spacing) + 8px);
}

/* add spacing */
.base__3e6af /* outside edges */ {
	margin: 0 var(--spacing) var(--spacing) 0;
}
.sidebar_ded4b5 /* channel list and user panel */,
.content__1a4fe /* between chat and member list */ {
	gap: var(--spacing);
}
.sidebar_ded4b5 /* channel list and chat */ {
	margin-right: var(--spacing);
}
.sidebar_ded4b5.hidden__3ab58 {
	margin-right: 0;
}
.resizeHandle_f1a098 /* pretend to be a margin */ {
	width: var(--spacing);
}
.wrapper_bd2abe.fullScreen__5263c .callContainer_cbde45 /* fullscreen vc */ {
	margin-top: var(--spacing);
}
.notice__5fd4c /* banner notice */,
.wrapper_bd2abe.minimum_ebf000 /* private call */ {
	margin-bottom: var(--spacing);
}
/* fix padding */
#vc-spotify-player /* vencord spotify */,
.container_d667ff /* vc panel */,
.panel_bd8c76 /* stream panel */ {
	padding: 10px;
}

/* add rounded corners */
.container__590e2 /* channel list */,
.panels__58331 /* user panels */,
.privateChannels__93473 /* dms list */,
.container__5c7e7 /* friends page */,
.applicationStore_fc7d76 /* nitro page */,
#app-mount .container_d3a736 /* message requests */,
.shop_b31ed2 /* discord shop */,
.container_a87c5e /* family center */,
.container_def45c /* message request */,
#app-mount .callContainer_cbde45 /* vc */, 
.chat__52833 /* general chat container (for browse channels page */,
.animatedContainer__341f6 /* server image card */,
.notice__5fd4c /* banner notice */,
.wrapper_bd2abe.minimum_ebf000, /* private call */
.wrapper_bd2abe.minimum_ebf000 ~ .content__1a4fe /* chat under private call */ {
	border-radius: var(--roundness);
	overflow: hidden;
}
.container__93316 /* main chat */,
.chatContent__5dca8 /* main chat inner */,
.container_b2ce9c /* members list */,
.members__9f47b /* members list inner */,
.searchResultsWrap__9f374 /* search results */,
.profilePanel__12596 /* profile panel outer */,
.userPanelOuter__880e5 /* profile panel inner */,
.userPanelInner_eddf4c /* profile panel inner inner */,
.userPanelInner_eddf4c::before /* profile panel inner inner filter */ {
	border-radius: 0 0 var(--roundness) var(--roundness);
}

/* separate guilds panel background */
.guilds__2b93a {
	background: var(--bg-4);
	border-radius: var(--roundness);
	margin: 0 0 var(--spacing) var(--spacing);
}
.guilds__2b93a.hidden__7c832 {
	margin: 0;
}
#app-mount .scroller__3d071 {
	padding: 12px 0;
}
.base__3e6af {
	margin-left: var(--spacing);
}
.guilds__2b93a::after /* add bottom scroll shadow */,
.members__9f47b::after {
	content: '';
	position: absolute;
	background: linear-gradient(transparent, var(--bg-4));
	bottom: 0px;
	width: 100%;
	height: 15px;
	pointer-events: none;
}
.guilds__2b93a::before /* add top scroll shadow */ {
	content: '';
	position: absolute;
	background: linear-gradient(var(--bg-4), transparent);
	top: 0px;
	width: 100%;
	height: 15px;
	pointer-events: none;
	z-index: 2;
}
.childWrapper__01b9c {
	background: var(--bg-3);
}
.container__037ed > [style$='display: flex;'] > .guilds__2b93a {
	margin: 0;
}
.container__037ed > [style$='display: flex;'] {
	margin: 0 0 var(--spacing) var(--spacing);
}
/* UNCOMMENT IF YOU REMOVE THE ABOVE SECTION "separate guilds panel background" */
.expandedFolderBackground__1bec6 /* expanded folder bg */,
.folder__17546 /* folder circle when expanded */,
.folderIconWrapper__72239 /* folder circle inner */ {
	/* background-color: var(--bg-4) !important; */
}

/* extra top margin for macos and custom clients */
.container__037ed {
	margin-top: var(--spacing);
}
.platform-win .container__037ed {
	margin-top: 0;
}

/* top corner title */
[class^='wordmarkWindows'] > svg {
	display: none;
}
[class^='wordmarkWindows']::after {
	content: 'Midnight';
	display: block;
	position: relative;
	width: 200px;
	height: 16px;
	line-height: 16px;
	font-family: var(--font-headline);
	font-size: 10px;
	font-weight: 600;
	color: var(--text-5);
}

/* top bar height */
[class^='typeWindows'] {
	height: var(--spacing) + 8px;
}

/* window controls */
[class^='winButton'] > svg {
	display: none;
}
[class^='winButton'] {
	background: none !important;
	top: 0;
	width: 20px;
	height: 20px;
	margin: -2px 4px 0px 0px;
}
[class^='winButton']::after {
	content: '';
	height: 12px;
	width: 12px;
	border-radius: 12px;
}
[class^='winButton']:hover::after {
	filter: brightness(0.8);
}
[class^='winButton']:active::after {
	transform: scale(0.9);
}
[class^='winButtonClose']::after {
	background-color: hsl(350, 50%, 50%) !important;
}
[class^='winButtonMinMax']:nth-child(3)::after {
	background-color: hsl(150, 50%, 50%) !important;
}
[class^='winButtonMinMax']:nth-child(4)::after {
	background-color: hsl(50, 50%, 50%) !important;
}

/* add moon */
.childWrapper__01b9c > svg:not(.favoriteIcon__91c06) {
	display: var(--discord-icon);
}
.childWrapper__01b9c:has(> svg:not(.favoriteIcon__91c06))::before {
	content: '';
	display: var(--moon-icon);
	position: absolute;
	width: 65%;
	height: 65%;
	background: var(--text-4);
	-webkit-mask-image: url('https://upload.wikimedia.org/wikipedia/commons/c/c4/Font_Awesome_5_solid_moon.svg');
}
.wrapper_d281dd:hover .childWrapper__01b9c::before {
	transition: background-color 0.15s ease-out, transform 0.3s ease-out;
	transform: rotate(0deg) scale(1);
}
.wrapper_d281dd:hover > .childWrapper__01b9c::before,
.wrapper_d281dd.selected_f5ec8e > .childWrapper__01b9c::before {
	background: var(--text-1);
	transform: rotate(-360deg) scale(0.8);
}

/* improve unread divider */
.divider_b9338f {
	border-width: 4px;
	border-radius: 4px;
}
.divider_b9338f .content_d67847 {
	margin-top: -3px;
}
.endCap__95d53 {
	margin-top: -1px;
	padding-top: 2px;
}
/* improve highlight message left edge */
.message__80c10.mentioned__58017::before,
.replying_d7b6ad::before {
	width: 4px;
	border-radius: 4px;
}

/* make emoji selector same color */
.emojiButtonNormal__73cd3 .sprite__294b3 {
	filter: grayscale(100%) brightness(40%) sepia(0.9) hue-rotate(180deg) !important;
}
/* filter login image */
.artwork__8fc92 {
	filter: saturate(0.3) hue-rotate(-15deg) brightness(0.4);
}

/* horizontal server list fix */
#app-mount .app_b1f720 .base__3e6af {
	top: calc(var(--server-container) + var(--spacing)) !important;
}

.theme-dark {
	--activity-card-background: var(--primary-700);
	--android-navigation-bar-background: var(--primary-830);
	--android-navigation-scrim-background: hsl(var(--primary-830-hsl) / 0.5);
	--android-ripple: hsl(var(--white-500-hsl) / 0.07);
	--background-accent: var(--bg-2);
	--background-floating: var(--bg-3);
	--background-mentioned: var(--mention);
	--background-mentioned-hover: var(--mention-hover);
	--background-message-automod: hsl(var(--red-400-hsl) / 0.05);
	--background-message-automod-hover: hsl(var(--red-400-hsl) / 0.1);
	--background-message-highlight: var(--active);
	--background-message-highlight-hover: var(--hover);
	--background-message-hover: var(--message-hover);
	--background-mobile-primary: var(--bg-4);
	--background-mobile-secondary: var(--primary-630);
	--background-modifier-accent: var(--hover);
	--background-modifier-accent-2: red;
	--background-modifier-active: var(--active);
	--background-modifier-hover: var(--hover);
	--background-modifier-selected: var(--active);
	--background-nested-floating: var(--primary-630);
	--background-primary: var(--bg-4);
	--background-secondary: var(--bg-3);
	--background-secondary-alt: var(--bg-3);
	--background-tertiary: var(--bg-3);
	--bg-backdrop: hsl(var(--black-500-hsl) / 0.7);
	--bg-backdrop-no-opacity: var(--black-500);
	--bg-base-primary: var(--primary-600);
	--bg-base-secondary: var(--primary-630);
	--bg-base-tertiary: var(--primary-660);
	--bg-mod-faint: hsl(var(--primary-500-hsl) / 0.3);
	--bg-mod-strong: hsl(var(--primary-500-hsl) / 0.54);
	--bg-mod-subtle: hsl(var(--primary-500-hsl) / 0.48);
	--bg-surface-overlay: var(--primary-800);
	--bg-surface-overlay-tmp: var(--primary-800);
	--bg-surface-raised: var(--primary-600);
	--black: var(--black-500);
	--blur-fallback: hsl(var(--primary-700-hsl) / 0.96);
	--blur-fallback-pressed: hsl(var(--primary-730-hsl) / 0.96);
	--border-faint: hsl(var(--white-500-hsl) / 0.03);
	--border-strong: hsl(var(--white-500-hsl) / 0.16);
	--border-subtle: hsl(var(--white-500-hsl) / 0.08);
	--bug-reporter-modal-submitting-background: hsl(
		var(--primary-800-hsl) / 0.6
	);
	--button-creator-revenue-background: var(--teal-430);
	--button-danger-background: var(--red-430);
	--button-danger-background-active: var(--red-530);
	--button-danger-background-disabled: var(--red-430);
	--button-danger-background-hover: var(--red-500);
	--button-outline-brand-background: hsl(var(--white-500-hsl) / 0);
	--button-outline-brand-background-active: var(--brand-560);
	--button-outline-brand-background-hover: var(--brand-500);
	--button-outline-brand-border: var(--brand-500);
	--button-outline-brand-border-active: var(--brand-560);
	--button-outline-brand-border-hover: var(--brand-500);
	--button-outline-brand-text: var(--white-500);
	--button-outline-brand-text-active: var(--white-500);
	--button-outline-brand-text-hover: var(--white-500);
	--button-outline-danger-background: hsl(var(--white-500-hsl) / 0);
	--button-outline-danger-background-active: var(--red-460);
	--button-outline-danger-background-hover: var(--red-430);
	--button-outline-danger-border: var(--red-400);
	--button-outline-danger-border-active: var(--red-430);
	--button-outline-danger-border-hover: var(--red-430);
	--button-outline-danger-text: var(--white-500);
	--button-outline-danger-text-active: var(--white-500);
	--button-outline-danger-text-hover: var(--white-500);
	--button-outline-positive-background: hsl(var(--white-500-hsl) / 0);
	--button-outline-positive-background-active: var(--green-530);
	--button-outline-positive-background-hover: var(--green-430);
	--button-outline-positive-border: var(--green-360);
	--button-outline-positive-border-active: var(--green-530);
	--button-outline-positive-border-hover: var(--green-430);
	--button-outline-positive-text: var(--white-500);
	--button-outline-positive-text-active: var(--white-500);
	--button-outline-positive-text-hover: var(--white-500);
	--button-outline-primary-background: hsl(var(--white-500-hsl) / 0);
	--button-outline-primary-background-active: var(--primary-430);
	--button-outline-primary-background-hover: var(--primary-500);
	--button-outline-primary-border: var(--primary-500);
	--button-outline-primary-border-active: var(--primary-430);
	--button-outline-primary-border-hover: var(--primary-500);
	--button-outline-primary-text: var(--white-500);
	--button-outline-primary-text-active: var(--white-500);
	--button-outline-primary-text-hover: var(--white-500);
	--button-positive-background: var(--green-430);
	--button-positive-background-active: var(--green-530);
	--button-positive-background-disabled: var(--green-430);
	--button-positive-background-hover: var(--green-500);
	--button-secondary-background: var(--bg-2);
	--button-secondary-background-active: var(--text-5);
	--button-secondary-background-disabled: var(--bg-2);
	--button-secondary-background-hover: var(--bg-1);
	--card-gradient-bg: hsl(var(--black-500-hsl) / 0.4);
	--card-gradient-pressed-bg: hsl(var(--black-500-hsl) / 0.5);
	--card-primary-bg: var(--primary-560);
	--card-primary-pressed-bg: var(--primary-645);
	--card-secondary-bg: var(--primary-560);
	--card-secondary-pressed-bg: var(--primary-645);
	--channel-icon: var(--text-4);
	--channel-text-area-placeholder: var(--text-5);
	--channels-default: var(--text-4);
	--channeltextarea-background: var(--bg-3);
	--chat-background: var(--primary-600);
	--chat-border: var(--primary-700);
	--chat-input-container-background: var(--primary-600);
	--chat-swipe-to-reply-background: var(--primary-660);
	--control-brand-foreground: var(--accent-2);
	--control-brand-foreground-new: var(--brand-360);
	--creator-revenue-icon-gradient-end: var(--teal-430);
	--creator-revenue-icon-gradient-start: var(--teal-360);
	--creator-revenue-info-box-background: hsl(var(--teal-430-hsl) / 0.1);
	--creator-revenue-info-box-border: var(--teal-400);
	--creator-revenue-locked-channel-icon: var(--teal-345);
	--creator-revenue-progress-bar: var(--teal-400);
	--deprecated-card-bg: hsl(var(--primary-700-hsl) / 0.6);
	--deprecated-card-editable-bg: hsl(var(--primary-700-hsl) / 0.3);
	--deprecated-quickswitcher-input-background: var(--primary-400);
	--deprecated-quickswitcher-input-placeholder: hsl(
		var(--white-500-hsl) / 0.3
	);
	--deprecated-store-bg: var(--primary-600);
	--deprecated-text-input-bg: var(--bg-3);
	--deprecated-text-input-border: hsl(var(--black-500-hsl) / 0.3);
	--deprecated-text-input-border-disabled: var(--primary-700);
	--deprecated-text-input-border-hover: var(--primary-900);
	--deprecated-text-input-prefix: var(--primary-200);
	--display-banner-overflow-background: hsl(var(--primary-700-hsl) / 0.5);
	--divider-strong: hsl(var(--white-500-hsl) / 0.16);
	--divider-subtle: hsl(var(--white-500-hsl) / 0.08);
	--focus-primary: var(--blue-345);
	--forum-post-extra-media-count-container-background: hsl(
		var(--primary-660-hsl) / 0.8
	);
	--forum-post-tag-background: hsl(var(--primary-660-hsl) / 0.9);
	--guild-notifications-bottom-sheet-pill-background: var(--primary-700);
	--header-muted: red;
	--header-primary: var(--text-2);
	--header-secondary: var(--text-4);
	--home-background: var(--bg-4);
	--home-card-resting-border: hsl(var(--transparent-hsl) / 0);
	--icon-muted: var(--primary-400);
	--icon-primary: var(--primary-130);
	--icon-secondary: var(--primary-330);
	--info-box-background: hsl(var(--blue-345-hsl) / 0.1);
	--info-danger-background: hsl(var(--red-400-hsl) / 0.1);
	--info-danger-foreground: var(--red-400);
	--info-danger-text: var(--white-500);
	--info-help-background: hsl(var(--blue-345-hsl) / 0.1);
	--info-help-foreground: var(--blue-345);
	--info-help-text: var(--white-500);
	--info-positive-background: hsl(var(--green-360-hsl) / 0.1);
	--info-positive-foreground: var(--green-360);
	--info-positive-text: var(--white-500);
	--info-warning-background: hsl(var(--yellow-300-hsl) / 0.1);
	--info-warning-foreground: var(--yellow-300);
	--info-warning-text: var(--white-500);
	--input-background: var(--bg-3);
	--input-placeholder-text: var(--text-5);
	--interactive-active: var(--text-3);
	--interactive-hover: var(--text-3);
	--interactive-muted: var(--text-5);
	--interactive-normal: var(--text-4);
	--legacy-android-blur-overlay-default: hsl(var(--primary-660-hsl) / 0.5);
	--legacy-android-blur-overlay-ultra-thin: hsl(var(--black-500-hsl) / 0.025);
	--legacy-blur-fallback-default: hsl(var(--primary-660-hsl) / 0.975);
	--legacy-blur-fallback-ultra-thin: hsl(var(--black-500-hsl) / 0.95);
	--live-stage-tile-border: hsl(var(--primary-500-hsl) / 0.6);
	--logo-primary: var(--white-500);
	--mention-background: var(--mention);
	--mention-foreground: var(--accent-1);
	--modal-background: var(--bg-4);
	--modal-footer-background: var(--bg-4);
	--navigator-header-tint: var(--white-500);
	--polls-image-normal-border: hsl(var(--black-430-hsl) / 0.9);
	--polls-victor-border: var(--yellow-300);
	--polls-victor-fill: var(--yellow-200);
	--polls-victor-label: var(--primary-600);
	--polls-voted-border: var(--green-330);
	--polls-voted-fill: var(--green-160);
	--polls-voted-label: var(--primary-600);
	--profile-gradient-card-background: hsl(var(--black-500-hsl) / 0.7);
	--profile-gradient-message-input-border: hsl(var(--primary-500-hsl) / 0.48);
	--profile-gradient-note-background: hsl(var(--black-500-hsl) / 0.3);
	--profile-gradient-overlay: hsl(var(--black-500-hsl) / 0.6);
	--profile-gradient-overlay-synced-with-user-theme: hsl(
		var(--black-500-hsl) / 0.8
	);
	--profile-gradient-profile-body-background-hover: hsl(
		var(--white-500-hsl) / 0.16
	);
	--profile-gradient-role-pill-background: hsl(var(--primary-660-hsl) / 0.5);
	--profile-gradient-role-pill-border: hsl(var(--white-500-hsl) / 0.2);
	--profile-gradient-section-box: hsl(var(--black-500-hsl) / 0.45);
	--redesign-activity-card-background: var(--primary-560);
	--redesign-activity-card-background-pressed: var(--primary-630);
	--redesign-activity-card-badge-icon: var(--primary-360);
	--redesign-activity-card-border: hsl(var(--white-500-hsl) / 0.02);
	--redesign-activity-card-overflow-background: var(--primary-630);
	--redesign-button-danger-background: var(--red-430);
	--redesign-button-danger-pressed-background: var(--red-460);
	--redesign-button-danger-text: var(--white-500);
	--redesign-button-overlay-alpha-background: hsl(
		var(--black-500-hsl) / 0.54
	);
	--redesign-button-overlay-alpha-pressed-background: hsl(
		var(--black-500-hsl) / 0.64
	);
	--redesign-button-overlay-alpha-text: var(--white-500);
	--redesign-button-overlay-background: var(--white-500);
	--redesign-button-overlay-pressed-background: var(--primary-230);
	--redesign-button-overlay-text: var(--primary-860);
	--redesign-button-positive-background: var(--green-430);
	--redesign-button-positive-pressed-background: var(--green-460);
	--redesign-button-positive-text: var(--white-500);
	--redesign-button-primary-alt-background: hsl(var(--brand-500-hsl) / 0);
	--redesign-button-primary-alt-border: var(--brand-360);
	--redesign-button-primary-alt-on-blurple-background: hsl(
		var(--brand-530-hsl) / 0
	);
	--redesign-button-primary-alt-on-blurple-border: var(--white-500);
	--redesign-button-primary-alt-on-blurple-pressed-background: var(
		--brand-530
	);
	--redesign-button-primary-alt-on-blurple-pressed-border: var(--brand-360);
	--redesign-button-primary-alt-on-blurple-text: var(--white-500);
	--redesign-button-primary-alt-pressed-background: hsl(
		var(--brand-700-hsl) / 0.16
	);
	--redesign-button-primary-alt-pressed-border: hsl(
		var(--brand-400-hsl) / 0.5
	);
	--redesign-button-primary-alt-pressed-text: var(--brand-360);
	--redesign-button-primary-alt-text: var(--brand-360);
	--redesign-button-primary-background: var(--brand-500);
	--redesign-button-primary-on-blurple-background: var(--white-500);
	--redesign-button-primary-on-blurple-pressed-background: var(--brand-200);
	--redesign-button-primary-on-blurple-pressed-text: var(--brand-530);
	--redesign-button-primary-on-blurple-text: var(--brand-500);
	--redesign-button-primary-pressed-background: var(--brand-560);
	--redesign-button-primary-text: var(--white-500);
	--redesign-button-secondary-alt-background: var(--primary-660);
	--redesign-button-secondary-alt-pressed-background: var(--primary-560);
	--redesign-button-secondary-alt-pressed-text: var(--primary-330);
	--redesign-button-secondary-alt-text: var(--primary-230);
	--redesign-button-secondary-background: var(--primary-460);
	--redesign-button-secondary-border: hsl(var(--white-500-hsl) / 0.08);
	--redesign-button-secondary-pressed-background: var(--primary-500);
	--redesign-button-secondary-pressed-border: hsl(var(--transparent-hsl) / 0);
	--redesign-button-secondary-text: var(--primary-230);
	--redesign-channel-category-name-text: var(--primary-330);
	--redesign-channel-message-preview-text: var(--primary-360);
	--redesign-channel-name-muted-text: var(--primary-360);
	--redesign-channel-name-text: var(--primary-130);
	--redesign-chat-input-background: var(--primary-700);
	--redesign-input-control-active-bg: var(--primary-645);
	--redesign-input-control-selected: var(--brand-500);
	--redesign-only-background-active: var(--primary-530);
	--redesign-only-background-default: var(--primary-600);
	--redesign-only-background-overlay: var(--primary-645);
	--redesign-only-background-raised: var(--primary-630);
	--redesign-only-background-sunken: var(--primary-660);
	--scrollbar-auto-scrollbar-color-thumb: var(--primary-730);
	--scrollbar-auto-scrollbar-color-track: var(--primary-630);
	--scrollbar-auto-thumb: var(--bg-3);
	--scrollbar-auto-track: transparent;
	--scrollbar-thin-thumb: var(--bg-3);
	--scrollbar-thin-track: transparent;
	--spoiler-hidden-background: var(--primary-700);
	--spoiler-revealed-background: var(--primary-660);
	--status-danger: var(--red-400);
	--status-danger-background: var(--red-400);
	--status-danger-text: var(--white-500);
	--status-dnd: var(--red-400);
	--status-idle: var(--yellow-300);
	--status-offline: var(--primary-360);
	--status-online: var(--green-360);
	--status-positive: var(--green-360);
	--status-positive-background: var(--green-430);
	--status-positive-text: var(--white-500);
	--status-speaking: var(--green-360);
	--status-warning: var(--yellow-300);
	--status-warning-background: var(--yellow-300);
	--status-warning-text: var(--black-500);
	--text-brand: var(--accent-1);
	--text-danger: var(--red-345);
	--text-link: var(--accent-1);
	--text-link-low-saturation: var(--blue-330);
	--text-low-contrast: var(--primary-360);
	--text-message-preview-low-sat: var(--primary-360);
	--text-muted: var(--text-5);
	--text-muted-on-default: red;
	--text-normal: var(--text-3);
	--text-positive: var(--green-330);
	--text-primary: var(--primary-230);
	--text-secondary: red;
	--text-warning: var(--yellow-300);
	--textbox-markdown-syntax: var(--primary-360);
	--theme-locked-blur-fallback: hsl(var(--primary-700-hsl) / 0.96);
	--user-profile-header-overflow-background: hsl(
		var(--primary-700-hsl) / 0.5
	);
	--voice-video-tile-blur-fallback: hsl(var(--primary-700-hsl) / 0.48);
	--voice-video-video-tile-blur-fallback: hsl(var(--primary-700-hsl) / 0.48);
	--white: var(--white-500);

	--profile-gradient-primary-color: var(--bg-4);
	--profile-gradient-secondary-color: var(--bg-4);

	--elevation-low: none;
	--search-popout-option-fade: none;
	--search-popout-option-fade-hover: none;

	--brand-430: var(--accent-3);
	--brand-500: var(--accent-3);
	--brand-560: var(--accent-4);
	--brand-600: var(--accent-5);

	--green-330: var(--accent-1);
	--green-360: var(--accent-3);
	--green-430: var(--accent-4);
	--green-500: var(--accent-4);
	--green-530: var(--accent-5);

	--brand-experiment-15a: var(
		--mention
	); /* background of reacted reactions */

	--primary-500: var(--bg-2); /* progress bars */
	--primary-600: var(--bg-3); /* delete message preview */
	--primary-630: var(--bg-3); /* billing transaction history */
	--primary-660: var(--bg-3); /* search popout "enter" bar */
}

/* change colors and variables here */
:root {
	/* font */
	--font-primary: 'figtree'; /* change to 'gg sans' for default discord font */
	--font-display: 'figtree'; /* change to 'gg sans' for default discord font */

	/* amount of spacing and padding */
	--spacing: 10px;
	/* radius of round corners */
	--roundness: 6px;

	/* color of links */
	--accent-1: #A7C080;
	/* color of unread dividers and some indicators */
	--accent-2: #A7C080;
	/* color of accented buttons */
	--accent-3: hsl(190, 80%, 42%);
	/* color of accented buttons when hovered */
	--accent-4: hsl(190, 80%, 36%);
	/* color of accented buttons when clicked */
	--accent-5: hsl(190, 80%, 30%);

	/* color of green online dot, change to #23a55a for default green */
	--online-indicator: var(--accent-2);

	/* color of mentions and messages that mention you */
	--mention: #cbd1c524;
	/* color of mentions and messages that mention you when hovered */
	--mention-hover: #d3c6aa45;

	/* color of bright text on colored buttons */
	--text-1: hsl(220, 40%, 90%);
	/* color of headings and important text */
	--text-2: #A7C080;
	/* color of normal text */
	--text-3: #c1c7c3;
	/* color of icon buttons and channels */
	--text-4: #9DA9A0;
	/* color of muted channels/chats and timestamps */
	--text-5: #859289;

	/* color of dark buttons when clicked */
	--bg-1: hsl(220, 15%, 20%);
	/* color of dark buttons */
	--bg-2: hsl(220, 15%, 16%);
	/* color of spacing around panels and secondary elements, so the borders*/
	--bg-3: #232A2E;
	/* main background color of the interior panels*/
	--bg-4: #2D353B;

	/* color of channels and icon buttons when hovered */
	--hover: hsla(90, 36%, 66%, 0.323);
	/* color of channels and icon buttons when clicked or selected */
	--active: hsla(220, 20%, 40%, 0.2);
	/* color of messages when hovered */
	--message-hover: #343F44;

	/* top left icon */
	--moon-icon: block; /* change to 'none' to hide moon icon */
	--discord-icon: none; /* change to 'block' to show default discord icon */
}
