/* v23 — visible black menu icons/text + green My Workspace top buttons. */
:root {
  --dnxt-v23-menu-text: #111111;
  --dnxt-v23-menu-icon: #111111;
  --dnxt-v23-menu-bg: #ffffff;
  --dnxt-v23-menu-border: rgba(17, 17, 17, .12);
  --dnxt-v23-menu-hover: #f1f9f9;
  --dnxt-v23-green: #006875;
  --dnxt-v23-green-hover: #00535e;
  --dnxt-v23-green-soft: #e5f3f5;
}

/* 1) Right-card 3-dots menu and sidebar 3-dots menus: make text/icons clearly visible. */
html[data-theme="light"] .detail-more-menu,
html:not([data-theme="dark"]) .detail-more-menu,
html[data-theme="light"] .context-menu,
html:not([data-theme="dark"]) .context-menu,
html[data-theme="light"] #projectContextMenu,
html:not([data-theme="dark"]) #projectContextMenu,
html[data-theme="light"] .tm-more-menu,
html:not([data-theme="dark"]) .tm-more-menu,
html[data-theme="light"] .team-tab-context-menu,
html:not([data-theme="dark"]) .team-tab-context-menu,
html[data-theme="light"] .chat-channel-context-menu,
html:not([data-theme="dark"]) .chat-channel-context-menu {
  background: var(--dnxt-v23-menu-bg) !important;
  border-color: var(--dnxt-v23-menu-border) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.14) !important;
}
html[data-theme="light"] .detail-more-menu .context-menu-item,
html:not([data-theme="dark"]) .detail-more-menu .context-menu-item,
html[data-theme="light"] .context-menu .context-menu-item,
html:not([data-theme="dark"]) .context-menu .context-menu-item,
html[data-theme="light"] #projectContextMenu .context-menu-item,
html:not([data-theme="dark"]) #projectContextMenu .context-menu-item,
html[data-theme="light"] .tm-more-menu .context-menu-item,
html:not([data-theme="dark"]) .tm-more-menu .context-menu-item,
html[data-theme="light"] .team-tab-context-menu .context-menu-item,
html:not([data-theme="dark"]) .team-tab-context-menu .context-menu-item,
html[data-theme="light"] .chat-channel-context-menu .context-menu-item,
html:not([data-theme="dark"]) .chat-channel-context-menu .context-menu-item {
  color: var(--dnxt-v23-menu-text) !important;
  font-weight: 500 !important;
}
html[data-theme="light"] .detail-more-menu .context-menu-item i,
html:not([data-theme="dark"]) .detail-more-menu .context-menu-item i,
html[data-theme="light"] .context-menu .context-menu-item i,
html:not([data-theme="dark"]) .context-menu .context-menu-item i,
html[data-theme="light"] #projectContextMenu .context-menu-item i,
html:not([data-theme="dark"]) #projectContextMenu .context-menu-item i,
html[data-theme="light"] .tm-more-menu .context-menu-item i,
html:not([data-theme="dark"]) .tm-more-menu .context-menu-item i,
html[data-theme="light"] .team-tab-context-menu .context-menu-item i,
html:not([data-theme="dark"]) .team-tab-context-menu .context-menu-item i,
html[data-theme="light"] .chat-channel-context-menu .context-menu-item i,
html:not([data-theme="dark"]) .chat-channel-context-menu .context-menu-item i,
html[data-theme="light"] .detail-more-menu svg,
html:not([data-theme="dark"]) .detail-more-menu svg,
html[data-theme="light"] .context-menu svg,
html:not([data-theme="dark"]) .context-menu svg {
  color: var(--dnxt-v23-menu-icon) !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}
