/* ==========================================================
   NOYTRIX PROFILE V59 — INTERACTION / POLISH FIX
   ========================================================== */


/* ==========================================================
   TOP ACCOUNT BUTTON
   ========================================================== */

#headerAccountButton.p59-header-profile {
  min-height:
    44px !important;

  padding:
    5px 13px 5px 6px !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  gap:
    8px !important;

  border:
    1px solid
    rgba(255, 187, 34, .45) !important;

  border-radius:
    11px !important;

  color:
    #f4f7fb !important;

  background:
    linear-gradient(
      145deg,
      rgba(7, 30, 56, .96),
      rgba(4, 19, 37, .96)
    ) !important;

  cursor:
    pointer !important;
}


#headerAccountButton.p59-header-profile:hover {
  border-color:
    rgba(255, 187, 34, .88) !important;

  background:
    linear-gradient(
      145deg,
      rgba(10, 40, 73, .98),
      rgba(5, 24, 46, .98)
    ) !important;
}


.p59-header-avatar {
  width:
    31px;

  height:
    31px;

  display:
    grid;

  place-items:
    center;

  border:
    2px solid
    #ffbd24;

  border-radius:
    50%;

  color:
    #fff;

  background:
    #061529;

  font-size:
    8px;

  font-weight:
    950;
}


/* ==========================================================
   REMOVE DUPLICATE PROFILE ACCOUNT CARD
   Sidebar profile is enough.
   ========================================================== */

#screen-profile-v56
.p56-header-user,

#screen-profile-v56
.p57-header-user,

#screen-profile-v56
.p57-account-card {
  display:
    none !important;
}


#screen-profile-v56
.p56-header {
  justify-content:
    flex-start !important;
}


/* ==========================================================
   CLICK SAFETY
   ========================================================== */

#screen-profile-v56 button,

#screen-profile-v56 select,

#screen-profile-v56 input,

#screen-profile-v56 a {
  pointer-events:
    auto !important;
}


#screen-profile-v56
[data-p56-tab] {
  position:
    relative;

  z-index:
    3;

  cursor:
    pointer !important;
}


#screen-profile-v56
.p56-card,

#screen-profile-v56
.p56-connection,

#screen-profile-v56
.p57-settings-card {
  pointer-events:
    auto !important;
}


/* ==========================================================
   SETTINGS SCROLL
   ========================================================== */

#screen-profile-v56
[data-p56-panel="settings"] {
  height:
    100% !important;

  min-height:
    0 !important;

  max-height:
    calc(100vh - 245px) !important;

  padding-right:
    9px !important;

  padding-bottom:
    110px !important;

  overflow-y:
    auto !important;

  overflow-x:
    hidden !important;

  overscroll-behavior:
    contain;

  touch-action:
    pan-y;

  scrollbar-gutter:
    stable;
}


#screen-profile-v56
[data-p56-panel="settings"]::-webkit-scrollbar {
  width:
    7px;
}


#screen-profile-v56
[data-p56-panel="settings"]::-webkit-scrollbar-track {
  background:
    rgba(4, 18, 34, .50);
}


#screen-profile-v56
[data-p56-panel="settings"]::-webkit-scrollbar-thumb {
  border-radius:
    10px;

  background:
    rgba(66, 139, 210, .44);
}


#screen-profile-v56
[data-p56-panel="settings"]::-webkit-scrollbar-thumb:hover {
  background:
    rgba(76, 163, 247, .67);
}


/* ==========================================================
   SETTINGS SAVE BAR
   ========================================================== */

.p59-settings-bar {
  position:
    sticky;

  top:
    0;

  z-index:
    50;

  min-height:
    50px;

  margin:
    0 0 11px;

  padding:
    7px 8px 7px 12px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    14px;

  border:
    1px solid
    rgba(62, 133, 203, .31);

  border-radius:
    10px;

  background:
    rgba(5, 23, 43, .96);

  backdrop-filter:
    blur(15px);

  box-shadow:
    0 12px 26px
    rgba(0, 0, 0, .17);
}


.p59-settings-state {
  display:
    flex;

  align-items:
    center;

  gap:
    7px;
}


.p59-settings-state > span {
  width:
    7px;

  height:
    7px;

  border-radius:
    50%;

  background:
    #3bdd9f;

  box-shadow:
    0 0 10px
    rgba(59, 221, 159, .38);
}


