:root {
    --ey-background-color: #2e2e38;
    --ey-color: #ffe600;
    --ey-color-rgb: 255, 233, 0;
    --ey-second-color: #747480; /*#FFA903*/
    --body-color: #C0C0C0;
    --parthenon-color: #1a9afa;
    --heading-color: #808080;
    --white-color: #ffffff;
    --black-color: #000000;
    --dark-color: #222222;
    --text-primary-color: #2e2e38;
    --primary-font: 'satoshi';
    --vz-border-radius: 0.375rem;
}

.text-primary{
color: var(--text-primary-color) !important;
--vz-primary-rgb:var(--text-primary-color) !important;
}
.navbar-menu, :is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-brand-box, :is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>a.menu-link, .footer, .auth-page-wrapper .footer {
background-color:  var(--ey-background-color) !important;
border-right:  var(--ey-background-color) !important;
}
.navbar-menu .navbar-nav .nav-link{
    color: var(--white-color) !important;
}
.navbar-menu .navbar-nav .nav-link:hover, .footer, .auth-page-wrapper .footer{
    color: var(--ey-color) !important;
}
.navbar-menu .navbar-nav .nav-sm .nav-link, :is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-sm .nav-item:hover>.nav-link, .ey-color-yellow{
    color: var(--ey-color) !important;
}
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>.menu-dropdown{
    background: var(--dark-color) !important;
}
:is([data-layout="vertical"], [data-layout="semibox"])[data-sidebar-size="sm"]{
     min-height:100vh;
}
.form-select:focus {
    -webkit-box-shadow: 0 0 0 .25rem rgba(var(--vz-primary-rgb),.05);
    box-shadow: 0 0 0 .25rem rgba(var(--vz-primary-rgb),.05);
}
.footer a, .auth-page-wrapper .footer a {
    color: var(--parthenon-color);
}
.btn-primary {
    --vz-btn-bg: var(--ey-color) !important;
    --vz-btn-border-color:  var(--ey-background-color) !important;
    --vz-btn-hover-bg:  var(--ey-background-color) !important;
    --vz-btn-hover-border-color:  var(--ey-background-color) !important;
    --vz-btn-focus-shadow-rgb:  var(--ey-background-color) !important;
    --vz-btn-active-bg:  var(--ey-background-color) !important;
    --vz-btn-active-border-color:  var(--ey-background-color) !important;
    --vz-btn-color:  var(--ey-background-color) !important;
}
.btn-danger {
    --vz-btn-bg:  var(--ey-background-color) !important;
    --vz-btn-border-color:  var(--ey-background-color) !important;
    --vz-btn-hover-bg: var(--ey-color);
    --vz-btn-hover-border-color:  var(--ey-background-color) !important;
    --vz-btn-focus-shadow-rgb:  var(--ey-background-color) !important;
    --vz-btn-active-bg:  var(--ey-background-color) !important;
    --vz-btn-active-border-color:  var(--ey-background-color) !important;
}
.btn-secondary{
    --vz-btn-bg: var(--ey-second-color) !important;
    --vz-btn-border-color: var(--ey-second-color) !important;
    --vz-btn-hover-bg: var(--ey-color);
    --vz-btn-hover-border-color: var(--ey-second-color) !important;
    --vz-btn-focus-shadow-rgb: var(--ey-second-color) !important;
    --vz-btn-active-bg: var(--ey-second-color) !important;
    --vz-btn-active-border-color: var(--ey-second-color) !important; 
}
.btn:hover {
    color: var(--ey-color);
    background-color:  var(--ey-background-color);
    border-color: var(--ey-color);
}
.auth-one-bg .bg-overlay{
    background: -webkit-gradient(linear,left top,right top,from(var( --ey-background-color)),to(var( --ey-background-color)));
    background: linear-gradient(to right,var( --ey-background-color),var( --ey-background-color));
    opacity: .9;
}
.auth-bg-cover{
    background: var( --ey-background-color);
}

/*******************************
* MODAL AS LEFT/RIGHT SIDEBAR
* Add "left" or "right" in modal parent div, after class="modal".
* Get free snippets on bootpen.com
*******************************/
.modal.left .modal-dialog,
.modal.right .modal-dialog, .modal .modal-dialog {
    position: fixed;
    margin: auto;
    width: 50%;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
    --vz-modal-border-color: none;
}

.modal.left .modal-content,
.modal.right .modal-content, .modal .modal-content {
    height: 100%;
    overflow-y: auto;
}