html[data-theme="light"] .detail-more-menu .context-menu-item:hover,
html:not([data-theme="dark"]) .detail-more-menu .context-menu-item:hover,
html[data-theme="light"] .context-menu .context-menu-item:hover,
html:not([data-theme="dark"]) .context-menu .context-menu-item:hover,
html[data-theme="light"] #projectContextMenu .context-menu-item:hover,
html:not([data-theme="dark"]) #projectContextMenu .context-menu-item:hover,
html[data-theme="light"] .tm-more-menu .context-menu-item:hover,
html:not([data-theme="dark"]) .tm-more-menu .context-menu-item:hover,
html[data-theme="light"] .team-tab-context-menu .context-menu-item:hover,
html:not([data-theme="dark"]) .team-tab-context-menu .context-menu-item:hover,
html[data-theme="light"] .chat-channel-context-menu .context-menu-item:hover,
html:not([data-theme="dark"]) .chat-channel-context-menu .context-menu-item:hover {
  background: var(--dnxt-v23-menu-hover) !important;
  color: #02464d !important;
}
html[data-theme="light"] .context-menu-title,
html:not([data-theme="dark"]) .context-menu-title {
  color: #111111 !important;
}
html[data-theme="light"] .context-menu-separator,
html:not([data-theme="dark"]) .context-menu-separator {
  background: rgba(17,17,17,.10) !important;
}
/* Keep destructive items visible, with dark-red tone. */
html[data-theme="light"] .context-menu-item.danger,
html:not([data-theme="dark"]) .context-menu-item.danger {
  color: #c0392b !important;
}
html[data-theme="light"] .context-menu-item.danger i,
html:not([data-theme="dark"]) .context-menu-item.danger i {
  color: #c0392b !important;
}

/* 2) My Workspace top buttons/tabs should have green backgrounds. */
html[data-theme="light"] .mytasks-tabs .mytasks-tab,
html:not([data-theme="dark"]) .mytasks-tabs .mytasks-tab,
html[data-theme="light"] .mytasks-toolbar .chip-btn,
html:not([data-theme="dark"]) .mytasks-toolbar .chip-btn {
  background: var(--dnxt-v23-green) !important;
  border: 1px solid var(--dnxt-v23-green) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 18px rgba(0,72,82, .14) !important;
}
html[data-theme="light"] .mytasks-tabs .mytasks-tab i,
html:not([data-theme="dark"]) .mytasks-tabs .mytasks-tab i,
html[data-theme="light"] .mytasks-toolbar .chip-btn i,
html:not([data-theme="dark"]) .mytasks-toolbar .chip-btn i,
html[data-theme="light"] .mytasks-toolbar .chip-btn .mytasks-filter-count,
html:not([data-theme="dark"]) .mytasks-toolbar .chip-btn .mytasks-filter-count {
  color: #ffffff !important;
}
html[data-theme="light"] .mytasks-tabs .mytasks-tab:hover,
html:not([data-theme="dark"]) .mytasks-tabs .mytasks-tab:hover,
html[data-theme="light"] .mytasks-toolbar .chip-btn:hover,
html:not([data-theme="dark"]) .mytasks-toolbar .chip-btn:hover {
  background: var(--dnxt-v23-green-hover) !important;
  border-color: var(--dnxt-v23-green-hover) !important;
  color: #ffffff !important;
}
html[data-theme="light"] .mytasks-tabs .mytasks-tab.active,
html:not([data-theme="dark"]) .mytasks-tabs .mytasks-tab.active {
  background: var(--dnxt-v23-green-hover) !important;
  border-color: var(--dnxt-v23-green-hover) !important;
  color: #ffffff !important;
}
html[data-theme="light"] .mytasks-tabs .mytasks-tab.mytasks-tab-add,
html:not([data-theme="dark"]) .mytasks-tabs .mytasks-tab.mytasks-tab-add {
  min-width: 40px !important;
  justify-content: center !important;
}
/* Optional soft variant for currently selected view-pill buttons inside workspace. */
html[data-theme="light"] .personal-view-toggle,
html:not([data-theme="dark"]) .personal-view-toggle {
  background: var(--dnxt-v23-green-soft) !important;
  border-color: rgba(14,95,104,.24) !important;
}