#p59SettingsState {
  color:
    #8ea8c2;

  font-size:
    8px;

  font-weight:
    900;
}


#p59SettingsState.dirty {
  color:
    #ffc33d;
}


#p59SettingsState.dirty
~ * {
  color:
    inherit;
}


.p59-settings-actions {
  display:
    flex;

  gap:
    7px;
}


#p59ResetSettings,

#p59SaveSettings {
  min-height:
    35px;

  padding:
    0 14px;

  border-radius:
    8px;

  cursor:
    pointer;

  font-size:
    8px;

  font-weight:
    950;
}


#p59ResetSettings {
  border:
    1px solid
    rgba(68, 141, 211, .36);

  color:
    #b5cbe0;

  background:
    rgba(7, 31, 57, .82);
}


#p59SaveSettings {
  min-width:
    115px;

  border:
    1px solid
    rgba(255, 199, 65, .92);

  color:
    #07111c;

  background:
    linear-gradient(
      135deg,
      #ffd55f,
      #ffad1c
    );
}


#p59ResetSettings:disabled,

#p59SaveSettings:disabled {
  opacity:
    .40;

  cursor:
    default;
}


/* ==========================================================
   SETTINGS CONTROLS
   ========================================================== */

#screen-profile-v56
#settingsTheme button,

#screen-profile-v56
#settingsDensity button {
  cursor:
    pointer !important;
}


#screen-profile-v56
#settingsTheme button.active,

#screen-profile-v56
#settingsDensity button.active {
  border-color:
    rgba(255, 192, 42, .90) !important;

  color:
    #07111c !important;

  background:
    linear-gradient(
      135deg,
      #ffd35c,
      #ffad1d
    ) !important;
}


#screen-profile-v56
[data-p56-panel="settings"]
select {
  cursor:
    pointer !important;
}


#screen-profile-v56
[data-p56-panel="settings"]
input[type="checkbox"] {
  cursor:
    pointer !important;
}


/* ==========================================================
   CONNECTIONS
   ========================================================== */

#screen-profile-v56
.p56-connection button {
  transition:
    transform .15s ease,
    border-color .15s ease,
    background .15s ease;
}


#screen-profile-v56
.p56-connection button:hover {
  transform:
    translateY(-1px);

  border-color:
    rgba(77, 167, 255, .70);

  background:
    rgba(13, 49, 83, .92);
}


/* ==========================================================
   GENERAL PROFILE BUTTON FEEDBACK
   ========================================================== */

#screen-profile-v56
.p56-primary,

#screen-profile-v56
.p56-secondary {
  transition:
    transform .14s ease,
    filter .14s ease,
    border-color .14s ease;
}


#screen-profile-v56
.p56-primary:hover,

#screen-profile-v56
.p56-secondary:hover {
  transform:
    translateY(-1px);
}


#screen-profile-v56
.p56-primary:active,

#screen-profile-v56
.p56-secondary:active {
  transform:
    translateY(0);
}


/* ==========================================================
   TOAST
   ========================================================== */

.p59-toast-root {
  position:
    fixed;

  z-index:
    9999;

  right:
    18px;

  bottom:
    18px;

  display:
    grid;

  gap:
    8px;

  pointer-events:
    none;
}


.p59-toast {
  min-width:
    220px;

  max-width:
    380px;

  padding:
    11px 13px;

  border:
    1px solid
    rgba(72, 145, 215, .40);

  border-radius:
    9px;

  opacity:
    0;

  transform:
    translateY(8px);

  color:
    #e5eef8;

  background:
    rgba(7, 28, 52, .97);

  box-shadow:
    0 14px 35px
    rgba(0, 0, 0, .30);

  font-size:
    9px;

  font-weight:
    800;

  transition:
    .18s ease;
}


.p59-toast.show {
  opacity:
    1;

  transform:
    translateY(0);
}


.p59-toast.success {
  border-color:
    rgba(58, 220, 160, .45);
}


.p59-toast.error {
  border-color:
    rgba(255, 91, 103, .50);
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media(max-width:800px) {

  #screen-profile-v56
  [data-p56-panel="settings"] {
    max-height:
      none !important;
  }


  .p59-settings-bar {
    align-items:
      stretch;

    flex-direction:
      column;
  }


  .p59-settings-actions {
    width:
      100%;
  }


  #p59ResetSettings,

  #p59SaveSettings {
    flex:
      1;
  }

}