@import url("https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
:root {
  --miz-strip-height: 30px;
  --miz-cult-people: 100px;
  --primary-font: "Roboto", sans-serif;
  --secondary-font: "Roboto Slab", serif;
  --max-width: 1400px;
  --section-spacing: 80px;
  /* Goals Color */
  --g1: #e5233d;
  --g2: #dda73a;
  --g3: #59ba47;
  --g4: #c7212f;
  --g5: #ee402d;
  --g6: #28bfe6;
  --g7: #fbc412;
  --g8: #a31d44;
  --g9: #f26a2e;
  --g10: #df1a83;
  --g11: #f99d2a;
  --g12: #bf8d2c;
  --g13: #3f7e45;
  --g14: #1f97d4;
  --g15: #59ba47;
  --g16: #136a9f;
  --g17: #1a3668;
  /* /Goals Color */
  /* Color palette */
  --cs-green: #009900;
  --cs-skyblue: #4bacc6;
  --cs-yellow: #ffc000;
  --cs-red: #dc3746;
  --cs-grey: #dfdfdf;
  --cs-teal: #00a084;
  --clr-1: #00437c;
  --clr-2: #f8f4e1;
  --clr-3: #31ca00;
  --clr-4: #565656;
  --clr-5: #38e500;
  --clr-6: #ffc436;
  --clr-7: #666666;
  --clr-8: #2196f3;
  --clr-9: #009900;
  --clr-10: #e5233d;
  --clr-11: #cce7ff;
  --clr-12: #d8d8d8;
  --clr-13: #009a7f;
  --clr-14: #fdc010;
  --clr-15: #a21942;
  /* /Color palette */
    --cs-performer: #ffc40c;
    --cs-front_runner: #00a084;
    --cs-achiever: #00aeef;
    --cs-aspirant: #dd1e47;
    --cs-no_data: #cccccc;
}
@media (max-width: 565px) {
  :root {
    --section-spacing: 60px;
  }
}

body {
  font-family: var(--primary-font);
}

p {
  margin-bottom: 0;
}


.form-select.disabled {
  background-image: none !important;
  background-color: #f2f2f2;
}

/* Global Classes */
.username-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #1aa053;
  font-size: 16px;
  color: #fff;
  width: 40px;
  min-width: unset;
  height: 40px;
}

/* Public Dashboard Header Css */
.cs-header {
  background-color: #fff;
  position: sticky;
  top: 0;
  z-index: 99;
}
.cs-header .header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1600px;
  margin: auto;
  padding: 10px 15px;
  position: relative;
}
.cs-header .header-content .header-left {
  display: flex;
}
.cs-header .header-content .header-left .header-text-logo {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
}
.cs-header .header-content .header-left .header-text-logo .top-title {
  font-weight: 700;
  font-size: 20px;
  color: var(--clr-1);
  font-family: var(--secondary-font);
  line-height: 22px;
}
.cs-header .header-content .header-left .header-text-logo .bottom-title {
  line-height: 15px;
  font-size: 16px;
  font-weight: 500;
  font-family: var(--secondary-font);
  color: #000;
}
.cs-header .header-content .header-left .header-text-logo .header-logo-text-1 {
  font-size: 16px;
  color: var(--clr-1);
  line-height: 20px;
}
.cs-header .header-content .header-left .header-text-logo .header-logo-text-2 {
  color: var(--clr-1);
  line-height: 20px;
}
.cs-header .header-content .header-left .header-text-logo .header-logo-text-3 {
  color: var(--clr-1);
  font-family: var(--secondary-font);
  line-height: 20px;
  font-weight: 500;
}
.cs-header .header-content .header-satyamev-logo {
  margin-left: 20px;
  margin-right: 10px;
  display: block;
}
.cs-header .header-content .header-satyamev-logo img {
  display: block;
  width: auto;
  height: 70px;
}
.cs-header .header-content .header-undp__logo {
  display: block;
  margin: 0 10px;
}
.cs-header .header-content .header-undp__logo img {
  display: block;
  width: auto;
  height: 70px;
}
.cs-header .header-content .header-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.cs-header .header-content .header-right .toggle-sidenav-btn {
  height: 100%;
  font-size: 35px;
  display: none;
  justify-content: center;
  align-items: center;
  background-color: #e0f1ff;
  color: #000;
  padding: 0 5px;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
}
.cs-header .header-content .header-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 18px;
}
.cs-header .header-content .header-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}
.cs-header .header-content .header-nav ul li {
  margin-right: 20px;
}
.cs-header .header-content .header-nav ul li a {
  font-size: 16px;
  color: #000;
  padding: 4px 0;
  transition: all 0.25s ease-in-out;
  position: relative;
  display: block;
}
.cs-header .header-content .header-nav ul li a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 3px;
  background-color: var(--clr-1);
  transition: 0.25s ease-in-out;
  border-radius: 10px;
}
.cs-header .header-content .header-nav ul li a:hover, .cs-header .header-content .header-nav ul li a.active {
  color: var(--clr-1);
}
.cs-header .header-content .header-nav ul li a:hover::after, .cs-header .header-content .header-nav ul li a.active::after {
  width: 100%;
}
.cs-header .header-content .header-nav .header-nav-login {
  padding: 4px 15px !important;
  line-height: normal !important;
}
@media (max-width: 1400px) {
  .cs-header .header-content .header-nav {
    display: none;
  }
  .cs-header .header-content .header-right {
    padding-right: 32px;
  }
  .cs-header .header-content .header-right .toggle-sidenav-btn {
    display: flex;
  }
}
@media (max-width: 565px) {
  .cs-header .header-content {
    padding-left: 0;
  }
  .cs-header .header-content .header-left .header-text-logo .top-title {
    font-size: 20px;
  }
  .cs-header .header-content .header-left .header-text-logo .bottom-title {
    font-size: 12px;
  }
  .cs-header .header-content .header-satyamev-logo {
    margin-left: 15px;
    margin-right: 10px;
    display: block;
  }
  .cs-header .header-content .header-satyamev-logo img {
    display: block;
    width: auto;
    height: 70px;
  }
  .cs-header .header-content .header-undp__logo {
    display: block;
    margin: 0 10px;
  }
  .cs-header .header-content .header-undp__logo img {
    display: block;
    width: auto;
    height: 70px;
  }
}

#sidebarMenu .modal-dialog {
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: auto;
  height: 100vh;
  width: 320px;
  border-radius: 0px;
  animation: slideInFromRight 0.5s forwards;
}
#sidebarMenu .modal-dialog .modal-content {
  height: 100%;
  border-radius: 0px !important;
  border: none !important;
}
#sidebarMenu .modal-dialog .modal-content .modal-header {
  display: flex;
  justify-content: space-between !important;
  align-items: center;
}
#sidebarMenu .modal-dialog .modal-content .modal-header .btn-close {
  margin-right: 0;
  margin-left: 0;
}

