@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

    @font-face {
        font-family: 'OpenSans';
        src: url('/css/fonts/Open_Sans/OpenSans-VariableFont_wdth,wght.ttf') format('truetype');
    }

:root {
    --csp-grey90: #E6E6E6;
    --csp-grey93: #EDEDED;
    --csp-grey95: #F2F2F2;
    --csp-grey97: #F7F7F7;
    --csp-grey99: #FCFCFC;
    --csp-red: #E05555;
    --csp-red-dark: #731b1b;
    --csp-green: #59D663;
    --csp-green-alt: #26b050;
    --csp-green-dark: #2b6530;
    --csp-blue-light: #D8E3EA;
    --csp-blue-mid: #3078A1;
    --csp-blue-dark: #1D3557;
    --csp-black: #10252d;
    --csp-grey-blue: #F2F5F7;
    --csp-grey-light: #f0efef;
    --csp-grey-dark: #babebf;
    --csp-blue-dark-alt: #284371;
    --csp-blue-mid-alt: #416EBA;
    --csp-blue-light-alt: #538CED;
    --csp-blue-pale-alt: #9CBBF0;
    --csp-blue-grey-alt: #47556E;
    --csp-yellow: #ffc107;
    --csp-orange: #e6831d;
    --csp-purple: #4800ff;
    --csp-magenta: #b200ff;
    --csp-brown: #6c4a1b;
    --csp-brown-light: #8d7e6b;
}

    html, body {
        font-family: 'OpenSans','Helvetica Neue', Helvetica, Arial, sans-serif;
    }

body {
    background-color: var(--csp-grey99);
    padding-top: 60px;
}

.content {
    min-height: calc(100vh - 62px - 24px);
}

.card {
    box-shadow: 0 .25rem 1rem rgba(0,0,0,.15) !important;
    border-radius: 0.5rem;
    border: none;
}

    h1:focus {
        outline: none;
    }

a {
    color: var(--csp-blue-mid-alt);
    text-decoration: none;
}

    a:hover {
        color: var(--csp-blue-light-alt);
    }

    .nav-item a:hover {
        text-decoration: none;
    }

.btn-outline-primary {
    color: var(--csp-blue-mid-alt) !important;
    border-color: var(--csp-blue-mid-alt) !important;
}

    .btn-outline-primary:hover {
        background-color: var(--csp-blue-dark-alt) !important;
        color: #fff !important;
    }

/*
.e-btn, .e-css.e-btn {
    background-color: #fff;
    border-color: #198754;
    color: #284371;
    border-radius: 50rem !important;
}

    .e-btn:hover, .e-css.e-btn:hover {
        background-color: #198754;
        border-color: #198754;
        color: #fff;
    }


.e-tbar-btn {
    background-color: #fff !important;
    border-color: #198754 !important;
    color: #284371 !important;
    border-radius: 50rem !important;
    border: 1px !important;
}

    .e-tbar-btn:hover {
        background-color: #198754 !important;
        border-color: #198754 !important;
        color: #fff !important;
    }

.e-btn.e-primary.e-flat:not([DISABLED]) {
    background-color: #fff !important;
    border-color: #198754 !important;
    color: #198754 !important;
    border-radius: 50rem !important;
    border-style: solid !important;
    border-width: 1px !important;
}

.e-btn.e-primary.e-flat:hover:not([DISABLED]) {
    background-color: #198754 !important;
    border-color: #198754 !important;
    color: #fff !important;
}

.e-btn.e-flat:not([DISABLED]) {
    background-color: #fff !important;
    color: #284371 !important;
    border-width: 0px !important;
}

.e-btn.e-flat:hover:not([DISABLED]) {
    color: #198754 !important;
}*/

.sidebar-menu {
    min-height: 100vh;
    background-color: var(--csp-blue-dark);
    color: var(--csp-grey93)
}

.e-sidebar-absolute {
    position: fixed !important;
} 

.e-menu-item {
    background-color: var(--csp-blue-dark);
    color: #fff !important;
    padding: 0px !important;
}
.e-menu-item a {
    color: #fff !important;
}

.e-menu-text.e-menu-url div.e-anchor-wrap{
    padding: 0 12px;

}

.e-menu-item .e-menu-icon {
    color: var(--csp-blue-light) !important
}

.e-menu .e-menu-item.e-selected .e-menu-icon {
    color: var(--csp-blue-dark) !important
}

