// ╔══════════════════════════╦═════════════════════════════════════════════════════════════════════════════[─]═[□]═[×]═╗
// ║ Panel                    ║ Layout                                                                                  ║
// ╚══════════════════════════╩═════════════════════════════════════════════════════════════════════════════════════════╝

// ╔══════════════════════════╦═════════════════════════════════════════════════════════════════════════════[─]═[□]═[×]═╗
// ║ Panel                    ║ Hover Function                                                                          ║
// ╚══════════════════════════╩═════════════════════════════════════════════════════════════════════════════════════════╝

// Spotify (Normal)
.powercord-spotify .container-YkUktl {
  height: calc(50px + var(--inner-primary) + var(--inner-primary)) !important;
}

.powercord-spotify .container-YkUktl .flex-2S1XBF {
  opacity: 0;
  z-index: -99;
}

// Spotify (Hover)
.powercord-spotify:hover .container-YkUktl {
  height: calc(90px + var(--inner-primary) + var(--inner-primary)) !important;
}

.powercord-spotify:hover .container-YkUktl .flex-2S1XBF {
  opacity: 0.4;
  z-index: 0;
}

// Activity (Normal)
.activityPanel-9icbyU .body-1FrnJD {
  height: calc(32px + var(--inner-primary) + var(--inner-primary)) !important;
}

.activityPanel-9icbyU .actions-zk2vB_ {
  opacity: 0;
  z-index: -99;
}

// Activity (Hover)
.activityPanel-9icbyU:hover .body-1FrnJD {
  height: calc(72px + var(--inner-primary) + var(--inner-primary)) !important;
}

.activityPanel-9icbyU:hover .actions-zk2vB_ {
  opacity: 1;
  z-index: 0;
}

// ╔══════════════════════════╦═════════════════════════════════════════════════════════════════════════════[─]═[□]═[×]═╗
// ║ Panel                    ║ Profile                                                                                 ║
// ╚══════════════════════════╩═════════════════════════════════════════════════════════════════════════════════════════╝

// Grid
.container-YkUktl {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: 1fr 1fr;
  height: calc(90px + var(--inner-primary) + var(--inner-primary));
  padding: 0px;
  margin: 0px;
}

// Avatar
.container-YkUktl .avatarWrapper-1B9FTW {
  background: var(--background-primary);
  border-radius: var(--radius-secondary);
  margin: var(--inner-primary) var(--inner-primary) 0px var(--inner-primary);
  padding: var(--inner-primary);
  grid-column: 1;
  height: 32px;
}

// Name
.container-YkUktl .nameTag-sc-gpq {
  background: var(--background-primary);
  border-radius: var(--radius-secondary);
  margin: var(--inner-primary) var(--inner-primary) 0px 0px;
  padding: var(--inner-primary);
  grid-column: 2;
  height: 32px;
}

// Button Area
.container-YkUktl .flex-2S1XBF {
  display: grid;
  margin-left: var(--inner-primary);
  margin-right: var(--inner-primary);
  grid-column: 1 / -1;
  grid-gap: var(--inner-primary);
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}

// Buttons
.container-YkUktl .directionRow-2Iu2A9 .button-12Fmur {
  background: var(--background-primary);
  border-radius: var(--radius-secondary);
  width: 100%;
  height: 34px;
}

// ╔══════════════════════════╦═════════════════════════════════════════════════════════════════════════════[─]═[□]═[×]═╗
// ║ Panel                    ║ Spotify                                                                                 ║
// ╚══════════════════════════╩═════════════════════════════════════════════════════════════════════════════════════════╝

// No Spotify Controls
.spotify-extra-controls,
.spotify-seek {
  display: none !important;
}

// Spacing
.powercord-spotify .container-YkUktl {
  margin-bottom: -8px !important;
}

.powercord-spotify .spotify-buttons button {
  background: var(--background-primary) !important;
}

.powercord-spotify .spotify-buttons button > div {
  color: var(--interactive-normal) !important;
}

// ╔══════════════════════════╦═════════════════════════════════════════════════════════════════════════════[─]═[□]═[×]═╗
// ║ Panel                    ║ Voice                                                                                   ║
// ╚══════════════════════════╩═════════════════════════════════════════════════════════════════════════════════════════╝