.sidebar-nav-wrapper .sidebar-nav__body ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.sidebar-nav-wrapper .sidebar-nav__body ul li {
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}
.sidebar-nav-wrapper .sidebar-nav__body ul li a {
  display: block;
  color: #000;
  font-size: 16px;
  font-weight: 500;
  padding: 10px 10px;
  text-transform: uppercase;
  transition: all 0.25s ease-in-out;
  border-radius: 2px;
}
.sidebar-nav-wrapper .sidebar-nav__body ul li a.active, .sidebar-nav-wrapper .sidebar-nav__body ul li a:hover {
  background-color: #00427c;
  color: #fff;
}

@keyframes slideInFromRight {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(0);
  }
}
/* /Public Dashboard Header Css */
/* Icons Tray Css */
.cs-icons-wrapper {
  white-space: nowrap;
}

.cs-icon-delete {
  background-color: #fff;
  color: #000;
  border: 2px solid #000;
  font-weight: 700;
  border-radius: 4px;
  width: 25px;
  height: 25px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  transition: all 0.25s ease-in-out;
}
.cs-icon-delete i.bi {
  line-height: 12px;
}
.cs-icon-delete:hover {
  color: #000;
  background-color: #fff;
}

.cs-icon-edit {
  background-color: var(--cs-teal);
  color: #fff;
  font-weight: 700;
  border-radius: 4px;
  width: 25px;
  height: 25px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  transition: all 0.25s ease-in-out;
}
.cs-icon-edit i.bi {
  line-height: 12px;
}
.cs-icon-edit:hover {
  color: #fff;
  background-color: var(--cs-teal);
}
.cs-icon-edit.cs-icon-yellow {
  background-color: var(--clr-14);
}
.cs-icon-edit.cs-icon-yellow:hover {
  background-color: var(--clr-14);
}

.cs-icon-save {
  border-radius: 4px;
  width: 25px;
  height: 25px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 2px solid var(--cs-green);
  color: var(--cs-green);
  background-color: #fff;
  transition: all 0.25s ease-in-out;
}
.cs-icon-save:hover {
  border: 2px solid var(--cs-green);
  color: var(--cs-green);
}

.cs-icon-discontinue {
  background-color: #e5233d;
  color: #fff;
  border-radius: 4px;
  width: 25px;
  height: 25px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  transition: all 0.25s ease-in-out;
}
.cs-icon-discontinue:hover {
  background-color: #d8243c;
  color: #fff;
}

.cs-icon-danger {
  background-color: #e5233d;
  color: #fff;
  border-radius: 4px;
  width: 25px;
  height: 25px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  transition: all 0.25s ease-in-out;
}
.cs-icon-danger:hover {
  background-color: #d8243c;
  color: #fff;
}

.cs-icon-success {
  border-radius: 4px;
  width: 25px;
  height: 25px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background-color: var(--cs-green);
  color: #fff;
  transition: all 0.25s ease-in-out;
}
.cs-icon-success:hover {
  background-color: var(--cs-green);
  color: #fff;
}