.main-menu {
/*    height: calc(100vh - 50px - 24px);*/
/*    position: static;*/
}

.main-menu ul {
    width: 100%
}

.main-menu-menus {
    height: calc(100vh - 62px - 24px);
}

.adminMenu {
    width:150px;
    height:75px;
    background-color: var(--csp-blue-dark);
}

.e-menu-wrapper, .e-menu-container {
    background-color: var(--csp-blue-dark);
/*    height: 0px;
    position: fixed;*/


}

    .e-menu-wrapper.e-contextmenu-container, .e-menu-container.e-contextmenu-container {
        height:0px;
    }

.e-contextmenu-wrapper.e-sfcontextmenu, .e-contextmenu-container.e-sfcontextmenu {
    position: fixed;
}

    .valid.modified:not([type=checkbox]) {
        outline: 1px solid #26b050;
    }

    .invalid {
        outline: 1px solid red;
    }

    .validation-message {
        color: red;
    }

    #blazor-error-ui {
        background: lightyellow;
        bottom: 0;
        box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
        display: none;
        left: 0;
        padding: 0.6rem 1.25rem 0.7rem 1.25rem;
        position: fixed;
        width: 100%;
        z-index: 1000;
    }

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

    .blazor-error-boundary {
        background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
        padding: 1rem 1rem 1rem 3.7rem;
        color: white;
    }

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

    label {
        color: #284371;
        font-size: smaller;
        font-weight: normal;
    }

    .e-grid .e-headercelldiv {
        color: #284371;
        font-weight: lighter;
    }

    .nav-link {
            color: var(--csp-blue-dark);
            margin-bottom: 5px;
            border-radius: 0.5rem !important;
        }

    .nav-link:hover {
        color: #fff;
        background-color: var(--csp-blue-dark-alt);
    }


.nav-pills .nav-link.active {
    color: #fff;
    background-color: var(--csp-blue-dark-alt);
}

    .nav-pills .nav-link.active:hover {
        color: #fff;
        background-color: var(--csp-blue-dark-alt);
    }


.nav-pills .nav-link:hover {
    color: #fff;
    background-color: var(--csp-blue-mid-alt);
}

.nav-pills .nav-link .btn-outline-primary {
    background-color: #fff !important;
}

    .nav-pills .nav-link .btn-outline-primary:hover {
        background-color: var(--csp-blue-dark-alt) !important;
        color: #fff !important;
        border-color: #fff !important;
    }

    .pillButton {
        display:none;
        height: 24px;
        width: 24px;
        padding: 0;
    }

    .nav-pills .nav-link:hover .pillButton {
        display: inline;
    }

    .nav-pills .nav-link.active .pillButton {
        display: inline;
    }


    h5 {
        color: #284371
    }

    h5 a {
        color: #284371 !important
    }

    h4 {
        color: #284371
    }

    h4 a {
        color: #284371
    }

    .text-primary {
        color: #0071c1!important;
    }
    .mainLogo
    {
        width:300px;
    }

    .cspHeading {
        color: #c5c5c5
    }

    .separator {
        color: #073c5e;
    }

    #components-reconnect-modal {
        display: none;
    }

    #components-reconnect-modal.components-reconnect-show {
        display: block;
    }


.e-chip-list .e-chip {
    height: 32px;
    padding: 4px 12px;
    background-color: var(--csp-grey90);
/*    border: none;*/
    border-color: #b1b1b1;
    color: #073c5e;
}

.e-chip-list .e-chip.e-active {
    background-color: #26b050 !important;
    border-color: #26b050 !important;
    color: #fff !important;
}

.e-chip-list .e-chip.e-active.aborted {
    background-color: var(--csp-red-dark) !important;
    border-color: var(--csp-red-dark) !important;
    color: #fff !important;
}


    .breakspaces {
        white-space:break-spaces
    }

    .cspItemImage {
        max-height: 75px;
        cursor: pointer;
    }

    .cspItemImage:hover {
        opacity:0.5
    }

    .cspEnlargeImage {
        height: 100%;
        margin-left: auto;
        margin-right: auto;
        display:block
    }

    .cspItemImage_small {
        max-height: 30px;
    }

.cspItemImage_med {
    max-height: 50px;
}

.csp_Image_DocLogo {
    max-height: 100px;
}

.csp-black {
    color: var(--csp-black) !important;
}

.csp-yellow {
    color: var(--csp-yellow) !important;
}

.csp-orange {
    color: var(--csp-orange) !important;
}

