/* Wartip shared navbar dropdowns (Index + Streamers)
 * Loaded last on both pages. Scoped to #nav to avoid affecting dashboard UI.
 */

/* A quieter, consistent account trigger */
#nav .account-menu { isolation: isolate; }
#nav .account-menu .account-trigger {
  gap: 9px !important;
  padding: 0 16px !important;
  min-height: 42px !important;
  border: 1px solid rgba(187, 146, 235, .20) !important;
  background: rgba(255,255,255,.045) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}
#nav .account-menu .account-trigger:hover,
#nav .account-menu[open] .account-trigger {
  border-color: rgba(168, 98, 255, .40) !important;
  background: rgba(148, 72, 245, .11) !important;
  box-shadow: 0 0 0 3px rgba(146, 72, 245, .075) !important;
}
#nav .account-menu .account-chevron { transition: transform .2s ease !important; }
#nav .account-menu[open] .account-chevron { transform: rotate(180deg) !important; }
#nav .account-menu summary:focus-visible,
#nav .nav-links a:focus-visible,
#nav .menu-btn:focus-visible,
#nav .account-popover .account-option:focus-visible {
  outline: 2px solid #ad72ff !important;
  outline-offset: 3px !important;
}

/* Desktop account card */
#nav .account-menu .account-popover {
  position: absolute !important;
  inset: auto 0 auto auto !important;
  top: calc(100% + 14px) !important;
  width: min(312px, calc(100vw - 28px)) !important;
  padding: 11px !important;
  background: #100e17 !important;
  color: #f8f5ff !important;
  border: 1px solid rgba(180, 130, 241, .20) !important;
  border-radius: 22px !important;
  box-shadow: 0 26px 70px -18px rgba(0,0,0,.75),
              0 0 0 1px rgba(255,255,255,.025) inset !important;
  backdrop-filter: blur(22px) !important;
  -webkit-backdrop-filter: blur(22px) !important;
  transform-origin: top right !important;
  animation: wt-nav-pop-in .22s cubic-bezier(.18,.85,.32,1) both !important;
}
#nav .account-popover .account-profile {
  padding: 12px 11px 15px !important;
  margin: 0 0 7px !important;
  gap: 12px !important;
  border-bottom: 1px solid rgba(199,171,242,.11) !important;
}
#nav .account-popover .account-avatar {
  width: 44px !important;
  height: 44px !important;
  border-radius: 14px !important;
  background: linear-gradient(140deg,#7426ea,#ac4fff) !important;
  box-shadow: 0 9px 24px -12px rgba(150,65,255,.9) !important;
}
#nav .account-popover .account-profile-label {
  color: #aaa0b9 !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
}
#nav .account-popover .account-profile-text strong {
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
}
#nav .account-popover .account-option {
  display: flex !important;
  align-items: center !important;
  min-height: 46px !important;
  padding: 10px 13px !important;
  gap: 12px !important;
  border-radius: 13px !important;
  color: #f2edfb !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  transition: background .16s ease, color .16s ease, transform .16s ease !important;
}
#nav .account-popover .account-option:hover {
  background: rgba(160,95,252,.12) !important;
  color: #fff !important;
  transform: translateX(2px) !important;
}
#nav .account-popover .account-option svg {
  color: #af80fa !important;
  width: 18px !important;
  height: 18px !important;
}
#nav .account-popover .account-option-arrow {
  font-size: 18px !important;
  color: #8e879e !important;
}
#nav .account-popover .account-logout {
  padding: 7px 0 0 !important;
  border-top: 1px solid rgba(199,171,242,.11) !important;
}
#nav .account-popover .account-option-danger { color: #ff839c !important; }
#nav .account-popover .account-option-danger svg { color: #ff839c !important; }
#nav .account-popover .account-option-danger:hover {
  color: #ff9aac !important;
  background: rgba(255,96,133,.085) !important;
}

