/**
 * @name UI Refresh Refresh
 * @author programmer2514
 * @description Enjoy Discord's UI refresh without the visual inconsistencies.
 * @version 1.6.0
 */

:root {
    --uirr-forum-panel-width: 450px;
}

#app-mount {
    border: 1px solid var(--border-subtle);
    width: calc(100% - 2px) !important;
    height: calc(100% - 2px) !important;
}

*[class] {
    --app-border-frame: var(--border-subtle);
    --border-muted: var(--border-subtle);
}

.visual-refresh {
    --custom-guild-list-padding: min(var(--space-sm));
}

._5e434347c823b592-sidebarListRounded,
._5e434347c823b592-sidebar,
._5e434347c823b592-page {
    border-radius: 0 !important;
    border-left: none !important;
}

._5e434347c823b592-guilds {
    border-top: 1px solid var(--border-subtle);
    border-right: 1px solid var(--border-subtle);
}

.ef3116c2da186559-tree {
    padding-top: var(--space-xs) !important;
}

.platform-win .c38106a3f0c3ca76-title,
.platform-linux .c38106a3f0c3ca76-title {
    justify-content: start;
    margin-left: var(--space-xs);
}

.edbb22df99c39831-title div:last-child::before {
    content: "Discord - ";
}

.c38106a3f0c3ca76-bar {
    width: 100%;
}

.c38106a3f0c3ca76-winButtons {
    gap: 0;
}

.c38106a3f0c3ca76-winButtons::before {
    padding-right: var(--space-xxs);
}

.c38106a3f0c3ca76-winButton {
    padding: 0 var(--space-xs);
}

.c38106a3f0c3ca76-trailing {
    gap: var(--space-xs);
}

.c99c29809d200a61-clickable {
    transform: scale(0.9);
}


._9293f6b2fc12398a-clickable,
.c99c29809d200a61-clickable {
    transition: background-color 0.2s;
    border-radius: 8px;
}

.c99c29809d200a61-clickable {
    --custom-horizontal-padding: 2px;
    transition: background-color 0.2s;
    border-radius: 8px;
    margin: 0px;
    padding-top: calc(var(--space-xxs) + var(--custom-horizontal-padding));
    padding-bottom: calc(var(--space-xxs) + var(--custom-horizontal-padding));
    width: var(--space-32);
    justify-content: center;
}

.c99c29809d200a61-clickable > * {
    height: var(--space-32);
}

._37e49614b9f110a9-buttons {
    gap: var(--space-xxs);
}

._9293f6b2fc12398a-clickable:hover,
.c99c29809d200a61-clickable:hover {
    background-color: var(--interactive-background-selected) !important;
}

._9293f6b2fc12398a-clickable:hover > *,
.c99c29809d200a61-clickable:hover > * {
    opacity: 1;
    animation: buttonWiggle 800ms linear 0s 1 normal none;
    color: var(--interactive-active) !important;
}

._9293f6b2fc12398a-clickable:active > *,
.c99c29809d200a61-clickable:active > * {
    animation: buttonJump 400ms linear 0s 1 normal none;
}

._740174f3d6a2c8fe-scrollableContainer {
    background: var(--bg-overlay-floating, var(--background-base-low));
}

.c322aadb96ff59c9-searchBar {
    background: var(--bg-overlay-floating, var(--background-base-low));
    border: 1px solid var(--border-subtle);
}

._44df51b030bd5ece-wrapper {
    margin-bottom: var(--space-xs);
}

._01ae244280823725-chatLayerWrapper {
    position: absolute;
    z-index: 100;
}

.f75fb00fb7356cbe-threadSidebarOpen ~ ._01ae244280823725-chatLayerWrapper {
    top: var(--custom-channel-header-height) !important;
    height: calc(100% - var(--custom-channel-header-height)) !important;
}

._01ae244280823725-chatLayerWrapper > * {
    border-radius: 0;
    width: var(--uirr-forum-panel-width) !important;
    transition: width var(--cui-transition-speed);
    border: 1px solid var(--border-subtle);
}

._01ae244280823725-floating {
    filter: none;
}

._01ae244280823725-resizeHandle {
    display: none;
}

div:not([class])[style^="min-width"] {
    display: none;
}

section._9293f6b2fc12398a-container {
    padding-left: var(--space-sm) !important;
}

section._9293f6b2fc12398a-container:has(._754bde0f294a39cb-hoverableContainer) {
    padding-left: var(--space-xxs) !important;
}

.f37cb1984c371ee5-header {
    padding: var(--space-sm);
}

.c0bea05627c5dc35-outer:not(.custom-theme-background) {
    background-color: var(--background-base-lower) !important;
}

.c0bea05627c5dc35-outer:not(.custom-theme-background) .c0bea05627c5dc35-overlay {
    background-color: var(--background-base-low) !important;
    border: 1px solid var(--border-subtle) !important;
}

.fc561d3c125f6a2f-container,
.ab66419eae73260f-header,
._35a7ecf3aba351b2-channelHeader,
.d404a36e7b59cdcf-container,
.e8b59c4b335dd2fc-messagesPopout {
    background-color: var(--background-base-low) !important;
}