.csp-blue-mid {
    color: var(--csp-blue-mid) !important;
}

.csp-blue-light-alt {
    color: var(--csp-blue-light-alt) !important;
}

.csp-green {
    color: var(--csp-green) !important;
}
.csp-green-alt {
    color: var(--csp-green-alt) !important;
}

.csp-green-dark {
    color: var(--csp-green-dark) !important;
}

.csp-purple {
    color: var(--csp-purple) !important;
}
.csp-magenta {
    color: var(--csp-magenta) !important;
}
.csp-brown {
    color: var(--csp-brown) !important;
}
.csp-red {
    color: var(--csp-red) !important;
}
.csp-red-dark {
    color: var(--csp-red-dark) !important;
}


.csp-brown-light {
    color: var(--csp-brown-light) !important;
}

.csp-grey99 {
    color: var(--csp-grey99) !important;
}



.e-menu-container .e-menu .e-menu-item .e-menu-icon {
    color: #284371;
}

/*.e-menu-icon:hover {
    color: var(--csp-blue-mid-alt) !important;
}

.e-anchor-wrap:hover {
    color: var(--csp-blue-mid-alt) !important;
}
*/
.e-menu-item:hover {
    color: var(--csp-blue-light-alt) !important;
}

    .e-menu-item:hover .e-anchor-wrap {
        color: var(--csp-blue-light-alt) !important;
    }


    .e-menu-item:hover .e-menu-icon {
        color: var(--csp-blue-light-alt) !important;
    }


    .e-menu-wrapper ul .e-menu-item,
    .e-menu-container ul .e-menu-item {
        height: 50px;
        line-height: 50px;
    }

    .e-menu-container ul .e-menu-item .e-caret {
        line-height: 50px;
    }


    .e-icons.e-frame.e-stop, .e-icons.e-frame.e-check {
        color: #fff;
    }


/* help popover */

.e-control.e-tooltip.e-lib {
    display: inline;
    vertical-align: top;
}

.e-btn.e-round:disabled, .e-css.e-btn.e-round:disabled {
    background-color: transparent;
    border: none;
    box-shadow: none;
    color: var(--csp-blue-mid-alt);
    height: 18px;
}

.e-tooltip-wrap.e-popup {
    background-color: #f7f7f7;
    border: 0;
}

.e-tooltip-wrap .e-tip-content {
    font-size: 14px;
    font-weight:normal
}

.e-tooltip-wrap .e-tip-content {
    color: #000;
}

.e-arrow-tip-inner.e-tip-left{
    color:#fff!important
}

/* help popover end */

.footer {
    border-top: 1px solid #e8e8e8;
    color: #828282;
    min-height: 62px;
/*    overflow: visible;*/
}

.footer a {
    color: #828282
}

.footer a:hover {
    color: #5e5e5e
}

.rag_red_light {
    color: #da848c;
}

.rag_amber_light {
    color: #e7d08a;
}

.rag_green_light {
    color: #73ab91;
}

.rag_red_bg_light {
    background-color: #da848c;
}
.rag_amber_bg_light {
    background-color: #e7d08a;
}
.rag_green_bg_light {
    background-color: #73ab91;
}

.rag_red_bg {
    background-color: #dc3545;
}

.rag_amber_bg {
    background-color: #ffc107;
}

.rag_green_bg {
    background-color: #198754;
}

.rag_red {
    color: #dc3545;
}

.rag_amber {
    color: #ed8c00;
}

.rag_green {
    color: #198754;
}

/*used in reports*/
.rag_red_bg_alt {
    background-color: #e394a1 !important;
}

.rag_orange_bg_alt {
    background-color: #f5b07f !important;
}

.rag_amber_bg_alt {
    background-color: #f5da82 !important;
}

.rag_green_bg_alt {
    background-color: #89cda1 !important;
}
/*end*/


.slider_Green.slider_track_colour .e-slider-track {
    background-color: #73ab91 !important
}

.e-control-wrapper.e-slider-container .e-slider.slider_Green .e-range {
    background-color: #73ab91 !important
}

.slider_Green .e-handle {
    background-color: #198754 !important;
    border-color: #198754 !important;
}

.slider_Amber.slider_track_colour .e-slider-track {
    background-color: #f2ca8f !important
}

.e-control-wrapper.e-slider-container .e-slider.slider_Amber .e-range {
    background-color: #f2ca8f !important
}