/* Light mode uses a true white popover, not a dimmed dark panel. */
html[data-theme="light"] #nav .account-menu .account-trigger {
  color: #33283e !important;
  background: #faf8fe !important;
  border-color: rgba(104,74,151,.15) !important;
}
html[data-theme="light"] #nav .account-menu[open] .account-trigger,
html[data-theme="light"] #nav .account-menu .account-trigger:hover {
  background: #f3edff !important;
  border-color: rgba(152,83,244,.32) !important;
}
html[data-theme="light"] #nav .account-menu .account-chevron { color: #7c718e !important; }
html[data-theme="light"] #nav .account-menu .account-popover {
  background: #fff !important;
  color: #292136 !important;
  border-color: rgba(97,73,134,.16) !important;
  box-shadow: 0 26px 60px -20px rgba(42,21,76,.28), 0 1px 0 rgba(255,255,255,.9) inset !important;
}
html[data-theme="light"] #nav .account-popover .account-profile { border-color: #eee7f6 !important; }
html[data-theme="light"] #nav .account-popover .account-profile-label { color: #7e748b !important; }
html[data-theme="light"] #nav .account-popover .account-profile-text strong { color: #2e2340 !important; }
html[data-theme="light"] #nav .account-popover .account-option { color: #33273f !important; }
html[data-theme="light"] #nav .account-popover .account-option:hover { background: #f6efff !important; }
html[data-theme="light"] #nav .account-popover .account-logout { border-color: #eee7f6 !important; }
html[data-theme="light"] #nav .account-popover .account-option-danger { color: #cb3e66 !important; }
html[data-theme="light"] #nav .account-popover .account-option-danger svg { color: #cb3e66 !important; }
html[data-theme="light"] #nav .account-popover .account-option-danger:hover { color: #b73357 !important; background: #fff2f6 !important; }

/* Overlay only for the phone menu/account popup. Layer below #nav. */
.wt-nav-scrim {
  position: fixed;
  inset: 0;
  z-index: 1190;
  background: rgba(4,2,10,.56);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s ease, visibility .22s ease;
}
.wt-nav-scrim.is-visible {
  visibility: visible;
  pointer-events: auto;
  opacity: 1;
}

/* Mobile-only decorations are hidden on desktop. */
#nav .wt-nav-menu-head,
#nav .wt-nav-mobile-icon { display: none !important; }
#nav .wt-menu-close { display: none !important; }
#nav .wt-menu-icon { display: block !important; }

