:root {
    --pdmis-logo-navy: #11263a;
    --pdmis-logo-teal: #2a858d;
    --pdmis-primary: var(--pdmis-logo-teal);
    --pdmis-primary-hover: #236f76;
    --pdmis-primary-active: #1d5d63;
    --pdmis-primary-subtle: #e8f5f6;
    --pdmis-primary-focus: rgba(42, 133, 141, 0.28);
    --pdmis-accent: var(--pdmis-primary);
    --pdmis-text: var(--pdmis-logo-navy);
}

.k-text-primary,
.\!k-text-primary,
.k-color-primary,
.\!k-color-primary,
.k-button-flat-primary,
.k-button-link-primary,
.k-button-clear-primary,
.k-button-outline-primary {
    color: var(--pdmis-primary) !important;
}

.k-bg-primary,
.\!k-bg-primary,
.k-button-solid-primary,
.k-button-solid-base.k-selected,
.k-button-group > .k-button.k-selected,
.k-list-item.k-selected,
.k-selected.k-list-optionlabel,
.k-table-tbody .k-table-row.k-selected > .k-table-td,
.k-table-list .k-table-row.k-selected,
.k-table-tbody .k-table-cell.k-selected,
.k-calendar .k-calendar-td.k-selected .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected .k-link,
.k-progressbar .k-selected,
.k-progressbar-chunk .k-selected,
.k-avatar-solid-primary,
.k-badge-solid-primary,
.k-tooltip-primary,
.k-fab-solid-primary,
.k-checkbox:checked,
.k-radio:checked,
.k-switch-on .k-switch-track {
    background-color: var(--pdmis-primary) !important;
}

.k-border-primary,
.\!k-border-primary,
.k-button-solid-primary,
.k-button-solid-base.k-selected,
.k-button-group > .k-button.k-selected,
.k-button-outline-primary,
.k-list-item.k-selected,
.k-selected.k-list-optionlabel,
.k-avatar-solid-primary,
.k-avatar-outline-primary,
.k-badge-solid-primary,
.k-badge-outline-primary,
.k-checkbox:checked,
.k-radio:checked,
.k-switch-on .k-switch-track {
    border-color: var(--pdmis-primary) !important;
}

.k-button-solid-primary,
.k-button-solid-base.k-selected,
.k-button-group > .k-button.k-selected,
.k-list-item.k-selected,
.k-selected.k-list-optionlabel,
.k-table-tbody .k-table-row.k-selected > .k-table-td,
.k-table-list .k-table-row.k-selected,
.k-calendar .k-calendar-td.k-selected .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected .k-link,
.k-avatar-solid-primary,
.k-badge-solid-primary,
.k-tooltip-primary,
.k-fab-solid-primary {
    color: #ffffff !important;
}

.k-button-solid-primary:hover,
.k-button-solid-primary.k-hover,
.k-fab-solid-primary:hover,
.k-fab-solid-primary.k-hover,
.k-list-item.k-selected:hover,
.k-selected.k-list-optionlabel:hover,
.k-list-item.k-selected.k-hover,
.k-selected.k-hover.k-list-optionlabel,
.k-calendar .k-calendar-td.k-selected:hover .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected:hover .k-link {
    border-color: var(--pdmis-primary-hover) !important;
    background-color: var(--pdmis-primary-hover) !important;
}

.k-button-solid-primary:active,
.k-button-solid-primary.k-active,
.k-button-solid-primary.k-selected,
.k-fab-solid-primary:active,
.k-fab-solid-primary.k-active,
.k-fab-solid-primary.k-selected {
    border-color: var(--pdmis-primary-active) !important;
    background-color: var(--pdmis-primary-active) !important;
}

.k-button-outline-primary:hover,
.k-button-outline-primary.k-hover,
.k-button-outline-primary:active,
.k-button-outline-primary.k-active,
.k-button-outline-primary.k-selected {
    border-color: var(--pdmis-primary) !important;
    color: #ffffff !important;
    background-color: var(--pdmis-primary) !important;
}