.slider_Amber .e-handle {
    background-color: #ed8c00 !important;
    border-color: #ed8c00 !important;
}

.slider_Red.slider_track_colour .e-slider-track {
    background-color: #da848c !important
}

.e-control-wrapper.e-slider-container .e-slider.slider_Red .e-range {
    background-color: #da848c !important
}

.slider_Red .e-handle {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
}

.nav-link .cspPill {
    color: #198754 !important;
    border: 1px solid #198754 !important;
}

.nav-link:active .cspPill {
    background-color: #198754 !important;
    color: #fff !important;
}

.pointer {
    cursor: pointer;
}

.largeImage {
    height: 200px !important;
    max-height: 200px !important;
}

/**/

.csp-input {
    border-radius: 0.5rem !important;
    border: none !important;
    background-color: var(--csp-grey99) !important;
    padding: 1rem .75rem;
    font-size: 14px;
    max-height: 54px;
}

.csp-input-text {
    border-radius: 0.5rem !important;
    border: none !important;
    background-color: var(--csp-grey99) !important;
    padding: 1rem .75rem;
    font-size: 14px;
}

.csp-input-dark {
    background-color: var(--csp-grey93) !important;
}


.e-input-group.e-control-wrapper.e-ddl .e-input[readonly] {
    height: 22px;
}

span.e-input-group-icon.e-ddl-icon.e-icons.e-ddl-disable-icon{
    min-height:22px;
}

.csp-bg-grey90 {
    background-color: var(--csp-grey90);
}

.csp-bg-grey93 {
    background-color: var(--csp-grey93);
}

.csp-bg-grey95 {
    background-color: var(--csp-grey95);
}

.csp-bg-grey97 {
    background-color: var(--csp-grey97);
}

.csp-bg-grey99 {
    background-color: var(--csp-grey99);
}


.csp-button{
    border-radius: 0.5rem;
}

.chip-shadow {
    box-shadow: 0rem .25rem 0.75rem rgba(0,0,0,.15) !important;
}


/*Scheduler */

.csp-scheduler {
    /*    padding: 1rem;*/
    background-color: var(--csp-grey99);
    border-radius: 0.5rem;
    border: none;
}

/*.sf-grid.e-grid{*/
/*    padding:1rem;*/
    /*border-radius:0.5rem;*/
/*    border:none;*/
/*    background-color: var(--csp-grey97);*/
/*}*/

.e-schedule-toolbar-container{
    background-color: var(--csp-grey93);
    padding:1rem;
}

.e-schedule .e-schedule-toolbar{
    box-shadow:none;
}
.e-schedule .e-schedule-toolbar .e-toolbar-items {
    background-color: var(--csp-grey93);
    border: none;
}

.e-toolbar .e-tbar-btn {
    background-color: var(--csp-grey93);
}

.e-schedule .e-schedule-toolbar .e-active-view .e-tbar-btn-text, .e-schedule .e-schedule-toolbar .e-active-view .e-icons{
    color: var(--csp-blue-mid-alt);
}

.e-schedule .e-timeline-view .e-date-header-wrap table td.e-current-day, .e-schedule .e-timeline-month-view .e-date-header-wrap table td.e-current-day {
    color: var(--csp-blue-mid-alt);
}

.e-toolbar .e-toolbar-items{
    background:none;
}
/*
    grid
*/

.e-pager.sf-pager .e-pagercontainer{
border-radius: 0.5rem;
}

.e-grid {
    /*    padding: 1rem;*/
    box-shadow: none !important;
    border: none;
    border-radius: 0.5rem;
    background-color: var(--csp-grey93);
}

    .e-grid .e-toolbar {
        padding: 1rem;
        border-radius: 0.5rem 0.5rem 0rem 0rem;
        border:none;
        background-color: var(--csp-grey93);
    }

    .e-grid .e-gridheader {
        padding: .25rem 1rem .5rem 1rem;
        background-color: var(--csp-grey93);
        border-radius: 0.5rem 0.5rem 0rem 0rem;
        border:none;
    }

.e-table.e-sortfilter {
    background-color: var(--csp-grey93) !important;
}

    .e-grid .e-gridcontent {
        padding: 0.5rem 1rem 0.5rem 1rem;
        
    }

    .e-grid .e-pager {
        padding: 1rem;
        border-radius: 0rem 0rem 0.5rem 0.5rem;
    }