.cs-icon-warning {
  background-color: var(--clr-14);
  color: #fff;
  font-weight: 700;
  border-radius: 4px;
  width: 25px;
  height: 25px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.cs-icon-warning i.bi {
  line-height: 12px;
}
.cs-icon-warning:hover {
  color: #fff;
  background-color: var(--clr-14);
}

/* /Icons Tray Css */
/* Scrollbar Css */
::-webkit-scrollbar {
  width: 6px;
  height: 5px;
  border-radius: 6px;
}

::-webkit-scrollbar-track {
  border-radius: 6px;
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background: #888;
}

::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* /Scrollbar Css */
.section-heading {
  font-weight: 600;
  font-size: 24px;
  font-family: var(--secondary-font);
}
@media (max-width: 565px) {
  .section-heading {
    font-size: 20px;
  }
}

.btn {
  font-family: var(--secondary-font);
  text-transform: uppercase;
  font-size: 16px;
  font-weight: 500;
}
.btn.btn-muted {
  background-color: #ebebeb;
  color: #000;
}
.btn.btn-2 {
  font-family: var(--primary-font);
  text-transform: capitalize;
  font-weight: 400;
}

.sidebar .data-scrollbar {
  max-height: calc(100vh - 75px) !important;
}

.dropdown .dropdown-menu {
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}
.dropdown .dropdown-menu .dropdown-item {
  color: #000;
}
.dropdown .dropdown-menu .dropdown-item:hover {
  background-color: #deffde;
}

.main-content .iq-navbar {
  min-height: 65.8px;
}

.sidebar-base .nav-item .nav-link .item-name {
  white-space: wrap;
}

.sidebar-list .nav-link[aria-expanded=true] {
  background-color: var(--bs-primary-tint-90) !important;
  color: var(--bs-primary) !important;
  box-shadow: none;
}
.sidebar-list .nav-link[aria-expanded=true].active {
  background-color: var(--bs-primary-tint-90) !important;
  color: var(--bs-primary) !important;
  box-shadow: none;
}
.sidebar-list .nav-link[aria-expanded=false].active.collapsed {
  background-color: var(--bs-primary-tint-90) !important;
  color: var(--bs-primary) !important;
  box-shadow: none;
}

.trend-score-chart {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  max-width: -moz-max-content;
  max-width: max-content;
  margin: 0 auto;
}
.trend-score-chart.tsc-border {
  border: 1px solid #c1c1c1;
  border-radius: 5px;
  padding: 5px 10px;
}
.trend-score-chart .trend-score-chart__title {
  font-size: 14px;
  font-weight: 500;
  color: #000;
  margin-right: 10px;
  margin-bottom: 0;
  font-family: var(--secondary-font);
}
.trend-score-chart .trend-score-chart__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.trend-score-chart .trend-score-chart__list .trend-score-chart__list-item {
  display: flex;
  align-items: center;
  margin: 5px 0;
  margin-right: 20px;
}
.trend-score-chart .trend-score-chart__list .trend-score-chart__list-item img {
  display: block;
  width: 25px;
  margin-right: 10px;
}
.trend-score-chart .trend-score-chart__list .trend-score-chart__list-item p.trend-score-chart__item-title {
  margin-bottom: 0;
  font-weight: 400;
  font-size: 14px;
  color: #000;
  font-family: var(--secondary-font);
}
@media (max-width: 767px) {
  .trend-score-chart.tsc-border .trend-score-chart__title {
    width: 100%;
    text-align: center;
  }
  .trend-score-chart.tsc-border .trend-score-chart__list .trend-score-chart__list-item {
    width: 50%;
    padding-right: 20px;
    margin-right: 0;
    justify-content: center;
  }
}
@media (max-width: 380px) {
  .trend-score-chart.tsc-border .trend-score-chart__list .trend-score-chart__list-item {
    width: 100%;
  }
}

.color-indicator-charts {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.color-indicator-charts .color-indicator__item {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  margin-right: 20px;
  margin-top: 5px;
  margin-bottom: 5px;
}
.color-indicator-charts .color-indicator__item .ci__color {
  width: 18px;
  min-width: 18px;
  height: 18px;
  margin-right: 8px;
  border-radius: 2px;
}
.color-indicator-charts .color-indicator__item .ci__color.ci__color-skyblue {
  background-color: var(--cs-achiever);
}
.color-indicator-charts .color-indicator__item .ci__color.ci__color-green {
  background-color: var(--cs-front_runner);
}
.color-indicator-charts .color-indicator__item .ci__color.ci__color-yellow {
  background-color: var(--cs-performer);
}
.color-indicator-charts .color-indicator__item .ci__color.ci__color-red {
  background-color: var(--cs-aspirant);
}
.color-indicator-charts .color-indicator__item .ci__color.ci__color-black {
  background-color: #000;
}
.color-indicator-charts .color-indicator__item .ci__color.ci__color-grey {
  background-color: var(--cs-grey);
}
.color-indicator-charts .color-indicator__item .ci__color.ci__t1 {
  background-color: #02b152;
}
.color-indicator-charts .color-indicator__item .ci__color.ci__t2 {
  background-color: #a7d08c;
}
.color-indicator-charts .color-indicator__item .ci__color.ci__t3 {
  background-color: #fdd964;
}
.color-indicator-charts .color-indicator__item .ci__color.ci__t4 {
  background-color: #ff9935;
}
.color-indicator-charts .color-indicator__item .ci__color.ci__t5 {
  background-color: #bf0200;
}
.color-indicator-charts .color-indicator__item .ci__title {
  font-size: 12px;
  font-weight: 400;
  color: #000;
  font-family: var(--secondary-font);
  width: calc(100% - 26px);
}
@media (max-width: 565px) {
  .color-indicator-charts {
    display: grid;
    grid-template-columns: repeat(2, 50%);
  }
  .color-indicator-charts.color-indicator-charts_mobile {
    padding: 0 20px;
  }
}
@media (max-width: 380px) {
  .color-indicator-charts {
    grid-template-columns: 100%;
  }
}

.cs-tag {
  display: inline-block;
  color: #fff;
  padding: 0px 5px;
  font-size: 14px;
  font-weight: 400;
  border-radius: 2px;
  line-height: 24px;
  min-width: 34px;
  text-align: center;
  position: relative;
  font-family: var(--secondary-font);
}
.cs-tag.in-active {
  background-color: transparent !important;
  color: #000;
  font-family: var(--primary-font);
  font-size: 16px;
}
.cs-tag.cs-tag-green {
  background-color: var(--cs-green);
}
.cs-tag.cs-tag-skyblue {
  background-color: var(--cs-skyblue);
}
.cs-tag.cs-tag-yellow {
  background-color: var(--cs-yellow);
}
.cs-tag.cs-tag-red {
  background-color: var(--cs-red);
}
.cs-tag.cs-tag-grey {
  background-color: var(--cs-grey);
}
.cs-tag.cs-tag-teal {
  background-color: var(--cs-teal);
}
.cs-tag.cs-tag-Achiever {
  background-color: var(--cs-achiever);
}
.cs-tag.cs-tag-Front_Runner {
  background-color: var(--cs-front_runner);
}
.cs-tag.cs-tag-Performer {
  background-color: var(--cs-performer);
}
.cs-tag.cs-tag-Aspirant {
  background-color: var(--cs-aspirant);
}
.cs-tag.cs-tag-Information_Unavailable {
  background-color: var(--cs-grey);
}
.cs-tag.cs-tag-black {
  background-color: #000;
}
.cs-tag.cs-tag-theme-Achiever {
  background-color: #02b152;
}
.cs-tag.cs-tag-theme-Front_Runner  {
  background-color: #a7d08c;
  color: #000;
}
.cs-tag.cs-tag-theme-Performer {
  background-color: #fdd964;
  color: #000;
}
.cs-tag.cs-tag-theme-Aspirant {
  background-color: #ff9935;
}
.cs-tag.cs-tag-theme-Beginner {
  background-color: #bf0200;
}
.cs-tag.cs-tag-theme-Information_Unavailable {
  background-color: var(--cs-grey);
}
.cs-tag[role=button] {
  transition: all 0.25s ease-in-out;
}
.cs-tag[role=button]:hover {
  transform: scale(1.1);
}
.cs-tag[data-icon-toggle-title]::before {
  width: 220px;
  font-size: 10px;
}


.avatar-text {
  display: flex;
  align-items: center;
  font-family: var(--secondary-font);
}
.avatar-text[role=button]:hover p {
  text-decoration: underline;
}
.avatar-text img {
  display: block;
  width: 50px;
  margin-right: 10px;
}
.avatar-text p {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 500;
}

.bar-goals-wrapper {
  height: 15px;
  display: flex;
  background-color: #e4e4e4;
  border-radius: 2px;
  width: calc(100% - 15px);
}
.bar-goals-wrapper .bar-theme,
.bar-goals-wrapper .bar-goal {
  height: 100%;
  width: 5%;
  border-radius: 2px;
  margin-right: 1px;
  position: relative;
}
.bar-goals-wrapper .bar-theme.bar-goal-1,
.bar-goals-wrapper .bar-goal.bar-goal-1 {
  background-color: #e5233d;
}
.bar-goals-wrapper .bar-theme.bar-goal-2,
.bar-goals-wrapper .bar-goal.bar-goal-2 {
  background-color: #dda73a;
}
.bar-goals-wrapper .bar-theme.bar-goal-3,
.bar-goals-wrapper .bar-goal.bar-goal-3 {
  background-color: #4ca146;
}
.bar-goals-wrapper .bar-theme.bar-goal-4,
.bar-goals-wrapper .bar-goal.bar-goal-4 {
  background-color: #c7212f;
}
.bar-goals-wrapper .bar-theme.bar-goal-5,
.bar-goals-wrapper .bar-goal.bar-goal-5 {
  background-color: #ee402d;
}
.bar-goals-wrapper .bar-theme.bar-goal-6,
.bar-goals-wrapper .bar-goal.bar-goal-6 {
  background-color: #28bfe6;
}
.bar-goals-wrapper .bar-theme.bar-goal-7,
.bar-goals-wrapper .bar-goal.bar-goal-7 {
  background-color: #fbc412;
}
.bar-goals-wrapper .bar-theme.bar-goal-8,
.bar-goals-wrapper .bar-goal.bar-goal-8 {
  background-color: #a31d44;
}
.bar-goals-wrapper .bar-theme.bar-goal-9,
.bar-goals-wrapper .bar-goal.bar-goal-9 {
  background-color: #f26a2e;
}
.bar-goals-wrapper .bar-theme.bar-goal-10,
.bar-goals-wrapper .bar-goal.bar-goal-10 {
  background-color: #df1a83;
}
.bar-goals-wrapper .bar-theme.bar-goal-11,
.bar-goals-wrapper .bar-goal.bar-goal-11 {
  background-color: #f99d2a;
}
.bar-goals-wrapper .bar-theme.bar-goal-12,
.bar-goals-wrapper .bar-goal.bar-goal-12 {
  background-color: #bf8d2c;
}
.bar-goals-wrapper .bar-theme.bar-goal-13,
.bar-goals-wrapper .bar-goal.bar-goal-13 {
  background-color: #407f46;
}
.bar-goals-wrapper .bar-theme.bar-goal-14,
.bar-goals-wrapper .bar-goal.bar-goal-14 {
  background-color: #59ba47;
}
.bar-goals-wrapper .bar-theme.bar-goal-15,
.bar-goals-wrapper .bar-goal.bar-goal-15 {
  background-color: #56c02b;
}
.bar-goals-wrapper .bar-theme.bar-goal-16,
.bar-goals-wrapper .bar-goal.bar-goal-16{
  background-color: #00689d;
}

.bar-goals-wrapper .bar-theme.bar-goal-17,
.bar-goals-wrapper .bar-goal.bar-goal-17{
  background-color: #136a9f;
}
.bar-goals-wrapper .bar-theme.bar-theme-1,
.bar-goals-wrapper .bar-goal.bar-theme-1 {
  background-color: #fcb732;
}
.bar-goals-wrapper .bar-theme.bar-theme-2,
.bar-goals-wrapper .bar-goal.bar-theme-2 {
  background-color: #99c83a;
}
.bar-goals-wrapper .bar-theme.bar-theme-3,
.bar-goals-wrapper .bar-goal.bar-theme-3 {
  background-color: #fa3e2b;
}
.bar-goals-wrapper .bar-theme.bar-theme-4,
.bar-goals-wrapper .bar-goal.bar-theme-4 {
  background-color: #23b67a;
}
.bar-goals-wrapper .bar-theme.bar-theme-5,
.bar-goals-wrapper .bar-goal.bar-theme-5 {
  background-color: #95192f;
}
.bar-goals-wrapper .bar-theme.bar-theme-6,
.bar-goals-wrapper .bar-goal.bar-theme-6 {
  background-color: #fc852d;
}
.bar-goals-wrapper .bar-theme.bar-theme-7,
.bar-goals-wrapper .bar-goal.bar-theme-7 {
  background-color: #044b79;
}
.bar-goals-wrapper .bar-theme.bar-theme-8,
.bar-goals-wrapper .bar-goal.bar-theme-8 {
  background-color: #7b64ac;
}
.bar-goals-wrapper .bar-theme.bar-theme-9,
.bar-goals-wrapper .bar-goal.bar-theme-9 {
  background-color: #47bfe8;
}
.bar-goals-wrapper .bar-theme:not(:hover) .bar-goal__tooltip,
.bar-goals-wrapper .bar-goal:not(:hover) .bar-goal__tooltip {
  display: none;
}
.bar-goals-wrapper .bar-theme .bar-goal__tooltip,
.bar-goals-wrapper .bar-goal .bar-goal__tooltip {
  position: absolute;
  bottom: calc(100% + 5px);
  left: 50%;
  transform: translateX(-50%);
  padding: 2.5px;
  border-radius: 2.5px;
  background-color: #000;
  color: #fff;
  z-index: 9;
  font-size: 12px;
  white-space: nowrap;
}
.bar-goals-wrapper .bar-theme .bar-goal__tooltip::after,
.bar-goals-wrapper .bar-goal .bar-goal__tooltip::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  width: 4px;
  height: 4px;
  border: 4px solid;
  border-color: #000 transparent transparent transparent;
}
.bar-goals-wrapper .bar-theme {
  width: 10%;
}

.cs-tabs-nav {
  margin-bottom: 15px;
  white-space: nowrap;
  overflow: auto;
  padding-bottom: 5px;
}
.cs-tabs-nav .btn {
  background-color: #f2f2f2;
  color: #000;
  margin-right: 10px;
}
.cs-tabs-nav .btn.active {
  background-color: var(--bs-primary);
  color: #fff;
}
.cs-tabs-nav.cs-dropdown-tab {
  display: flex;
  justify-content: center;
}
.cs-tabs-nav.cs-dropdown-tab .dropdown .dropdown-menu .dropdown-item.active:not(:hover) {
  color: #fff;
}

.colored-strips {
  background-image: url("../images/strip-lines.png");
  background-repeat: repeat-x;
  padding: 2px;
}

.miz-strip {
  background-image: url(../images/miz-strip.jpeg);
  background-repeat: repeat;
  height: var(--miz-strip-height);
  background-size: contain;
}

.miz-cult-people {
  background-image: url(../images/cultural-people.png);
  background-repeat: repeat;
  background-size: contain;
  height: var(--miz-cult-people);
  opacity: 0.3;
  position: absolute;
  bottom: calc(var(--miz-strip-height) - 10px);
  left: 0;
  width: 100%;
  z-index: -1;
}

.miz-divisional-card {
  border: 1px solid #efefef;
  box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.0784313725);
  background: #ffffff;
  max-width: var(--max-width);
  margin: 0 auto;
  border-radius: 10px;
}
.miz-divisional-card .miz-card-header {
  padding: 15px;
  padding-bottom: 0px;
}
.miz-divisional-card .miz-card-title {
  font-family: var(--secondary-font);
  font-size: 26px;
  font-weight: 600;
}
.miz-divisional-card .miz-card-body {
  display: flex;
  flex-wrap: wrap;
}
.miz-divisional-card .miz-card-left,
.miz-divisional-card .miz-card-right {
  padding: 15px;
  width: 50%;
}
.miz-divisional-card .miz-card-wide {
  padding: 20px;
  width: 100%;
}
@media (max-width: 992px) {
  .miz-divisional-card .miz-card-body {
    flex-direction: column;
  }
  .miz-divisional-card .miz-card-left,
  .miz-divisional-card .miz-card-right {
    width: 100%;
  }
}

