﻿
:root {
    --border-footer: #e5e5e5;
    --badge-bg-unknown: #6c757d;
    --badge-bg-verylow: #dc3545;
    --badge-bg-low: #ff8533;
    --badge-bg-medium: #17a2b8;
    --badge-bg-moderate: #17a2b8;
    --badge-bg-high: #00cc99;
    --badge-bg-veryhigh: #28a745;
    --badge-fg-unknown: #fff;
    --badge-fg-verylow: #fff;
    --badge-fg-low: #fff;
    --badge-fg-medium: #fff;
    --badge-fg-moderate: #fff;
    --badge-fg-high: #fff;
    --badge-fg-veryhigh: #fff;
    --primary-color: #d4dc3c;
    --secondary-color: #0b5759;
    --tertiary-color: #849e76;
    --progress-bar: #001e2c;
    --nutun-gradient-start: #52ffcf;
    --nutun-gradient-end: #4df14c;
    --nutun-gradient-start-darken: #00d79b;
    --nutun-gradient-end-darken: #0fbb0e;
    --nutun-button-hover: #ffffff;
    --nutun-button-normal: #000000;
    --qlink-light-green: #d4dc3c;
    --qlink-dark-turquoise: #0b5759;
    --qlink-olive-green: #849e76;
    --qlink-light-mint: #e7f1ed;
    --qlink-grey: #a6a6a6;
    --qlink-black: #000000;
   
}

/* CREDIT HEALTH STYLING - START */

body {
    font-family: "Sora", sans-serif;
    background-color: #fff;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    color: #000000; /* #858796 !important;*/
    text-align: left;
    /*margin: 0px;*/
}

strong {
    font-weight: bolder;
    color: black;
}


.navbar-dark .navbar-brand {
    color: #000;
}

.navbar-brand {
    padding-top: .75rem;
    padding-bottom: .75rem;
    font-size: 1rem;
   /* background-color: rgba(0, 0, 0, .25);
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);*/
}

.text-light {
    color: black !important;
}

.bg-tableHeader {
    background-color: var(--qlink-olive-green);
}

.bg-primary {
    background-color: var(--primary-color) !important;
}

.card-header {
    background-color: var(--tertiary-color) !important;
}

/*.primary-btn {
    background: rgb(0,180,35);
    background: linear-gradient(90deg, rgba(0,180,35,1) 0%, rgba(138,226,115,1) 95%, rgba(30,230,0,1) 100%);
}*/
.bg-color-icon {
    color: var(--qlink-dark-turquoise);
    font-size: 19px;
}

.input-group-text {
    height: calc(1.5em + .5rem + 2px) !important;
    padding: .3rem .5rem !important;
}

#Environment {
    background-color: var(--primary-color);
    color: var(--qlink-black);
}

.form-control {
    height: calc(1.5em + .5rem + 2px) !important;
    padding: .3rem .5rem !important;
}

.btn {
    padding: .25rem .5rem;
    font-size: 14px !important;
    font-weight: 400 !important;
}

.icon-color {
    color: var(--qlink-black);
}

    .icon-color:hover {
        color: var(--qlink-dark-turquoise);
    }


.modal-header {
    padding: 0.5rem 0.5rem;
    background-color: var(--primary-color);
    color: #ffffff;
}

.form-group .form-input {
    font-size: 14px !important;
    font-weight: 400 !important;
}

.form-group {
    margin-bottom: 0.25rem;
}

label {
    margin-bottom: .2rem;
}

.inline-label {
    align-items: center;
    display: flex;
}

.card-header {
    padding: .5rem .75rem;
    background: var(--primary-color);
    color: white;
}

.card-body {
    padding: .75rem;
}

hr {
    margin-top: .5rem;
    margin-bottom: .5rem;
}