@keyframes wt-nav-pop-in {
  from { opacity: 0; transform: translateY(-7px) scale(.975); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 820px) {
  /* The old 60% transparent panel showed the hero heading THROUGH the menu. */
  #nav:not(.open) .nav-links { display: none !important; }
  #nav.open .nav-links {
    display: flex !important;
    position: absolute !important;
    top: calc(100% + 11px) !important;
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    flex-direction: column !important;
    gap: 5px !important;
    padding: 12px !important;
    border: 1px solid rgba(176,125,243,.24) !important;
    border-radius: 23px !important;
    background: #100e17 !important;
    box-shadow: 0 25px 70px -16px rgba(0,0,0,.74) !important;
    max-height: calc(100dvh - 92px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    animation: wt-nav-pop-in .20s cubic-bezier(.18,.85,.32,1) both !important;
  }
  #nav .wt-nav-menu-head {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 36px !important;
    padding: 2px 12px 7px !important;
    color: #b6acc8 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: .04em !important;
  }
  #nav .wt-nav-menu-dot { width: 6px; height: 6px; background: #a554ff; border-radius: 50%; box-shadow: 0 0 0 4px rgba(151,77,251,.12); }
  #nav .wt-nav-menu-label { margin-left:auto; color: #7e748f; font-size: 10px; letter-spacing:.02em; }
  #nav .nav-links a {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 52px !important;
    padding: 9px 13px !important;
    margin: 0 !important;
    background: transparent !important;
    color: #e5def1 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
    border: 1px solid transparent !important;
    border-radius: 14px !important;
    opacity: 1 !important;
    transition: background .18s ease, border-color .18s ease, color .18s ease !important;
  }
  #nav .nav-links a:hover,
  #nav .nav-links a:focus-visible {
    background: rgba(166,94,252,.10) !important;
    color: #fff !important;
  }
  #nav .nav-links a.is-active,
  #nav .nav-links a[aria-current="page"] {
    color: #fff !important;
    border-color: rgba(169,96,255,.18) !important;
    background: linear-gradient(90deg,rgba(146,64,248,.17),rgba(146,64,248,.045)) !important;
  }
  #nav .nav-links a::after {
    content: "" !important;
    position: static !important;
    display: block !important;
    margin-left: auto !important;
    width: 5px !important;
    height: 5px !important;
    border-radius: 50% !important;
    flex: 0 0 5px !important;
    background: #b36cff !important;
    opacity: 0 !important;
    transform: none !important;
  }
  #nav .nav-links a.is-active::after,
  #nav .nav-links a[aria-current="page"]::after { opacity: 1 !important; }
  #nav .wt-nav-mobile-icon {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 34px !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 10px !important;
    background: rgba(181,123,255,.065) !important;
    color: #a978ed !important;
  }
  #nav .wt-nav-mobile-icon svg {
    width: 18px !important;
    height: 18px !important;
    fill: none !important;
    stroke: currentColor !important;
  }
  #nav .menu-btn[aria-expanded="true"] {
    background: rgba(145,72,247,.15) !important;
    border-color: rgba(174,106,250,.30) !important;
  }
  #nav.open .wt-menu-icon { display: none !important; }
  #nav.open .wt-menu-close { display: block !important; }
  #nav .account-menu .account-popover {
    top: calc(100% + 15px) !important;
    right: -54px !important;
    left: auto !important;
    width: min(328px, calc(100vw - 28px)) !important;
    max-height: calc(100dvh - 95px) !important;
    overflow-y: auto !important;
    transform-origin: top right !important;
  }
  html[data-theme="light"] #nav.open .nav-links {
    background: #fff !important;
    border-color: #e7dff1 !important;
    box-shadow: 0 25px 60px -17px rgba(38,15,73,.30) !important;
  }
  html[data-theme="light"] #nav .wt-nav-menu-head { color: #746881 !important; }
  html[data-theme="light"] #nav .wt-nav-menu-label { color: #aaa1b6 !important; }
  html[data-theme="light"] #nav .wt-nav-mobile-icon {
    background: #f5efff !important;
    color: #9650e7 !important;
  }
  html[data-theme="light"] #nav .nav-links a { color: #30283b !important; }
  html[data-theme="light"] #nav .nav-links a:hover,
  html[data-theme="light"] #nav .nav-links a:focus-visible { color: #2b1c40 !important; background: #f7f2ff !important; }
  html[data-theme="light"] #nav .nav-links a.is-active,
  html[data-theme="light"] #nav .nav-links a[aria-current="page"] { color: #6e24cd !important; background: #f6efff !important; border-color: #ead8ff !important; }
  html[data-theme="light"] .wt-nav-scrim { background: rgba(17,11,29,.37); }
}

@media (max-width: 370px) {
  #nav .account-menu .account-trigger { padding: 0 11px !important; gap: 6px !important; }
  #nav .account-menu .account-trigger span { font-size: 12px !important; }
  #nav .account-menu .account-popover { right: -44px !important; }
  #nav.open .nav-links { padding: 9px !important; }
}
@media (prefers-reduced-motion: reduce) {
  #nav.open .nav-links,
  #nav .account-menu .account-popover { animation: none !important; }
  .wt-nav-scrim { transition: none; }
}