/* Table Css */
.table.cs-table thead tr th,
.table.cs-table thead tr td {
  background-color: var(--bs-primary);
  color: #fff;
  white-space: wrap;
}
.table.cs-table thead tr th:first-child,
.table.cs-table thead tr td:first-child {
  border-radius: 5px 0 0 5px;
  padding-left: 10px;
}
.table.cs-table thead tr th:last-child,
.table.cs-table thead tr td:last-child {
  border-radius: 0px 5px 5px 0px;
  padding-right: 10px;
}
.table.cs-table tbody tr td {
  border-bottom: none;
  white-space: wrap;
  padding-top: 10px;
  padding-bottom: 10px;
}
.table.cs-table tbody tr td:first-child {
  border-radius: 5px 0 0 5px;
  padding-left: 10px;
}
.table.cs-table tbody tr td:last-child {
  border-radius: 0px 5px 5px 0px;
  padding-right: 10px;
}

.table-wrap tbody tr th,
.table-wrap tbody tr td,
.table-wrap thead tr th,
.table-wrap thead tr td {
  white-space: wrap !important;
}

.table-responsive {
  overflow: auto;
  max-height: 450px !important;
}
.table-responsive .cs-table-sticky-header {
  overflow: auto;
}
.table-responsive .cs-table-sticky-header thead {
  position: sticky;
  top: 0;
  z-index: 9;
}

