/**
 * @name Refreshed Seamless Chat Bar
 * @author NSPG911
 * @version 1.1.0
 * @description Moves around elements near the Chat Bar to be seamless with the message bar
 * @source https://nspc911.github.io/themes/vencord/RefreshedSeamlessChatBar.theme.css
*/

:root {
  /* Custom padding for the chat box */
  --rscb-chat-box-padding: 8px;
  /* Whether you want the messages to clip through *\
  \*  the gap between slowmode and typing people   */
  --rscb-clip-chat-through-typing-bar: 0;
  /* certain older themes havent been *\
  \* updated, use this if necessary   */
  --rscb-use-fixed-attach-button: 0;
}

.visual-refresh .form_f75fb0 {
  display: flex;
  flex-direction: column;
  padding: 4px var(--rscb-chat-box-padding) var(--rscb-chat-box-padding)
    var(--rscb-chat-box-padding) !important;
  /* Normal chatbar */
  .channelTextArea_f75fb0 {
    margin-bottom: 0px;
    margin-right: 1px;
    /* reply bar */
    .stackedBars__74017 {
      border-bottom-color: transparent !important;
      background-color: var(--chat-background-default);
    }
  }
  /* slowmode bar + typing indicator */
  .base_b88801 {
    border-color: transparent !important;
    position: static;
    order: -1;
    background: transparent !important;
    background-image: transparent !important;
    border: 1px solid var(--border-faint);
    border-bottom: none;
    border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    padding-left: 0 !important;
    transform: translateX(-1px);
    .typingDots_b88801,
    .cooldownText_b21699 {
      background-color: var(--chat-background-default);
      height: 24px;
      padding-right: 8px;
      padding-left: 8px;
      border-radius: 8px 8px 0 0;
      border: 1px solid var(--border-faint) !important;
      border-bottom-color: transparent !important;
      /* because they dont have the same position */
      &.typingDots_b88801 {
        flex: unset !important; /* latest build uses flex for some fucking reason */
        margin-left: 0 !important;
        &:not(:has(span > strong)) {
          display: none !important;
        }
      }
      &.cooldownText_b21699 {
        transform: translateY(1px);
      }
    }
  }
  .threadSuggestionBar__841c8 {
    /* fix a certain pixel issue that bugged me to oblivion */
    border-top: unset !important;
  }
  .channelAttachmentArea_b77158 {
    background-color: var(--chat-background-default);
  }
  /* the stars of the show, the :has */
  /* check for typing thing */
  &:has(> .typing_b88801 > .typingDots_b88801 > span > strong)
    .channelTextArea_f75fb0 {
    border-top-left-radius: 0 !important;
  }
  /* check for cooldown thing */
  &:has(> .typing_b88801 > .cooldownWrapper_b21699) .channelTextArea_f75fb0 {
    border-top-right-radius: 0 !important;
  }
  .cooldownWrapper_b21699 {
    padding: 3px 0px 3px 8px;
    transform: translateX(1px);
    .slowModeIcon_b21699 {
      margin-left: 0px;
    }
  }
}

.chatGradientBase__36d07 {
  display: none !important;
}

.messagesWrapper__36d07:not(
  :has(+ .formWithLoadedChatInput_f75fb0 > .typing_b88801)
) {
  margin-bottom: 12px;
}
.messagesWrapper__36d07:has(
  + .formWithLoadedChatInput_f75fb0 > .typing_b88801
) {
  .scrollerInner__36d07 {
    padding-bottom: calc(var(--rscb-clip-chat-through-typing-bar) * 24px);
  }
  .scroller__36d07 {
    margin-bottom: calc(12px - var(--rscb-clip-chat-through-typing-bar) * 24px);
  }
}
.scrollerSpacer__36d07 {
  height: 7px !important;
}
.align-chat-input .attachWrapper__0923f {
  padding: 7px 10px;
  padding: calc(
      var(--space-12) * (1 - var(--rscb-use-fixed-attach-button)) +
        (7px * var(--rscb-use-fixed-attach-button))
    )
    calc(
      (var(--space-md) - 6px) * (1 - var(--rscb-use-fixed-attach-button)) +
        (10px * var(--rscb-use-fixed-attach-button))
    );
}