.k-button-solid-primary:focus,
.k-button-solid-primary.k-focus,
.k-button-outline-primary:focus,
.k-button-outline-primary.k-focus,
.k-button-flat-primary:focus,
.k-button-flat-primary.k-focus,
.k-button-link-primary:focus,
.k-button-link-primary.k-focus,
.k-button-clear-primary:focus,
.k-button-clear-primary.k-focus,
.k-input:focus,
.k-input.k-focus,
.k-input:focus-within,
.k-picker:focus,
.k-picker.k-focus,
.k-picker:focus-within,
.k-textbox:focus,
.k-textbox.k-focus,
.k-textarea:focus,
.k-textarea.k-focus {
    box-shadow: 0 0 0 2px var(--pdmis-primary-focus) !important;
}

.k-input:focus,
.k-input.k-focus,
.k-input:focus-within,
.k-picker:focus,
.k-picker.k-focus,
.k-picker:focus-within,
.k-textbox:focus,
.k-textbox.k-focus,
.k-textarea:focus,
.k-textarea.k-focus {
    border-color: var(--pdmis-primary) !important;
}

.pdmis-nav.k-menu:not(.k-context-menu) > .k-item,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item,
.pdmis-nav .k-menu-link,
.pdmis-nav .k-menu-link-text,
.pdmis-nav .k-menu-expand-arrow,
.k-menu-scroll-wrapper .k-menu-scroll-button {
    color: var(--pdmis-primary) !important;
}

.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:hover,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-hover,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:hover,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-hover,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:focus,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-focus,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:focus,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-focus,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:active,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-active,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:active,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-active,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-selected,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-selected {
    color: var(--pdmis-primary) !important;
    background-color: var(--pdmis-primary-subtle) !important;
}

.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:hover .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-hover .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:hover .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-hover .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:focus .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-focus .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:focus .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-focus .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:active .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-active .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:active .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-active .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-selected .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-selected .k-menu-link,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:hover .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-hover .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:hover .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-hover .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:focus .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-focus .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:focus .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-focus .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:active .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-active .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:active .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-active .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-selected .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-selected .k-menu-link-text,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:hover .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-hover .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:hover .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-hover .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:focus .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-focus .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:focus .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-focus .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item:active .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-active .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item:active .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-active .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-item.k-selected .k-menu-expand-arrow,
.pdmis-nav.k-menu:not(.k-context-menu) > .k-menu-item.k-selected .k-menu-expand-arrow {
    color: var(--pdmis-primary) !important;
}

.k-menu-group .k-item > .k-link:active,
.k-menu-group .k-item > .k-link.k-active,
.k-menu-group .k-item > .k-link.k-selected,
.k-menu.k-context-menu .k-item > .k-link:active,
.k-menu.k-context-menu .k-item > .k-link.k-active,
.k-menu.k-context-menu .k-item > .k-link.k-selected,
.k-tabstrip-items-wrapper .k-item.k-active,
.k-tabstrip-items-wrapper .k-item.k-selected,
.k-treeview-leaf.k-selected {
    color: var(--pdmis-logo-navy) !important;
    background-color: var(--pdmis-primary-subtle) !important;
}

.k-tabstrip-items-wrapper .k-item.k-active,
.k-tabstrip-items-wrapper .k-item.k-selected {
    border-color: var(--pdmis-primary) !important;
}

.k-loader-primary {
    color: var(--pdmis-primary) !important;
}

.k-tooltip-primary .k-callout {
    color: var(--pdmis-primary) !important;
}

.pdmis-mfa-panel {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--pdmis-border);
    border-radius: 8px;
    background: #fff;
}

.pdmis-mfa-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pdmis-mfa-header > div {
    display: grid;
    gap: 2px;
}

.pdmis-mfa-header span {
    color: var(--pdmis-muted);
    font-size: 0.875rem;
}

.pdmis-mfa-setup {
    display: grid;
    gap: 12px;
}

.pdmis-mfa-qr {
    width: min(220px, 100%);
    justify-self: center;
    padding: 8px;
    border: 1px solid var(--pdmis-border);
    border-radius: 8px;
    background: #fff;
}