.table.cs-table-2 thead tr td,
.table.cs-table-2 thead tr th {
  background-color: #fff;
  color: #000;
  white-space: wrap;
  border-bottom: 1px solid #c1c1c1 !important;
  font-family: var(--secondary-font);
}
.table.cs-table-2 tbody tr td {
  border-bottom-color: transparent;
  white-space: wrap;
  color: #000;
}
.table.cs-table-2 tbody tr:nth-child(odd) td {
  background-color: #f1f9ff;
}

.table.cs-table-3 thead tr td,
.table.cs-table-3 thead tr th {
  background-color: var(--clr-11);
  color: #000;
  white-space: wrap;
  border: 1px solid var(--clr-12) !important;
  padding: 8px 12px;
  vertical-align: middle;
}
.table.cs-table-3 tbody tr th,
.table.cs-table-3 tbody tr td {
  border: 1px solid var(--clr-12) !important;
  color: #000;
  padding: 12px;
  vertical-align: top;
}

/* /Table Css */
.switch-to-list-btn {
  font-size: 14px;
  font-weight: 400;
  font-family: var(--primary-font);
  text-transform: capitalize;
  display: block;
  margin-left: auto;
  max-width: -moz-max-content;
  max-width: max-content;
}

.primary-btn {
  font-size: 14px;
  font-weight: 400;
  font-family: var(--primary-font);
  text-transform: capitalize;
}

.heading-action-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.heading-action-wrapper .heading-action .btn:first-child {
  margin-right: 5px;
}
@media (max-width: 992px) {
  .heading-action-wrapper {
    flex-direction: column;
  }
  .heading-action-wrapper .page-title {
    width: 100%;
    margin-bottom: 10px;
  }
  .heading-action-wrapper .heading-action {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
}

.user-switch {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.user-switch .form-label {
  margin-right: 15px;
  white-space: nowrap;
}
.user-switch .form-check-input {
  cursor: pointer;
}

.switch-filter-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.switch-filter-wrapper .switch-filter-area {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: calc(100% - 150px);
  margin-left: -5px;
  margin-right: -5px;
}
.switch-filter-wrapper .switch-filter-area .switch-filter-item {
  width: 200px;
  padding: 0 5px;
}
.switch-filter-wrapper .switch-filter-area.compact-filter .switch-filter-item {
  width: 190px;
}
.switch-filter-wrapper .switch-list-action-area {
  width: 150px;
}
.switch-filter-wrapper .switch-list-action-area .btn {
  margin-bottom: 1rem;
}
@media (max-width: 992px) {
  .switch-filter-wrapper {
    flex-direction: column-reverse;
    margin-left: -5px;
    margin-right: -5px;
  }
  .switch-filter-wrapper .switch-filter-area {
    width: 100%;
  }
  .switch-filter-wrapper .switch-filter-area.compact-filter .switch-filter-item,
  .switch-filter-wrapper .switch-filter-area .switch-filter-item {
    width: 50%;
  }
  .switch-filter-wrapper .switch-list-action-area {
    width: 100%;
    padding-right: 5px;
  }
}
@media (max-width: 767px) {
  .switch-filter-wrapper .switch-filter-area.compact-filter .switch-filter-item {
    width: 100%;
  }
  .switch-filter-wrapper .switch-filter-area .switch-filter-item {
    width: 100%;
  }
}

.section-spacing {
  margin-bottom: var(--section-spacing);
}

/* /Global Classes */
/* Animations Css */
@keyframes clockwise_rotation {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@keyframes counter_clockwise_rotation {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(-360deg);
  }
}
@keyframes sdg_clockwise_rotation {
  0% {
    transform: translateY(-50%) rotate(0deg);
  }
  100% {
    transform: translateY(-50%) rotate(360deg);
  }
}
@keyframes FADE_IN {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    transform: none;
    opacity: 1;
  }
}
@keyframes SLIDE_UP {
  0% {
    opacity: 0;
    transform: translateY(50px) scale(0);
    transform-origin: right bottom;
  }
  100% {
    transform: none;
    opacity: 1;
  }
}
@keyframes ROTATE {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* /Animations Css */
/* Mizoram Wheel Css */
.miz-wheel-animation-wrapper {
  max-width: 600px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  overflow: hidden;
}
.miz-wheel-animation-wrapper .miz-wheel-animation {
  position: relative;
  width: 100%;
  padding-top: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-1,
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-2,
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-3,
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-4,
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-5,
.miz-wheel-animation-wrapper .miz-wheel-animation .sdg-wheel-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
}
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-1 {
  width: 100%;
  animation: clockwise_rotation 50s linear infinite;
}
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-2 {
  width: 67%;
  animation: counter_clockwise_rotation 50s linear infinite;
}
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-3 {
  width: 52%;
  animation: clockwise_rotation 50s linear infinite;
}
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-4 {
  width: 32%;
  animation: counter_clockwise_rotation 50s linear infinite;
}
.miz-wheel-animation-wrapper .miz-wheel-animation .miz-ring-5 {
  animation: clockwise_rotation 50s linear infinite;
  width: 24%;
}
.miz-wheel-animation-wrapper .miz-wheel-animation .sdg-wheel-icon {
  width: 21%;
}
.miz-wheel-animation-wrapper .miz-wheel-animation .round-white-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  width: 53.5%;
  height: 53.5%;
  border-radius: 50%;
}

/* /Mizoram Wheel Css */
/* District Listing Css */
.district-list-grid {
  display: flex;
  flex-wrap: wrap;
}
.district-list-grid .district-list-grid-item {
  width: 8.3333333333%;
  padding-right: 10px;
  padding-top: 4px;
  padding-left: 2px;
}
@media (max-width: 1200px) {
  .district-list-grid .district-list-grid-item {
    width: 12.5%;
  }
}
@media (max-width: 992px) {
  .district-list-grid {
    white-space: nowrap;
    flex-direction: row;
    overflow: auto;
    flex-wrap: nowrap;
  }
  .district-list-grid .district-list-grid-item {
    width: 120px;
    min-width: 120px;
  }
}

/* /District Listing Css */
.form-group.cs-form-group .form-label {
  color: #000;
  margin-bottom: 5px;
}
.form-group.cs-form-group .form-label em {
  color: var(--bs-danger);
}
.form-group.cs-form-group.helper-txt .form-label {
  margin-bottom: 0;
}
.form-group.cs-form-group.helper-txt small {
  display: block;
  font-size: 12px;
  margin-bottom: 5px;
}
.form-group.cs-form-group .form-control {
  color: #000;
}
.form-group.cs-form-group .form-control:not(:focus) {
  border: 1.35px solid rgba(37, 37, 37, 0.2509803922);
}
.form-group.cs-form-group .form-select {
  color: #000;
  border-radius: 0.25rem;
}
.form-group.cs-form-group .form-select:not(:focus) {
  border: 1.35px solid rgba(37, 37, 37, 0.2509803922);
}
.form-group.cs-form-group .form-select::-moz-placeholder, .form-group.cs-form-group .form-control::-moz-placeholder {
  color: #a1a1a1;
}
.form-group.cs-form-group .form-select::placeholder,
.form-group.cs-form-group .form-control::placeholder {
  color: #a1a1a1;
}
.form-group.cs-form-group .form-check-wrapper {
  display: flex;
}
.form-group.cs-form-group .form-check-wrapper .form-check {
  margin-right: 20px;
  cursor: pointer;
}
.form-group.cs-form-group .form-check-wrapper .form-check * {
  cursor: pointer;
}
.form-group.cs-form-group .form-check-wrapper .form-check .form-check-label {
  color: #000;
}
.form-group.cs-form-group .form-check-wrapper .form-check .form-check-label em {
  color: var(--bs-danger);
}

.form-check.cs-form-check label.form-check-label {
  color: #000;
}

/* Cards Css */
.sdg-scoring-card:hover, .sdg-scoring-card.active {
  border: 3px solid #50aefe;
  border-radius: 5px;
  transform: scale(1.05);
}
.sdg-scoring-card:hover img, .sdg-scoring-card.active img {
  animation: ROTATE 4s linear infinite;
}
.sdg-scoring-card .img-area {
  border: 1px solid #ececec;
  border-radius: 5px;
}
.sdg-scoring-card .img-area img {
  display: block;
  width: 100%;
  border-radius: 50%;
}

.scoring-card {
  perspective: 1000px;
}
.scoring-card:not(:hover) .scoring-card__overlay {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 100%) !important;
}
.scoring-card:not(:hover) .scoring-card__overlay span.scoring-card__overlay-btn {
  opacity: 0 !important;
}
.scoring-card .flip-card-inner {
  transition: transform 0.6s;
  transform-style: preserve-3d;
  position: relative;
}
.scoring-card .img-area,
.scoring-card .flip-side {
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}
.scoring-card .flip-side {
  position: absolute;
  top: 0;
  background: linear-gradient(180deg, #0168d7 0%, #01458f 100%);
  color: #fff;
  transform: rotateY(180deg);
  border-radius: 5px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  padding: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.scoring-card .flip-side .flip-side-card .flip-side-content {
  font-size: 12px;
  text-align: center;
}
.scoring-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}
.scoring-card.active .img-area img {
  border: 3px solid #005fb3 !important;
  box-shadow: 0px 0px 10px #005fb3;
  border-radius: 5px;
  transform: scale(1.05);
}
.scoring-card .img-area {
  position: relative;
}
.scoring-card .img-area img {
  display: block;
  width: 100%;
  border-radius: 5px;
}
.scoring-card .img-area .img-title {
  position: absolute;
  bottom: 10px;
  left: 10px;
  z-index: 1;
  color: #fff;
  margin-bottom: 0;
  font-size: 12px;
  font-weight: 500;
  font-family: var(--secondary-font);
}
.scoring-card .img-area .scoring-card__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
  border-radius: 2.5px;
}
.scoring-card .img-area .scoring-card__overlay span.scoring-card__overlay-btn {
  background-color: #fff;
  color: #000;
  font-size: 10px;
  font-weight: 500;
  padding: 2px 5px;
  border-radius: 5px;
  line-height: normal;
}
.scoring-card .scoring-title {
  text-align: center;
  background-color: #f2f2f2;
  color: #000;
  border-radius: 5px;
  padding: 6px;
  font-weight: 500;
  font-size: 14px;
  margin-top: 5px;
}
.scoring-card .scoring-title .scoring-title-icon {
  display: inline-block;
  max-width: 100%;
  margin-left: 5px;
}