.nav-tabs .nav-link.active {
    color: var(--qlink-black);
    font-weight: 600;
    background-color: var(--primary-color);
    border-color: #dee2e6 #dee2e6 #dee2e6;
}

    .nav-tabs .nav-link.active:hover {
        background-color: var(--qlink-olive-green) !important;
        font-weight: 600;
        border-color: #dee2e6 #dee2e6 #dee2e6;
    }

.nav-tabs .nav-link:hover {
    background-color: #ced4da !important;
    border-color: #ced4da #ced4da #ced4da;
    color: var(--qlink-black);
}

.nav-tabs .nav-link {
    /*border-color: var(--primary-color);
    background-color: #e9ecef !important;
    color: black;*/
}


.nav-link[data-toggle="pill"] {
    background-color: var(--qlink-light-mint) !important;
    color: black;
}

    .nav-link[data-toggle="pill"]:hover {
        background-color: var(--qlink-olive-green) !important;
    }

    .nav-link[data-toggle="pill"].active:hover {
        background-color: var(--primary-color) !important;
        border-color: #dee2e6 #dee2e6 #dee2e6;
    }

    .nav-link[data-toggle="pill"].active {
        background-color: var(--primary-color) !important;
        border-color: #dee2e6 #dee2e6 #dee2e6;
    }

.nav-pills > .nav-item > .nav-link.active {
    color: black;
    font-weight: 700;
    background-color: var(--primary-color);
    border-color: #dee2e6 #dee2e6 #fff;
}

.tab-content-border {
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
    border-top: 1px solid #dee2e6;
    border-bottom-left-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

.sidebar {
    min-width: 48px !important;
    color: #ffffff;
}

    .sidebar .nav-link {
        font-weight: 400;
        color: #000000;
    }

        .sidebar .nav-link.active {
            color: black;
            background-color: var(--tertiary-color);
        }

        .sidebar .nav-link:hover {
            color: white;
            background-color: var(--secondary-color);
        }

        .sidebar .nav-link.active:hover {
            color: white;
            background-color: #849e76;
        }

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: rgba(0,0,0, .75);
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255, 1);
}

.push-bottom {
    position: absolute;
    bottom: 0;
}

.modal-header {
    padding: .5rem .5rem;
    background-color: var(--primary-color);
    color: #ffffff;
}

.modal-backdrop {
    background-color: rgba(0,0,0, .5);
}

input.required:not(:placeholder-shown) {
    border-color: #ced4da;
}

input.required:placeholder-shown {
    border-color: var(--warning);
}

textarea.required:not(:placeholder-shown) {
    border-color: #ced4da;
}

textarea.required:placeholder-shown {
    border-color: var(--warning);
}

div.rounded-1 {
    border-radius: 3px;
}

div.rounded-2 {
    border-radius: 5px;
}

div.rounded-3 {
    border-radius: 9px;
}

textarea {
    border-radius: 0.25rem;
}
/*
    CHECKBOX STYLES
*/
[type=checkbox] {
    --checkmark-svg: url("../lib/font-awesome/sprites/check-solid.svg");
    /*--indeterminate-svg: url("https://api.iconify.design/feather:minus.svg");*/
    display: inline-block;
    height: 1rem;
    width: 1rem;
    position: relative;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: currentColor;
    border: 1px solid currentColor;
    border-radius: 0.3rem;
}

    [type=checkbox]:disabled {
        cursor: not-allowed;
        color: GrayText;
    }

    [type=checkbox]:checked::after, [type=checkbox]:indeterminate::after {
        content: "";
        position: absolute;
        inset: 0;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        -webkit-mask-size: 0.7rem;
        mask-size: 0.7em;
        background-color: currentColor;
    }

    [type=checkbox]:checked::after {
        -webkit-mask-image: var(--checkmark-svg);
        mask-image: var(--checkmark-svg);
    }

    [type=checkbox]:indeterminate::after {
        -webkit-mask-image: var(--indeterminate-svg);
        mask-image: var(--indeterminate-svg);
    }

/*
    RADIO STYLES
*/

