:root {
    --20: white;
    --30: white;
    --40: #f6f2fa;
    --50: #f4f4f4;
    --primary: #007fff;
    --primary-70: #165492;
    --primary-dark: #165492;
    --yellow: #ffab2d;
}

.w-sidebar {
    width: 15rem;
    z-index: 100;
}

/*.bg-logo {
    background: white;
}

.bg-grad-sidebar h3,
.bg-grad-sidebar a {
    color: #465760 !important;
}

.shadow,
.card,
.bg-grad-sidebar {
    box-shadow: 0 2px 29px 0 #1d717013;
}*/

.user-avatar {
    border: 3px solid white;
    outline: 3px solid var(--50);
}

.sidemenu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sidemenu li a {
    padding: 10px 20px;
    margin-bottom: 10px;
}

.sidemenu li a.router-link-active {
    --sidebar-icon: var(--primary);
    background: var(--40);
    border-radius: 5px;
    color: var(--primary);
}

.sidemenu li a.router-link-active .sidebar-label {
    color: var(--primary);
}

.chartist-tooltip-meta {
    color: var(--black) !important;
}

.form-input:active,
.form-input:focus {
    background-color: var(--white);
    border-radius: 0.5rem;
    outline: 0;
    border-color: var(--primary-50);
    box-shadow: 0 0 0 3px rgba(64, 153, 222, 0.4);
}

.w-sidebar.pt-header {
    padding-top: 100px;
}

trix-toolbar .trix-button-row .trix-button {
    border-bottom: none;
}

trix-toolbar .trix-button-row .trix-button-group {
    border-top-color: var(--60);
    border-bottom-color: var(--60);
    border-color: var(--60);
}

trix-editor.trix-content {
    border-color: var(--60);
}

.bg-logo {
    background: #152050;
}

.bg-grad-sidebar {
    background: #152050;
}