/* /Cards Css */
/* Footer Css */
.cs-footer {
  background-color: #00437c;
  color: #fff;
  padding: 10px 20px;
}
.cs-footer .cs-footer-wrapper {
  max-width: var(--max-width);
  margin: auto;
  font-size: 14px;
}

/* /Footer Css */
/* Header Css */
.logo-normal.sdg-main-logo {
  width: 100%;
  max-width: 40px;
}
.logo-normal.sdg-main-logo img {
  display: block;
  width: 100%;
  max-width: 100%;
}
@media (max-width: 380px) {
  .logo-normal.sdg-main-logo {
    max-width: 20px;
  }
}

.logo-title.sdg-main-logo-title {
  font-weight: 700;
  color: var(--bs-primary) !important;
  margin-left: 6px !important;
}
.logo-title.sdg-main-logo-title .logo-title__sm {
  font-size: 16px;
}
.logo-title.sdg-main-logo-title .logo-title__md {
  font-size: 18px;
}
@media (max-width: 380px) {
  .logo-title.sdg-main-logo-title .logo-title__sm {
    font-size: 10px;
  }
  .logo-title.sdg-main-logo-title .logo-title__md {
    font-size: 12px;
  }
}

.navbar-brand {
  flex-wrap: wrap;
  padding: 12.5px 1rem !important;
}

@media (max-width: 1199.98px) {
  .iq-navbar .navbar-brand {
    margin-left: 0px;
  }
}
/* Header Css */
/* Page Content Wrapper */
.main-content .page-content {
  padding: 20px;
  min-height: calc(100vh - 107px);
}
.main-content .page-content .page-title {
  font-size: 22px;
  font-weight: 500;
}

/* /Page Content Wrapper */
.bottom-goals-wrapper {
  position: sticky;
  bottom: 0;
  right: 0;
  z-index: 99;
  width: 100%;
  background-color: #fff;
  box-shadow: 0px -6.4px 38.4px 0px rgba(0, 0, 0, 0.0784313725);
  padding-top: 8px;
}
.bottom-goals-wrapper .btn-bottom-goals-toggle {
  position: absolute;
  top: -12px;
  left: 10px;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  padding: 0;
  z-index: 9;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s linear;
}
.bottom-goals-wrapper .bottom-goals {
  max-height: 30px;
  overflow: hidden;
  transition: all 1s linear;
}
.bottom-goals-wrapper .bottom-goals .bottom-goals-body {
  display: flex;
  flex-wrap: wrap;
}
.bottom-goals-wrapper .bottom-goals .bottom-goals-body .bottom-goals-item {
  width: 5.8823529412%;
  padding: 8px 3px;
}
.bottom-goals-wrapper .bottom-goals .bottom-goals-body .bottom-goals-item img {
  display: block;
  width: 100%;
  border-radius: 4px;
  transition: 0.3s ease-in-out;
  opacity: 0.5;
}
.bottom-goals-wrapper .bottom-goals .bottom-goals-body .bottom-goals-item img.active, .bottom-goals-wrapper .bottom-goals .bottom-goals-body .bottom-goals-item img:hover {
  transform: scale(1.1);
  opacity: 1;
}
.bottom-goals-wrapper.active .bottom-goals {
  max-height: 200px;
}
.bottom-goals-wrapper.active .btn-bottom-goals-toggle {
  transform: rotate(180deg);
}
@media (max-width: 992px) {
  .bottom-goals-wrapper .bottom-goals {
    padding: 0 15px;
  }
  .bottom-goals-wrapper .bottom-goals .bottom-goals-body {
    display: block;
    white-space: nowrap;
    overflow: auto;
  }
  .bottom-goals-wrapper .bottom-goals .bottom-goals-body .bottom-goals-item {
    width: 90px;
    display: inline-block;
  }
}