[type=radio] {
    --hover-background: hsl(0deg 0% 50% / 30%);
    --checkmark-svg: url("../lib/font-awesome/sprites/dot-circle-solid.svg");
    --indeterminate-svg: url("../lib/font-awesome/sprites/white-circle.svg");
    display: inline-block;
    height: 1rem;
    width: 1rem;
    position: relative;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: var(--primary-color);
    border: 1px solid currentColor;
    border-radius: 0.5rem;
}

    [type=radio]:disabled {
        cursor: not-allowed;
        color: currentColor;
    }

    [type=radio]:checked::after, [type=radio]:indeterminate::after {
        content: "";
        position: absolute;
        inset: 0;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        -webkit-mask-size: 1rem;
        mask-size: 1rem;
        background-color: currentColor;
    }

    [type=radio]:checked::after {
        -webkit-mask-image: var(--checkmark-svg);
        mask-image: var(--checkmark-svg);
    }

    [type=radio]:indeterminate::after {
        -webkit-mask-image: var(--indeterminate-svg);
        mask-image: var(--indeterminate-svg);
    }

/*
 * DASHBOARD STYLES
*/

.small-box {
    position: relative;
    display: block;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    margin-bottom: 15px;
}

    .small-box > .inner {
        padding: 10px;
    }

    .small-box > .small-box-footer {
        position: relative;
        text-align: center;
        padding: 3px 0;
        color: #fff;
        color: rgba(255, 255, 255, 0.8);
        display: block;
        z-index: 10;
        background: rgba(0, 0, 0, 0.1);
        text-decoration: none;
    }

        .small-box > .small-box-footer:hover {
            color: #fff;
            background: rgba(0, 0, 0, 0.15);
        }

    .small-box h3 {
        font-size: 38px;
        font-weight: bold;
        margin: 0 0 10px 0;
        white-space: nowrap;
        padding: 0;
    }

    .small-box p {
        font-size: 15px;
    }

        .small-box p > small {
            display: block;
            color: #f9f9f9;
            font-size: 13px;
            margin-top: 5px;
        }

    .small-box h3,
    .small-box p {
        z-index: 5;
    }

    .small-box .icon {
        position: absolute;
        top: auto;
        bottom: 1rem;
        right: 1rem;
        z-index: 0;
        font-size: 90px;
        color: rgba(0, 0, 0, 0.15);
    }

    .small-box:hover {
        text-decoration: none;
        color: #f9f9f9;
    }

        .small-box:hover .icon {
            animation-name: tansformAnimation;
            animation-duration: .5s;
            animation-iteration-count: 1;
            animation-timing-function: ease;
            animation-fill-mode: forwards;
            -webkit-animation-name: tansformAnimation;
            -webkit-animation-duration: .5s;
            -webkit-animation-iteration-count: 1;
            -webkit-animation-timing-function: ease;
            -webkit-animation-fill-mode: forwards;
            -moz-animation-name: tansformAnimation;
            -moz-animation-duration: .5s;
            -moz-animation-iteration-count: 1;
            -moz-animation-timing-function: ease;
            -moz-animation-fill-mode: forwards;
        }

.tooltip-inner {
    background-color: var(--info) !important;
}

.bs-tooltip-auto[x-placement^=bottom] .arrow::before,
.bs-tooltip-top .arrow::before {
    border-top-color: var(--info) !important;
}
/*
label {
    color: #ffffff;
}

.form-group {
    position: relative;
    margin-bottom: 25px;
}

.form-group .form-input {
    width: 350px;
    height: 3rem;
    border: 0px;
    color: #fff;
    margin: 5px 0px;
    border-radius: 5px;
    background-color: transparent;
    text-align: center;
    font-size: 1.25rem;
}

.form-group.right {
    text-align: right;
}

.form-group button {
    background-color: initial;
    border: 1px solid #6d6d88;
    border-radius: 5px;
    color: #6d6d88;
    font-weight: bolder;
}

.btn {
    border: 1px solid rgba(47, 47, 145, 1);
    color: rgba(255,255,255,1);
    background-color: rgba(47, 47, 145,1);
    border-radius: 10px;
    font-size: 16px;
    text-decoration: none;
    display: inline-block;
}

table {
    color: #ffffff;
}

th {
    color: #ffffff;
}

tr {
    color: #000000;
}

tr.odd {
    color: #000000;
}

tr.table-hover,
td.table-hover {
    color: #ffffff !important;
    background-color: gainsboro;
}

tr:hover {
    color: #ffffff !important;
}*/
/* CREDIT HEALTH STYLING - END */
a .navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
    color: var(--qlink-dark-turquoise);
}

