/**
 * Product shell — sage / teal-fade floor on PRDNA + Command light mode.
 * One teal→off floor on every light screen. Headers are clear gloss so
 * that wash shows through (no fill, not a solid #128C7E brick).
 * Footer wrappers are sage #e6ece9 — never #128C7E, never paper white.
 * Does not live in prdna-account-light.css. Dark mode is unchanged.
 */
:root {
  --pardna-rail-collapsed: 76px;
  --pardna-rail-expanded: 232px;
  --pardna-rail-w: var(--pardna-rail-collapsed);
  --mg-nav-h: calc(56px + env(safe-area-inset-top, 0px));
  --admin-chrome-offset: calc(72px + env(safe-area-inset-top, 0px));
  --acct-teal: #128C7E;
  --acct-shell-mid: #d7e8e2;
  --acct-shell: #e6ece9;
  --acct-shell-fade: linear-gradient(180deg, var(--acct-teal) 0%, var(--acct-shell-mid) 38%, var(--acct-shell) 100%);
  --acct-chats-fade: var(--acct-shell-fade);
  --acct-header-gloss: transparent;
}
body.pardna-rail-expanded { --pardna-rail-w: var(--pardna-rail-expanded); }

/* Home, Discover, and Profile own content-first chrome. Other destinations keep
   the shared Account header and its measured offset. */
body.mg-home-active,
body.mg-discover-active,
body.mg-profile-active { padding-top: 0 !important; }
body.mg-profile-active #mainNav,
body.mg-profile-active #acctPortalsBtn,
body.mg-profile-active #navLogout,
body.mg-profile-active #accountHeader,
body.mg-profile-active #dashSearchBar,
body.mg-profile-active #acctTabsTop {
  display: none !important;
  pointer-events: none !important;
}
body.mg-profile-active main { overflow: hidden; }
body.mg-profile-active #tab-settings:not(.hidden) {
  position: fixed !important;
  top: env(safe-area-inset-top, 0px);
  right: 0;
  bottom: calc(3.5rem + env(safe-area-inset-bottom, 0px));
  left: 0;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  overflow-y: auto !important;
  z-index: 15;
}

#pardnaRail {
  display: none;
  box-sizing: border-box;
}

@media (max-width: 767px) {
  #pardnaRail { display: none !important; }
}

@media (min-width: 768px) {
  body.pardna-authed #pardnaRail {
    display: flex !important;
    flex-direction: column;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 30;
    height: 100vh;
    width: var(--pardna-rail-w, 76px);
    min-width: var(--pardna-rail-w, 76px);
    padding: max(0.75rem, env(safe-area-inset-top)) 0 env(safe-area-inset-bottom);
    background: #e6ece9;
    border-right: 1px solid #c5d4ce;
    color: #111827;
    overflow: hidden;
  }
  body.pardna-authed #acctTabsTop { display: none !important; }
  body.pardna-authed #pardnaBottomNav { display: none !important; }
  body.pardna-authed #mainNav {
    left: var(--pardna-rail-w, 76px) !important;
    right: 0;
  }
  body.pardna-authed #mainNav > div {
    max-width: none !important;
    width: 100%;
  }
  body.pardna-authed #acctMain {
    max-width: none !important;
    margin-left: var(--pardna-rail-w, 76px) !important;
    margin-right: 0 !important;
    width: auto !important;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
  body.pardna-authed #dashSearchBar {
    left: var(--pardna-rail-w, 76px) !important;
  }
  body.pardna-authed #dashSearchBar > div {
    max-width: none !important;
  }
  body.pardna-authed.mg-chat-active #tab-chat,
  body.pardna-authed.pardna-thread-open.mg-chat-active #tab-chat,
  body.pardna-authed.mg-portal-active #tab-partner,
  body.pardna-authed.pardna-portal-thread.mg-portal-active #tab-partner {
    position: fixed !important;
    top: var(--mg-nav-h, calc(52px + env(safe-area-inset-top, 0))) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: var(--pardna-rail-w, 76px) !important;
    height: auto !important;
    min-height: 0 !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
    z-index: 15;
  }
  body.pardna-authed.pardna-portal-thread #acctBusinessWorkspace.is-portal-docked {
    left: auto;
  }
  body.pardna-authed #acctBusinessProfileView,
  body.pardna-authed #acctBusinessWorkspace,
  body.pardna-authed #acctPersonProfileOverlay {
    left: var(--pardna-rail-w, 76px);
  }
  body.pardna-authed.mg-profile-active #tab-settings:not(.hidden) {
    top: 0 !important;
    bottom: 0 !important;
    left: var(--pardna-rail-w, 76px) !important;
  }
}

