:root {
    --white: #fff;
    --white-trans-: rgba(255, 255, 255, 0.6);
    --black: #000;
    --greenies-blue: #00636e;
    --greenies-blue-light: #007e8c;
    --orange-d: #e64b50;
    --spacing-5: 5px;
    --spacing-10: 10px;
    --spacing-15: 15px;
    --spacing-20: 20px;
    --spacing-50: 50px;
    --spacing-100: 100px;
    --font-12: 0.9em;
    --font-14: 1em;
    --font-16: 1.155em;
    --font-20: 1.4em;
}
.alert-info {
    --bs-alert-color: var(--bs-info-text-emphasis);
    --bs-alert-bg: #d7edff;
    --bs-alert-border-color: #b3dcff;
    --bs-alert-link-color: var(--bs-info-text-emphasis);
}
.card {background:var(--white);}

.srow, .img-responsive, .logo-wrapper a span small, .employee-details ul li small, .employee-details ul li span {width: 100%;}
.clrleft {float:left;}
.clrright {float:right;}
.darkmode {display: none;}
.employee-details ul li small, .employee-details ul li span {display:block;}
/*.logo-wrapper a, .logo-wrapper a figure, .logo-wrapper a span small, .ekyc-status, .ekyc-status h4, .ekyc-status small, .nps-details ul li, .nps-details ul li small, .nps-details ul li span, .employee-details ul li {display: flex;}*/
.ekyc-status {justify-content: center;}
.ekyc-status {align-items: center;}
.ekyc-bg {
    --bs-alert-bg: #fff;
}
.admin-title-h2 {position:relative;}
.admin-title-h2::before, .admin-title-h2::after {position:absolute;}
.admin-title-h2::before, .admin-title-h2::after {content:'';}
.employee-details ul li span {font-weight:700;}

.mr-10 {margin-right:var(--spacing-10);}
.mb-5 {margin-bottom:var(--spacing-5);}
.mb-10 {margin-bottom:var(--spacing-10);}
.mb-20 {margin-bottom:var(--spacing-20);}
.br-10 {border-radius:var(--spacing-50);}

.admin-title-h2 {color:var(--greenies-blue); padding-left:var(--spacing-15);}
.admin-title-h2::before {top:3px; left:0; width:3px; height:17px; background:var(--orange-d)}
.admin-title-h2::after {top:9px; left:0; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid var(--orange-d); transform: rotate(90deg);}

.logo-wrapper a {color:var(--white);}
.logo-wrapper a figure {width: 50px; margin-bottom: 0; margin-right: 10px;}

.admintop-logo a {color:var(--black);}
.page-wrapper.compact-wrapper .page-header .header-wrapper .toggle-sidebar {padding-left: 7px!important; padding-top: 2px; color: #1561b7;}
.page-wrapper.compact-wrapper .page-header .header-wrapper .toggle-sidebar i {font-size:1.3rem;}
.ekyc-status small {margin-left:var(--spacing-100);}
.ekyc-status h4 span {color: #237f52;}
.nps-details ul li {margin-bottom:var(--spacing-10); padding-bottom:var(--spacing-10); border-bottom: 1px dashed #b4d5f1;}
.nps-details ul li small {width:20%; margin-right:var(--spacing-20); font-size:0.9em;}
.nps-details ul li span {font-weight: 700; color:var(--greenies-blue); line-height:normal;}
.custom-table thead tr {background:var(--greenies-blue-light);}
.custom-table thead tr th {color:var(--white); font-weight:400;}

.profile-media img {width:40px;}
.employee-details ul {display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;}
.employee-details ul li {padding: 5px 10px; border: 1px solid #ddd; border-radius: 10px; background:var(--greenies-blue);  color: #fff; align-content: center; flex-wrap: wrap; text-align: center;}
.employee-details ul li small {font-size:var(--font-14);}
.employee-details ul li span {font-size:var(--font-14);}
.employee-details ul li.one {background: #F784B6; background: linear-gradient(90deg, rgba(247, 132, 182, 1) 0%, rgba(219, 75, 137, 1) 100%);}
.employee-details ul li.two {background: #39B7DD; background: linear-gradient(90deg, rgba(57, 183, 221, 1) 0%, rgba(27, 165, 207, 1) 100%);}
.employee-details ul li.three {background: #569627; background: linear-gradient(90deg, rgba(86, 150, 39, 1) 0%, rgba(59, 128, 10, 1) 100%);}
.employee-details ul li.four {background: #FCA326; background: linear-gradient(90deg, rgba(252, 163, 38, 1) 0%, rgba(207, 120, 0, 1) 100%);}
.employee-details ul li.five {background: #8762C9; background: linear-gradient(90deg, rgba(135, 98, 201, 1) 0%, rgba(102, 54, 186, 1) 100%);}
.mode span {cursor: pointer; padding: 8px 15px; border-radius: 5px; background: #e5f2fd; transition: 0.3s; color:var(--greenies-blue);}
.mode span:hover {background:#e8e8e8; color:var(--black)}
.mode span i {margin-right:var(--spacing-10)}

.dark-only .logo-wrapper a {color:var(--white-trans);}
.dark-only .mode span {border: 1px solid #374558; color:var(--white-trans); background:#1f2639;}
.dark-only .nps-details ul li span {color:var(--white-trans);}
.dark-only .ekyc-status h4 span {color:var(--body-font-color);}
.dark-only .employee-details ul li.one, .dark-only .employee-details ul li.two, .dark-only .employee-details ul li.three, .dark-only .employee-details ul li.four, .dark-only .employee-details ul li.five {background: #212121; background: linear-gradient(90deg, rgb(31 38 57) 0%, rgb(25 31 49) 100%)}
.dark-only .employee-details ul li {border: 1px solid #374558; color:#8f929d}
.dark-only .custom-table thead tr {background: #3a4050;}
.dark-only .admin-title-h2::before {background:#516075;}
.dark-only .admin-title-h2::after {border-bottom: 5px solid #516075;}
.dark-only .table {--bs-table-color: #90949d;}
.dark-only .custom-table thead tr th {color: #c9cedb;}