.btn-primary {
    color: #fff;
    background-color: var(--primary-color);
    border-color: #1861ac;
}

    .btn-primary:hover {
        color: #fff;
        background-color: var(--primary-color);
        border-color: #1861ac;
    }

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #666666;
    background-color: var(--primary-color);
    border-color: #1861ac;
}

.wmax40 {
    max-width: 40px !important;
}

.wmin40 {
    min-width: 40px !important;
}

.wmax80 {
    max-width: 80px !important;
}

.wmin80 {
    min-width: 80px !important;
}

.wmax100 {
    max-width: 100px !important;
}

.wmin100 {
    min-width: 100px !important;
}

/* Sticky footer styles
-------------------------------------------------- */

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid var(--border-footer);
}

.border-bottom {
    border-bottom: 1px solid var(--border-footer);
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically center the text there */
}

/* Custom Colours for badges - AVS and Credit Helth results*/

span[data-value='NONE'].badge,
span[data-value='UNKNOWN'].badge {
    color: var(--badge-fg-unknown);
    background-color: var(--badge-bg-unknown);
}

span[data-value='VERY LOW'].badge,
span[data-value='NO'].badge {
    color: var(--badge-fg-verylow);
    background-color: var(--badge-bg-verylow);
}

span[data-value='LOW'].badge {
    color: var(--badge-fg-low);
    background-color: var(--badge-bg-low);
}

span[data-value='MEDIUM'].badge {
    color: var(--badge-fg-medium);
    background-color: var(--badge-bg-medium);
}

span[data-value='MODERATE'].badge {
    color: var(--badge-fg-moderate);
    background-color: var(--badge-bg-moderate);
}

span[data-value='HIGH'].badge {
    color: var(--badge-fg-high);
    background-color: var(--badge-bg-high);
}

span[data-value='VERY HIGH'].badge,
span[data-value='YES'].badge {
    color: var(--badge-fg-veryhigh);
    background-color: var(--badge-bg-veryhigh);
}

/* OVERRIDE BOOTSTRAP */
/*-------------------------------------------------- */
.form-group {
    margin-bottom: 0.5rem;
}

/* BUSY SPINNER STYLES */
.busy-spinner-main {
    position: fixed;
    z-index: 999;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: #000000;
    filter: alpha(opacity=50);
    opacity: 0.5;
    -moz-opacity: 0.5;
}