.e-input-group input.e-input, .e-input-group.e-control-wrapper input.e-input, .e-input-group textarea.e-input, .e-input-group.e-control-wrapper textarea.e-input {
    border-radius:0.5rem;
    background-color: var(--csp-grey99);
}

.e-grid .e-filterbarcell, .e-grid .e-filterbarcelldisabled{
    border: none;
}

.e-input-group, .e-input-group.e-control-wrapper{
    border:none;
}

    .e-clear-icon{
        background-color: var(--csp-grey99) !important;
        border-radius: 0.5rem;
    }

.e-grid .e-headercell {
    background-color: var(--csp-grey93) !important;
}

.e-grid .e-filterbarcell {
    background-color: var(--csp-grey93) !important;
}

.e-toolbar .e-toolbar-items .e-toolbar-item.e-overlay{
    background-color: var(--csp-grey93)
}

.e-input-group .e-input-group-icon, .e-input-group.e-control-wrapper .e-input-group-icon{
    border:none;
}

.e-upload{
    border-radius: 0.5rem; 
}

.csp-grid-card .e-grid {
    
    box-shadow: 0rem .25rem 0.75rem rgba(0,0,0,.15) !important;
}
.e-pager .e-numericitem, .e-pager div.e-icons.e-pager-default {
    color: var(--csp-blue-mid-alt);
}

/*checkbox*/

.e-checkbox-wrapper .e-frame.e-check, .e-css.e-checkbox-wrapper .e-frame.e-check {
    background-color: var(--csp-blue-mid-alt);
    border-color: var(--csp-blue-mid-alt);
}

.e-checkbox-wrapper .e-frame.e-stop, .e-css.e-checkbox-wrapper .e-frame.e-stop {
    background-color: var(--csp-blue-mid-alt);
    border-color: var(--csp-blue-mid-alt);
}

.e-checkbox-wrapper:hover .e-frame.e-check, .e-css.e-checkbox-wrapper:hover .e-frame.e-check {
    background-color: var(--csp-blue-light-alt);
    border-color: var(--csp-blue-light-alt);
}

.e-checkbox-wrapper:hover .e-frame.e-stop, .e-css.e-checkbox-wrapper:hover .e-frame.e-stop {
    background-color: var(--csp-blue-light-alt);
    border-color: var(--csp-blue-light-alt);
}


/*buttons*/

.e-footer-content .e-btn.e-primary.e-flat:not([DISABLED]) {
    border-radius:0.5rem;
    background-color: transparent;
    border-color: var(--csp-blue-mid-alt);
    color: var(--csp-blue-mid-alt);
}

    .e-footer-content .e-btn.e-primary.e-flat:not([DISABLED]):hover {
        background-color: var(--csp-blue-dark-alt);
        border-color: var(--csp-blue-dark-alt);
        color: white;
    }

.e-footer-content .e-btn.e-flat:not([DISABLED]) {
    border-radius: 0.5rem;
    background-color: transparent;
    border-color: var(--csp-black);
    color: var(--csp-black);
}

    .e-footer-content .e-btn.e-flat:not([DISABLED]):hover {
        border-radius: 0.5rem;
        background-color: var(--csp-black);
        border-color: var(--csp-black);
        color: white;
    }

/*  SfTab */

.e-tab.e-fill .e-tab-header.e-vertical.e-vertical-left {
    min-width: 200px;
    min-height: 400px;
    border-right: 1px solid var(--csp-grey-light);
    margin-right: 15px;
}

.e-tab.e-fill .e-tab-header .e-toolbar-items {
    margin-right:0.75rem;
}

.e-tab.e-fill .e-tab-header .e-toolbar-item {
    margin-bottom: 5px !important;
    min-height: 40px !important;
    border: 0px !important;
}

.e-tab.e-fill .e-tab-header .e-toolbar-item .e-tab-wrap {
    height: 40px !important;
    border-radius: 0.5rem !important;
    border: 0px !important;
}

.e-tab.e-fill .e-tab-header .e-toolbar-item:not(.e-separator) {
    margin-right: 0px !important;
}

.e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
    background: var(--csp-blue-dark-alt) !important;
}

.e-tab-text {
    font-size: 16px !important;
    color: var(--csp-blue-dark-alt);
    padding-top:5px;
}

.e-tab.e-fill .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
    background: var(--csp-blue-mid-alt);
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
    border:0px!important;
}

.e-tab.e-fill .e-tab-header .e-toolbar-item .e-tab-wrap:hover .e-tab-text {
    color: #fff !important;
}

