:root {
    --primary: #002564;
    --secondary: #0042ac;
}

body {
    color: var(--primary);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--primary);
}

.menu .menu-item,
.menu .menu-item:hover,
.menu .menu-item:focus,
.menu .menu-item:visited,
.menu .menu-item-name,
.menu a,
.menu a:hover,
.menu a:focus,
.menu a:visited,
.tasks-navigation,
.tasks-navigation a,
.tasks-navigation a:hover,
.tasks-navigation a:focus,
.tasks-navigation a:visited,
.tasks-navigation .task-name,
.tasks-navigation .name {
    color: #fff;
}

a,
a:visited {
    color: var(--secondary);
}

a:hover,
a:focus {
    color: var(--primary);
}

.btn.btn--primary,
.btn.btn--action,
.btn.btn--success,
button.btn--primary,
.js-submit,
.js-submitDropdown .btn {
    background-color: var(--secondary);
    border-color: var(--secondary);
    color: #fff;
}

.btn.btn--primary:hover,
.btn.btn--action:hover,
.btn.btn--success:hover,
button.btn--primary:hover,
.js-submit:hover {
    background-color: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

.navigation .tasks .task.is-active,
.navigation .nav-item.is-active > a,
.tabs .tab.active,
.tab.is-active {
    background-color: var(--primary);
    color: #fff;
}

.icon,
.user-menu .icon {
    fill: var(--primary);
}

.ticketZoom-controls .btn,
.ticketZoom-controls .btn:hover,
.ticketZoom-controls .btn:focus,
.ticketZoom-controls .btn .icon,
.ticketZoom-controls .icon {
    color: #fff;
    fill: #fff;
}

.user-menu.navbar-items-personal > li > a,
.user-menu.navbar-items-personal > li > a:hover,
.user-menu.navbar-items-personal > li > a:focus,
.user-menu.navbar-items-personal > li > a:visited,
.user-menu.navbar-items-personal > li > a .icon {
    color: #fff;
    fill: #fff;
}

.user-menu.navbar-items-personal > li > a:visited {
    background-color: var(--primary);
}

.menu.js-menu .is-active,
.menu.js-menu .menu-item.is-active,
.menu.js-menu a.is-active {
    background-color: var(--primary);
    color: #fff;
}

.badge,
.label-subtle {
    background-color: var(--secondary);
    color: #fff;
}

.icon-logo,
.logo.js-toggleNotifications,
.main-navigation .logo {
    background-image: url("/kc-logo.svg") !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70%;
    background-color: transparent !important;
}

.icon-logo > *,
.logo.js-toggleNotifications svg,
.main-navigation .logo svg {
    visibility: hidden;
}
