/*
 * CyberManager dark theme: topbar, navigation popovers and messenger.
 *
 * This file is intentionally loaded after the legacy topbar CSS. Keep all
 * dark-theme-only corrections here instead of adding more !important rules
 * to static/css/components/topbar.css.
 */

html[data-theme="dark"] {
  --topbar-bg-dark: rgba(41, 41, 41, .96);
  --topbar-surface-dark: #303030;
  --topbar-surface-hover-dark: #373737;
  --topbar-surface-active-dark: #3b3b3b;
  --topbar-popover-dark: #323232;
  --topbar-text-dark: #ededed;
  --topbar-muted-dark: #ababab;
  --topbar-shadow-dark: 0 22px 58px rgba(0, 0, 0, .30);

  --message-shell-dark: #2f2f2f;
  --message-sidebar-dark: #323232;
  --message-content-dark: #2f2f2f;
  --message-card-dark: #393939;
  --message-card-hover-dark: #404040;
  --message-card-active-dark: #3c4848;
  --message-own-dark: #354545;
  --message-field-dark: #383838;
}

/* Top bar and primary navigation. */
html[data-theme="dark"] .topbar {
  background: var(--topbar-bg-dark) !important;
  border-bottom-color: rgba(255, 255, 255, .055) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .18) !important;
}

html[data-theme="dark"] .topbar .nav-btn.topbar-primary-link {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--topbar-muted-dark) !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-theme="dark"] .topbar .nav-btn.topbar-primary-link:hover,
html[data-theme="dark"] .topbar .nav-btn.topbar-primary-link:focus-visible {
  background: var(--topbar-surface-hover-dark) !important;
  border-color: transparent !important;
  color: var(--topbar-text-dark) !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-theme="dark"] .topbar .nav-btn.topbar-primary-link.active,
html[data-theme="dark"] .topbar-dropdown:has(.topbar-submenu-link.active) > .topbar-primary-link,
html[data-theme="dark"] .topbar-more-dropdown.has-active > .topbar-primary-link {
  background: var(--topbar-surface-active-dark) !important;
  border-color: transparent !important;
  color: var(--text-primary) !important;
  box-shadow: inset 0 -2px 0 rgba(var(--brand-rgb), .72) !important;
}

html[data-theme="dark"] .topbar .nav-btn.topbar-primary-link.active:hover,
html[data-theme="dark"] .topbar-dropdown:has(.topbar-submenu-link.active) > .topbar-primary-link:hover,
html[data-theme="dark"] .topbar-more-dropdown.has-active > .topbar-primary-link:hover {
  background: #404040 !important;
}

/* Navigation dropdowns: separation by surface and shadow, not outlines. */
html[data-theme="dark"] :where(
  .topbar-rich-submenu,
  .topbar-account-submenu,
  .topbar-workspace-popover,
  .notifPopover,
  .topbarSystemNotificationPopover,
  .workActionPopover
) {
  background: var(--topbar-popover-dark) !important;
  border: 0 !important;
  box-shadow: var(--topbar-shadow-dark) !important;
}

html[data-theme="dark"] :where(
  .topbar-submenu,
  .topbar-account-submenu,
  .topbar-workspace-popover
)::before {
  display: none !important;
  border: 0 !important;
}