.e8b59c4b335dd2fc-header {
    border-bottom: none;
}

.ab66419eae73260f-tabBar {
    padding-left: var(--space-sm);
}

._1ccd1ba5cb2270c2-messages {
    background-color: var(--background-base-lower) !important;
    padding: 0 var(--space-lg) var(--space-sm) var(--space-xs);
}

._957962c2bd49881b-messageContainer {
    background-color: var(--background-base-lower) !important;
    padding: var(--space-md) var(--space-xl) var(--space-lg) var(--space-xxs);
}

._1ccd1ba5cb2270c2-showAllButtonContainer {
    margin-top: var(--space-xs);
}

.fc561d3c125f6a2f-container {
    transform: translateY(-4px);
    border: 1px solid var(--border-subtle);
    box-shadow: none;
}

._1405b3b8e8eb5fd0-wrapper,
._1405b3b8e8eb5fd0-wrapper > * {
    flex-wrap: wrap;
    justify-content: center;
}

div:has(> ._1405b3b8e8eb5fd0-wrapper) {
    flex-shrink: 0 !important;
    max-width: 100%;
}

.e9e3ed8b8badfe05-content,
.e9e3ed8b8badfe05-contentHeader {
    background-color: var(--background-base-lowest);
}

.aa8da23faa27393c-top {
    gap: var(--space-xl);
    max-width: 100%;;
}

.aa8da23faa27393c-top > .aa8da23faa27393c-item {
    margin: 0 !important;
    padding: 0 var(--space-xxs) var(--space-sm) !important;
}

._88a69141dd70013a-item {
    border: 1px solid var(--input-border);
    background: var(--input-background);
}

.bd-addon-store-modal {
    max-height: 90vh !important;
    overflow: hidden !important;
}

.bf-visible,
.bf-hover:hover {
    overflow: visible !important;
}

.bf-toolbar {
    right: -4px;
}

.bf-toolbar::before {
    background: var(--background-base-low) !important;
    border-radius: var(--radius-sm) !important;
    border: 1px solid var(--border-subtle);
    height: calc(100% - 16px) !important;
}

.bf-toolbar .format {
    padding: 0px !important;
    width: var(--space-32) !important;
    height: var(--space-32) !important;
    max-height: var(--space-32) !important;
    margin-right: var(--space-xxs) !important;
    margin-top: -2px;
    justify-content: center;
}

.bf-toolbar .format:hover {
    background-color: var(--interactive-background-selected);
    transition: background-color 0.2s;
    border-radius: 8px;
}

.bf-arrow {
    bottom: -1px !important;
}

.theme-light .bf-toolbar .format > *,
.theme-light .bf-toolbar .bf-arrow {
    filter: invert(1);
}

.bf-toolbar .format > * {
    width: 22px !important;
    height: auto !important;
}

.bf-toolbar .format:hover > * {
    opacity: 1;
    animation: buttonWiggle 800ms linear 0s 1 normal none;
}

.bf-toolbar .format:active > * {
    animation: buttonJump 400ms linear 0s 1 normal none;
}

main > section._9293f6b2fc12398a-container,
:not(.cb9592ad77576717-headerWrapper) > .f75fb00fb7356cbe-subtitleContainer,
.user-profile-sidebar .c0bea05627c5dc35-inner,
.f75fb00fb7356cbe-content,
._133bf5eea8e33a34-tabBody {
    border-left: 1px solid var(--border-subtle);
}

.cb9592ad77576717-callContainer {
    border-left: 1px solid var(--border-subtle);
    border-top: none !important;
}

.f1ceaca61b18918e-colorable.f1ceaca61b18918e-disconnect {
    border: 1px solid var(--status-danger);
}

.f1ceaca61b18918e-colorable.f1ceaca61b18918e-disconnect:hover {
    border: 1px solid var(--red-460);
}

.cb9592ad77576717-noChat:has(> .cb9592ad77576717-callContainer) {
    border-top: 1px solid var(--border-subtle);
}

._409aa1aeee28d5f7-sidebar {
    border-right: 1px solid var(--border-subtle);
}

._1fed1dd06c7aabf7-accountProfileCard {
    border: 1px solid var(--border-subtle);
}

@media (min-width: 1216px) {
    .f75fb00fb7356cbe-threadSidebarOpen .f75fb00fb7356cbe-content > * {
        flex-shrink: 100;
    }

    .f75fb00fb7356cbe-threadSidebarOpen .f75fb00fb7356cbe-content::after {
        content: "";
        display: block;
        width: 450px;
        height: 100%;
    }
}

@keyframes buttonWiggle {
  0%,
  100% {
	transform: rotate(0deg);
	transform-origin: 50% 100%;
  }

  20%,
  40% {
	transform: rotate(3deg);
  }

  60%,
  80% {
	transform: rotate(-3deg);
  }
}

@keyframes buttonJump {
  0%,
  100% {
	transform: translateY(0px);
  }

  20%,
  30% {
	transform: translateY(1px);
  }

  60%,
  80% {
	transform: translateY(-1px);
  }
}