/* V5 — unobstructed phone menu and simpler account dropdown (shared by both pages). */
/* Never dim/blend the page when either dropdown is opened. */
.wt-nav-scrim, .wt-nav-scrim.is-visible {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  background: transparent !important;
  pointer-events: none !important;
  backdrop-filter: none !important;
}
/* One account trigger, no rectangle, decorative pseudo elements or extra layer behind. */
#nav .account-menu, #nav .account-menu[open] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  padding: 0 !important;
}
#nav .account-menu::before, #nav .account-menu::after,
#nav .account-trigger::before, #nav .account-trigger::after,
#nav .nav-actions::before, #nav .nav-actions::after { content: none !important; display: none !important; }
#nav .account-menu .account-trigger {
  border: 1px solid rgba(175,128,236,.20) !important;
  border-radius: 999px !important;
  background: #111016 !important;
  color: #f6f3fb !important;
  box-shadow: none !important;
  outline: none;
}
#nav .account-menu .account-trigger:hover,
#nav .account-menu[open] .account-trigger {
  background: #1a1524 !important;
  border-color: rgba(172,106,255,.46) !important;
  box-shadow: none !important;
}
#nav .account-menu .account-trigger:focus-visible {
  outline: 2px solid #ac6cff !important;
  outline-offset: 3px !important;
}
html[data-theme="light"] #nav .account-menu .account-trigger {
  background: #fff !important;
  color: #292132 !important;
  border-color: #e6ddeb !important;
  box-shadow: none !important;
}
html[data-theme="light"] #nav .account-menu .account-trigger:hover,
html[data-theme="light"] #nav .account-menu[open] .account-trigger {
  background: #f9f5ff !important;
  border-color: #c8a6f6 !important;
  box-shadow: none !important;
}
/* Calm, clear hierarchy: account identity, primary destination, separate exit action. */
#nav .account-menu .account-popover {
  padding: 13px !important;
  border-radius: 20px !important;
  background: #111016 !important;
  border: 1px solid #30243c !important;
  box-shadow: 0 20px 48px rgba(0,0,0,.40) !important;
}
#nav .account-popover .account-profile {
  background: rgba(162,102,246,.065) !important;
  border: 1px solid rgba(168,117,237,.10) !important;
  border-radius: 14px !important;
  padding: 13px !important;
  margin: 0 0 9px !important;
  min-width: 0 !important;
}
#nav .account-popover .account-avatar {
  border-radius: 13px !important;
  flex: 0 0 44px !important;
}
#nav .account-popover .account-profile-text { min-width: 0 !important; }
#nav .account-popover .account-profile-text strong {
  overflow-wrap: anywhere !important;
  font-size: 14px !important;
}
#nav .account-popover .account-option {
  min-height: 49px !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
#nav .account-popover a.account-option {
  color: #f6f1ff !important;
  background: rgba(151,82,242,.10) !important;
}
#nav .account-popover a.account-option:hover {
  background: rgba(151,82,242,.19) !important;
}
#nav .account-popover .account-logout {
  margin: 9px 0 0 !important;
  padding: 9px 0 0 !important;
}
#nav .account-popover .account-option-danger {
  color: #ff9aad !important;
  font-weight: 500 !important;
}
html[data-theme="light"] #nav .account-menu .account-popover {
  background: #fff !important;
  border-color: #e7ddee !important;
  box-shadow: 0 18px 44px rgba(41,20,68,.16) !important;
}
html[data-theme="light"] #nav .account-popover .account-profile {
  background: #f9f6ff !important;
  border-color: #eee6fa !important;
}
html[data-theme="light"] #nav .account-popover a.account-option {
  color: #512782 !important;
  background: #f5edff !important;
}
html[data-theme="light"] #nav .account-popover a.account-option:hover { background: #eee0ff !important; }
html[data-theme="light"] #nav .account-popover .account-option-danger { color: #c43b60 !important; }
@media(max-width:820px) {
  #nav.open .nav-links { z-index: 150 !important; }
  #nav .account-menu .account-popover { z-index: 160 !important; }
  #nav .account-menu .account-trigger { min-height: 40px !important; }
}