// Grid
.container-1zzFcN .horizontal-112GEH > .flex-2S1XBF {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  grid-gap: var(--inner-primary);
  width: 100%;
}

// Background
.container-1zzFcN {
  margin: var(--inner-primary);
  padding: 0px;
  border: none !important;
  //height: 120px;
}

// Spacing
.container-1zzFcN .horizontal-112GEH > .flex-2S1XBF,
.horizontal-112GEH > .flexChild-3PzYmX {
  margin-left: 0px;
}

// Flex
.container-1zzFcN .connection-3k9QeF {
  flex-direction: column;
}

// Info
.container-1zzFcN .inner-llGtyq {
  background: var(--background-primary);
  border-radius: var(--radius-secondary);
  width: 100%;
  min-height: 32px;
  padding: var(--inner-primary) 0px;
  margin: 0px 0px var(--inner-primary) 0px;
}

// RTC Connection Status
.container-1zzFcN .rtcConnectionStatus-c5A6Av {
  padding-bottom: 4px;
  margin-left: 8px;
}

// Subtext
.container-1zzFcN .subtext-2HDqJ7 {
  margin-left: 8px;
}

// Buttons
.container-1zzFcN .button-f2h6uQ,
.container-1zzFcN .button-12Fmur {
  background: var(--background-primary);
  border-radius: var(--radius-secondary);
  width: 100%;
}

// Disabled Buttons
.button-1EGGcP.buttonColor-3bP3fX.fauxDisabled-8w0hCZ,
.button-1EGGcP .buttonColor-3bP3fX.fauxDisabled-8w0hCZ,
.button-1EGGcP.buttonColor-3bP3fX:disabled,
.button-1EGGcP .buttonColor-3bP3fX:disabled {
  background: var(--background-tertiary);
}

// ╔══════════════════════════╦═════════════════════════════════════════════════════════════════════════════[─]═[□]═[×]═╗
// ║ Panel                    ║ Activity                                                                                ║
// ╚══════════════════════════╩═════════════════════════════════════════════════════════════════════════════════════════╝

// Grid
.actions-zk2vB_ {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  grid-gap: var(--inner-primary);
  width: 100%;
  background: transparent !important;
}

// Background
.actions-zk2vB_ .button-12Fmur {
  background: var(--background-primary);
  border-radius: var(--radius-secondary);
}

.body-1FrnJD {
  flex-direction: column;
  margin: var(--inner-primary) var(--inner-primary) 0px var(--inner-primary);
}

.activityPanel-9icbyU {
  padding: 0px;
  border: none;
}

// Activity
.activityPanel-9icbyU .gameWrapper-2TFy7F {
  background: var(--background-primary);
  border-radius: var(--radius-secondary);
  margin: 0px 0px var(--inner-primary) 0px;
  padding: var(--inner-primary) 0px var(--inner-primary) 0px;
  width: 100%;
}

// Icon
.gameIconWrapper-zXQ03M {
  padding: 0px var(--inner-primary) 0px 8px;
}

.gameIcon-1mDo1J {
  border-radius: 90%;
}

// Buttons
.activityPanel-9icbyU .actions-zk2vB_ {
  background: var(--background-primary);
  border-radius: var(--radius-secondary);
  margin: 0px 0px 0px 0px;
  width: 100%;
}

.activityPanel-9icbyU .disabledButtonWrapper-2Oz3aY {
  width: 100%;
}

.activityPanel-9icbyU .button-12Fmur {
  width: 100%;
}

// ╔══════════════════════════╦═════════════════════════════════════════════════════════════════════════════[─]═[□]═[×]═╗
// ║ Panel                    ║ Order                                                                                   ║
// ╚══════════════════════════╩═════════════════════════════════════════════════════════════════════════════════════════╝

// Order
.panels-3wFtMD {
  display: flex;
  flex-direction: column;
}

// Voice
.wrapper-3Hk9OB {
  order: 2;
}

// Activity
.activityPanel-9icbyU {
  order: 3;
}

// Spotify
.powercord-spotify {
  order: 4;
}

// Profile
.container-YkUktl {
  order: 5;
}