#pardnaRail .pardna-rail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 0 8px 12px;
}
#pardnaRail .pardna-rail-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: #059669;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  flex-shrink: 0;
}
#pardnaRail #pardnaRailToggle {
  border: 0;
  background: transparent;
  color: #6b7280;
  border-radius: 8px;
  padding: 6px;
  cursor: pointer;
}
#pardnaRail #pardnaRailToggle:hover { background: rgba(0, 0, 0, 0.05); }
#pardnaRail nav {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 100%;
  padding: 0 8px;
  overflow-y: auto;
  overflow-x: hidden;
}
#pardnaRail .pardna-rail-heading {
  display: none;
  padding: 10px 12px 4px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #059669;
}
#pardnaRail .pardna-rail-label {
  display: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#pardnaRail .pardna-rail-item {
  width: 100%;
  margin: 0;
  padding: 10px 8px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #4b5563;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  text-align: left;
}
#pardnaRail .pardna-rail-item svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
#pardnaRail .pardna-rail-item:hover:not(.active) { background: rgba(0, 0, 0, 0.05); }
#pardnaRail .pardna-rail-item.active {
  color: #047857;
  font-weight: 600;
  background: rgba(0, 168, 84, 0.12);
}

body.pardna-rail-expanded #pardnaRail .pardna-rail-heading,
body.pardna-rail-expanded #pardnaRail .pardna-rail-label { display: block; }
body.pardna-rail-expanded #pardnaRail .pardna-rail-item {
  flex-direction: row;
  justify-content: flex-start;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
}

@media (min-width: 768px) and (hover: hover) {
  body.pardna-authed.pardna-rail-collapsed #pardnaRail:hover,
  body.pardna-authed.pardna-rail-collapsed #pardnaRail:focus-within {
    width: var(--pardna-rail-expanded) !important;
    min-width: var(--pardna-rail-expanded) !important;
    z-index: 45;
    box-shadow: 12px 0 28px rgba(0, 0, 0, 0.12);
  }
  body.pardna-authed.pardna-rail-collapsed #pardnaRail:hover .pardna-rail-heading,
  body.pardna-authed.pardna-rail-collapsed #pardnaRail:focus-within .pardna-rail-heading,
  body.pardna-authed.pardna-rail-collapsed #pardnaRail:hover .pardna-rail-label,
  body.pardna-authed.pardna-rail-collapsed #pardnaRail:focus-within .pardna-rail-label { display: block; }
  body.pardna-authed.pardna-rail-collapsed #pardnaRail:hover .pardna-rail-item,
  body.pardna-authed.pardna-rail-collapsed #pardnaRail:focus-within .pardna-rail-item {
    flex-direction: row;
    justify-content: flex-start;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
  }
}

body.app-theme-dark #pardnaRail {
  background: #18181b;
  border-right-color: #27272a;
  color: #e5e7eb;
}
body.app-theme-dark #pardnaRail .pardna-rail-item { color: rgba(255, 255, 255, 0.72); }
body.app-theme-dark #pardnaRail .pardna-rail-item:hover:not(.active) { background: rgba(255, 255, 255, 0.06); }
body.app-theme-dark #pardnaRail .pardna-rail-item.active {
  color: #6ee7b7;
  background: rgba(16, 185, 129, 0.16);
}
body.app-theme-dark #pardnaRail .pardna-rail-heading { color: #34d399; }
body.app-theme-dark #pardnaRail #pardnaRailToggle { color: #a1a1aa; }

