/* Global Rift accent owner. Semantic colours (success, warning, danger, presence) stay semantic. */
:root {
  --accent: var(--rift-user-accent, #d84b4b);
  --accent-hover: color-mix(in srgb, var(--accent), #fff 12%);
  --accent-soft: color-mix(in srgb, var(--accent), transparent 84%);
  --r-accent: var(--accent);
  --ref-accent: var(--accent);
  --p-blue: var(--accent);
  --rift-brand-red: var(--accent);
  --rift-brand-red-bright: color-mix(in srgb, var(--accent), #fff 14%);
  --rift-brand-red-soft: color-mix(in srgb, var(--accent), transparent 86%);
  --rift-brand-red-faint: color-mix(in srgb, var(--accent), transparent 93%);
}

::selection {
  background: color-mix(in srgb, var(--accent), transparent 68%);
}

button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline-color: color-mix(in srgb, var(--accent), #fff 18%) !important;
}

input[type='checkbox'],
input[type='radio'],
input[type='range'],
progress {
  accent-color: var(--accent);
}

/* Primary brand actions */
.primary-button,
.send-button,
.server-button.active,
.home-button.active,
.parity-dm-side button,
.r021-primary,
.r021-button-primary,
.ui0211-primary,
.ui0212-primary,
.ui0213-primary {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
}

.primary-button:hover:not(:disabled),
.send-button:hover:not(:disabled),
.parity-dm-side button:hover:not(:disabled),
.r021-primary:hover:not(:disabled),
.r021-button-primary:hover:not(:disabled) {
  background: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}

/* Shell brand marks and selected state */
.server-header::after,
.content-header::after,
.desktop-titlebar-mark,
.auth-brand .rift-mark,
.channel-item.active .channel-symbol-small,
.home-button:not(.active),
.rift-mark.brand,
.rift-brand-accent {
  color: var(--accent) !important;
}

.server-header::after,
.content-header::after,
.desktop-titlebar-mark {
  background: var(--accent) !important;
}

.server-button.active,
.server-button.r021-active,
.server-button[aria-current='page'] {
  background: var(--accent) !important;
}

.channel-item.active .channel-symbol-small,
.channel-item[aria-current='page'] .channel-symbol-small,
.home-nav-item.active > span,
.r021-friends-tab.active,
.r021-tab.active,
.r021-nav-tab.active,
.r021-profile-tab.active,
.r021-server-tab.active,
.r021-channel-tab.active {
  color: var(--accent) !important;
}

.home-nav-item.active,
.dm-item.active,
.r021-friends-tab.active,
.r021-tab.active,
.r021-nav-tab.active,
.r021-profile-tab.active,
.r021-server-tab.active,
.r021-channel-tab.active {
  box-shadow: inset 2px 0 0 var(--accent);
}

/* Menus and selectable surfaces previously carrying a fixed Discord blue/red accent. */
.parity-menu-item:hover:not(:disabled):not(.danger),
.r021-menu-item:hover:not(:disabled):not(.danger),
.r021-context-item:hover:not(:disabled):not(.danger),
.context-menu button:hover:not(:disabled):not(.danger),
.message-actions button:hover:not(:disabled) {
  background: color-mix(in srgb, var(--accent), transparent 18%) !important;
  color: #fff !important;
}

/* Settings and preference surfaces */
#r021-settings .r021-settings-nav [data-settings-tab].active,
#r021-settings .rift-settings-subnav > button.active,
#r021-settings .rift-settings-subnav > button:hover,
#r021-settings .rift-unified-theme.active {
  border-color: var(--accent) !important;
}

#r021-settings .r021-settings-nav [data-settings-tab].active {
  background: color-mix(in srgb, var(--accent), transparent 86%) !important;
}

#r021-settings .rift-unified-switch.on,
#r021-settings .rift-unified-radio input:checked + i {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
}

#r021-settings .rift-unified-link,
#r021-settings .rift-account-email-reveal,
#r021-settings a:not(.danger) {
  color: color-mix(in srgb, var(--accent), #fff 25%) !important;
}

/* Administration and server settings should use the same product accent. */
.v024-audit-mark,
.v024-page input[type='checkbox'],
.v024-page input[type='radio'],
.v024-page input[type='range'] {
  accent-color: var(--accent);
}

.v024-audit-mark {
  background: var(--accent) !important;
}

.parity-settings-nav button.active:not(.danger),
.ui0212-server-settings-nav button.active:not(.danger),
.ui0212-channel-settings-nav button.active:not(.danger) {
  background: color-mix(in srgb, var(--accent), transparent 78%) !important;
  color: #fff !important;
}

/* Soft branded interaction cues around the rest of the app. */
a:not(.danger),
.rift-link,
.r021-link,
.ui0211-link,
.ui0212-link,
.ui0213-link {
  color: color-mix(in srgb, var(--accent), #fff 24%);
}

.composer:focus-within,
.r021-search:focus-within,
.r021-friend-search:focus-within,
.r021-header-search:focus-within {
  border-color: color-mix(in srgb, var(--accent), transparent 35%) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent), transparent 78%);
}

/* Light theme keeps enough contrast while still following the selected Rift accent. */
html[data-rift-effective-theme='light'] .home-button:not(.active),
html[data-rift-effective-theme='light'] .channel-item.active .channel-symbol-small,
html[data-rift-effective-theme='light'] .home-nav-item.active > span,
html[data-rift-effective-theme='light'] a:not(.danger),
html[data-rift-effective-theme='light'] .rift-link,
html[data-rift-effective-theme='light'] .r021-link {
  color: color-mix(in srgb, var(--accent), #1d232a 30%) !important;
}

html[data-rift-effective-theme='light'] .parity-menu-item:hover:not(:disabled):not(.danger),
html[data-rift-effective-theme='light'] .r021-menu-item:hover:not(:disabled):not(.danger),
html[data-rift-effective-theme='light'] .r021-context-item:hover:not(:disabled):not(.danger),
html[data-rift-effective-theme='light'] .context-menu button:hover:not(:disabled):not(.danger) {
  background: color-mix(in srgb, var(--accent), #fff 78%) !important;
  color: #20242a !important;
}

/* Deliberately excluded: online/idle/DND/offline, success, warning and destructive actions. */