:root {
    --color-neutral-500: #737373;
    --color-neutral-600: #525252;
    --color-neutral-700: #404040;
    --color-neutral-800: #262626;
    --color-blue-600   : #2563eb;
    --color-blue-700   : #1d4ed8;
    --color-blue-800   : #1e40af;
    --color-border     : #e8e8e8;
}

html,
body {
    font-size: 16px;
    color    : #0a0a0a;
}

a {
    color: #0a0a0a;
}

a:hover {
    color: var(--color-blue-700);
}

.bg-gradient-brand {
    background: linear-gradient(to bottom, var(--color-blue-600), var(--color-blue-700));
    color     : white;
}

.uk-navbar-nav {
    gap: 2px;
}

.uk-navbar-nav>li>a {
    min-height: 56px;
    color     : white !important;
    font-size : 18px;
}

.uk-navbar-nav>li:hover>a,
.uk-navbar-nav>li.uk-active>a {
    background: linear-gradient(to top, transparent, rgba(0, 0, 0, .35));
}

.uk-navbar-nav .uk-navbar-dropdown {
    padding: 8px;
}

.uk-navbar-nav .uk-navbar-dropdown .uk-nav {
    font-size: 16px;
}

.uk-navbar-nav .uk-navbar-dropdown .uk-nav>li>a {
    justify-content: center;
    padding: 8px 0;
    border-radius: 6px;
}

.uk-navbar-nav .uk-navbar-dropdown .uk-nav>li>a:hover {
    background: var(--color-blue-700);
    color: white;
}

.card {
    outline        : 1px solid var(--color-border);
    border-radius : 8px;
    display       : flex;
    flex-direction: column;
}

.card-header {
    display       : flex;
    align-items   : center;
    border-bottom : 2px solid var(--color-blue-700);
    padding-inline: 16px;
}

.card-title {
    margin-top    : 8px;
    border-radius : 8px 8px 0 0;
    background    : linear-gradient(to bottom, var(--color-blue-600), var(--color-blue-700));
    line-height   : 40px;
    padding-inline: 24px;
    font-weight   : 600;
    color         : white;
}

.card-extra {
    margin-inline-start: auto;
}

.card-more {
    color    : var(--color-blue-700);
    font-size: 14px;
}

.card-more::after {
    content               : "\ea6c";
    font-family           : remixicon !important;
    font-style            : normal;
    -webkit-font-smoothing: antialiased;
    margin-inline-start   : 4px;
}

.card-body {
    flex          : 1;
    min-height    : 0;
    padding-block : 4px;
    padding-inline: 18px;
    display       : flex;
    flex-direction: column;
    overflow      : hidden;
}

.card-body li {
    position   : relative;
    line-height: 48px;
    display    : flex;
    align-items: center;
}

.card-body li:not(:last-child) {
    border-bottom: 1px dashed var(--color-border);
}

.wp_listcolumn li::before {
    content               : "\ea6d";
    font-family           : remixicon !important;
    font-style            : normal;
    -webkit-font-smoothing: antialiased;
    margin-inline-start   : -8px;
    margin-inline-end     : 8px;
    color                 : var(--color-blue-700);
    font-size             : 20px;
}
.wp_subcolumn li::before {
    display: none;
}
.card-body li a {
    overflow     : hidden;
    text-overflow: ellipsis;
    white-space  : nowrap;
    margin-right : 2px;
}

.card-body li span {
    margin-left: auto;
}

.process-list>div>a {
    overflow     : hidden;
    text-overflow: ellipsis;
    white-space  : nowrap;
}

.process-list>div::before {
    content               : "\ea68";
    font-family           : remixicon !important;
    font-style            : normal;
    -webkit-font-smoothing: antialiased;
    margin-inline-start   : -8px;
    margin-inline-end     : 8px;
    color                 : var(--color-blue-700);
    font-size             : 16px;
}

.list-column li {
    line-height: 48px;
    display    : flex;
    align-items: center;
}

.list-column li:not(:last-child) {
    border-bottom: 1px dashed var(--color-border);
}

.list-column li a {
    overflow     : hidden;
    text-overflow: ellipsis;
    white-space  : nowrap;
    margin-right : 16px;
}

.list-column li span {
    margin-left: auto;
    color      : var(--color-neutral-500);
    white-space: nowrap;
}