/* ===== Light product floor + chrome (PRDNA + Command) =====
   One teal→off floor. Glossy headers let that wash show through.
   Footer wrappers: flat #e6ece9. Dark mode is unchanged. */

body.pardna-authed:not(.app-theme-dark),
body#commandBody:not(.app-theme-dark) {
  background: var(--acct-shell-fade) !important;
  background-attachment: fixed !important;
  background-color: var(--acct-shell) !important;
}

body.pardna-authed:not(.app-theme-dark) #acctMain,
body.pardna-authed:not(.app-theme-dark) #viewDashboard,
body.pardna-authed:not(.app-theme-dark) #viewDashboard #pardnaTabCard.pardna-tab-shell,
body.pardna-authed:not(.app-theme-dark) #viewDashboard #pardnaTabCard.pardna-tab-shell > .tab-panel:not(#tab-chat),
body.pardna-authed:not(.app-theme-dark) #tab-home,
body.pardna-authed:not(.app-theme-dark) #tab-discover,
body.pardna-authed:not(.app-theme-dark) #tab-news,
body.pardna-authed:not(.app-theme-dark) #tab-settings,
body.pardna-authed:not(.app-theme-dark) #pardnaChatInbox,
body.pardna-authed:not(.app-theme-dark) #pardnaChatList,
body#commandBody:not(.app-theme-dark) main#ccMain,
body#commandBody:not(.app-theme-dark) main#ccMain.bg-white,
body#commandBody:not(.app-theme-dark) #tab-command,
body#commandBody:not(.app-theme-dark) #tab-command.pcb-bucket-landing,
body#commandBody:not(.app-theme-dark) #tab-command.pcb-bucket-landing #commandScrollArea,
body#commandBody:not(.app-theme-dark) #tab-command.pcb-bucket-landing #commandGroupsPanel,
body#commandBody:not(.app-theme-dark) #tab-chats,
body#commandBody:not(.app-theme-dark) #tab-chats #chatsScrollArea,
body#commandBody:not(.app-theme-dark) #chatsList,
body#commandBody:not(.app-theme-dark) #tab-services,
body#commandBody:not(.app-theme-dark) #tab-services.cc-catalogue-tab,
body#commandBody:not(.app-theme-dark) #tab-services #servicesScrollArea,
body#commandBody:not(.app-theme-dark) #tab-catalogue,
body#commandBody:not(.app-theme-dark) #tab-my-work,
body#commandBody:not(.app-theme-dark) #tab-my-work #myWorkScrollArea,
body#commandBody:not(.app-theme-dark) #tab-notifications,
body#commandBody:not(.app-theme-dark) #tab-notifications #notifySubAlerts,
body#commandBody:not(.app-theme-dark) #tab-notifications #notifySubRequests,
body#commandBody:not(.app-theme-dark) #tab-accounts,
body#commandBody:not(.app-theme-dark) #accountsBodyColumn,
body#commandBody:not(.app-theme-dark) #tab-accounts #accountsScrollArea,
body#commandBody:not(.app-theme-dark) #tab-outbound,
body#commandBody:not(.app-theme-dark) #tab-groups,
body#commandBody:not(.app-theme-dark) #tab-oracle,
body#commandBody:not(.app-theme-dark) #tab-admin-ai,
body#commandBody:not(.app-theme-dark) #tab-ai,
body#commandBody:not(.app-theme-dark) #tab-library,
body#commandBody:not(.app-theme-dark) #tab-command .flex-1.min-h-0.overflow-auto,
body.pardna-authed:not(.app-theme-dark) #tab-services,
body.pardna-authed:not(.app-theme-dark) #tab-marketplace,
body.pardna-authed:not(.app-theme-dark) #tab-travel,
body.pardna-authed:not(.app-theme-dark) #tab-payments,
body.pardna-authed:not(.app-theme-dark) #tab-library,
body.pardna-authed:not(.app-theme-dark) #tab-partner,
body.pardna-authed:not(.app-theme-dark) #tab-cases,
body.pardna-authed:not(.app-theme-dark) #tab-documents,
body.pardna-authed:not(.app-theme-dark) #tab-forms,
body.pardna-authed:not(.app-theme-dark) #tab-intake,
body.pardna-authed:not(.app-theme-dark) #acctTabsTop {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
@media (max-width: 767px) {
  html body#commandBody:not(.app-theme-dark) main#ccMain,
  html body#commandBody:not(.app-theme-dark) main#ccMain.bg-white {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
  }
}