.bottom-themes-wrapper {
  position: sticky;
  bottom: 0;
  right: 0;
  width: 100%;
  z-index: 99;
  background-color: #fff;
  box-shadow: 0px -6.4px 38.4px 0px rgba(0, 0, 0, 0.25);
  padding-top: 8px;
}
.bottom-themes-wrapper .btn-bottom-theme-toggle {
  position: absolute;
  top: -12px;
  left: 10px;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  padding: 0;
  z-index: 9;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s linear;
}
.bottom-themes-wrapper .bottom-theme {
  max-height: 50px;
  overflow: hidden;
  transition: all 2s linear;
}
.bottom-themes-wrapper .bottom-theme .bottom-theme-body {
  display: flex;
  flex-wrap: wrap;
}
.bottom-themes-wrapper .bottom-theme .bottom-theme-body .bottom-theme-item {
  width: 11.1111111111%;
  padding: 8px 3px;
}
.bottom-themes-wrapper .bottom-theme .bottom-theme-body .bottom-theme-item img {
  display: block;
  width: 100%;
  border-radius: 4px;
  transition: 0.3s ease-in-out;
  border: 1px solid #dbdbdb;
}
.bottom-themes-wrapper .bottom-theme .bottom-theme-body .bottom-theme-item img.active, .bottom-themes-wrapper .bottom-theme .bottom-theme-body .bottom-theme-item img:hover {
  transform: scale(1.05);
  border: 2px solid var(--clr-1);
}
.bottom-themes-wrapper.active .bottom-theme {
  max-height: 500px;
}
.bottom-themes-wrapper.active .btn-bottom-theme-toggle {
  transform: rotate(180deg);
}
@media (max-width: 992px) {
  .bottom-themes-wrapper .bottom-theme .bottom-theme-body {
    display: block;
    white-space: nowrap;
    overflow: auto;
    padding: 0 15px;
  }
  .bottom-themes-wrapper .bottom-theme .bottom-theme-body .bottom-theme-item {
    width: 90px;
    display: inline-block;
  }
}

.report-details-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.report-details-list li {
  font-size: 10px;
  font-weight: 400;
  white-space: nowrap;
  margin-bottom: 4px;
}

.dashboard-tabs {
  margin-bottom: 23px;
}
.dashboard-tabs .btn {
  margin-bottom: 5px;
}
.dashboard-tabs .btn:first-child {
  margin-right: 8px;
}
@media (max-width: 430px) {
  .dashboard-tabs .btn {
    width: 100%;
  }
}

.fade-in {
  animation: FADE_IN 0.3s ease-in-out;
}

/* Filters */
.filters-strip {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.filters-strip .filters-area {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% - 130px);
}
.filters-strip .filters-area .form-group {
  width: 100%;
  max-width: 220px;
  padding-right: 10px;
}
.filters-strip .filters-area .form-group input.form-control-sm {
  height: 30.6px;
  min-height: 30.6px;
}
.filters-strip .filters-area .form-group select {
  color: #6a6a6a !important;
}
.filters-strip.full-length .filters-area {
  width: 100%;
}
.filters-strip .switch-list-action-area {
  width: 130px;
  padding-top: 26px;
  padding-bottom: 13px;
}
@media (max-width: 992px) {
  .filters-strip {
    flex-direction: column-reverse;
  }
  .filters-strip .filters-area {
    width: 100%;
  }
  .filters-strip .filters-area .form-group {
    max-width: unset;
    width: 25%;
    padding: 0 5px;
  }
  .filters-strip .switch-list-action-area {
    width: 100%;
    padding-top: 0;
  }
}
@media (max-width: 767px) {
  .filters-strip .filters-area .form-group {
    width: 50%;
  }
}
@media (max-width: 565px) {
  .filters-strip .filters-area .form-group {
    width: 100%;
    padding: 0;
  }
}

/* /Filters */
/* Pagination */
.pagination .page-item {
  margin-right: 5px;
}
.pagination .page-item:first-child {
  margin-right: 15px;
  font-size: 10px;
}
.pagination .page-item:last-child {
  margin-left: 10px;
  margin-right: 0;
  font-size: 10px;
}
.pagination .page-item .page-link {
  border-radius: 5px;
  border: 1px solid #555;
  font-size: 14px;
}
.pagination .page-item .page-link.active {
  border-color: var(--bs-primary);
  background-color: var(--bs-primary);
  color: #fff;
}

/* /Pagination */
.role-filter-wrapper {
  margin-bottom: 20px;
}
.role-filter-wrapper .role-filter {
  display: flex;
  flex-wrap: wrap;
}
.role-filter-wrapper .role-filter .role-search-wrapper {
  display: flex;
  align-items: center;
  width: 280px;
  margin-right: 30px;
  margin-bottom: 5px;
}
.role-filter-wrapper .role-filter .role-search-wrapper .form-group.cs-form-group {
  margin-bottom: 0;
  margin-right: 6px;
  width: calc(100% - 38px - 6px);
}
.role-filter-wrapper .role-filter .role-search-wrapper .btn.btn-sm.btn-success {
  background-color: var(--clr-13);
  border-color: var(--clr-13);
  padding: 0;
  width: 38px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.role-filter-wrapper .role-filter .role-dropdown {
  width: 200px;
  margin-bottom: 5px;
  margin-right: 15px;
}
.role-filter-wrapper .role-filter .role-dropdown .form-group.cs-form-group {
  margin-bottom: 0;
}
.role-filter-wrapper .role-filter .role-dropdown .form-group.cs-form-group .form-select {
  height: 34px;
}
@media (max-width: 565px) {
  .role-filter-wrapper .role-filter .role-search-wrapper {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }
  .role-filter-wrapper .role-filter .role-dropdown {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }
}

/* Graphs heading Css */
.graphs-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 20px;
}
.graphs-heading .graph-title-img {
  width: 50px;
  margin-right: 15px;
}
.graphs-heading .graph-title-img img {
  display: block;
  width: 100%;
  border-radius: 2px;
}
.graphs-heading .graph-title {
  width: calc(100% - 65px);
  font-size: 500;
  font-weight: 14px;
}