.busy-spinner {
    top: calc(50% - 25px);
    left: calc(50% - 25px);
    /*top: 50%;*/
    /*left: 50%;*/
    color: val(--primary);
    display: inline-block;
    position: relative;
    width: 100px;
    height: 100px;
}

    .busy-spinner div {
        transform-origin: 40px 40px;
        animation: busy-spinner 1.2s linear infinite;
    }

        .busy-spinner div:after {
            content: " ";
            display: block;
            position: absolute;
            top: -30px;
            left: 37px;
            width: 10px;
            height: 40px;
            border-radius: 5px;
            background: #FFFFFF;
        }

        .busy-spinner div:nth-child(1) {
            transform: rotate(0deg);
            animation-delay: -1.1s;
        }

        .busy-spinner div:nth-child(2) {
            transform: rotate(30deg);
            animation-delay: -1s;
        }

        .busy-spinner div:nth-child(3) {
            transform: rotate(60deg);
            animation-delay: -0.9s;
        }

        .busy-spinner div:nth-child(4) {
            transform: rotate(90deg);
            animation-delay: -0.8s;
        }

        .busy-spinner div:nth-child(5) {
            transform: rotate(120deg);
            animation-delay: -0.7s;
        }

        .busy-spinner div:nth-child(6) {
            transform: rotate(150deg);
            animation-delay: -0.6s;
        }

        .busy-spinner div:nth-child(7) {
            transform: rotate(180deg);
            animation-delay: -0.5s;
        }

        .busy-spinner div:nth-child(8) {
            transform: rotate(210deg);
            animation-delay: -0.4s;
        }

        .busy-spinner div:nth-child(9) {
            transform: rotate(240deg);
            animation-delay: -0.3s;
        }

        .busy-spinner div:nth-child(10) {
            transform: rotate(270deg);
            animation-delay: -0.2s;
        }

        .busy-spinner div:nth-child(11) {
            transform: rotate(300deg);
            animation-delay: -0.1s;
        }

        .busy-spinner div:nth-child(12) {
            transform: rotate(330deg);
            animation-delay: 0s;
        }

@keyframes busy-spinner {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

/*-------------------------------------------------- */

#body-row {
    margin-left: 0;
    margin-right: 0;
}

#sidebar-container {
    min-height: 100vh;
    /*background-color: #333;*/
    padding: 0;
}

/* Sidebar sizes when expanded and expanded */
.sidebar-expanded {
    width: 230px;
}

.sidebar-collapsed {
    width: 60px;
}

/* Menu item*/
#sidebar-container .list-group a {
    height: 30px;
    color: #000;
}

/* Submenu item*/
#sidebar-container .list-group .sidebar-submenu a {
    height: 30px;
    /*padding-left: 20px;*/
}

.sidebar-submenu {
    font-size: 0.9rem;
}

/* Separators */
/*.sidebar-separator-title {*/
/*background-color: #333;*/
/*height: 35px;
}

.sidebar-separator {*/
/*    background-color: #333;*/
/*height: 25px;
}*/

.logo-separator {
    /*background-color: #333;*/
    height: 60px;
}

.list-group-item {
    position: relative;
    display: block;
    padding: .25rem;
    margin-bottom: -1px;
    background-color: #fff;
    border: 0px;
}

    .list-group-item:first-child {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

    .list-group-item:last-child {
        margin-bottom: 0;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }
/* Closed submenu icon */
#sidebar-container .list-group .list-group-item[aria-expanded="false"] .submenu-icon::after {
    content: " >";
    color: #000;
    display: inline;
    text-align: right;
}
/* Opened submenu icon */
#sidebar-container .list-group .list-group-item[aria-expanded="true"] .submenu-icon::after {
    content: " <";
    color: #000;
    display: inline;
    text-align: right;
}

/******* START PAGING *******/