.modal.left .modal-body,
.modal.right .modal-body, .modal .modal-body {
    padding: 15px 15px 40px;
}
.modal-footer:not([class*=bg-]) {
    padding-top: 10px;
    border-top-width: calc(0.15rem - 1px);
}
.modal-header {
    background-color: var(--ey-background-color) !important;
}
.modal-title, .modal-header .btn-close {
    margin-bottom: 0;
    line-height: 1.5;
    color: #fff !important;
   
}
.modal-dialog:not(.modal-dialog-scrollable) .modal-header{
    padding:var(--vz-modal-header-padding);
}
.modal .modal-dialog.modal-xxl {
    width: 70% !important;
}
/*Left*/
.modal.left.fade .modal-dialog {
    left: -50%;
    -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
    -o-transition: opacity 0.3s linear, left 0.3s ease-out;
    transition: opacity 0.3s linear, left 0.3s ease-out;
}

.modal.left.fade.show .modal-dialog {
    left: 0;
}

/*Right*/
.modal.right.fade .modal-dialog, .modal.fade .modal-dialog, .modal .modal-dialog {
    right: -50%;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}

.modal.right.fade.show .modal-dialog, .modal.fade.show .modal-dialog, .modal.show .modal-dialog {
    right: 0;
}

.formContainer {
    height: 85vh !important;
}

.modal-body .companyfirst-formpanel .individual-queryrow {
    width: 50%;
}

.modal-body .rte-modern.rte-desktop.rte-toolbar-default {
    min-width: 100%;
}

@media (max-width: 576px) {
    .modal.left .modal-dialog, .modal.right .modal-dialog, .modal .modal-dialog {
        width: 100%;
    }

    .formDropdown .dropDiv {
        width: 96%;
    }
    .modal .modal-dialog.modal-xxl {
        width: 100% !important;
    }
}

@media (max-width: 480px) {
    .modal.left .modal-dialog, .modal.right .modal-dialog, .modal .modal-dialog {
        width: 100%;
    }

    .formDropdown .dropDiv {
        width: 96%;
    }
    .modal .modal-dialog.modal-xxl {
        width: 100% !important;
    }
}

.bg-ey{
    background-color:  var(--ey-background-color) !important;
}
.bg-ey strong{
    color: var(--white-color);
}
.top-20 {
    top: 20%!important
}

.form-check-input:checked {
    background-color: var(--ey-color);
    border-color: var(--ey-color);
}
/****************** Custom select2 Changes ******************/
.select2-container .select2-selection--single{
    height: unset;
    padding: 0.235rem;
    border: var(--vz-border-width) solid var(--vz-input-border-custom);
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
    top: 20%;
}
/****************** Custom select2 Changes ******************/


/****************** Custom Alert Changes ******************/
.progress-success{
    background-color: var(--vz-success-text-emphasis);
}
.progress-error{
    background-color: var(--vz-danger-text-emphasis);
}
.swal2-cancel{
    display: none !important;
}
div:where(.swal2-container) .swal2-html-container{
    margin: 0;
    color: var(--white-color);
}
.swal2-popup{
    padding-bottom: 2px;
}
/****************** Custom Alert Changes ******************/

/****************** Custom Datatables Changes ******************/

.active>.page-link, .page-link.active {
    z-index: 3;
    color: var(--ey-color);
    background-color:  var(--ey-background-color) !important;
    border-color: var(--ey-color);
}
table.dataTable.table-striped>tbody>tr.odd>* {
    box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-stripe), 0.02);
}

/****************** Custom Datatables Changes ******************/

.select2-container--default .select2-selection--multiple .select2-selection__choice{
    background-color: transparent !important;
    color: var(--vz-topbar-search-color);
}

.fst_break_long{
    word-wrap: break-word;
    white-space: break-spaces !important;
}
.bg-gray, .bg-Unrated {
    --vz-bg-opacity: 1;
    background-color: var(--vz-gray-400) !important;
}
@media (min-width: 992px)
{
    .modal-xxl {
    --vz-modal-width: 900px;
    }
   
}
.swiper-pagination-bullet-active{
--swiper-theme-color: var(--ey-color);
}

.table > thead > tr {
    --vz-bg-opacity: 1;
    background-color: var(--vz-gray-700) !important;
    --vz-text-opacity: 1;
    color: rgba(var(--vz-white-rgb),var(--vz-text-opacity))!important;
}
.card {
    -webkit-box-shadow: 0 1px 10px rgba(56,65,74,.15);
    box-shadow: 0 1px 10px rgba(56,65,74,.15);
}
.card-header{
    border-color: var(--ey-color) !important;
    border-width: 2px;
}
.table-bordered>:not(caption)>*>* {
    border-width: 0 var(--vz-border-width);
    /* border-color: var(--heading-color); */
    border: dotted 1px var(--ey-color);
}