/* Menu sheet paints the same fixed wash so Chats cannot show through. */
html body#commandBody:not(.app-theme-dark) #ccMoreSheet,
html body#commandBody:not(.app-theme-dark) #ccMoreSheet.cc-more-screen,
html body#commandBody:not(.app-theme-dark).cc-more-open #ccMoreSheet {
  background: var(--acct-shell-fade) !important;
  background-color: var(--acct-shell) !important;
  background-attachment: fixed !important;
}

html body.pardna-authed:not(.app-theme-dark):not(.pardna-thread-open) #tab-chat,
html body.pardna-authed:not(.app-theme-dark):not(.pardna-thread-open).mg-chat-active #tab-chat,
html body.pardna-authed:not(.app-theme-dark):not(.pardna-thread-open) #viewDashboard #pardnaTabCard.pardna-tab-shell > #tab-chat,
html body.pardna-authed:not(.app-theme-dark):not(.pardna-thread-open) #pardnaChatInbox,
html body.pardna-authed:not(.app-theme-dark):not(.pardna-thread-open) #pardnaChatInbox.bg-white,
html body.pardna-authed:not(.app-theme-dark):not(.pardna-thread-open) #pardnaChatList {
  background: var(--acct-shell-fade) !important;
  background-color: var(--acct-shell) !important;
  background-attachment: fixed !important;
}

html body.pardna-authed:not(.app-theme-dark):not(.pardna-thread-open) #pardnaChatList .mg-human-preview,
html body.pardna-authed:not(.app-theme-dark):not(.pardna-thread-open) #pardnaChatList .pardna-chat-preview-row {
  background: var(--acct-shell-fade) !important;
  background-color: var(--acct-shell) !important;
  background-attachment: fixed !important;
  border-color: rgba(15, 41, 31, 0.08) !important;
}

/* Glossy headers — no fill. Fade shows through. */
html body.pardna-authed:not(.app-theme-dark) #mainNav,
html body.pardna-authed:not(.app-theme-dark) #mainNav.nav-pardna-mobile,
html body.pardna-authed:not(.app-theme-dark) .nav-pardna-mobile {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-bottom: 0 !important;
  color: #111827 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
html body.pardna-authed:not(.app-theme-dark) .nav-pardna-mobile a,
html body.pardna-authed:not(.app-theme-dark) .nav-pardna-mobile a.text-gray-600,
html body.pardna-authed:not(.app-theme-dark) .nav-pardna-mobile a.text-white,
html body.pardna-authed:not(.app-theme-dark) #mainNav .text-white,
html body.pardna-authed:not(.app-theme-dark) #mainNav .font-heading,
html body.pardna-authed:not(.app-theme-dark) .nav-pardna-mobile #navLogout {
  color: #111827 !important;
}
html body.pardna-authed:not(.app-theme-dark) .nav-pardna-mobile a:hover,
html body.pardna-authed:not(.app-theme-dark) .nav-pardna-mobile #navLogout:hover {
  color: #374151 !important;
}

/* PRDNA footer — flat sage, not green */
html body:not(.app-theme-dark) #pardnaBottomNav {
  background: #e6ece9 !important;
  background-color: #e6ece9 !important;
  background-image: none !important;
  box-shadow: 0 -1px 0 rgba(15, 41, 31, 0.08) !important;
}
html body:not(.app-theme-dark) #pardnaBottomNav .pardna-nav-item {
  color: #5b726a !important;
}
html body:not(.app-theme-dark) #pardnaBottomNav .pardna-nav-item.active {
  color: #00A854 !important;
  font-weight: 600;
}