#searchRequestApp .pagingNav {
    text-align: right;
    padding-right: 80px;
    margin-top: 20px;
}

    #searchRequestApp .pagingNav ul.dots {
        list-style: none;
        margin: 0 auto;
        display: inline-block;
    }

        #searchRequestApp .pagingNav ul.dots > li {
            display: inline-block;
        }

            #searchRequestApp .pagingNav ul.dots > li > a {
                display: block;
                width: 35px;
                height: 35px;
                border-radius: 50%;
                font-weight: 400;
                line-height: 35px;
                text-align: center;
                cursor: pointer;
            }

                #searchRequestApp .pagingNav ul.dots > li > a.active {
                    background-color: #E8E9EA;
                    width: 40px;
                    height: 40px;
                    line-height: 40px;
                }

    #searchRequestApp .pagingNav .arrow {
        font-size: 14px;
        line-height: 20px;
        color: #1D3443;
        display: inline-block;
        vertical-align: top;
        margin-top: 10px;
        cursor: pointer;
    }

        #searchRequestApp .pagingNav .arrow:hover {
            color: #66B6C4;
        }

        #searchRequestApp .pagingNav .arrow.prev:before, #searchRequestApp .pagingNav .arrow.next:after {
            content: "";
            display: inline-block;
            width: 11px;
            height: 17px;
            background-repeat: no-repeat;
            background-position: center center;
            background-size: contain;
            margin-bottom: -4px;
        }

        #searchRequestApp .pagingNav .arrow.prev:before {
            background-image: url('../logos/AngleLeftBlack-thin.svg');
            margin-right: 14px;
        }

        #searchRequestApp .pagingNav .arrow.prev:hover:before {
            background-image: url('../logos/AngleLeftBlack-thin.svg');
        }

        #searchRequestApp .pagingNav .arrow.next:after {
            background-image: url('../logos/AngleRightBlack-thin.svg');
            margin-left: 14px;
        }

        #searchRequestApp .pagingNav .arrow.next:hover:after {
            background-image: url('../logos/AngleRightTeal-thin.svg');
        }

        #searchRequestApp .pagingNav .arrow.prev {
            margin-right: 10px;
        }

            #searchRequestApp .pagingNav .arrow.prev.disabled {
                opacity: 0.3;
                margin-right: 15px;
            }

        #searchRequestApp .pagingNav .arrow.next {
            margin-left: 10px;
        }

            #searchRequestApp .pagingNav .arrow.next.disabled {
                opacity: 0.3;
                margin-left: 15px;
            }


#searchRequestApp .rowDatatable {
    border: 1px solid grey;
}

#searchRequestApp .borderDatatable {
    border-right: 1px solid grey;
}


/******* END PAGING *******/


/* LOGOS */
img {
    height: 150px;
    object-fit: contain;
}

/******* SEARCH DATATABLE COLUMN POPOVER *******/
.popover-title .close {
    position: relative;
    bottom: 3px;
}

.popover {
    width: 600px;
}

/******* END SEARCH DATATABLE COLUMN POPOVER *******/

.textareaDisabled {
    background: #e9ecef;
    opacity: 1;
    border-radius: 0.25rem;
    border: 1px solid #ced4da;
    color: #495057;
}

.new-udlite-data-badge {
    background: red;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    object-fit: cover;
    color: white;
    font-weight: bold;
    width: 0.5rem;
    height: 0.5rem;
}

.udlite-data-badge {
    background: red;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    object-fit: cover;
    color: white;
    font-weight: bold;
    width: 1.5rem;
    height: 1.5rem;
}


.udlite-avatar {
    background: var(--qlink-black);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    object-fit: cover;
    color: var(--primary-color);
    font-weight: bold;
}


.udlite-notification-badge {
    background: red;
    color: black;
    display: inline-block;
    font-weight: 700;
    border-radius: 50%;
    text-align: center;
}
/*.udlite-notification-counter {
    border-radius: 8888px;
    font-size: .9em;
    min-width: 1em;
    padding: 0.4rem 0.8rem;
}*/
/*
.udlite-block-list-item-small .udlite-block-list-item-icon, .udlite-block-list-item-small .udlite-block-list-item-content {
    min-height: 1rem;
}*/

.udlite-notification-dot {
    font-size: 1.2rem;
    border-radius: 50%;
    height: 1em;
    width: 1em;
}

/*.header--header--3sK1h .header--dropdown-counter-badge--bsUVW, .header--header--3sK1h .header--dropdown-dot-badge--ni0x0 {
    position: absolute;
    font-size: 1.2rem;
    margin: 0;
}*/
.udlite-notification-badge {
    background: red;
    color: #fff;
    display: inline-block;
    font-weight: 700;
    text-align: center;
}

.avatar-wrapper {
    position: relative;
    width: 45px;
    height: 45px;
}

div.udlite-avatar:hover {
    background-color: #00b495;
}

a:target {
    background-color: var(--primary-color)
}

.custom-control-input:checked {
    background-color: var(--primary-color);
}