.navbar-header .user-name-text{
    color: var(--text-primary-color);
}
.btn:hover .user-name-text {
    color: var(--ey-color);
}

.bg-ey-yellow{
        --vz-bg-opacity: 1;
        background-color: rgba(var(--ey-color-rgb),var(--vz-bg-opacity))!important;
}
.text-ey-yellow{
    --vz-text-opacity: 1;
    color: rgba(var(--ey-color-rgb),var(--vz-text-opacity))!important;
}

.btn-failure {
    --vz-btn-bg: var(--vz-danger);
    --vz-btn-border-color: var(--vz-danger);
    --vz-btn-hover-bg: var(--vz-danger-text-emphasis);
    --vz-btn-hover-border-color: var(--vz-danger-text-emphasis);
    --vz-btn-focus-shadow-rgb: var(--vz-danger-rgb);
    --vz-btn-active-bg: var(--vz-danger-text-emphasis);
    --vz-btn-active-border-color: var(--vz-danger-text-emphasis);
    --vz-btn-color: #fff;
}

.btn-failure.btn-animation {
    background-color: #f06548;
    border-color: #f06548!important;
}
.btn-failure.btn-animation:is(:hover,:focus,:active,:focus-visible) {
    color: #f06548;
    background-color: rgba(240,101,72,.1);
}

.swiper-button-next::after, .swiper-button-prev::after {
    font-family: remixicon !important;
    font-size: 28px;
    color: var(--ey-background-color);
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}
  
.avatar-xsm {
    height: 2.5rem;
    min-width: 3rem;
}

div.dataTables_wrapper div.dataTables_length label, div.dataTables_wrapper div.dataTables_filter label{
    padding-top: 0.375rem;
    margin-bottom: 0.25rem;
}

div.dataTables_wrapper div.dataTables_filter{
    text-align: left;
}

.dtrg-group{
    
    --vz-bg-opacity: 0.45;
    /* background-color: rgba(var(--ey-color-rgb),var(--vz-bg-opacity)) !important; */
    background-color: #e9ebec80 !important;
    font-weight: 600;
}

.step-arrow-nav .nav .nav-link.active {
    --vz-bg-opacity: 1;
    /* background-color: rgba(var(--ey-color-rgb),var(--vz-bg-opacity));
    color: var(--ey-background-color); */
    background-color: var(--ey-second-color) !important;
    color: var(--vz-topbar-user-bg);
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 5px;
    -webkit-box-shadow: 0 1px 10px rgba(56,65,74,.15);
    box-shadow: 0 1px 10px rgba(56,65,74,.15);
}
.step-arrow-nav .nav .nav-link {
    border-radius: 0;
    position: relative;
    font-weight: 500;
    /* color: var(--white-color);
    --vz-bg-opacity: 1;
    background-color: var(--ey-second-color); */
    
    color: var(--black-color);
    background-color: #e9ebec;
}




/***************************** Conduct Risk Dashboard *****************************/

.gauge-wrapper {
    display: inline-block;
    width: auto;
    margin: 0 auto;
    padding: 25px 10px 15px 10px;
}

.gauge {
    background: #e7e7e7;
    box-shadow: 0 -2px 6px 0px rgba(0, 0, 0, 0.50);
    width: 200px;
    height: 100px;
    position: sticky;
    border-radius: 100px 100px 0 0;
    overflow: hidden;
}

    .gauge.min-scaled {
        transform: scale(0.5);
    }

.gauge-center {
    content: '';
    color: var(--white-color);
    width: 60%;
    height: 60%;
    background: var(--white-color);
    border-radius: 100px 100px 0 0 !important;
    position: absolute;
    box-shadow: 0 -13px 15px -10px rgba(0, 0, 0, 0.28);
    right: 21%;
    bottom: 0;
    color: var(--white-color);
    z-index: 10;
}

    .gauge-center .label, .gauge-center .number {
        display: block;
        width: 100%;
        text-align: center;
        border: 0 !important;
    }

    .gauge-center .label {
        font-size: 0.75em;
        opacity: 0.6;
        margin: 1.1em 0 0.3em 0;
    }

    .gauge-center .number {
        font-size: 1.2em;
    }

