:root {
    --accent-primary: 8 121 191;
    --accent-primary-hover: 0 80 131;
    --link: 8 121 191;
    --link-hover: 0 80 131;
    --link-visited: 0 40 78;
    --ring-primary: 8 121 191;
    --brand-purple: 8 121 191;
    --surface-inverted: 8 121 191;
    --surface-inverted-hover: 0 80 131;
    --surface-submit: 8 121 191;
    --surface-submit-hover: 0 80 131;
    --nx-user-bubble: 223 232 245;
}

:root.dark {
    --accent-primary: 0 187 240;
    --accent-primary-hover: 113 208 246;
    --link: 0 187 240;
    --link-hover: 113 208 246;
    --link-visited: 171 224 249;
    --ring-primary: 0 187 240;
    --brand-purple: 113 208 246;
    --surface-inverted: 0 187 240;
    --surface-inverted-hover: 113 208 246;
    --surface-submit: 8 121 191;
    --surface-submit-hover: 0 80 131;
    --nx-user-bubble: 34 47 66;
}

.bg-text-primary,
.before\:bg-text-primary::before,
.data-\[active-item\]\:before\:bg-text-primary[data-active-item]::before {
    background-color: rgb(var(--accent-primary) / var(--tw-bg-opacity, 1));
}

.ring-text-primary,
.focus\:ring-text-primary:focus,
.focus-visible\:ring-text-primary:focus-visible,
.data-\[focus-visible\]\:ring-text-primary[data-focus-visible] {
    --tw-ring-color: rgb(var(--accent-primary) / var(--tw-ring-opacity, 1));
}

.prose {
    --tw-prose-links: #0879bf;
    --tw-prose-invert-links: #71d0f6;
}

.rounded-br-theme-control.bg-surface-tertiary {
    background-color: rgb(var(--nx-user-bubble));
}

.bg-surface-chat:has(#prompt-textarea):focus-within {
    border-color: rgb(var(--accent-primary));
}

.bg-surface-chat\/90 {
    background-color: rgb(var(--accent-primary));
    border-color: rgb(var(--accent-primary));
    color: rgb(var(--text-inverted));
}

.bg-surface-chat\/90:hover {
    background-color: rgb(var(--accent-primary-hover));
    color: rgb(var(--text-inverted));
}