/* Koop Sahabat accents for the classic Zammad UI.
 * Keep the vendor's gray/white surfaces and original layout in both themes.
 */
:root,
[data-theme='light'],
[data-theme='dark'] {
  --ks-blue: #1058a4;
  --ks-navy: #0d3156;
  --ks-yellow: #ffe606;
  --button-primary-background: var(--ks-blue);
  --button-primary-background-active: var(--ks-navy);
  --button-primary-text: #fff;
  --highlight: var(--ks-blue);
  --menu-background-active: var(--ks-blue);
  --supergood-color: #1058a4;
  --good-color: #b58a00;
  --ks-accent-text: #1058a4;
}
[data-theme='dark'] {
  --supergood-color: #519fe6;
  --good-color: #ffe606;
  --ks-accent-text: #73b9fa;
}
#navigation {
  /* The sidebar stays dark in both modes; use a lighter blue for its icons. */
  --supergood-color: #519fe6;
  --ks-accent-text: #73b9fa;
}

/* Replace positive green controls with corporate blue. */
.btn--positive,
.btn--create,
.btn--success,
.alert--success,
.alert--success[contenteditable]:hover,
.alert--success[contenteditable]:focus,
.recipientList--new,
.avatar--new,
.loading.icon,
.badge--closed,
.nav-tab.task-state-closed.is-active {
  background: var(--ks-blue);
}
.btn--primary:hover,
.btn--positive:hover,
.btn--create:hover,
.btn--success:hover,
.btn--positive:active,
.btn--create:active,
.btn--success:active,
.dropdown .recipientList--new:hover {
  background: var(--ks-navy);
}
.btn--positive.btn--secondary,
.btn--create.btn--secondary,
.btn--success.btn--secondary {
  color: var(--ks-accent-text);
  background: var(--background-secondary);
}
.btn--positive.btn--text,
.btn--create.btn--text,
.btn--success.btn--text,
.btn--link.btn--positive,
.btn--link.btn--positive:active {
  color: var(--ks-accent-text);
  background: transparent;
}
.btn:focus-visible {
  box-shadow: 0 0 0 3px var(--shadow-highlight);
}
a.create { color: var(--ks-accent-text); }
.user-menu-icon.icon-plus { fill: var(--ks-accent-text); }
.user-menu li.add:hover .list-button::before,
.user-menu li.add.is-active .list-button::before,
.user-menu li.add.is-hovered .list-button::before,
.dropdown-menu > li.create:hover,
.dropdown-menu > li.create.is-active,
.tabsSidebar-tab-count.tabsSidebar-tab-count--success {
  background: var(--ks-blue);
}
.tabsSidebar-tab-count.tabsSidebar-tab-count--success::after {
  border-right-color: var(--ks-blue);
}
.frequency.stat-widget .primary {
  color: var(--supergood-color);
  background: var(--supergood-color);
}
.dashboard .icon-mood-supergood { color: var(--supergood-color); }
.dashboard .icon-mood-good { color: var(--good-color); }
#navigation .js-menu .menu-item.is-active {
  box-shadow: inset 3px 0 var(--ks-yellow);
}