html[data-theme="dark"] .topbar-rich-submenu .topbar-submenu-link,
html[data-theme="dark"] .topbar-account-submenu .topbar-submenu-link,
html[data-theme="dark"] .topbar-workspace-row {
  background: transparent !important;
  border: 0 !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .topbar-rich-submenu .topbar-submenu-link:hover,
html[data-theme="dark"] .topbar-rich-submenu .topbar-submenu-link:focus-visible,
html[data-theme="dark"] .topbar-account-submenu .topbar-submenu-link:hover,
html[data-theme="dark"] .topbar-account-submenu .topbar-submenu-link:focus-visible,
html[data-theme="dark"] .topbar-workspace-row:hover,
html[data-theme="dark"] .topbar-workspace-row:focus-visible {
  background: var(--topbar-surface-hover-dark) !important;
  color: var(--text-primary) !important;
}

html[data-theme="dark"] .topbar-submenu-glyph,
html[data-theme="dark"] .topbar-nav-glyph {
  background: #3a4444 !important;
  color: #9adcdc !important;
  box-shadow: none !important;
}

/* Account popover and tariff card. */
html[data-theme="dark"] .topbar-account-profile-card {
  background: var(--topbar-surface-dark) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .topbar-account-profile-bg {
  opacity: 1 !important;
  filter: none !important;
  background-color: #303030 !important;
  background-blend-mode: luminosity !important;
}

html[data-theme="dark"] .topbar-account-profile-bg::after,
html[data-theme="dark"] .topbar-account-profile-bg.has-bg::after {
  background: linear-gradient(180deg, rgba(42, 42, 42, .72), rgba(48, 48, 48, .96)) !important;
  backdrop-filter: blur(1px) saturate(.55) !important;
}

html[data-theme="dark"] .topbar-account-profile-main,
html[data-theme="dark"] .topbar-account-profile-text,
html[data-theme="dark"] .topbar-account-profile-text b {
  color: var(--text-primary) !important;
}

html[data-theme="dark"] .topbar-account-profile-text span,
html[data-theme="dark"] .topbar-active-tariff-kicker,
html[data-theme="dark"] .topbar-active-tariff-card .topbar-tariff-expires {
  color: var(--text-muted) !important;
}

html[data-theme="dark"] .topbar-active-tariff-card {
  background: #383838 !important;
  border: 0 !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .topbar-active-tariff-card:hover,
html[data-theme="dark"] .topbar-active-tariff-card:focus-visible {
  background: #404040 !important;
}

html[data-theme="dark"] .topbar-active-tariff-card .topbar-tariff-name {
  color: var(--text-primary) !important;
}

/* Messenger shell. Borders are removed; hierarchy is created by surfaces. */
html[data-theme="dark"] :where(#msgPanel, .msgPanel) {
  --msg-line: transparent;
  --msg-bg: var(--message-shell-dark);
  --msg-slate: var(--text-primary);
  --msg-muted: var(--text-muted);
  background: var(--message-shell-dark) !important;
  border: 0 !important;
  box-shadow: 0 28px 78px rgba(0, 0, 0, .42) !important;
}

html[data-theme="dark"] :where(
  .msgHead,
  .msgTabs,
  .msgPaneHost,
  .msgBody,
  .msgRight,
  .marketRight,
  .msgDialogHead,
  .msgDialog,
  .msgSend,
  .msgAttachPreview
) {
  background: var(--message-content-dark) !important;
  border-color: transparent !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .msgHead {
  background: #333333 !important;
}

html[data-theme="dark"] .msgTabs {
  background: #303030 !important;
  border-bottom: 0 !important;
}

html[data-theme="dark"] .msgLeft,
html[data-theme="dark"] .marketLeft {
  background: var(--message-sidebar-dark) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] :where(
  .msgHeadText b,
  .msgHead .auto-topbar-2,
  .msgDialogHeadInner b,
  .threadName,
  .marketMsgText,
  .marketPremiumTitle,
  .attName
) {
  color: var(--text-primary) !important;
}

html[data-theme="dark"] :where(
  .msgHeadSub,
  .msgDialogHead .muted,
  .msgTypingLine,
  .threadLast,
  .msgSenderLine,
  .bubbleMeta,
  .marketDialogHeadMeta,
  .marketPremiumText
) {
  color: var(--text-muted) !important;
}

html[data-theme="dark"] :where(.msgSearch, .msgInput, .marketSelect, .msgNewChatSearchInput) {
  background: var(--message-field-dark) !important;
  border: 0 !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] :where(.msgSearch, .msgInput, .marketSelect, .msgNewChatSearchInput)::placeholder {
  color: var(--text-faint) !important;
}

html[data-theme="dark"] :where(.msgSearch, .msgInput, .marketSelect, .msgNewChatSearchInput):focus {
  background: #3d3d3d !important;
  border: 0 !important;
  box-shadow: 0 0 0 3px rgba(var(--brand-rgb), .17) !important;
}

html[data-theme="dark"] .msgMiniBtn,
html[data-theme="dark"] #msgNewChatBtn,
html[data-theme="dark"] .marketReadAllBtn,
html[data-theme="dark"] .marketUnwatchBtn {
  background: #393939 !important;
  border: 0 !important;
  color: var(--text-secondary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .msgMiniBtn:hover,
html[data-theme="dark"] #msgNewChatBtn:hover,
html[data-theme="dark"] .marketReadAllBtn:hover,
html[data-theme="dark"] .marketUnwatchBtn:hover {
  background: #424242 !important;
  color: var(--text-primary) !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-theme="dark"] .msgTabBtn {
  background: #383838 !important;
  border: 0 !important;
  color: var(--text-secondary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .msgTabBtn:hover {
  background: #404040 !important;
  color: var(--text-primary) !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-theme="dark"] .msgTabBtn.isActive {
  background: #465252 !important;
  color: #eafafa !important;
  border: 0 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .thread {
  background: var(--message-card-dark) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .thread:hover {
  background: var(--message-card-hover-dark) !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-theme="dark"] .thread.active {
  background: var(--message-card-active-dark) !important;
  border: 0 !important;
  box-shadow: inset 3px 0 0 rgba(var(--brand-rgb), .72) !important;
}

html[data-theme="dark"] .thread.pinned::before {
  box-shadow: none !important;
}

html[data-theme="dark"] .threadAvatar,
html[data-theme="dark"] .msgDialogAvatar {
  background: #424242 !important;
  border: 0 !important;
}

html[data-theme="dark"] .threadBadge,
html[data-theme="dark"] .msgTabBadge {
  border-color: transparent !important;
}

html[data-theme="dark"] .threadPin,
html[data-theme="dark"] .threadDel {
  color: var(--text-faint) !important;
}

html[data-theme="dark"] .threadPin:hover,
html[data-theme="dark"] .threadDel:hover {
  background: #464646 !important;
  color: var(--text-primary) !important;
}

html[data-theme="dark"] .bubble {
  background: var(--message-card-dark) !important;
  border: 0 !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .bubble.me {
  background: var(--message-own-dark) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .sysLine,
html[data-theme="dark"] .marketPremiumState,
html[data-theme="dark"] .marketUnreadOnly,
html[data-theme="dark"] .attChip {
  background: #383838 !important;
  border: 0 !important;
  color: var(--text-secondary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .msgSendBtn {
  background: #444444 !important;
  border: 0 !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .msgSendBtn:hover {
  background: #4c4c4c !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-theme="dark"] .msgNewChatPicker,
html[data-theme="dark"] .msgGroupSettings {
  background: rgba(10, 10, 10, .74) !important;
}

html[data-theme="dark"] .msgNewChatCard,
html[data-theme="dark"] .msgGroupSettingsCard {
  background: var(--message-shell-dark) !important;
  border: 0 !important;
  color: var(--text-primary) !important;
  box-shadow: 0 28px 78px rgba(0, 0, 0, .42) !important;
}

html[data-theme="dark"] .msgThreads::-webkit-scrollbar-thumb,
html[data-theme="dark"] .msgDialog::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb) !important;
}

@media (max-width: 720px) {
  html[data-theme="dark"] .topbar {
    background: var(--topbar-bg-dark) !important;
    border-bottom-color: rgba(255, 255, 255, .055) !important;
  }
}

/* Small controls injected into the messenger by storage_picker.js. */
html[data-theme="dark"] .msgSend .storagePickerInlineBtn,
html[data-theme="dark"] .marketSend .storagePickerInlineBtn {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--text-secondary) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .msgSend .storagePickerInlineBtn:hover,
html[data-theme="dark"] .marketSend .storagePickerInlineBtn:hover {
  background: rgba(32, 196, 200, .10) !important;
  border-color: rgba(32, 196, 200, .40) !important;
  color: var(--accent) !important;
}

html[data-theme="dark"] .topbar-account-actions,
html[data-theme="dark"] .topbar-workspace-popover-head,
html[data-theme="dark"] .topbar-workspace-current {
  border-color: transparent !important;
}

html[data-theme="dark"] .topbar-rich-submenu .topbar-submenu-link.active,
html[data-theme="dark"] .topbar-account-submenu .topbar-submenu-link.active,
html[data-theme="dark"] .topbar-workspace-row.is-current {
  background: #3c4646 !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
}


/* v464: remove brand plate in dark theme. */
html[data-theme="dark"] .topbar-brand,
html[data-theme="dark"] .topbar-brand:hover{
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}


/* v465: topbar interaction polish. */
html[data-theme="dark"] #notifPopover{background:var(--popover-bg)!important;border:1px solid var(--popover-border)!important;box-shadow:var(--shadow-lg)!important}


/* v466: theme control in topbar. */
html[data-theme="dark"] .themeControlWrap{position:relative}
html[data-theme="dark"] #themeToggleBtn-001{width:42px;height:42px;border-radius:14px;border:0;background:var(--surface-2);display:inline-flex;align-items:center;justify-content:center;position:relative;color:var(--text-primary);box-shadow:none;overflow:hidden}
html[data-theme="dark"] #themeToggleBtn-001:hover{background:var(--surface-3)}
html[data-theme="dark"] .themeControlBtnIcon{position:absolute;width:18px;height:18px;transition:transform .24s ease,opacity .24s ease}
html[data-theme="dark"] .themeControlBtnIcon--sun{opacity:0;transform:translateY(10px) scale(.82)}
html[data-theme="dark"] .themeControlBtnIcon--moon{opacity:1;transform:translateY(0) scale(1)}
html[data-theme="dark"] #themeToggleBtn-001[data-theme-active="light"] .themeControlBtnIcon--sun{opacity:1;transform:translateY(0) scale(1)}
html[data-theme="dark"] #themeToggleBtn-001[data-theme-active="light"] .themeControlBtnIcon--moon{opacity:0;transform:translateY(-10px) scale(.82)}
html[data-theme="dark"] .themeControlPopover{position:absolute;top:calc(100% + 12px);right:0;min-width:300px;padding:14px;border-radius:18px;background:var(--popover-bg);border:1px solid var(--popover-border);box-shadow:var(--shadow-lg);z-index:1200}
html[data-theme="dark"] .themeControlPopoverHead{display:flex;flex-direction:column;gap:3px;margin-bottom:12px}
html[data-theme="dark"] .themeControlPopoverHead b{font-size:14px;color:var(--text-primary)}
html[data-theme="dark"] .themeControlPopoverHead span{font-size:12px;color:var(--text-secondary)}
html[data-theme="dark"] .themeControlSwitchRail{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:6px;border-radius:18px;background:var(--surface-sunken)}
html[data-theme="dark"] .themeControlSliderKnob{position:absolute;top:6px;left:6px;width:calc(50% - 10px);height:calc(100% - 12px);border-radius:14px;background:linear-gradient(135deg, rgba(39,199,199,.92), rgba(21,159,161,.88));box-shadow:0 12px 28px rgba(0,0,0,.25);transition:transform .26s ease}
html[data-theme="dark"] .themeControlOption{position:relative;z-index:1;display:flex;align-items:center;gap:10px;padding:10px 12px;border:0;border-radius:14px;background:transparent;color:var(--text-primary);text-align:left;cursor:pointer}
html[data-theme="dark"] .themeControlOptionText{display:flex;flex-direction:column;gap:2px}
html[data-theme="dark"] .themeControlOptionText strong{font-size:13px;font-weight:800}
html[data-theme="dark"] .themeControlOptionText small{font-size:11px;color:rgba(255,255,255,.84)}
html[data-theme="dark"] .themeControlOption:not(.is-active):hover{background:rgba(255,255,255,.04)}
html[data-theme="dark"] .themeControlOption .reportsAdsBulkThemePreview{width:48px;height:34px;padding:4px;border-radius:10px}


/* v466b: generic theme control preview tiles. */
.themeControlOption--light .reportsAdsBulkThemePreview{background:#f5f8fc;border-color:#d5e0ea}
.themeControlOption--light .reportsAdsBulkThemePreview i:first-child{background:#dce6ef}
.themeControlOption--light .reportsAdsBulkThemePreview i:nth-child(2){background:#fff;box-shadow:inset 0 0 0 1px #d5e0ea}
.themeControlOption--light .reportsAdsBulkThemePreview i:nth-child(3){background:#169f9b}
.themeControlOption--dark .reportsAdsBulkThemePreview{background:#2f2f2f;border-color:#4a4a4a}
.themeControlOption--dark .reportsAdsBulkThemePreview i:first-child{background:#404040}
.themeControlOption--dark .reportsAdsBulkThemePreview i:nth-child(2){background:#353535}
.themeControlOption--dark .reportsAdsBulkThemePreview i:nth-child(3){background:#27c7c7}
html[data-theme="light"] .themeControlWrap{position:relative}
html[data-theme="light"] #themeToggleBtn-001{width:42px;height:42px;border-radius:14px;border:1px solid var(--control-border);background:var(--surface-1);display:inline-flex;align-items:center;justify-content:center;position:relative;color:var(--text-primary);box-shadow:none;overflow:hidden}
html[data-theme="light"] .themeControlBtnIcon{position:absolute;width:18px;height:18px;transition:transform .24s ease,opacity .24s ease}
html[data-theme="light"] .themeControlBtnIcon--sun{opacity:1;transform:translateY(0) scale(1)}
html[data-theme="light"] .themeControlBtnIcon--moon{opacity:0;transform:translateY(-10px) scale(.82)}
html[data-theme="light"] #themeToggleBtn-001[data-theme-active="dark"] .themeControlBtnIcon--moon{opacity:1;transform:translateY(0) scale(1)}
html[data-theme="light"] #themeToggleBtn-001[data-theme-active="dark"] .themeControlBtnIcon--sun{opacity:0;transform:translateY(10px) scale(.82)}
html[data-theme="light"] .themeControlPopover{position:absolute;top:calc(100% + 12px);right:0;min-width:300px;padding:14px;border-radius:18px;background:var(--popover-bg);border:1px solid var(--popover-border);box-shadow:var(--shadow-lg);z-index:1200}
html[data-theme="light"] .themeControlPopoverHead{display:flex;flex-direction:column;gap:3px;margin-bottom:12px}
html[data-theme="light"] .themeControlSwitchRail{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:6px;border-radius:18px;background:var(--surface-sunken)}
html[data-theme="light"] .themeControlSliderKnob{position:absolute;top:6px;left:6px;width:calc(50% - 10px);height:calc(100% - 12px);border-radius:14px;background:linear-gradient(135deg, rgba(25,195,195,.92), rgba(21,159,161,.88));box-shadow:0 12px 28px rgba(15,23,42,.18);transition:transform .26s ease}
html[data-theme="light"] .themeControlOption{position:relative;z-index:1;display:flex;align-items:center;gap:10px;padding:10px 12px;border:0;border-radius:14px;background:transparent;color:var(--text-primary);text-align:left;cursor:pointer}
html[data-theme="light"] .themeControlOptionText{display:flex;flex-direction:column;gap:2px}
html[data-theme="light"] .themeControlOptionText strong{font-size:13px;font-weight:800}
html[data-theme="light"] .themeControlOptionText small{font-size:11px;color:var(--text-secondary)}
html[data-theme="light"] .themeControlOption .reportsAdsBulkThemePreview{width:48px;height:34px;padding:4px;border-radius:10px}


/* v467: expanded three-mode theme chooser. */
.themeControlWrap{position:relative;display:inline-flex;flex:0 0 auto}
#themeControlPopover-001.themeControlPopover{
  width:min(650px,calc(100vw - 28px))!important;min-width:min(650px,calc(100vw - 28px))!important;
  padding:16px!important;border-radius:22px!important;
}
#themeControlPopover-001 .themeControlPopoverHead{margin-bottom:14px!important;padding:2px 4px!important}
#themeControlPopover-001 .themeControlPopoverHead b{font-size:16px!important}
#themeControlPopover-001 .themeControlPopoverHead span{font-size:12px!important;color:var(--text-secondary)!important}
#themeControlSwitchRail.themeControlSwitchRail{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;
  padding:7px!important;border-radius:20px!important;background:var(--surface-sunken)!important;position:relative!important;
}
#themeControlSwitchRail .themeControlSliderKnob{
  top:7px!important;left:7px!important;width:calc((100% - 30px)/3)!important;height:calc(100% - 14px)!important;
  border-radius:15px!important;transition:transform .26s cubic-bezier(.2,.8,.2,1)!important;
}
#themeControlSwitchRail .themeControlOption{
  min-width:0!important;min-height:122px!important;display:flex!important;flex-direction:column!important;
  justify-content:center!important;align-items:center!important;gap:9px!important;padding:12px 10px!important;
  border:0!important;border-radius:15px!important;text-align:center!important;background:transparent!important;
}
#themeControlSwitchRail .themeControlOptionText{align-items:center!important;text-align:center!important}
#themeControlSwitchRail .themeControlOptionText strong{font-size:14px!important;color:var(--text-primary)!important}
#themeControlSwitchRail .themeControlOptionText small{font-size:11px!important;line-height:1.25!important;color:var(--text-secondary)!important}
#themeControlSwitchRail .themeControlOption.is-active .themeControlOptionText strong,
#themeControlSwitchRail .themeControlOption.is-active .themeControlOptionText small{color:#fff!important}
#themeControlSwitchRail .reportsAdsBulkThemePreview{width:78px!important;height:52px!important;padding:6px!important;border-radius:12px!important}
.themeControlOption--system .reportsAdsBulkThemePreview{background:linear-gradient(90deg,#f5f8fc 0 50%,#2f2f2f 50% 100%)!important;border-color:#707070!important}
.themeControlOption--system .reportsAdsBulkThemePreview i:first-child{background:linear-gradient(90deg,#dce6ef 0 50%,#404040 50% 100%)!important}
.themeControlOption--system .reportsAdsBulkThemePreview i:nth-child(2){background:#fff!important;box-shadow:inset 0 0 0 1px #d5e0ea!important}
.themeControlOption--system .reportsAdsBulkThemePreview i:nth-child(3){background:#27c7c7!important}
@media(max-width:720px){
  #themeControlPopover-001.themeControlPopover{left:10px!important;right:10px!important;width:auto!important;min-width:0!important;padding:12px!important}
  #themeControlSwitchRail .themeControlOption{min-height:104px!important;padding:9px 5px!important}
  #themeControlSwitchRail .reportsAdsBulkThemePreview{width:58px!important;height:40px!important}
  #themeControlSwitchRail .themeControlOptionText small{display:none!important}
}


/* v468: active tab uses a soft bottom glow in both themes, never an underline. */
html[data-theme] :is(
  .topbar .nav-btn.topbar-primary-link.active,
  .topbar-dropdown:has(.topbar-submenu-link.active) > .topbar-primary-link,
  .topbar-more-dropdown.has-active > .topbar-primary-link
){
  border:0!important;
  color:var(--text-primary)!important;
  background:linear-gradient(180deg,transparent 34%,rgba(var(--brand-rgb),.11) 100%)!important;
  box-shadow:inset 0 -12px 16px -17px rgba(var(--brand-rgb),.95)!important;
}
html[data-theme] :is(
  .topbar .nav-btn.topbar-primary-link.active,
  .topbar-dropdown:has(.topbar-submenu-link.active) > .topbar-primary-link,
  .topbar-more-dropdown.has-active > .topbar-primary-link
)::after{content:none!important;display:none!important}

/* v2026.08.15.556 — messenger action/date/policy states in dark theme. */
html[data-theme="dark"] .threadPin.is-active,
html[data-theme="dark"] .threadPin[aria-pressed="true"] {
  background: color-mix(in srgb, var(--accent, #20c4c8) 18%, #2f2f2f) !important;
  color: var(--accent, #20c4c8) !important;
}
html[data-theme="dark"] .msgPolicyNotice {
  border-color: color-mix(in srgb, #ef4444 45%, #3a3a3a) !important;
  background: color-mix(in srgb, #ef4444 11%, #2b2b2b) !important;
  color: #fecaca !important;
}
html[data-theme="dark"] #msgPanel .msgPanelDateSeparator span {
  background: var(--message-content-dark, #292929) !important;
  color: var(--text-faint, #a8a8a8) !important;
}

/* v2026.08.15.564 — mobile More features + rebuilt messenger surfaces. */
@media (max-width:960px){
  html[data-theme="light"] .topbar-mobile-sheet-features .topbar-workspace-btn,
  html[data-theme="light"] .topbar-mobile-sheet-features .workMainBtn{
    background:#f7fafc!important;
    border-color:#dbe5ec!important;
    color:#20354e!important;
  }
  html[data-theme="dark"] .topbar-mobile-sheet-features .topbar-workspace-btn,
  html[data-theme="dark"] .topbar-mobile-sheet-features .workMainBtn{
    background:#303438!important;
    border-color:#444b52!important;
    color:#eef3f6!important;
  }
  html[data-theme="dark"] .topbar-mobile-feature-label{color:#98a6b3!important;}
  html[data-theme="dark"] .topbar-mobile-workspace-mount .topbar-workspace-popover,
  html[data-theme="dark"] .topbar-mobile-work-mount .workActionPopover{
    background:#292d31!important;
    border-color:#42484e!important;
    color:#eef3f6!important;
  }
}

@media (max-width:760px){
  html[data-theme="light"] #msgPanel .thread{background:#f7fafc!important;border-color:#dbe5ec!important;}
  html[data-theme="light"] #msgPanel .thread.active{background:#e9fbfc!important;border-color:#78d8dc!important;}
  html[data-theme="light"] #msgPanel .msgDialog{background:#f7fafc!important;}
  html[data-theme="dark"] #msgPanel.msgPanel,
  html[data-theme="dark"] #msgPanel .msgHead,
  html[data-theme="dark"] #msgPanel .msgTabs,
  html[data-theme="dark"] #msgPanel .msgPaneHost,
  html[data-theme="dark"] #msgPanel .msgLeft,
  html[data-theme="dark"] #msgPanel .msgRight,
  html[data-theme="dark"] #msgPanel .msgDialogHead,
  html[data-theme="dark"] #msgPanel .msgSend{background:#24282c!important;border-color:#3a4148!important;color:#f2f5f7!important;}
  html[data-theme="dark"] #msgPanel .thread{background:#2c3136!important;border-color:#3c444b!important;color:#f2f5f7!important;}
  html[data-theme="dark"] #msgPanel .thread.active{background:rgba(27,193,202,.14)!important;border-color:rgba(51,211,220,.5)!important;}
  html[data-theme="dark"] #msgPanel .msgDialog{background:#202428!important;}
  html[data-theme="dark"] #msgPanel .msgSearch,
  html[data-theme="dark"] #msgPanel .msgInput{background:#2e3338!important;border-color:#424a52!important;color:#f1f5f9!important;}
  html[data-theme="dark"] #msgPanel .msgMobileBackBtn{background:#2e3338!important;border-color:#424a52!important;color:#edf3f7!important;}
}

/* v2026.08.16.565 — messenger/notification colors after legacy theme rules. */
@media (max-width:760px){
  html[data-theme="light"] #msgPanel,
  body:not(.dark) #msgPanel{
    --msg565-panel:#f4f7f9;
    --msg565-surface:#ffffff;
    --msg565-card:#ffffff;
    --msg565-control:#eef3f6;
    --msg565-line:#d8e2e8;
    --msg565-text:#183047;
    --msg565-muted:#718196;
    --msg565-accent:#20c4c8;
    --msg565-accent-soft:#e8fbfc;
  }
  html[data-theme="dark"] #msgPanel,
  body.dark #msgPanel,
  .dark #msgPanel{
    --msg565-panel:#1f2326;
    --msg565-surface:#25292d;
    --msg565-card:#2a2f33;
    --msg565-control:#31363b;
    --msg565-line:#41484e;
    --msg565-text:#f0f4f7;
    --msg565-muted:#a5b0b9;
    --msg565-accent:#22c5c7;
    --msg565-accent-soft:rgba(34,197,199,.14);
  }
}

html[data-theme="light"] #notifPopover,
body:not(.dark) #notifPopover{
  --notif565-surface:#ffffff;
  --notif565-control:#f1f5f7;
  --notif565-line:#d9e3e8;
  --notif565-text:#183047;
  --notif565-muted:#718196;
  --notif565-accent:#20c4c8;
  --notif565-accent-soft:#e9fbfc;
}
html[data-theme="dark"] #notifPopover,
body.dark #notifPopover,
.dark #notifPopover{
  --notif565-surface:#292d30;
  --notif565-control:#33383c;
  --notif565-line:#444b50;
  --notif565-text:#f2f5f7;
  --notif565-muted:#a7b0b7;
  --notif565-accent:#22c5c7;
  --notif565-accent-soft:rgba(34,197,199,.15);
}
#notifPopover.notifPopover,
#notifPopover .notifHead,
#notifPopover .notifFooter{
  background:var(--notif565-surface)!important;
  color:var(--notif565-text)!important;
  border-color:var(--notif565-line)!important;
}
#notifPopover .notifHead>b{color:var(--notif565-text)!important;}
#notifPopover .notifHeadBtn,
#notifPopover .notifCloseBtn{
  background:var(--notif565-control)!important;
  border:1px solid var(--notif565-line)!important;
  color:var(--notif565-text)!important;
}
#notifPopover .notifHeadBtn:hover,
#notifPopover .notifCloseBtn:hover,
#notifPopover .notifHeadBtn[aria-expanded="true"]{
  background:var(--notif565-accent-soft)!important;
  border-color:color-mix(in srgb,var(--notif565-accent) 52%,var(--notif565-line))!important;
  color:var(--notif565-accent)!important;
}
#notifPopover .notifTypes{color:var(--notif565-muted)!important;background:var(--notif565-surface)!important;}
#notifPopover .notifTypeLink{
  background:var(--notif565-control)!important;
  border:1px solid var(--notif565-line)!important;
  color:var(--notif565-muted)!important;
}
#notifPopover .notifTypeLink:hover{
  background:var(--notif565-accent-soft)!important;
  border-color:color-mix(in srgb,var(--notif565-accent) 42%,var(--notif565-line))!important;
  color:var(--notif565-text)!important;
}
#notifPopover .notifTypeLink.isActive{
  background:var(--notif565-accent)!important;
  border-color:var(--notif565-accent)!important;
  color:#fff!important;
}
#notifPopover .notifSettingsPanel{
  background:var(--notif565-control)!important;
  border:1px solid var(--notif565-line)!important;
  color:var(--notif565-text)!important;
}
#notifPopover .notifSettingsTitle,
#notifPopover .notifMuteRow{color:var(--notif565-text)!important;}
#notifPopover .notifMuteRow:hover{background:var(--notif565-accent-soft)!important;}
#notifPopover .notifSettingsActions{border-color:var(--notif565-line)!important;}
#notifPopover .notifSettingsActions .nav-btn{
  background:var(--notif565-accent)!important;
  border-color:var(--notif565-accent)!important;
  color:#fff!important;
}
#notifPopover .notifItem{
  background:var(--notif565-control)!important;
  border-color:var(--notif565-line)!important;
  color:var(--notif565-text)!important;
}

/* v2026.08.17.566 — final group messenger palette overrides after legacy theme rules. */
html[data-theme="light"] .msgGroupSettingsCard,
html[data-theme="light"] .msgGroupMembersPopover{
  --grp566-surface:#ffffff;
  --grp566-surface-2:#f6f8fa;
  --grp566-surface-3:#eef2f6;
  --grp566-line:#d7dfe8;
  --grp566-line-strong:#c4cfdb;
  --grp566-text:#172033;
  --grp566-muted:#66758a;
  --grp566-shadow:0 26px 80px rgba(15,23,42,.18);
}
html[data-theme="dark"] .msgGroupSettingsCard,
html[data-theme="dark"] .msgGroupMembersPopover{
  --grp566-surface:#2d2d2d;
  --grp566-surface-2:#26292b;
  --grp566-surface-3:#34383b;
  --grp566-line:#484d51;
  --grp566-line-strong:#596066;
  --grp566-text:#f5f7fa;
  --grp566-muted:#a7b0b9;
  --grp566-shadow:0 28px 84px rgba(0,0,0,.46);
}
html[data-theme="dark"] .msgGroupSettingsHead,
html[data-theme="dark"] .msgGroupSettingsCard{background:var(--grp566-surface)!important;color:var(--grp566-text)!important;}
html[data-theme="dark"] .msgGroupMembersList .memMakeOwner{background:#273543!important;border-color:#38526a!important;color:#b9ddff!important;}
html[data-theme="dark"] .msgGroupMembersList .memKick,
html[data-theme="dark"] #msgGroupDeleteBtn{background:#3b292c!important;border-color:#684047!important;color:#ffb7bf!important;}
html[data-theme="dark"] .msgGroupSettingsCard .auto-topbar-4{color:var(--grp566-muted)!important;}
html[data-theme="dark"] #msgGroupTitleInput,
html[data-theme="dark"] #msgGroupAddSearch{background:#25282a!important;color:#f5f7fa!important;border-color:#484d51!important;}
html[data-theme="dark"] #msgGroupTitleSave,
html[data-theme="dark"] #msgGroupLeaveBtn{background:#34383b!important;color:#f5f7fa!important;border-color:#4a5054!important;}
html[data-theme="dark"] .msgGroupMembersList .memName,
html[data-theme="dark"] .msgGroupAddList .memName{color:#f5f7fa!important;}