.e-tab.e-vertical-tab .e-content {
    font-size: 16px !important;
}

/*  SfTab end */


/*numeric*/

.e-numeric.e-control-wrapper {
    border-radius: 0.5rem !important;
    border: none !important;
    background-color: var(--csp-grey99) !important;
    padding: 1rem .75rem;
    font-size: 14px;
}

.e-input-group-icon.e-spin-down {
    border: none !important;
    border-radius: 0.5rem !important;
}

.e-input-group-icon.e-spin-up {
    border: none !important;
    border-radius: 0.5rem !important;
}

/*SfDatePicker SfDateTimePicker*/

.e-date-wrapper.e-date-container {
    border-radius: 0.5rem !important;
    border: none !important;
    background-color: var(--csp-grey99) !important;
    padding: 1rem .75rem;
    font-size: 14px;
}

.e-input-group-icon.e-date-icon {
    border: none !important;
    border-radius: 0.5rem !important;
}

.e-control-wrapper.e-datetime-wrapper.e-control-container.e-datetime-container {
    border-radius: 0.5rem !important;
    border: none !important;
    background-color: var(--csp-grey99) !important;
    padding: 1rem .75rem;
    font-size: 14px;
}


/*SFDialog*/
.e-dialog {
    background-color: var(--csp-grey90);
    border-radius: 0.5rem;
}


.e-dialog .e-dlg-header-content {
    background-color: var(--csp-grey90);
    padding: 1rem 1.5rem;
    border-radius: 0.5rem .5rem 0rem 0rem;
}

.e-dialog .e-dlg-content{
    background-color: var(--csp-grey93);
    padding: 1rem 1.5rem;
}

.e-dialog .e-footer-content {
    background-color: var(--csp-grey90);
    padding: 1rem;
    border-radius: 0rem 0rem 0.5rem .5rem;
}

/*switch*/

.csp-switch {
    border: none;
    cursor: pointer;
    height: 1.5rem;
    width: 3rem !important;
}

.csp-switch:checked {
    background-color: var(--csp-blue-mid-alt);
}

.csp-form-switch{
/*    width: 5rem;*/
    max-height: 3rem;
}

.e-tooltip-wrap.e-popup {
}

.e-tooltip-wrap {
}

    .e-tooltip-wrap .e-tip-content{
        border-radius: .50rem !important;
    }
    .csp-rounded{
        border-radius:0.5rem;
    }



.e-btn-group .e-btn {
    background-color: var(--csp-grey93);
    color: var(--csp-blue-dark);
    border-color: var(--csp-grey90);
}

.e-btn-group input:checked+label.e-btn {
    background-color: var(--csp-blue-mid-alt);
    color: var(--csp-grey99);
    border-color: var(--csp-blue-mid);
}

.largeNav {
    white-space: nowrap
}

.largeNav .card:hover {
    background-color: var(--csp-blue-light);
}

/* diary */
.e-schedule .e-timeline-view .e-appointment {
    background-color: transparent;
    height: 100%;
}

    .e-schedule .e-timeline-view .e-appointment .e-appointment-details {
        padding: 0;
        height: 100%;
        width: 100%;
    }

.timeslotEventWrap {
    width: 100%;
    height: 100%;
    background-color: var(--csp-grey-light);
    color: var(--csp-black);
}

.timeslot_Blue {
    background-color: var(--csp-blue-mid);
    color: var(--csp-grey-dark);
}
.timeslot_Blue a {
    color: var(--csp-grey90);
}
.timeslot_Blue a:hover {
    color: #fff;
}

.timeslot_GreenAlt {
    background-color: var(--csp-green-alt);
    color: var(--csp-grey-dark);
}
.timeslot_GreenAlt a {
    color: var(--csp-grey-light);
}
.timeslot_GreenAlt a:hover {
    color: #fff;    
}

.timeslot_Red {
    background-color: var(--csp-red-dark);
    color: #fff;
}
    .timeslot_Red a {
        color: var(--csp-grey-light);
    }
.timeslot_Red a:hover {
    color: #fff;
}
.timeslot_Yellow {
    background-color: var(--csp-yellow);
}

/*end*/

.nshareLogo_small 
{
    height:30px;
}

.reportItemImage {
    height: 150px;
    max-height: 150px;
}


.grid-badge{

    border-radius:0.5rem;
    padding: 0.75rem;

}

.colour-white{
    color: white;
}

/*.grid-badge-green{
    background-color: 
}*/