@import url('https://fonts.googleapis.com/css2?family=Oxygen:wght@300;400;700&family=Roboto:wght@400;500&family=Ubuntu:wght@400;500&display=swap');

@font-face {
    font-family: 'proxima-nova';
    src: url('../fonts/ProximaNova-Regular.eot');
    src: url('../fonts/ProximaNova-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-Regular.woff2') format('woff2'), url('../fonts/ProximaNova-Regular.woff') format('woff'), url('../fonts/ProximaNova-Regular.ttf') format('truetype'), url('../fonts/ProximaNova-Regular.svg#ProximaNova-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'proxima-nova';
    src: url('../fonts/ProximaNova-Semibold.eot');
    src: url('../fonts/ProximaNova-Semibold.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-Semibold.woff2') format('woff2'), url('../fonts/ProximaNova-Semibold.woff') format('woff'), url('../fonts/ProximaNova-Semibold.ttf') format('truetype'), url('../fonts/ProximaNova-Semibold.svg#ProximaNova-Semibold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'proxima-nova';
    src: url('../fonts/ProximaNova-Bold.eot');
    src: url('../fonts/ProximaNova-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/ProximaNova-Bold.woff2') format('woff2'), url('../fonts/ProximaNova-Bold.woff') format('woff'), url('../fonts/ProximaNova-Bold.ttf') format('truetype'), url('../fonts/ProximaNova-Bold.svg#ProximaNova-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

:root {
    --head-font-family: ui-monospace,Menlo,Monaco,'Roboto','Oxygen','Ubuntu',Arial,sans-serif;
    --typography-paragraph-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-paragraph-font-size: 1rem;
    --typography-paragraph-line-height: 1.5rem;
    --typography-paragraph-font-weight: 400;
    --typography-paragraph-emphasis-font-weight: 600;
    --typography-color-primary-base: #1D1E20;
    --typography-color-primary-placeholder: #C4C9CF;
    --typography-color-primary-inverse: #FFFFFF;
    --typography-color-secondary-base: #4B4D4E;
    --typography-color-secondary-inverse: #F3F6F7;
    --typography-color-link-base-base: #1C65AD;
    --typography-color-link-base-inverse: #41A1E6;
    --typography-color-link-hovered-base: #0B376B;
    --typography-color-link-hovered-inverse: #6CBEF1;
    --typography-color-link-active-base: #1C65AD;
    --typography-color-link-active-inverse: #41A1E6;
    --typography-color-link-visited-base: #1C65AD;
    --typography-color-link-visited-inverse: #41A1E6;
    --typography-color-link-disabled-base: #ACB0B4;
    --typography-color-link-disabled-inverse: #4B4D4E;
    --typography-UI1-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-UI1-font-size: 1rem;
    --typography-UI1-line-height: 1.5rem;
    --typography-UI1-font-weight: 400;
    --typography-UI1-mono-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Cantarell", "Source Code Pro", "Fira Mono", "Droid Sans Mono", Verdana, monospace;
    --typography-UI1-mono-emphasis-font-weight: 600;
    --typography-UI1-emphasis-font-weight: 500;
    --typography-UI2-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-UI2-font-size: 0.875rem;
    --typography-UI2-line-height: 1.25rem;
    --typography-UI2-font-weight: 400;
    --typography-UI2-mono-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Cantarell", "Source Code Pro", "Fira Mono", "Droid Sans Mono", Verdana, monospace;
    --typography-UI2-emphasis-font-weight: 600;
    --typography-UI3-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-UI3-font-size: 0.75rem;
    --typography-UI3-line-height: 1rem;
    --typography-UI3-font-weight: 400;
    --typography-UI3-mono-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Cantarell", "Source Code Pro", "Fira Mono", "Droid Sans Mono", Verdana, monospace;
    --typography-heading1-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-heading1-font-size: 2.5rem;
    --typography-heading1-line-height: 3rem;
    --typography-heading1-font-weight: 500;
    --typography-heading1-mono-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Cantarell", "Source Code Pro", "Fira Mono", "Droid Sans Mono", Verdana, monospace;
    --typography-heading1-mono-font-weight: 600;
    --typography-heading2-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-heading2-font-size: 2.25rem;
    --typography-heading2-line-height: 2.75rem;
    --typography-heading2-font-weight: 500;
    --typography-heading2-mono-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Cantarell", "Source Code Pro", "Fira Mono", "Droid Sans Mono", Verdana, monospace;
    --typography-heading2-mono-font-weight: 500;
    --typography-heading3-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-heading3-font-size: 2rem;
    --typography-heading3-line-height: 2.5rem;
    --typography-heading3-font-weight: 500;
    --typography-heading3-mono-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Cantarell", "Source Code Pro", "Fira Mono", "Droid Sans Mono", Verdana, monospace;
    --typography-heading3-mono-font-weight: 500;
    --typography-heading4-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-heading4-font-size: 1.5rem;
    --typography-heading4-line-height: 2rem;
    --typography-heading4-font-weight: 500;
    --typography-heading4-mono-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Cantarell", "Source Code Pro", "Fira Mono", "Droid Sans Mono", Verdana, monospace;
    --typography-heading4-mono-font-weight: 600;
    --typography-heading5-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-heading5-font-size: 1.25rem;
    --typography-heading5-line-height: 1.75rem;
    --typography-heading5-font-weight: 600;
    --typography-heading5-mono-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Cantarell", "Source Code Pro", "Fira Mono", "Droid Sans Mono", Verdana, monospace;
    --typography-heading5-mono-font-weight: 600;
    --typography-heading6-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
    --typography-heading6-font-size: 1rem;
    --typography-heading6-line-height: 1.5rem;
    --typography-heading6-font-weight: 600;
    --typography-heading6-mono-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Cantarell", "Source Code Pro", "Fira Mono", "Droid Sans Mono", Verdana, monospace;
    --typography-heading6-mono-font-weight: 600;
    --color-border-general-base: #C4C9CF;
    --color-border-general-subtle: #EAEDEF;
    --color-border-general-emphasis: #959697;
    --color-outline-default-focused: #92D2F766;
    --color-border-default-base: #959697;
    --color-border-default-focused: #1C65AD;
    --color-border-default-hovered: #1C65AD;
    --color-border-default-pressed: #959697;
    --color-border-default-selected: #959697;
    --color-border-default-disabled: #959697;
    --color-border-primary-base: #1D1E20;
    --color-border-primary-focused: #37383A;
    --color-border-primary-hovered: #37383A;
    --color-border-primary-pressed: #4B4D4E;
    --color-border-primary-selected: #5D5E60;
    --color-border-primary-disabled: #EAEDEF;
    --color-border-primary-inverse-base: #FFFFFF;
    --color-border-primary-inverse-focused: #EAEDEF;
    --color-border-primary-inverse-hovered: #EAEDEF;
    --color-border-primary-inverse-pressed: #C4C9CF;
    --color-border-primary-inverse-selected: #ACB0B4;
    --color-border-primary-inverse-disabled: #EAEDEF;
    --color-border-secondary-base: #959697;
    --color-border-secondary-focused: #959697;
    --color-border-secondary-hovered: #959697;
    --color-border-secondary-pressed: #4B4D4E;
    --color-border-secondary-selected: #4B4D4E;
    --color-border-secondary-disabled: #EAEDEF;
    --color-border-secondary-inverse-base: #ACB0B4;
    --color-border-secondary-inverse-focused: #EAEDEF;
    --color-border-secondary-inverse-hovered: #EAEDEF;
    --color-border-secondary-inverse-pressed: #C4C9CF;
    --color-border-secondary-inverse-selected: #C4C9CF;
    --color-border-secondary-inverse-disabled: #EAEDEF;
    /********/
    --header-color: #dfe3e6;
    --font-normal: 400;
    --font-semi: 600;
    --font-bold: 700;
    --elevation-zIndex-xs: 101;
    --elevation-zIndex-sm: 200;
    --elevation-zIndex-md: 300;
    --elevation-zIndex-lg: 400;
    --elevation-zIndex-xl: 500;
    --unit-border-radius-none: 0;
    --unit-border-radius-xs: 2px;
    --unit-border-radius-sm: 4px;
    --unit-border-radius-md: 6px;
    --unit-border-radius-lg: 8px;
    --unit-border-radius-xl: 12px;
    --unit-border-radius-circle: 50%;
    --unit-border-style-none: none;
    --unit-border-style-dashed: dashed;
    --unit-border-style-dotted: dotted;
    --unit-border-style-solid: solid;
    --unit-border-width-none: 0;
    --unit-border-width-xs: 1px;
    --unit-border-width-sm: 2px;
    --unit-border-width-md: 3px;
    --unit-border-width-lg: 4px;
    --unit-outline-width-xs: 1px;
    --unit-outline-width-sm: 2px;
    --unit-outline-width-md: 3px;
    --unit-outline-width-lg: 4px;
    --unit-outline-style-none: none;
    --unit-outline-style-dashed: dashed;
    --unit-outline-style-dotted: dotted;
    --unit-outline-style-solid: solid;
    --unit-size-control-xxs: 1rem;
    --unit-size-control-xs: 1.25rem;
    --unit-size-control-sm: 1.5rem;
    --unit-size-control-md: 2rem;
    --unit-size-control-lg: 2.5rem;
    --unit-size-control-xl: 3rem;
    --unit-size-control-xxl: 3.25rem;
    --unit-space-0: 0;
    --unit-space-12: 0.125rem;
    --unit-space-25: 0.25rem;
    --unit-space-50: 0.5rem;
    --unit-space-75: 0.75rem;
    --unit-space-100: 1rem;
    --unit-space-125: 1.25rem;
    --unit-space-150: 1.5rem;
    --unit-space-200: 2rem;
    --unit-space-225: 2.25rem;
    --unit-space-250: 2.5rem;
    --unit-space-275: 2.75rem;
    --unit-space-300: 3rem;
    --unit-space-350: 3.5rem;
    --unit-space-400: 4rem;
    --unit-space-450: 4.5rem;
    --unit-space-500: 5rem;
    --unit-space-600: 6rem;
    --unit-space-750: 7.5rem;
    --unit-space-1000: 10rem;
    --unit-size-0: 0;
    --unit-size-25: 0.25rem;
    --unit-size-50: 0.5rem;
    --unit-size-75: 0.75rem;
    --unit-size-100: 1rem;
    --unit-size-125: 1.25rem;
    --unit-size-150: 1.5rem;
    --unit-size-175: 1.75rem;
    --unit-size-200: 2rem;
    --unit-size-225: 2.25rem;
    --unit-size-250: 2.5rem;
    --unit-size-275: 2.75rem;
    --unit-size-300: 3rem;
    --unit-size-350: 3.5rem;
    --unit-size-400: 4rem;
    --unit-size-450: 4.5rem;
    --unit-size-500: 5rem;
    --unit-size-600: 6rem;
    --unit-size-750: 7.5rem;
    --unit-size-1000: 10rem;
    --elevation-shadow-100: rgba(55,63,71,5%) 0px 0px 0px 1px,rgba(55,63,71,16%) 0px 1px 4px;
    --elevation-shadow-200: rgba(55,63,71,8%) 0px 2px 8px,rgba(55,63,71,12%) 0px 1px 2px;
    --elevation-shadow-300: rgba(55,63,71,4%) 0px 0px 0px 1px,rgba(55,63,71,8%) 0px 4px 4px 0px,rgba(55,63,71,8%) 0px 8px 24px 0px;
    --elevation-shadow-400: rgba(55,63,71,15%) 0px 0px 0px 1px,rgba(55,63,71,15%) 0px 8px 16px;
    --elevation-shadow-500: rgba(55,63,71,20%) 0px 8px 16px 0px;
    --elevation-shadow-600: rgba(55,63,71,8%) 0px 0px 0px 2px,rgba(55,63,71,12%) 0px 8px 20px 0px,rgba(55,63,71,12%) 0px 16px 32px 0px;
    --elevation-shadow-700: rgba(55,63,71,8%) 0px 0px 0px 2px,rgba(55,63,71,14%) 0px 12px 24px 0px,rgba(55,63,71,16%) 0px 20px 48px 0px;
    --elevation-shadow-800: rgba(55,63,71,18%) 0px 4px 16px 0px,rgba(55,63,71,22%) 0px 24px 56px 0px;
    --bs-input-bg: #FFFFFF;
    --color-background-default-base: #FFFFFF;
    --color-background-default-focused: #FFFFFF;
    --color-background-default-hovered: #FFFFFF;
    --color-background-default-pressed: #FFFFFF;
    --color-background-default-selected: #FFFFFF;
    --color-background-default-readonly: #EAEDEF;
    --color-background-default-disabled: #EAEDEF;
    --color-background-primary-base: #1D1E20;
    --color-background-primary-focused: #37383A;
    --color-background-primary-hovered: #37383A;
    --color-background-primary-pressed: #4B4D4E;
    --color-background-primary-selected: #C4C9CF;
    --color-background-primary-disabled: #EAEDEF;
    --color-background-primary-inverse-base: #FFFFFF;
    --color-background-primary-inverse-focused: #EAEDEF;
    --color-background-primary-inverse-hovered: #EAEDEF;
    --color-background-primary-inverse-pressed: #C4C9CF;
    --color-background-primary-inverse-selected: #FFFFFF;
    --color-background-primary-inverse-disabled: #EAEDEF;
    --color-background-secondary-base: #FFFFFF;
    --color-background-secondary-focused: #EAEDEF;
    --color-background-secondary-hovered: #EAEDEF;
    --color-background-secondary-pressed: #C4C9CF;
    --color-background-secondary-selected: #ACB0B4;
    --color-background-secondary-disabled: #EAEDEF;
    --color-background-secondary-inverse-base: #1D1E20;
    --color-background-secondary-inverse-focused: #37383A;
    --color-background-secondary-inverse-hovered: #37383A;
    --color-background-secondary-inverse-pressed: #4B4D4E;
    --color-background-secondary-inverse-selected: #C4C9CF;
    --color-background-secondary-inverse-disabled: #EAEDEF;
    --color-background-tertiary-base: #FFFFFF;
    --color-background-tertiary-focused: #EAEDEF;
    --color-background-tertiary-hovered: #EAEDEF;
    --color-background-tertiary-pressed: #C4C9CF;
    --color-background-tertiary-selected: #ACB0B4;
    --color-background-tertiary-disabled: #EAEDEF;
    --color-background-tertiary-inverse-base: #1D1E20;
    --color-background-tertiary-inverse-focused: #37383A;
    --color-background-tertiary-inverse-hovered: #37383A;
    --color-background-tertiary-inverse-pressed: #4B4D4E;
    --color-background-tertiary-inverse-selected: #37383A;
    --color-background-tertiary-inverse-disabled: #EAEDEF;
}

body {
    font-family: var(--typography-paragraph-font-family) !important;
    font-weight: var(--font-normal);
    color: var(--typography-color-primary-base);
    font-size: var(--typography-paragraph-font-size);
    line-height: var(--typography-paragraph-font-size);
}

    body.dark-mode-active .appBottomMenu .item:hover i.icon, body.dark-mode-active .appBottomMenu .item:hover ion-icon, body.dark-mode-active .appBottomMenu .item:hover strong {
        color: #FFFFFF;
    }

.bg-primary {
    background: #0f3cc9 !important;
    color: #FFF;
}

.bg-warning {
    background: #fcc008 !important;
    border-top: 1px solid #e9b003 !important;
}

.appBottomMenu {
    background: #fff;
    border-top: 1px solid #e5e9f2;
}

    .appBottomMenu .item i.bi, .appBottomMenu .item i.icon, .appBottomMenu .item ion-icon {
        color: #364a63;
    }

    .appBottomMenu .item .col {
        font-weight: 500;
        text-transform: none;
        font-size: .75rem;
        letter-spacing: -.06px;
        line-height: 1.3333333333;
    }

a.active {
    color: #0f3cc9;
}

.blue-theme .profileBox {
    background: #0f3cc9;
}

body.dark-mode-active .appBottomMenu .item:hover ion-icon path {
    color: #FFFFFF !important;
}

.userImage {
    line-height: 40px;
    text-align: center;
    color: #FFF;
}

.s-ion-icon svg path {
    stroke: #000 !important;
}

.avatar ion-icon {
    font-size: 25px;
    height: 2em;
}

.avatar-50 {
    height: 50px;
    line-height: 46px;
    vertical-align: middle;
    width: 50px;
}

.avatar {
    border-radius: 200px;
    display: inline-block;
    margin: 0px auto;
    background-color: #ffffff;
    overflow: hidden;
    border: 2px solid #ffffff;
    vertical-align: top;
    text-align: center;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    position: relative;
}

.item .imageWrapper .imaged {
    width: 42px;
    height: 42px;
    border: 2px solid #FFF;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.1),0 1px 3px 0 rgba(0,0,0,0.08);
}

.card .card-body {
    padding: 15px 15px !important;
}

.chatFooter .form-group .search-txt {
    border-radius: 0px !important;
    padding: 0 10px 0 10px;
}

.conversations {
    padding: 0 0 5px 0;
    width: 100%;
    margin: 0px;
    list-style: none;
    float: left;
    clear: both;
}

.conversations__row {
    display: flex;
    color: #9b9b9b;
    background-color: #f6f9fa;
    border-radius: 15px;
    padding: 10px;
    margin: 10px;
}

.conversations__avatar {
    max-width: 50px;
    flex-grow: 1;
    position: relative;
}

.conversations__details {
    padding: 0 10px 0 20px;
    flex-grow: 1;
}

.conversations__info {
    width: 100px;
    text-align: right;
}

.btn ion-icon {
    margin-right: 0px !important;
}

.radio-option {
    width: auto;
    display: inline-block;
    padding: 0;
    margin: 0 10px 10px 0;
    cursor: pointer;
}

    .radio-option label {
        cursor: pointer;
        display: block;
        padding: 5px 10px;
        background-color: #f6f9fa;
        color: #000;
        text-align: left;
        border-radius: 10px;
    }

        .radio-option label span {
            color: #5160eb;
            font-weight: 700;
        }

    .radio-option input[type="radio"] {
        display: none;
    }

        .radio-option input[type="radio"]:checked + label {
            background-color: #3456a0;
            color: #fff;
        }

            .radio-option input[type="radio"]:checked + label span {
                color: #fff;
            }

.InputContainer .form-control {
    height: 34px;
    padding: 5px 8px;
    border-radius: 2px;
    font-family: var(--typography-UI2-font-family);
    font-size: var(--typography-UI2-font-size);
    line-height: var(--typography-UI2-line-height);
    color: var(--typography-color-primary-base);
    font-weight: var(--typography-UI2-font-weight);
    --emphasis-weight: var(--typography-UI2-emphasis-font-weight, --typography-UI2-font-weight);
    border: var(--unit-border-width-xs) var(--unit-border-style-solid) var(--color-border-default-base);
}

.InputContainer .form-label {
    font-size: 0.875rem;
    line-height: 1.25rem;
    margin-bottom: 0rem;
    color: var(--typography-color-primary-base);
    font-weight: var(--typography-UI2-emphasis-font-weight);
    --emphasis-weight: var(--typography-UI2-emphasis-font-weight, --typography-UI2-font-weight );
}

.InputContainer .Field-label {
    font-family: var(--typography-UI2-font-family);
    font-size: var(--typography-UI2-font-size);
    line-height: var(--typography-UI2-line-height);
    color: var(--typography-color-primary-base);
    font-weight: var(--typography-UI2-font-weight);
    --emphasis-weight: var(--typography-UI2-emphasis-font-weight, --typography-UI2-font-weight);
}

.paragraph {
    margin: 0px;
    overflow-wrap: break-word;
    font-family: var(--typography-UI2-font-family);
    font-size: var(--typography-UI2-font-size);
    line-height: var(--typography-UI2-line-height);
    color: var(--typography-color-secondary-base);
    font-weight: var(--typography-UI2-font-weight);
    --emphasis-weight: var(--typography-UI2-emphasis-font-weight, --typography-UI2-font-weight);
}

.paragraph-bold {
    margin: 0px;
    overflow-wrap: break-word;
    font-family: var(--typography-paragraph-font-family);
    font-size: var(--typography-paragraph-font-size);
    line-height: var(--typography-paragraph-line-height);
    color: var(--typography-color-primary-base);
    font-weight: var(--emphasis-weight, var(--typography-paragraph-emphasis-font-weight));
    --emphasis-weight: var(--typography-paragraph-emphasis-font-weight, --typography-paragraph-font-weight);
}

.heading1 {
    font-size: var(--typography-heading1-font-size);
    line-height: var(--typography-heading1-line-height);
    --emphasis-weight: var(--typography-heading1-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading1-font-family);
    font-weight: var(--typography-heading1-font-weight);
}

.heading2 {
    font-size: var(--typography-heading2-font-size);
    line-height: var(--typography-heading2-line-height);
    --emphasis-weight: var(--typography-heading2-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading2-font-family);
    font-weight: var(--typography-heading2-font-weight);
}

.heading3 {
    font-size: var(--typography-heading3-font-size);
    line-height: var(--typography-heading3-line-height);
    --emphasis-weight: var(--typography-heading3-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading3-font-family);
    font-weight: var(--typography-heading3-font-weight);
}

.heading4 {
    font-size: var(--typography-heading4-font-size);
    line-height: var(--typography-heading4-line-height);
    --emphasis-weight: var(--typography-heading4-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading4-font-family);
    font-weight: var(--typography-heading4-font-weight);
}

.heading5 {
    font-size: var(--typography-heading5-font-size);
    line-height: var(--typography-heading5-line-height);
    --emphasis-weight: var(--typography-heading5-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading5-font-family);
    font-weight: var(--typography-heading5-font-weight);
}

.heading6 {
    font-family: var(--typography-heading6-font-family);
    font-size: var(--typography-heading6-font-size);
    line-height: var(--typography-heading6-line-height);
    font-weight: var(--typography-heading6-font-weight);
    --emphasis-weight: var(--typography-heading6-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
}

.heading1-mono {
    font-size: var(--typography-heading1-font-size);
    line-height: var(--typography-heading1-line-height);
    --emphasis-weight: var(--typography-heading1-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading1-mono-font-family);
    font-weight: var(--typography-heading1-mono-font-weight);
}

.heading2-mono {
    font-size: var(--typography-heading2-font-size);
    line-height: var(--typography-heading2-line-height);
    --emphasis-weight: var(--typography-heading2-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading2-mono-font-family);
    font-weight: var(--typography-heading2-mono-font-weight);
}

.heading3-mono {
    font-size: var(--typography-heading3-font-size);
    line-height: var(--typography-heading3-line-height);
    --emphasis-weight: var(--typography-heading3-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading3-mono-font-family);
    font-weight: var(--typography-heading3-mono-font-weight);
}

.heading4-mono {
    font-size: var(--typography-heading4-font-size);
    line-height: var(--typography-heading4-line-height);
    --emphasis-weight: var(--typography-heading4-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading4-mono-font-family);
    font-weight: var(--typography-heading4-mono-font-weight);
}

.heading5-mono {
    font-size: var(--typography-heading5-font-size);
    line-height: var(--typography-heading5-line-height);
    --emphasis-weight: var(--typography-heading5-font-weight);
    margin: 0px;
    color: var(--typography-color-primary-base);
    --inverse-color: var(--typography-color-primary-inverse);
    font-family: var(--typography-heading5-mono-font-family);
    font-weight: var(--typography-heading5-mono-font-weight);
}

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 0 solid rgba(0, 0, 0, 0.125);
    border-radius: 4px;
}

.card-bordered {
    border: 1px solid #dbdfea;
}

.card-inner {
    padding: 1.25rem;
}

.project-head {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    align-items: start;
}

.project-title {
    display: flex;
    align-items: center;
    margin-right: .75rem;
}

    .project-title .title {
        font-size: .975rem;
    }

        .project-title .title:not(:last-child) {
            margin-bottom: .125rem;
        }

    .project-title .sub-text {
        display: block;
        font-size: 13px;
        color: #8094ae;
    }

.project-details {
    margin-bottom: 1rem;
}

.project-progress {
    margin-bottom: 1rem;
}

.project-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bg-primary-light {
    background-color: rgba(85, 155, 251, .1) !important;
    color: #559bfb !important;
}

.bg-success-light {
    background-color: rgba(30, 224, 172, .1) !important;
    color: #1ee0ac !important;
}

.bg-secondary-light {
    background-color: rgba(129, 107, 255, .1) !important;
    color: #816bff !important;
}

.bg-danger-light {
    background-color: rgba(255, 99, 165, .1) !important;
    color: #ff63a5 !important;
}

.bg-warning-light {
    background-color: #fef6e0 !important;
    color: #f4bd0e !important;
}

.g-gs, .gy-gs {
    --bs-gutter-y: 28px;
}

.g-gs, .gx-gs {
    --bs-gutter-x: 28px;
}

.filter-result .job-box {
    background: #fff;
    -webkit-box-shadow: 0 0 35px 0 rgba(130, 130, 130, 0.2);
    box-shadow: 0 0 35px 0 rgba(130, 130, 130, 0.2);
    border-radius: 10px;
    padding: 10px 35px;
}

.job-box .img-holder {
    height: 65px;
    width: 65px;
    background-color: #4e63d7;
    background-image: -webkit-gradient(linear, left top, right top, from(rgba(78, 99, 215, 0.9)), to(#5a85dd));
    background-image: linear-gradient(to right, rgba(78, 99, 215, 0.9) 0%, #5a85dd 100%);
    font-family: "Open Sans", sans-serif;
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 65px;
}

.user-avatar, [class^=user-avatar]:not([class*=-group]) {
    border-radius: 4px;
    margin-right: 1rem;
    height: 40px;
    width: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    background: #0f3cc9;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .06em;
    flex-shrink: 0;
    position: relative;
}

.user-avatar-round {
    border-radius: 50%;
}

.user-avatar img, [class^=user-avatar]:not([class*=-group]) img {
    border-radius: 50%;
}

.card-bordered {
    border: 1px solid #dbdfea;
}

.card-inner-group .card-inner:not(:last-child) {
    border-bottom: 1px solid #dbdfea;
}

.nk-tb-list {
    display: table;
    width: 100%;
    font-size: 13px;
    color: #8094ae;
}

.nk-tb-item {
    transition: background-color .3s, box-shadow .3s;
    display: table-row;
}

.nk-tb-col {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    padding: 1rem .5rem;
}

.nk-tb-item:not(:last-child) .nk-tb-col {
    border-bottom: 1px solid #dbdfea;
}

.nk-tb-col:first-child {
    padding-left: 1.25rem;
}

.nk-tnx-type {
    display: flex;
    align-items: center;
}

.nk-tnx-type-icon {
    font-size: 1.125rem;
    flex-shrink: 0;
    height: 2.5rem;
    width: 2.5rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e5e9f2;
    margin-right: 1rem;
}

.nk-tb-list .tb-amount, .nk-tb-list .tb-lead {
    font-weight: 500;
    color: #364a63;
    display: block;
    line-height: 1.4;
    font-size: .875rem;
}

    .nk-tb-list .tb-lead + .tb-date, .nk-tb-list .user-info .tb-lead + span {
        font-size: .875rem;
    }

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

.nk-activity-item {
    display: flex;
    align-items: center;
    padding: 1.25rem;
}

    .nk-activity-item:not(:last-child) {
        border-bottom: 1px solid #e5e9f2;
    }

.nk-activity-data {
    margin-left: 1rem;
}

    .nk-activity-data .lead-text {
        font-size: .875rem;
        font-weight: 700;
        color: #364a63;
        display: block;
    }

    .nk-activity-data p {
        margin-bottom: 0;
        margin-top: .25rem;
        font-size: .875rem;
        font-weight: 500;
        color: #526484;
    }

    .nk-activity-data .time {
        display: block;
        font-size: 12px;
        color: #8094ae;
        line-height: 1.3;
    }