/* Day / Night / Auto switch. It sits on the dark "chrome" (side rail, partner
   header, sign-in page), which is dark in both themes. */
.theme-switch {
  display: inline-flex;
  gap: 2px;
  padding: 2px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: var(--r-input, 9px);
  background: rgba(0, 0, 0, .12);
}
.theme-switch button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  flex: 1 1 0;
  min-height: 30px;
  padding: 5px 8px;
  border: 0;
  border-radius: calc(var(--r-input, 9px) - 2px);
  background: transparent;
  color: var(--on-chrome-dim, #a9b4c4);
  font: inherit;
  font-size: .8rem;
  line-height: 1;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.theme-switch button:hover { background: rgba(255, 255, 255, .08); color: var(--on-chrome, #e6ecf3); }
.theme-switch button:focus-visible { outline: 2px solid var(--bronze-2, #c29b52); outline-offset: 1px; }
.theme-switch button[aria-pressed="true"] {
  background: rgba(255, 255, 255, .17);
  color: var(--on-chrome, #fff);
  font-weight: 600;
}
.theme-switch svg { width: 15px; height: 15px; flex: 0 0 15px; }

/* Staff side rail: its own full-width row above Sign out. */
.theme-switch.ts-rail { display: flex; width: 100%; margin-top: 8px; }

/* Sign-in pages: top right of the screen. */
.theme-switch.ts-corner { position: fixed; top: 12px; right: 12px; z-index: 30; }

/* Partner header: on the right of the logo row. */
.pp-head-id .theme-switch { margin-left: auto; }

/* Phones: the rail is the menu drawer, where the row stays full width with words. */
@media (max-width: 900px) {
  .theme-switch.ts-rail { margin-top: 10px; }
  .theme-switch.ts-rail button { min-height: 38px; }
}
@media (max-width: 560px) {
  .pp-head-id .theme-switch .ts-label { display: none; }
}
@media (max-width: 400px) {
  .theme-switch.ts-corner .ts-label { display: none; }
}
@media print { .theme-switch { display: none !important; } }
/* "Find a tool" box at the top of the side rail (app/sidefind.js, shared by every EH-Products panel;
   owner 9 Nov 2026). The rail is dark chrome in Day and Night. */
.rail { --sf-bg: rgba(255,255,255,.08); --sf-line: rgba(255,255,255,.2); --sf-text: #fff; --sf-accent: rgba(255,255,255,.75); }
.rail .sf-wrap { padding: 8px 12px 4px; }