/* TOPBAR-ACTIONS-V4 */

.topbar-actions-v2{
  margin-left:auto!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
}


/* SOCIALS */

.topbar-socials-v4{
  display:flex;
  align-items:center;
  gap:2px;

  margin-right:6px;
  padding-right:9px;

  border-right:1px solid rgba(255,255,255,.065);
}

.topbar-social-v3{
  width:32px!important;
  height:32px!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  padding:0!important;

  border:0!important;
  border-radius:5px!important;

  background:transparent!important;
  color:#74828d!important;

  box-shadow:none!important;
  transform:none!important;

  transition:
    color .15s ease,
    background .15s ease!important;
}

.topbar-social-v3:hover{
  color:#dce5ea!important;
  background:rgba(255,255,255,.045)!important;
  transform:none!important;
}

.topbar-brand-icon-v4{
  width:19px!important;
  height:19px!important;
  display:block!important;
  flex:0 0 19px!important;
}

.topbar-brand-icon-v4.discord{
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.55!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

.topbar-brand-icon-v4.discord .dc-eye{
  fill:currentColor!important;
  stroke:none!important;
}

.topbar-brand-icon-v4.youtube{
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.55!important;
  stroke-linejoin:round!important;
}

.topbar-brand-icon-v4.youtube .yt-play{
  fill:currentColor!important;
  stroke:none!important;
}


/* SIGN IN + CONNECT */

.topbar-actions-v2 #global-auth-entry-v1:not(.account-chip-v4),
.topbar-actions-v2 .topbar-connect-v2{
  position:relative!important;
  overflow:hidden!important;

  height:36px!important;
  min-height:36px!important;

  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;

  margin:0!important;

  border-radius:5px!important;
  border:1px solid rgba(255,255,255,.075)!important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.026),
      rgba(255,255,255,.010)
    )!important;

  color:#aeb9c1!important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025)!important;

  font-family:'Inter',system-ui,sans-serif!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:.015em!important;

  text-decoration:none!important;

  transform:none!important;

  transition:
    color .15s ease,
    border-color .15s ease,
    background .15s ease!important;
}


/* SIGN IN */

.topbar-actions-v2 #global-auth-entry-v1:not(.account-chip-v4){
  min-width:88px!important;
  padding:0 13px!important;
  gap:8px!important;
}


/* CONNECT — trochę mocniejszy, ale nadal nasz styl */

.topbar-actions-v2 .topbar-connect-v2{
  min-width:148px!important;
  padding:0 16px!important;

  color:#ced9de!important;

  border-color:rgba(0,229,255,.13)!important;

  background:
    linear-gradient(
      180deg,
      rgba(0,229,255,.043),
      rgba(255,255,255,.012)
    )!important;

  box-shadow:
    inset 0 1px 0 rgba(0,229,255,.07)!important;
}


/* HOVER */

.topbar-actions-v2 #global-auth-entry-v1:not(.account-chip-v4):hover{
  color:#f0f5f7!important;
  border-color:rgba(255,255,255,.14)!important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.046),
      rgba(255,255,255,.016)
    )!important;

  transform:none!important;
}

.topbar-actions-v2 .topbar-connect-v2:hover{
  color:#f1f9fa!important;
  border-color:rgba(0,229,255,.24)!important;

  background:
    linear-gradient(
      180deg,
      rgba(0,229,255,.065),
      rgba(255,255,255,.017)
    )!important;

  box-shadow:
    inset 0 1px 0 rgba(0,229,255,.10)!important;

  transform:none!important;
}


/* SWEEP */

.topbar-actions-v2 #global-auth-entry-v1:not(.account-chip-v4)::before,
.topbar-actions-v2 .topbar-connect-v2::before{
  content:"";

  position:absolute;
  z-index:1;

  top:-45%;
  bottom:-45%;
  left:-50%;

  width:29%;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.025),
    rgba(255,255,255,.13),
    rgba(255,255,255,.025),
    transparent
  );

  opacity:0;

  transform:skewX(-20deg);
  pointer-events:none;
}

.topbar-actions-v2 #global-auth-entry-v1:not(.account-chip-v4):hover::before,
.topbar-actions-v2 .topbar-connect-v2:hover::before{
  animation:iwbpTopbarSweepV4 .58s ease-out;
}

@keyframes iwbpTopbarSweepV4{
  0%{left:-50%;opacity:0}
  14%{opacity:1}
  82%{opacity:1}
  100%{left:125%;opacity:0}
}


/* wszystko nad refleks */

.topbar-actions-v2 #global-auth-entry-v1:not(.account-chip-v4) > *,
.topbar-actions-v2 .topbar-connect-v2 > *{
  position:relative;
  z-index:2;
}


/* caret Sign in */

.topbar-actions-v2 #global-auth-entry-v1:not(.account-chip-v4)::after{
  content:"";

  position:relative;
  z-index:2;

  width:5px;
  height:5px;

  margin-top:-3px;

  border:0!important;
  border-right:1.5px solid currentColor!important;
  border-bottom:1.5px solid currentColor!important;

  border-radius:0!important;

  background:none!important;
  box-shadow:none!important;

  opacity:.58!important;

  transform:rotate(45deg)!important;
}


/* CLICK */

.topbar-actions-v2 #global-auth-entry-v1:not(.account-chip-v4):active,
.topbar-actions-v2 .topbar-connect-v2:active{
  background:rgba(255,255,255,.02)!important;
}


/* MOBILE */

@media(max-width:700px){
  .topbar-socials-v4{
    display:none;
  }

  .topbar-actions-v2{
    gap:5px!important;
  }

  .topbar-actions-v2 .topbar-connect-v2{
    min-width:0!important;
    padding:0 11px!important;
  }
}