/* /Graphs heading Css */
[data-icon-toggle-title] {
  position: relative;
}
[data-icon-toggle-title]:not(:hover)::before, [data-icon-toggle-title]:not(:hover)::after {
  display: none;
}
[data-icon-toggle-title]::after {
  content: "";
  position: absolute;
  top: -5px;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 9;
  border: 3.5px solid #fff;
  border-color: #fff transparent transparent transparent;
}
[data-icon-toggle-title]::before {
  content: attr(data-icon-toggle-title);
  position: absolute;
  bottom: calc(100% + 5px);
  right: 0;
  z-index: 9;
  color: #000;
  background-color: #fff;
  padding: 3px 8px;
  border-radius: 5px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
  font-size: 12px;
  font-weight: 500;
  line-height: normal;
}

.clickable-text[role=button] {
  cursor: pointer;
}
.clickable-text:hover {
  text-decoration: underline;
}

.cs-tab-wrapper .cs-tab-header {
  margin-bottom: 20px;
}
.cs-tab-wrapper .cs-tab-header nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
  overflow: auto;
  padding-bottom: 2px;
}
.cs-tab-wrapper .cs-tab-header nav ul li {
  margin-right: 8px;
  display: inline-block;
}
.cs-tab-wrapper .cs-tab-header nav ul li .btn {
  background-color: #f2f2f2;
  color: #000;
}
.cs-tab-wrapper .cs-tab-header nav ul li .btn:hover, .cs-tab-wrapper .cs-tab-header nav ul li .btn.active {
  background-color: var(--bs-primary);
  color: #fff;
  border: 1px solid var(--bs-primary);
}

.nd-input-wrapper {
  display: flex;
  flex-wrap: wrap;
}
.nd-input-wrapper .nd-item {
  display: flex;
  align-items: center;
  width: 50%;
  padding: 5px;
}
.nd-input-wrapper .nd-item:last-child {
  width: 100%;
}
.nd-input-wrapper .nd-item span {
  margin-right: 4px;
}
.nd-input-wrapper .form-group {
  margin-bottom: 0;
}

.entry-field-sm label {
  font-size: 12px;
}

.user-icon {
  position: relative;
  color: #000 !important;
  float: right;
}
.user-icon.hide-user {
  visibility: hidden;
  pointer-events: none;
}
.user-icon:not(:hover) .user-icon__tooltip {
  display: none;
}
.user-icon .user-icon__tooltip {
  position: absolute;
  bottom: calc(100% + 2px);
  right: 0;
  z-index: 9;
  border-radius: 5px;
  padding: 2.5px 5px;
  background-color: #fff;
  width: 160px;
  max-width: -moz-max-content;
  max-width: max-content;
  font-size: 10px;
  font-weight: 500;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
  color: #000 !important;
}
.user-icon .user-icon__tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  right: 3px;
  width: 6px;
  height: 6px;
  border: 6px solid;
  border-color: #fff transparent transparent transparent;
}
.user-icon .user-icon__tooltip .user-reporter {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
}
.user-icon .user-icon__tooltip .user-reporter .icon-area {
  background-color: #ffe392;
  font-size: 12px;
  border-radius: 50%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  margin-right: 5px;
}
.user-icon .user-icon__tooltip .user-approver .icon-area {
  border-radius: 50%;
  background-color: #d9ffd9;
  font-size: 12px;
  width: 16px;
  height: 16px;
  margin-right: 5px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.pgoal-no-content {
  text-align: center;
  background-color: #efefef;
  color: #000;
  padding: 20px;
  height: 350px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
  height: 100%;
}

.demo-detail-card {
  height: 100%;
  color: #000;
  background-color: #fff;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05);
  border-radius: 5px;
  padding: 18px;
  display: flex;
  flex-direction: column;
}
.demo-detail-card.ddc-1 {
  background-color: #ebf6ff;
}
.demo-detail-card.ddc-2 {
  background-color: #f8f4e1;
}
.demo-detail-card.ddc-3 {
  background-color: #cfe2ff;
}
.demo-detail-card.ddc-4 {
  background-color: #f9e5ff;
}
.demo-detail-card.ddc-5 {
  background-color: #ffcbc9;
}
.demo-detail-card.ddc-6 {
  background-color: #d6faff;
}
.demo-detail-card.ddc-7 {
  background-color: #ffdac0;
}
.demo-detail-card.ddc-8 {
  background-color: #c5ffb1;
}
.demo-detail-card .demo-detail-title {
  min-height: 50px;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.demo-detail-card .demo-detail-title .demo-detail-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #f9f9f9;
  margin-right: 10px;
  padding: 10px;
}
.demo-detail-card .demo-detail-title .demo-detail-icon img {
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center;
     object-position: center;
  display: block;
  width: 100%;
  height: 100%;
}
.demo-detail-card .demo-detail-title .demo-detail-text {
  width: calc(100% - 50px);
}
.demo-detail-card .demo-detail-value {
  font-size: 28px;
  font-weight: 700;
  word-break: break-word;
}
.demo-detail-card .demo-detail-input {
  position: relative;
}
.demo-detail-card .demo-detail-input::after {
  content: "\f4c9";
  width: 25px;
  height: 25px;
  font-family: "bootstrap-icons";
  padding: 5px;
  border-radius: 50%;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  right: 0px;
  transform: translate(0, -50%);
}
.demo-detail-card .demo-detail-input input {
  border: 1px solid rgba(0, 0, 0, 0.1);
  background-color: transparent;
  color: #000;
  font-size: 28px;
  font-weight: 700;
  padding: 0 5px;
  display: block;
  width: 100%;
  border-radius: 5px;
  background-color: #fff;
  padding-right: 25px;
}

@media (max-width: 565px) {
  [role=tooltip] {
    display: none !important;
  }
}/*# sourceMappingURL=main.css.map */

#loading .loader-body img {
  display: block;
  width: 100px;
}

#loading .loader-body {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}
.main-content{
  min-height: calc(100vh - 135px);
}

.table.cs-table-2 thead tr th:first-child {
  min-width: 400px;
}
.table.cs-table-2 thead tr th:nth-child(2) {
  min-width: 250px;
}
.goal-performance-gauge-wrapper #performance-gauge {
  height: 500px;
  width: 700px;
}

.section_loader.simple-loader {
  background-color: #f5f6fa;
  height: 100%;
  width: 100%;
  place-content: center;
  overflow: hidden !important;
  right: 0px;
  z-index: 1250;
}

.filter_button{
  max-height: 40px;
  top: 20px;
}

#fileInput{
 display: none;
}

.export_filter{
  display: inline-block;
  margin-right: 25px;
}

#cif_listing_form{
  display: contents;
}
#uif_listing_form{
  display: contents;
}

#vif_listing_form{
  display: contents;
}
.select2-results__option--highlighted{
  background-color: #1967d2;
  color:white;
}

.clamp-content-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
 white-space: wrap;
}