.btn-primary {
    color: black;
    background: rgb(82,255,207);
    background: linear-gradient(113deg, rgba(82,255,207,1) 0%, rgba(77,241,76,1) 100%);
}

    .btn-primary:hover {
        color: black;
        background: rgb(82,255,207);
        background: linear-gradient(113deg, rgba(82,255,207,1) 0%, rgba(77,241,76,1) 100%);
    }

.btn-primary {
    color: black;
    background: rgb(82,255,207);
    background: linear-gradient(113deg, rgba(82,255,207,1) 0%, rgba(77,241,76,1) 100%);
}

    .btn-primary:hover {
        color: black;
        background: rgba(77,241,76,1);
    }

.btn-secondary {
    color: white;
    background-color: #001e2c;
    border-color: #6c757d;
}

    .btn-secondary:hover {
        color: white;
        background-color: dimgrey;
        border-color: #6c757d;
    }

    .btn-secondary:target {
        color: black;
        background-color: #001e2c;
        border-color: #6c757d;
    }

.btn-tertiary {
    color: black;
    background-color: var(--qlink-light-mint);
    border-color: #6c757d;
}

    .btn-tertiary:hover {
        color: black;
        background-color: #a6a6a6;
        border-color: #6c757d;
    }

    .btn-tertiary:target {
        color: black;
        background-color: var(--tertiary-color);
        border-color: #6c757d;
    }

    .btn-tertiary:hover {
        color: black;
        background-color: #a6a6a6;
        border-color: #117a8b;
    }

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #00b495;
    border-color: #00b495;
}

#subCompanyBatchSizeSpan {
    color: #138200;
}

.img-index {
    height: 250px;
    object-fit: contain;
}

.modal-header .close {
    color: white;
    padding: 1rem 1rem;
    margin: -1rem -1rem -1rem auto;
}

.form-control:focus {
    color: rgb(73, 80, 87);
    background-color: rgb(255, 255, 255);
    border-color: #00b495;
    outline: 0px;
    box-shadow: rgb(0 123 255 / 25%) 0px 0px 0px 0.2rem;
}

.text-info {
    color: #001e2c !important;
}

.help-icon {
    color: #008263;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: var(--primary-color);
    background-color: var(--primary-color);
}

.alert-success {
    color: var(--primary-color);
    background-color: var(--qlink-light-mint);
    border-color: white;
}



.dataTables_filter input[type="text"] :focus {
    outline: none;
}

.btn {
    border-width: 1px;
    border-style: solid;
}

    .btn.btn-primary {
        border-color: var(--nutun-blue-primary) !important;
        background: var(--primary-color) !important;
        color: var(--nutun-button-normal) !important;
    }

        .btn.btn-primary:hover:not([disabled]),
        .btn.btn-primary:focus:not([disabled]) {
            border-color: var(--nutun-blue-primary-lighten) !important;
            background: var(--qlink-olive-green) !important;
            color: var(--nutun-button-hover) !important;
        }

    .btn.btn-login {
        border-color: var(--nutun-blue-primary) !important;
        background: var(--qlink-olive-green) !important;
        color: var(--nutun-button-normal) !important;
    }

        .btn.btn-login:hover:not([disabled]),
        .btn.btn-login:focus:not([disabled]) {
            border-color: var(--nutun-blue-primary-lighten) !important;
            background: var(--qlink-light-green) !important;
            color: var(--nutun-button-hover) !important;
        }


/* Style the sidenav links and the dropdown button */
.sidenav a, .dropdown-btn {
    padding: 6px 8px 6px 16px;
    text-decoration: none;
    font-size: 15px;
    color: #818181;
    display: block;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    outline: none;
}

    /* On mouse-over */
    .sidenav a:hover, .dropdown-btn:hover {
        color: #f1f1f1;
    }

.dropdown-container {
    display: none;
    padding-left: 8px;
}


/* Optional: Style the caret down icon */
.fa-caret-down {
    float: right;
    padding-right: 8px;
}