.needle {
    width: 73px;
    height: 8px;
    background: #15222E;
    border-bottom-left-radius: 100% !important;
    border-bottom-right-radius: 5px !important;
    border-top-left-radius: 100% !important;
    border-top-right-radius: 5px !important;
    position: absolute;
    bottom: -2px;
    left: 25px;
    transform-origin: 100% 4px;
    transform: rotate(0deg);
    box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.38);
    display: none;
    z-index: 19;
}

.four.rischio0 .needle {
    animation: fourspeed0 2s 1 both;
    animation-delay: 1s;
    display: block;
}

.four.rischio1 .needle {
    animation: fourspeed1 2s 1 both;
    animation-delay: 1s;
    display: block;
}

.four.rischio2 .needle {
    animation: fourspeed2 2s 1 both;
    animation-delay: 1s;
    display: block;
}

.four.rischio3 .needle {
    animation: fourspeed3 2s 1 both;
    animation-delay: 1s;
    display: block;
}

.four.rischio4 .needle {
    animation: fourspeed4 2s 1 both;
    animation-delay: 1s;
    display: block;
}

.slice-colors {
    height: 100%;
    position: relative;
    overflow: hidden;
    border-radius: 100px 100px 0 0
}

    .slice-colors .st {
        position: absolute;
        bottom: 0;
        width: 0;
        height: 0;
        border: 50px solid transparent;
    }


/* Color for Risk score on Welcome Page */
.four .slice-colors .st.slice-item:nth-child(2) {
   
    border-top: 50px var(--vz-bg-high) solid;
    border-right: 50px var(--vz-bg-high) solid;
    background-color: var(--vz-bg-veryhigh);
}

.four .slice-colors .st.slice-item:nth-child(4) {
    left: 50%;
    border-bottom: 50px var(--vz-bg-low) solid;
    border-right: 50px var(--vz-bg-low) solid;
    background-color: var(--vz-bg-medium);
}

#dvRiskScore {
    text-align: center;
}

.risk-score-number {
    font-size: 1.2em;
    text-align: center;
    color: #6a6a6a;
    font-weight: 800;
}

@-webkit-keyframes fourspeed0 {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(1deg);
    }
}

@-webkit-keyframes fourspeed1 {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(16deg);
    }
}

@-webkit-keyframes fourspeed2 {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(65deg);
    }
}

@-webkit-keyframes fourspeed3 {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(115deg);
    }
}

@-webkit-keyframes fourspeed4 {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(164deg);
    }
}

:root{
    /* --vz-bg-veryhigh: #ee3323;
    --vz-bg-high: #fca503;
    --vz-bg-medium: #9dcb3b;
    --vz-bg-low: #24a84a; */

    --vz-bg-veryhigh: #FF0000;
    --vz-bg-high: #FF0000;
    --vz-bg-medium: #FFC000;
    --vz-bg-low: #00B050;
}
.bg-scoreHigh, .bg-scoreSatisfactory{
    background-color: var(--vz-bg-high) !important; 
    color: var(--vz-white)  !important;
}

.bg-scoreMedium, .bg-scoreNeedsImprovement{
        background-color: var(--vz-bg-medium) !important;
        color: var(--vz-white) !important;
}
.bg-scoreLow, .bg-scoreSatisfactory{
    background-color: var(--vz-bg-low) !important;
    color: var(--vz-white) !important;
}

.bg-Medium{
    background-color: var(--vz-bg-medium) !important;
    color: var(--vz-white) !important;
}
.bg-VeryHigh, .bg-HighOverride{
    background-color: var(--vz-bg-veryhigh);
    color: var(--vz-white);
}
.bg-High{
    background-color: var(--vz-bg-high) !important; 
    color: var(--vz-white)  !important;
}
.bg-Low, .bg-LowOverride{
    background-color: var(--vz-bg-low) !important;
    color: var(--vz-white) !important;
}

.bg-RetailBanking{
    background-color: #005089 !important;
    color: var(--vz-white) !important;
}
.bg-BusinessBanking{
    background-color: #9751CB !important;
    color: var(--vz-white) !important;
}
.bg-Treasury{
    background-color: #A6A6A6 !important;
    color: var(--vz-white) !important;
}
.bg-WholesaleBanking{
    background-color: #AB8A54 !important;
    color: var(--vz-white) !important;
}
.bg-IslamicBanking{
    background-color: #00B050 !important;
    color: var(--vz-white) !important;
}
/***************************** Conduct Risk Dashboard *****************************/