/* Command rail — quiet sage */
body#commandBody:not(.app-theme-dark) aside#ccRail {
  background: #e6ece9 !important;
  border-right-color: #c5d4ce !important;
}

/* Updates lock: top chrome is 100% clear. Fade runs through. No slab. */
html body#commandBody:not(.app-theme-dark) header#ccTopBar,
html body#commandBody:not(.app-theme-dark) header#ccTopBar.bg-\[\#128C7E\],
html body#commandBody:not(.app-theme-dark).layout-catalogue header#ccTopBar,
html body#commandBody:not(.app-theme-dark).layout-command header#ccTopBar,
html body#commandBody:not(.app-theme-dark).layout-chats header#ccTopBar,
html body#commandBody:not(.app-theme-dark) #ccMoreSheet .cc-more-header,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #catalogueChrome,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #catalogueChrome[data-cc-cat-hosted-top="1"],
html body#commandBody:not(.app-theme-dark) header#ccTopBar #catalogueTitleRow,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #catalogueSegBar,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #prdnaBucketLandingStickyControls,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #prdnaBucketLandingStickyControls[data-pcb-hosted-top="1"],
html body#commandBody:not(.app-theme-dark) header#ccTopBar #prdnaBucketStickyControls,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #prdnaBucketStickyControls[data-pcb-hosted-top="1"],
html body#commandBody:not(.app-theme-dark) header#ccTopBar #commandHeaderWrap,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #commandHeaderWrap[data-pcb-hosted-top="1"],
html body#commandBody:not(.app-theme-dark) header#ccTopBar #commandHeaderWrap.pcb-l4-header,
body:not(.app-theme-dark) .acct-info-head,
body:not(.app-theme-dark) .acct-bp-head,
body:not(.app-theme-dark) .acct-bw-head,
html body:not(.app-theme-dark) #acctBusinessProfileView .acct-bp-head,
body:not(.app-theme-dark) #acctBusinessProfileView .acct-bp-head,
body:not(.app-theme-dark) #acctBusinessWorkspace .acct-info-head,
body:not(.app-theme-dark) #acctBusinessWorkspace .acct-bw-head,
body:not(.app-theme-dark) #contextMenuDrawer.acct-info-drawer .acct-info-head,
body:not(.app-theme-dark) #serviceDetailOverlay.cc-cat-pdp-mode .sticky.top-0,
body:not(.app-theme-dark) #serviceDetailOverlay .sticky.top-0 {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: #111827 !important;
  box-shadow: none !important;
  border: 0 !important;
  border-bottom: 0 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html body#commandBody:not(.app-theme-dark) header#ccTopBar::before,
