/**
 * @name Minimal Nord Discord
 * @description A Dicord theme based on the Nord colorscheme
 * @author TheAvidDev
 * @version 1.0
 *
 * @source https://raw.githubusercontent.com/TheAvidDev/dotfiles/master/Lightcord_BD/themes/DiscordNord.theme.css
 * @website https://theavid.dev/
**/

:root {
    --background-primary: #2e3440;
    --channeltextarea-background: #3b4252;
    --background-secondary: #3b4252;
    --background-secondary-alt: #2e3440;
    --background-tertiary: #2e3440;
    
    --border-radius: 15px;
}

.da-video, .da-peopleColumn, .da-tabBody {
    background-color: var(--background-primary);
}

.da-wrapper.da-video, .da-sidebar, .da-members, .da-nowPlayingColumn {
    border-radius: var(--border-radius);
}

.da-panels {
    background-color: var(--background-secondary);
}

/*
 * Change selected channel name and icons
 */
.da-selected > .da-wrapper > .da-content > .da-mainContent > .da-name,
.da-selected > .da-wrapper > .da-content > .da-children > .da-iconItem > .da-actionIcon {
    color: var(--background-primary);
}

.da-selected > .da-wrapper > .da-content {
    background-color: #88c0d0;
}

/* Remove margin for typing indicator */
.da-channelTextArea {
    margin-bottom: 0;
}

/* Channel name */
.da-name {
    color: #d8dee9;
}

/* Add a small line at the top of chat */
.da-chatContent {
  border-top: 1px solid var(--background-secondary);
}

#bd-pub-li, /* BetterDiscord public vutton */
#private-channels-1, /* Nitro button */
.da-toolbar > .da-anchor, /* Help button */
.da-typing, /* Removing typing indicator */
.da-content:before { /* Tiny black line in header */
    display: none;
}


/* Change divider and pill */
.da-divider {
    border-color: #bf616a;
}

.da-divider > span.da-content {
    color: #bf616a;
}

.da-unreadPill {
    background-color: #bf616a;
}

.da-unreadPillCapStroke {
    color: #bf616a;
    fill: #bf616a;
}

/**
 * Change server folder icon colors
 */
#app-mount > .da-app > div > .da-layers > div > div > nav > .da-scroller > div:nth-child(3) > div:nth-child(1) > .da-listItem > div:nth-child(2) > div > svg > foreignObject > div > div > div > svg {
    color: #bf616a!important;
}

#app-mount > .da-app > div > .da-layers > div > div > nav > .da-scroller > div:nth-child(3) > div:nth-child(2) > .da-listItem > div:nth-child(2) > div > svg > foreignObject > div > div > div > svg {
    color: #d08770!important;
}

#app-mount > .da-app > div > .da-layers > div > div > nav > .da-scroller > div:nth-child(3) > div:nth-child(3) > .da-listItem > div:nth-child(2) > div > svg > foreignObject > div > div > div > svg {
    color: #ebcb8b!important;
}

#app-mount > .da-app > div > .da-layers > div > div > nav > .da-scroller > div:nth-child(3) > div:nth-child(4) > .da-listItem > div:nth-child(2) > div > svg > foreignObject > div > div > div > svg {
    color: #a3be8c!important;
}

#app-mount > .da-app > div > .da-layers > div > div > nav > .da-scroller > div:nth-child(3) > div:nth-child(5) > .da-listItem > div:nth-child(2) > div > svg > foreignObject > div > div > div > svg {
    color: #b48ead!important;
}

#app-mount > .da-app > div > .da-layers > div > div > nav > .da-scroller > div:nth-child(3) > div:nth-child(6) > .da-listItem > div:nth-child(2) > div > svg > foreignObject > div > div > div > svg {
    color: #88c0d0!important;
}
