button[aria-current="page"]
  [data-flx^="app.sidebar-nav."][data-flx$=".fluxer-button-icon"],
button[aria-pressed="true"]
  [data-flx^="app.sidebar-nav."][data-flx$=".fluxer-button-icon"],
button:active
  [data-flx^="app.sidebar-nav."][data-flx$=".fluxer-button-icon"] {
  background-color: #021f26 !important;
  color: #b86d00 !important;
}

button[aria-current="page"]
  [data-flx^="app.sidebar-nav."][data-flx$=".favorites-icon"],
button[aria-pressed="true"]
  [data-flx^="app.sidebar-nav."][data-flx$=".favorites-icon"],
button:active [data-flx^="app.sidebar-nav."][data-flx$=".favorites-icon"] {
  color: #b86d00 !important;
}

button[aria-pressed="true"]
  [data-flx^="app.sidebar-nav."][data-flx$=".div--2"],
button[aria-current="page"]
  [data-flx^="app.sidebar-nav."][data-flx$=".div--2"],
button:active [data-flx^="app.sidebar-nav."][data-flx$=".div--2"] {
  border-color: #b86d00 !important;
  background-color: #021f26 !important;
  color: #b86d00 !important;
}

button[aria-pressed="true"]
  [data-flx^="app.sidebar-nav."][data-flx$=".icon-text"],
button[aria-current="page"]
  [data-flx^="app.sidebar-nav."][data-flx$=".icon-text"],
button:active [data-flx^="app.sidebar-nav."][data-flx$=".icon-text"] {
  color: #b86d00 !important;
}

[aria-current="page"]
  [data-flx^="app.sidebar-nav."][data-flx$=".guild-indicator-bar"] {
  background-color: #b86d00 !important;
}

[role="button"][aria-current="page"]
  [data-flx="app.sidebar-nav.guild-list-item.guild-icon"] {
  background-color: #021f26 !important;
  box-shadow: inset 0 0 0 2px #b86d00;
}

body:has([data-flx="guild.add-guild-modal.modal-root"])
  [data-flx="app.sidebar-nav.add-guild-button.div--2"],
body:has(
    [data-flx="app.sidebar-nav.download-button.handle-context-menu.menu-icon"]
  )
  [data-flx="app.sidebar-nav.download-button.div--2"],
body:has(
    [data-flx="app.sidebar-nav.help-button.handle-context-menu.menu-icon"]
  )
  [data-flx="app.sidebar-nav.help-button.div--2"] {
  border-color: #b86d00 !important;
  background-color: #021f26 !important;
  color: #b86d00 !important;
}

body:has([data-flx="guild.add-guild-modal.modal-root"])
  [data-flx="app.sidebar-nav.add-guild-button.icon-text"],
body:has(
    [data-flx="app.sidebar-nav.download-button.handle-context-menu.menu-icon"]
  )
  [data-flx="app.sidebar-nav.download-button.icon-text"],
body:has(
    [data-flx="app.sidebar-nav.help-button.handle-context-menu.menu-icon"]
  )
  [data-flx="app.sidebar-nav.help-button.icon-text"] {
  color: #b86d00 !important;
}

@media (hover: hover) and (pointer: fine) {
  button:hover
    [data-flx^="app.sidebar-nav."][data-flx$=".fluxer-button-icon"],
  [data-flx^="app.sidebar-nav."][data-flx$=".fluxer-button-icon"]:hover {
    background-color: #021f26 !important;
    color: #b86d00 !important;
  }

  button:hover [data-flx^="app.sidebar-nav."][data-flx$=".div--2"],
  [data-flx^="app.sidebar-nav."][data-flx$=".div--2"]:hover {
    border-color: #b86d00 !important;
    background-color: #021f26 !important;
    color: #b86d00 !important;
  }

  button:hover
    [data-flx^="app.sidebar-nav."][data-flx$=".favorites-icon"],
  button:hover [data-flx^="app.sidebar-nav."][data-flx$=".icon-text"] {
    color: #b86d00 !important;
  }
}

/*
 * Temporary compatibility backport for fluxerapp/fluxer#1381.
 * Remove after the deployed app-proxy includes the upstream mobile-scroll fix.
 */
[data-flx="app.guild-layout.mobile-navbar"]
  [data-flx="app.guild-sidebar.guild-navbar"][class*="guildNavbarContainerMobile"] {
  height: 100%;
}

[data-flx="app.guild-layout.mobile-navbar"]
  [data-flx="app.guild-sidebar.guild-navbar"][class*="guildNavbarContainerMobile"]
  [data-flx="app.channel-list-content.channel-list-scroller-wrapper"] {
  max-height: calc(100% - 20px);
}