/* V6: neutral black, centered identity. All selectors scoped to account dropdown. */
#nav .account-menu .account-popover.wt-account-v6,
html[data-theme="light"] #nav .account-menu .account-popover.wt-account-v6 {
  width: min(340px, calc(100vw - 28px)) !important;
  padding: 18px !important;
  background: #000000 !important;
  border: 1px solid #292929 !important;
  border-radius: 22px !important;
  color: #f8f8f8 !important;
  box-shadow: 0 22px 55px rgba(0,0,0,.48) !important;
  overflow: hidden !important;
}
#nav .wt-account-v6 .wt-account-identity,
html[data-theme="light"] #nav .wt-account-v6 .wt-account-identity {
  display: flex !important;
  align-items: center !important;
  flex-direction: column !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 6px 0 18px !important;
  border: none !important;
  border-bottom: 1px solid #262626 !important;
  border-radius: 0 !important;
  background: #000 !important;
  text-align: center !important;
}
#nav .wt-account-v6 .wt-account-avatar-frame {
  display: grid !important;
  place-items: center !important;
  width: 88px !important;
  height: 88px !important;
  margin-bottom: 3px !important;
  padding: 4px !important;
  border: 1px solid #404040 !important;
  border-radius: 50% !important;
  background: #111 !important;
  overflow: hidden !important;
}
#nav .wt-account-v6 .wt-account-avatar-image {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  background: #090909 !important;
}
#nav .wt-account-v6 .wt-account-user-line,
#nav .wt-account-v6 .wt-account-type-line {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 5px 7px !important;
  width: 100% !important;
  line-height: 1.45 !important;
  color: #f5f5f5 !important;
  font-size: 13px !important;
}
#nav .wt-account-v6 .wt-account-field-label {
  color: #9f9f9f !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}
#nav .wt-account-v6 .wt-account-username {
  max-width: 180px !important;
  overflow-wrap: anywhere !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #fff !important;
}
#nav .wt-account-v6 .wt-account-type-line strong { color:#fff !important; font-weight:600 !important; }
#nav .wt-account-v6 .wt-verified-badge { width: 17px !important; height:17px !important; }
#nav .wt-account-v6 .account-option.wt-account-action,
html[data-theme="light"] #nav .wt-account-v6 .account-option.wt-account-action {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 48px !important;
  margin-top: 10px !important;
  padding: 11px 13px !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: #f5f5f5 !important;
  font-weight: 600 !important;
  text-align: left !important;
}
#nav .wt-account-v6 .account-option.wt-account-action:hover,
html[data-theme="light"] #nav .wt-account-v6 .account-option.wt-account-action:hover { background: #161616 !important; }
#nav .wt-account-v6 .account-logout {
  padding-top: 9px !important;
  margin-top: 7px !important;
  border-top: 1px solid #262626 !important;
}
#nav .wt-account-v6 .account-option-danger.wt-account-action,
html[data-theme="light"] #nav .wt-account-v6 .account-option-danger.wt-account-action { color: #ff8c9c !important; }
#nav .wt-account-v6 .account-option-danger.wt-account-action:hover { background: #1d1114 !important; }
@media (max-width: 820px) {
  #nav .account-menu .account-popover.wt-account-v6 { right: -44px !important; max-width:calc(100vw - 22px) !important; }
}


/* V7 — opaque mobile navigation panel: no hero/text bleed-through. */
@media (max-width: 820px) {
  html #nav.open .nav-links,
  html[data-theme="dark"] #nav.open .nav-links,
  html[data-theme="light"] #nav.open .nav-links {
    background: #000000 !important;
    background-color: #000000 !important;
    background-image: none !important;
    opacity: 1 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    isolation: isolate !important;
    border-color: #292929 !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.42) !important;
  }
  /* Keep the page unchanged; only the navigation panel is solid. */
  .wt-nav-scrim,
  .wt-nav-scrim.is-visible { display: none !important; opacity: 0 !important; }
  html[data-theme="light"] #nav .nav-links a { color: #f5f5f5 !important; }
  html[data-theme="light"] #nav .wt-nav-menu-head { color: #b2b2b2 !important; }
  html[data-theme="light"] #nav .wt-nav-menu-label { color: #909090 !important; }
  html[data-theme="light"] #nav .nav-links a:hover,
  html[data-theme="light"] #nav .nav-links a:focus-visible { background: #151515 !important; color: #fff !important; }
  html[data-theme="light"] #nav .nav-links a.is-active,
  html[data-theme="light"] #nav .nav-links a[aria-current="page"] { background: #171020 !important; color: #fff !important; border-color: #33213f !important; }
}