html body#commandBody:not(.app-theme-dark) header#ccTopBar::after,
html body#commandBody:not(.app-theme-dark).layout-chats header#ccTopBar::before,
html body#commandBody:not(.app-theme-dark).layout-command header#ccTopBar::before,
html body#commandBody:not(.app-theme-dark).layout-catalogue header#ccTopBar::before {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html body#commandBody:not(.app-theme-dark).layout-command main#ccMain,
html body#commandBody:not(.app-theme-dark).layout-catalogue main#ccMain,
html body#commandBody:not(.app-theme-dark).layout-chats main#ccMain {
  margin-top: 0 !important;
}
html body#commandBody:not(.app-theme-dark) header#ccTopBar h1,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #ccTopBarLogout,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #ccPresenceBtn,
html body#commandBody:not(.app-theme-dark) header#ccTopBar .pcr-chats-title,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #pcrChatsTitle,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #catalogueTitle,
html body#commandBody:not(.app-theme-dark) header#ccTopBar .cc-cat-title,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #catalogueSearchBtn,
html body#commandBody:not(.app-theme-dark) header#ccTopBar #pcbBucketTitle,
html body#commandBody:not(.app-theme-dark) header#ccTopBar .pcb-cat-screen-title,
html body#commandBody:not(.app-theme-dark) header#ccTopBar .pcb-svc-cases-title,
html body#commandBody:not(.app-theme-dark) header#ccTopBar .pcb-svc-cases-back,
html body#commandBody:not(.app-theme-dark) header#ccTopBar .pcb-l4-service-title,
html body#commandBody:not(.app-theme-dark) header#ccTopBar .pcb-l4-back,
html body#commandBody:not(.app-theme-dark) #ccMoreSheet .cc-more-title,
body:not(.app-theme-dark) .acct-info-head,
body:not(.app-theme-dark) .acct-bp-head,
body:not(.app-theme-dark) .acct-bw-head,
body:not(.app-theme-dark) .acct-bp-back,
body:not(.app-theme-dark) .acct-bw-back,
body:not(.app-theme-dark) .acct-bw-title,
body:not(.app-theme-dark) #acctPersonProfileOverlayBack,
body:not(.app-theme-dark) #staffPersonProfileBack,
body:not(.app-theme-dark) #serviceDetailOverlay .sticky.top-0,
body:not(.app-theme-dark) #serviceDetailOverlay .sticky.top-0 button,
body:not(.app-theme-dark) #serviceDetailOverlay #svcDetailName {
  color: #111827 !important;
}

/* Command footer — flat sage (chat-reno also sets this; keep a matching lock here) */
html body#commandBody:not(.app-theme-dark) #ccBottomNav {
  background: #e6ece9 !important;
  background-color: #e6ece9 !important;
  background-image: none !important;
}

/* Full-viewport overlays use the same fixed fade the cards sit on. */
html body:not(.app-theme-dark) #staffProfileDashboard,
html body:not(.app-theme-dark) #staffProfileDashPanel,
html body:not(.app-theme-dark) #ccBusinessProfileSheet,
html body:not(.app-theme-dark) #acctProfileEditSheet,
html body:not(.app-theme-dark) #acctPersonProfileView,
html body:not(.app-theme-dark) #acctCustomerCaseShell,
html body#adminBody:not(.app-theme-dark),
html body#adminBody:not(.app-theme-dark) #adminRoot,
html body#adminBody:not(.app-theme-dark) #adminContent {
  background: var(--acct-shell-fade) !important;
  background-color: var(--acct-shell) !important;
  background-attachment: fixed !important;
}

/* Remaining top rows — clear, same as Updates / #ccTopBar. */
html body#commandBody:not(.app-theme-dark) #tab-chats .chats-tab-header,
html body#commandBody:not(.app-theme-dark) .chats-tab-header,
html body#commandBody:not(.app-theme-dark) #myWorkHeaderWrap,
html body#commandBody:not(.app-theme-dark) #notificationsHeaderWrap,
html body#commandBody:not(.app-theme-dark) #notifySubTabs,
html body#commandBody:not(.app-theme-dark) #notifyHeaderAlerts,
html body#commandBody:not(.app-theme-dark) #notifyHeaderRequests,
html body#commandBody:not(.app-theme-dark) #staffProfileDashboard .cc-sp-head,
html body#commandBody:not(.app-theme-dark) #ccBusinessProfileSheet .cc-bp-head,
html body#commandBody:not(.app-theme-dark) main#ccMain header,
html body:not(.app-theme-dark) #acctProfileEditSheet .cc-ap-head,
html body:not(.app-theme-dark) #acctBusinessWorkspace .acct-info-tabs,
html body:not(.app-theme-dark) #tab-partner .acct-info-tabs,
html body:not(.app-theme-dark) #acctBusinessProfileView .acct-bp-tabs,
html body:not(.app-theme-dark) #contextMenuDrawer.acct-info-drawer .acct-info-tabs,
html body.pardna-authed:not(.app-theme-dark) #dashSearchBar,
html body.pardna-authed:not(.app-theme-dark) #acctTabsTop,
html body#adminBody:not(.app-theme-dark) #adminChrome {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: #111827 !important;
  box-shadow: none !important;
  border: 0 !important;
  border-bottom: 0 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html body#adminBody:not(.app-theme-dark) #adminRoot {
  position: relative !important;
}
html body#adminBody:not(.app-theme-dark) #adminChrome {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 40 !important;
}
html:not(.admin-embed-forms) body#adminBody #adminContent {
  padding-top: var(--admin-chrome-offset) !important;
}
html.admin-embed-forms {
  --admin-chrome-offset: 0px;
}
html.admin-embed-forms #adminContent,
html.admin-embed-forms body #adminContent {
  padding-top: 0 !important;
}