.action-btn:hover {
    text-decoration: none;
    color: #1861ac;
    font-size: 22px;
}

.auto-width-textarea {
    border: 1px solid #999999;
    width: 100%;
    margin: 5px 0;
    padding: 3px;
}

#secondary .nav-link[data-toggle="pill"].active {
    background-color: var(--primary-color) !important;
    border-color: #dee2e6 #dee2e6 #dee2e6;
}

#thirdtab .nav-link[data-toggle="pill"].active {
    background-color: #00ffd2 !important;
    color: black;
    border-color: #dee2e6 #dee2e6 #dee2e6;
}





fieldset {
    border: 1px solid #ddd !important;
    margin: 0;
    xmin-width: 0;
    padding: 10px;
    position: relative;
    border-radius: 4px;
    background-color: white;
    padding-left: 10px !important;
}

legend {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 0px;
    width: 55%;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px 5px 5px 10px;
    background-color: var(--primary-color);
}

.checkbox-wrapper-6 .tgl {
    display: none;
}

    .checkbox-wrapper-6 .tgl,
    .checkbox-wrapper-6 .tgl:after,
    .checkbox-wrapper-6 .tgl:before,
    .checkbox-wrapper-6 .tgl *,
    .checkbox-wrapper-6 .tgl *:after,
    .checkbox-wrapper-6 .tgl *:before,
    .checkbox-wrapper-6 .tgl + .tgl-btn {
        box-sizing: border-box;
    }

        .checkbox-wrapper-6 .tgl::-moz-selection,
        .checkbox-wrapper-6 .tgl:after::-moz-selection,
        .checkbox-wrapper-6 .tgl:before::-moz-selection,
        .checkbox-wrapper-6 .tgl *::-moz-selection,
        .checkbox-wrapper-6 .tgl *:after::-moz-selection,
        .checkbox-wrapper-6 .tgl *:before::-moz-selection,
        .checkbox-wrapper-6 .tgl + .tgl-btn::-moz-selection,
        .checkbox-wrapper-6 .tgl::selection,
        .checkbox-wrapper-6 .tgl:after::selection,
        .checkbox-wrapper-6 .tgl:before::selection,
        .checkbox-wrapper-6 .tgl *::selection,
        .checkbox-wrapper-6 .tgl *:after::selection,
        .checkbox-wrapper-6 .tgl *:before::selection,
        .checkbox-wrapper-6 .tgl + .tgl-btn::selection {
            background: none;
        }

        .checkbox-wrapper-6 .tgl + .tgl-btn {
            outline: 0;
            display: block;
            width: 4em;
            height: 2em;
            position: relative;
            cursor: pointer;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

            .checkbox-wrapper-6 .tgl + .tgl-btn:after,
            .checkbox-wrapper-6 .tgl + .tgl-btn:before {
                position: relative;
                display: block;
                content: "";
                width: 50%;
                height: 100%;
            }

            .checkbox-wrapper-6 .tgl + .tgl-btn:after {
                left: 0;
            }

            .checkbox-wrapper-6 .tgl + .tgl-btn:before {
                display: none;
            }

        .checkbox-wrapper-6 .tgl:checked + .tgl-btn:after {
            left: 50%;
        }

.checkbox-wrapper-6 .tgl-light + .tgl-btn {
    background: #f0f0f0;
    border-radius: 2em;
    padding: 2px;
    transition: all 0.4s ease;
}

    .checkbox-wrapper-6 .tgl-light + .tgl-btn:after {
        border-radius: 50%;
        background: #fff;
        transition: all 0.2s ease;
    }

.checkbox-wrapper-6 .tgl-light:checked + .tgl-btn {
    background: #1C973E;
}


.bg-danger {
    background-color: var(--qlink-dark-turquoise) !important;
}

.bg-warning {
    background-color: var(--qlink-olive-green) !important;
}
.bg-success {
    background-color: var(--primary-color) !important;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--qlink-light-mint);
    color: white;
}