.qa-theme-toggle {
    display: inline-flex;
    align-items: center;
}

.qa-theme-toggle-dark {
    display: none;
}

[data-theme="dark"] .qa-theme-toggle-light {
    display: none;
}

[data-theme="dark"] .qa-theme-toggle-dark {
    display: inline-flex;
}

[data-theme="dark"] input[type="date"],
[data-theme="dark"] input[type="datetime-local"],
[data-theme="dark"] input[type="time"],
[data-theme="dark"] input[type="month"],
[data-theme="dark"] input[type="week"] {
    color-scheme: dark;
}

.topbar .qa-button.qa-button--tertiary {
    color: var(--qa-chrome-header-fg) !important;
}

.topbar .qa-button.qa-button--tertiary:hover:not(:disabled):not([disabled]),
.topbar .qa-button.qa-button--tertiary:focus-visible {
    color: var(--qa-chrome-header-fg) !important;
    background: rgba(255, 255, 255, 0.14) !important;
}

.topbar .qa-button.qa-button--tertiary .qa-icon {
    color: var(--qa-chrome-header-fg) !important;
    stroke: currentColor !important;
}

.topbar .qa-bell .qa-bell-button {
    color: var(--qa-chrome-header-fg) !important;
}

.topbar .qa-bell .qa-bell-button:hover {
    background: rgba(255, 255, 255, 0.14) !important;
}

.topbar .qa-bell .qa-bell-button .qa-icon {
    color: var(--qa-chrome-header-fg) !important;
    stroke: currentColor !important;
}

.topbar .qa-bell .qa-bell-badge {
    box-shadow: 0 0 0 2px var(--qa-chrome-header-bg) !important;
}

.topbar .qa-branch-switcher .qa-branch-switcher-trigger {
    color: var(--qa-chrome-header-fg) !important;
    background: rgba(255, 255, 255, 0.10) !important;
    border-color: rgba(255, 255, 255, 0.24) !important;
}

.topbar .qa-branch-switcher .qa-branch-switcher-trigger:hover {
    background: rgba(255, 255, 255, 0.18) !important;
    border-color: rgba(255, 255, 255, 0.40) !important;
}

.topbar .qa-branch-switcher .qa-branch-switcher-trigger .qa-icon {
    color: var(--qa-chrome-header-fg) !important;
    stroke: currentColor !important;
}

.topbar .qa-acct .qa-acct-trigger-name {
    color: var(--qa-chrome-header-fg) !important;
}

.topbar .qa-acct .qa-acct-trigger-role,
.topbar .qa-acct .qa-acct-trigger-caret {
    color: var(--qa-chrome-header-fg) !important;
    opacity: 0.82;
}

.topbar .qa-acct .qa-acct-trigger:hover {
    background: rgba(255, 255, 255, 0.10) !important;
}

.topbar .qa-acct .qa-acct-trigger-caret .qa-icon {
    color: var(--qa-chrome-header-fg) !important;
    stroke: currentColor !important;
}

.topbar .topbar-brand-sub {
    color: var(--qa-chrome-header-fg) !important;
    opacity: 0.78;
}