/* V8 — mobile menu follows light/dark theme; icons have no background tiles. */
@media (max-width: 820px) {
  html[data-theme="light"] #nav.open .nav-links {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    color: #1b1428 !important;
    border-color: #e9e2ef !important;
    box-shadow: 0 18px 42px rgba(37,20,64,.16) !important;
    opacity: 1 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  html[data-theme="dark"] #nav.open .nav-links {
    background: #000000 !important;
    background-color: #000000 !important;
    background-image: none !important;
    border-color: #292929 !important;
    opacity: 1 !important;
  }
  #nav .wt-nav-mobile-icon,
  html[data-theme="light"] #nav .wt-nav-mobile-icon,
  html[data-theme="dark"] #nav .wt-nav-mobile-icon {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 25px !important;
    width: 25px !important;
    height: 25px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    outline: 0 !important;
    color: #a978ed !important;
  }
  #nav .wt-nav-mobile-icon svg {
    width: 21px !important;
    height: 21px !important;
    filter: none !important;
  }
  html[data-theme="light"] #nav .wt-nav-mobile-icon { color: #893de2 !important; }
  html[data-theme="light"] #nav .wt-nav-menu-head { color: #62546f !important; }
  html[data-theme="light"] #nav .wt-nav-menu-label { color: #7f758b !important; }
  html[data-theme="light"] #nav .nav-links a { color: #261e31 !important; }
  html[data-theme="light"] #nav .nav-links a:hover,
  html[data-theme="light"] #nav .nav-links a:focus-visible {
    background: #f7f2fc !important;
    color: #261e31 !important;
  }
  html[data-theme="light"] #nav .nav-links a.is-active,
  html[data-theme="light"] #nav .nav-links a[aria-current="page"] {
    background: #f7f1ff !important;
    background-image: none !important;
    color: #6928c2 !important;
    border-color: #e8d9f9 !important;
  }
  html[data-theme="dark"] #nav .nav-links a.is-active,
  html[data-theme="dark"] #nav .nav-links a[aria-current="page"] {
    background: #160d22 !important;
    background-image: none !important;
  }
}


/* V9 — Account dropdown follows the selected theme, while mobile menu remains unchanged. */
html[data-theme="light"] #nav .account-menu .account-popover.wt-account-v6 {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  color: #21182e !important;
  border-color: #e7e0ed !important;
  box-shadow: 0 20px 48px rgba(37, 21, 56, .16) !important;
}
html[data-theme="light"] #nav .wt-account-v6 .wt-account-identity {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #21182e !important;
  border-bottom-color: #e9e3ef !important;
}
html[data-theme="light"] #nav .wt-account-v6 .wt-account-avatar-frame {
  background: #f7f3fb !important;
  border-color: #e2d9eb !important;
}
html[data-theme="light"] #nav .wt-account-v6 .wt-account-avatar-image {
  background: #f7f3fb !important;
}
html[data-theme="light"] #nav .wt-account-v6 .wt-account-user-line,
html[data-theme="light"] #nav .wt-account-v6 .wt-account-type-line,
html[data-theme="light"] #nav .wt-account-v6 .wt-account-username,
html[data-theme="light"] #nav .wt-account-v6 .wt-account-type-line strong {
  color: #21182e !important;
}
html[data-theme="light"] #nav .wt-account-v6 .wt-account-field-label {
  color: #756c80 !important;
}
html[data-theme="light"] #nav .wt-account-v6 .account-option.wt-account-action {
  color: #2a2036 !important;
  background: transparent !important;
}
html[data-theme="light"] #nav .wt-account-v6 .account-option.wt-account-action:hover,
html[data-theme="light"] #nav .wt-account-v6 .account-option.wt-account-action:focus-visible {
  color: #21182e !important;
  background: #f5f0fa !important;
}
html[data-theme="light"] #nav .wt-account-v6 .account-logout {
  border-top-color: #e9e3ef !important;
}
html[data-theme="light"] #nav .wt-account-v6 .account-option-danger.wt-account-action {
  color: #bf3f62 !important;
}
html[data-theme="light"] #nav .wt-account-v6 .account-option-danger.wt-account-action:hover,
html[data-theme="light"] #nav .wt-account-v6 .account-option-danger.wt-account-action:focus-visible {
  background: #fff1f5 !important;
  color: #b63358 !important;
}
html[data-theme="light"] #nav .wt-account-v6 .account-option-danger.wt-account-action svg {
  color: #bf3f62 !important;
}