/* Transparent overlay chrome must not steal clicks from headers underneath.
   Hits land on the chrome's own controls; empty wash passes through. */
header#ccTopBar,
#adminChrome,
#mainNav,
#acctBusinessProfileView .acct-bp-head {
  pointer-events: none;
}
header#ccTopBar > *,
#adminChrome > *,
#mainNav > *,
#acctBusinessProfileView .acct-bp-head > * {
  pointer-events: auto;
}

html body#commandBody:not(.app-theme-dark) #myWorkHeaderWrap .mw-dash-welcome,
html body#commandBody:not(.app-theme-dark) #myWorkHeaderWrap .mw-dash-sub,
html body#commandBody:not(.app-theme-dark) #myWorkHeaderWrap .text-mgDark,
html body#commandBody:not(.app-theme-dark) #myWorkHeaderWrap .text-gray-500,
html body#commandBody:not(.app-theme-dark) #staffProfileDashboard .cc-sp-title,
html body#commandBody:not(.app-theme-dark) #staffProfileDashboard .cc-sp-back,
html body#commandBody:not(.app-theme-dark) #ccBusinessProfileSheet .cc-bp-title,
html body#commandBody:not(.app-theme-dark) #ccBusinessProfileSheet .cc-bp-head button,
html body:not(.app-theme-dark) #acctProfileEditSheet .cc-ap-title,
html body:not(.app-theme-dark) #acctProfileEditSheet .cc-ap-back,
html body#adminBody:not(.app-theme-dark) #adminChrome .admin-shell-brand,
html body#adminBody:not(.app-theme-dark) #adminChrome .admin-shell-cc-link,
html body#adminBody:not(.app-theme-dark) #adminChrome .admin-btn-ghost {
  color: #111827 !important;
}

/* Status-bar clearance sits ABOVE the chrome's own title row — not a way to
   push underneath headers. Do not add this pad to My Work / Accounts / Forms
   rows (those use --cc-top-bar-offset / --admin-chrome-offset on the content). */
@media (max-width: 767px) {
  html body#commandBody header#ccTopBar,
  html body.pardna-authed #mainNav,
  html body.pardna-authed #mainNav.nav-pardna-mobile,
  html body.pardna-authed .nav-pardna-mobile,
  html body#commandBody #ccMoreSheet .cc-more-header,
  html body:not(.app-theme-dark) #staffProfileDashboard .cc-sp-head,
  html body:not(.app-theme-dark) #ccBusinessProfileSheet .cc-bp-head,
  html body:not(.app-theme-dark) #acctProfileEditSheet .cc-ap-head,
  body:not(.app-theme-dark) #acctBusinessProfileView .acct-bp-head,
  body:not(.app-theme-dark) #acctBusinessWorkspace .acct-info-head,
  body:not(.app-theme-dark) #acctBusinessWorkspace .acct-bw-head,
  body:not(.app-theme-dark) #contextMenuDrawer.acct-info-drawer .acct-info-head,
  html body#adminBody:not(.app-theme-dark) #adminChrome {
    padding-top: calc(env(safe-area-inset-top, 0px) + 12px) !important;
    box-sizing: border-box !important;
    min-height: 0 !important;
    height: auto !important;
    align-items: flex-start !important;
  }
}

/* Retired MG identity card. Must not paint on first load or leak through Chats. */
body.pardna-authed #accountHeader,
body.mg-chat-active #accountHeader,
body.mg-discover-active #accountHeader {
  display: none !important;
}
