/**
 * Author: Somesh B 
 * Version: v1
 * Created: 07/23/2025
 * Description: Created to maintain common css code.
 */










* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline: none;
    box-shadow: none;
}

html {
  scroll-behavior: auto !important;
}

body {
  background: #fff;
  color: #555555;
  font-family: "Poppins" !important;
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.5;
  /*text-align: justify;*/
}
.main-body {
    min-height: 75vh;
}

h3{
  font-size: 24px !important;
}

h4{
font-family: "Poppins";
font-size: 20px !important;
color: #222 !important;
}

p {
    font-family: "Poppins";
    font-weight: 400;
    font-size: 14px;
    line-height: 20px !important;
    min-height: 1em;
}

.p2{
font-family: "Poppins";
font-weight: 400;
font-size: 24px ;
}

a{
  text-decoration: none !important;
  color: #444444 !important;
}

.main-container {
  display: flex;
   width: 100%;
}

main {
    width: 100%;
    padding: 0 1.5rem;
    /*overflow: hidden;*/
    min-width: 0;
}

.header{
    padding: 0 !important;
}

.header.fixed-top {
  background: #FFFFFF;
    position: sticky !important;
    width: 100%;
}

.fixed-top {
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
}

.header-container{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: inherit;
    padding: 1rem 0;
}

.header-container img{
  width: 200px;
}
.header-profile{
    cursor: pointer;
}
.header-profile #userDropdown {
    padding: 0.3rem 1rem;
    background-color: #FCF7EB;
}
.header-profile #userDropdown:hover {
    background-color: #FFF5DD;
}
.header-profile button{
  width: auto;
  padding: 0.5rem 1rem;
  background-color: #FCF7EB;
  border-radius: 30px;
  border: 0;
}
.header-profile span {
    color: #74943D;
    text-align: center;
    font-family: "Poppins";
    font-size: 14px;
    font-weight: 500;
}


/* sidebar start */

/* sidebar links - start */
.nav-item {
    margin: 0.5rem 0;
    position: relative;
    overflow: visible;
    z-index: 1 !important;
}

.nav-link {
    padding: 0.5rem !important;
}

.nav-pills {
    margin: 0.5rem;/*1rem;*/
}

.nav-link svg {
    color: #aaa;
    transition: color 0.3s ease;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: #74943D !important;
}

.nav-link:hover span, .nav-link.active span, .nav-link.active i {
    color: #FFFFFF !important;
}

.nav-pills .nav-link:hover, .nav-link.active {
    background-color: #74943D;
}

    .nav-pills .nav-link:hover img, .nav-link.active i {
        filter: brightness(0) invert(1);
    }

    /*.nav-link:hover svg path,
    .nav-link.active svg path {
        stroke: white;
        fill: white;
        color: white;
    }*/
    .nav-link.active img {
        filter: brightness(0) invert(1);
    }
/* sidebar links - end */
#sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    background-color: #F1F1F1;
    display: flex;
    flex-direction: column;
    z-index: 1000 !important;
    min-width: 101pt;
}

.sidebar-scrollable {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding-bottom: 3.5rem;
    width: inherit;
}

#sidebar.collapsed .sidebar-scrollable {
    overflow: visible !important;
}

#sidebar .link-title {
    /*display: none;*/
    margin-left: 10px;
    white-space: nowrap;
}

.sidebar-open-icon {
    position: sticky;
    bottom: 0;
    background-color: #F1F1F1;
    padding: 1rem;
    text-align: center;
    border-top: 1px solid #ddd;
}

    .sidebar-open-icon a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        text-decoration: none;
    }

#sidebar.expanded {
    width: 20rem;
}

#sidebar.expanded .link-title {
    display: inline;
}

.toggle-label {
    /*display: none;*/
    margin-left: 8px;
    font-weight: 500;
}

#sidebar.expanded ~ li .toggle-label {
    display: inline;
}

.nav-flush .nav-link {
    border-radius: var(--bs-nav-pills-border-radius);
}

#sidebar.collapsed .nav .sidebar-submenu .sidebar-submenu-items {
    background-color: #F1F1F1;
    border: none !important;
    box-shadow: none !important;
    padding-left: 1rem;
    width: 260px !important;
}

#sidebar.collapsed .nav .sidebar-submenu .sidebar-submenu-items .submenu-links {
    padding-left: 0 !important;
    list-style: none !important;
}

#sidebar .nav .sidebar-submenu .sidebar-submenu-items {
    background-color: #e9ecef;
    width: 100% !important;
    overflow: hidden !important;
    /*text-align: center !important;*/
}

#sidebar.expanded .nav .sidebar-submenu .sidebar-submenu-items .submenu-links {
    list-style: none !important;
    padding-left: 0 !important;
}

#sidebar-item-wrapper .sidebar-submenu-items .submenu-links {
    position: absolute !important;
    top: 0 !important;
    left: 100% !important;
    transform: translateX(10px) !important;
    display: none !important;
    z-index: 1050 !important;
}

#sidebar.collapsed .sidebar-item-wrapper:hover .sidebar-submenu-items {
    display: block !important;
    position: absolute;
    left: 12px !important;
    inset: -7px auto auto 0px !important;
    margin: 0px;
    transform: translate3d(119px, 0px, 0px);
}
#sidebar.collapsed .sidebar-item-wrapper .sidebar-submenu-items.show {
    display:none;
}

#sidebar.expanded .sidebar-item-wrapper {
    display: block !important;
}

#sidebar.expanded .sidebar-item-wrapper .sidebar-submenu-items {
    inset: 50px auto auto auto !important;
    transform: none !important;
    border: none !important;
}

#sidebar.expanded .sidebar-item-wrapper .sidebar-submenu-items {
    width: 100%;
    background-color: #e9ecef;
    padding: 0;
}

#sidebar.collapsed .sidebar-submenu-toggle .chevron-icon {
    display: none;
}

#sidebar.expanded .sidebar-submenu-toggle .chevron-icon i {
    transition: transform 0.3s ease;
}

.nav-item.sidebar-submenu .nav-link.sidebar-submenu-toggle.show .chevron-icon i {
    transform: rotate(180deg);
    color: #FFFFFF !important;
}

#sidebar .nav .sidebar-submenu {
    border: none;
}

#sidebar .nav .sidebar-submenu-item.active,
#sidebar .nav .sidebar-submenu-item:hover {
    background-color: #74943D !important;
}

#sidebar .nav .sidebar-submenu-item:hover, #sidebar .nav .sidebar-submenu-item.active {
    color: #fff !important;
}

/* Center items */
#sidebar.collapsed .sidebar-icon-top {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    /*padding: 12px 6px;*/
    text-align: center;
    width: 100%;
}
#sidebar.collapsed .link-title {
    margin: 0px;
    font-size: 10pt;
    font-weight: 500;
}
/* sidebar end */
.heading {
    font-family: "Poppins";
    font-weight: 600;
    font-size: 32px;
    color: #74943D;
}

.subheading{
font-family: "Poppins";
font-weight: 700;
font-size: 26px;
color: #74943D;
}

a.primary-btn, button.primary-btn {
    background-color: #FFC01E;
    padding: 1rem;
    border-radius: 8px;
    cursor: pointer;
    border: 0;
}
a.primary-btn:hover, button.primary-btn:hover {
    color: white !important;
    background-color: #74943D;
}

.primary-btn:hover a span{
  color: #fff
}

.primary-btn:hover{
  color: #fff
}

a.primary-btn:hover svg path,
a.primary-btn:active svg path,
button.primary-btn:hover svg path,
button.custom-warning-btn:active svg path {
    stroke: white;
    fill: white;
}

button.sec-btn, a.sec-btn {
    padding: 1rem 2.5rem;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid #444444;
    background-color: transparent;
    width: 150px;
}
button.sec-btn:hover {
    color: #fff;
    background-color: #74943D;
}

a.primary-btn span, button.primary-btn span {
    margin-left: 0.5rem;
    margin-top: 0.15rem;
    font-family: "Poppins";
    font-weight: 500;
    font-size: 16pt;
    line-height: 20px;
    letter-spacing: 3%;
    text-align: center;
    text-transform: capitalize;
}

/*#home-grid{
  column-count: 2;         
  column-gap: 1.5rem;
}*/

#home-grid h4/*, #home-grid p*/{
  margin-bottom: 0 !important;
}

#home-grid .grid-item {
 background: #fff;
  margin-bottom: 1.5rem;
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
  border-radius: 8px;
}

#home-grid .item1, .item2{
   border: 1px solid #B4B4B4;
   border-radius: 20px;
   padding: 0.5rem 1rem;
}
/*#home-grid .item1 .box-container {
    max-height: 310px;
    overflow: auto;
}*/
.view-all button {
    font-weight: 500;
    font-size: 1rem;
    text-align: right;
    text-decoration: underline !important;
    color: #FFC01E !important;
    cursor: pointer;
    background: inherit;
    border: inherit;
}

.view-all button:hover{
  color: #74943D !important;
}

#home-grid .box{
    background-color: #FCF7EB;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 1rem;
    margin: 1rem 0;
}

#home-grid .box .box-content{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100px;
  cursor: pointer;
}

#home-grid .box .box-content svg:hover path/*, #home-grid .article-box svg:hover path*/ {
    fill: #74943D;
    stroke: #74943D;
}

#home-grid .box .box-content p{
  margin-bottom: 0 !important;
}

#home-grid .box h5{
font-family: "Poppins";
font-weight: 600;
font-size: 18px;
line-height: 20px;
color: #74943D;
margin: 0;
}

#home-grid .item2 h5{
  font-family: "Poppins";
font-weight: 600;
font-size: 18px;
line-height: 20px;
color: #74943D;
}

#home-grid .item3{
    border: 1px solid  #B4B4B4;
    background-color: #FFF7E5;
    border-radius: 20px;
    padding: 2.5rem 4rem;
    text-align: center;
}

#home-grid .item3 h2{
  font-family: "Poppins";
font-weight: 600;
font-size: 24px;
line-height: 100%;
}

/* footer - start */
/*

footer .footer-help-cards {
    font-size: 0.9rem;
    margin: 0 auto;
}

    footer .footer-help-cards .footer-help-card {
        align-items: center;
        border: 1px solid #74953D;
        display: flex;
        font-weight: bold;
        justify-content: center;
        margin: 0.3rem 0;
        padding: 0.9rem;
        text-align: center;
        text-decoration: none;
        width: 125px;
        min-height: 100px;
    }

        footer .footer-help-cards .footer-help-card:hover {
            background-color: #74943D;
        }

    footer .footer-help-cards a {
        color: #74943D !important;
    }

        footer .footer-help-cards a:hover {
            color: #fff !important;
        }

#helpSection {
    position: fixed;
    bottom: -100%;
    left: 0;
    width: 100%;
    background-color: #f8f9fa;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.2);
    z-index: 2;
    transition: bottom 0.6s ease;
    padding: 1rem 0;
}

    #helpSection.show {
        bottom: 0;
    }

.toggle-help-btn i {
    transition: transform 0.3s ease;
}

.toggle-help-btn.open i {
    transform: rotate(180deg);
}*/
footer .footer-links p.with-lines {
    /*margin: 0 1rem;
    padding: 0 1rem;*/
    border-left: 1px solid #444444;
    /*border-right: 1px solid #444444;*/
}

footer .footer-links a:hover {
    text-decoration: underline !important;
    color: #74943D !important;
}
.header-profile-links-sp a:hover .a-text {
    text-decoration: underline !important;
}
.header-profile-links-sp a:hover i {
    text-decoration: none !important;
}
footer {
    margin: 205px 0px 0px 0px;
    position: relative;
    z-index: 1030;
}
footer .footer-help-toggler-wrapper .footer-help-toggler:hover {
    color: #fff;
}
.footer-help-toggler.open .fa-chevron-down::before {
    content: "\f077";
}
footer .footer-help-toggler-wrapper {
    border-bottom: 3px solid #74953D;
    position: relative;
}
footer .footer-help-toggler-wrapper .footer-help-toggler {
    border: 20px solid transparent;
    border-top: 0 solid;
    border-bottom: 40px solid #74953D;
    color: #fff;
    display: block;
    height: 0;
    text-align: center;
    width: 160px;
}
footer .footer-help-toggler-wrapper .footer-help-toggler:hover {
    border-bottom-color: #3B5411;
    text-decoration: none;
}
footer .footer-help-toggler-wrapper .footer-help-toggler .fas {
    font-size: 0.9rem;
}
footer .footer-help-toggler-wrapper .footer-help-toggler span {
    display: block;
    margin-top: 0.5rem;
}
footer .footer-help-wrapper {
    background-color: #f8f9fa;
}
footer .footer-help-cards {
    background-color: #f8f9fa;
    font-size: 0.9rem;
    /*max-width: 750px;
    margin: 0 auto;*/
    padding: 1rem 1rem 1rem 0;
}
footer .footer-help-cards .footer-help-card {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #74953D;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 90px;
    font-weight: bold;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0.3rem 0;
    padding: 0.9rem;
    text-align: center;
    text-decoration: none;
    width: 125px;
    color: #74943D !important;
    background: white;
}
footer .footer-help-cards .footer-help-card:hover {
    background-color: #74953D;
    color: #fff !important;
}
footer .collapseFooter {
    position: absolute;
    bottom: 50px; 
    left: 0;
    width: 100%;
    height: 50px;
    overflow: hidden;
    transition: height 0.4s ease;
    z-index: 9999;
}
footer .collapseFooter.open-help-section {
    height: 195px;
}
/* footer - end */




/* help section start */
.round-number {
    background-color: #74953D;
    color: #fff;
    display: inline-block;
    height: 17px;
    line-height: 1.7;
    font-size: 9px;
    font-style: normal;
    font-weight: bold;
    padding: 0.1rem 0.1rem;
    text-align: center;
    width: 16px;
    /* margin-bottom: 2.4rem; */
    /* margin-right: 1rem; */
    border-radius: 50% !important;
}

.round-numberBlack {
    background-color: #090908;
    color: #fff;
    display: inline-block;
    height: 11px;
    line-height: -4.9;
    width: 11px;
    margin-right: 2PX;
    border-radius: 50% !important;
    padding-top: -3px;
}
/* help section end */
    /* tools page */

.tool-card {
  background-color: #f5f5f5;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 20px;
  align-items: center;
  min-height: 150px;

  /* transition: 0.3s; */
}

.tool-card:hover {
  background-color: #e9ecef;
}

.icon {
  font-size: 24px;
  margin-bottom: 10px;
  color: #222;
}

.tool-text {
  margin-top: 0.5rem;
  font-size: 14px;
  font-weight: 500;
  color: #222222
}

.tool-card a{
  text-decoration: none;
}



/* peerdata page */

.step-indicator .circle {
    background-color: #fbc02d;
    color: white;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 10pt;
}

.step-label {
  font-weight: 600;
  font-size: 14px;
  color: #222;
  /* margin-bottom: 10px; */
}

.dropdown-menu {
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  max-height: 400px;
  overflow-y: auto;
  overflow-x: hidden; 
}
 
.dropdown-menu .dropdown-item:hover {
    color: #74943D !important;
    background-color: #f8f9fa !important;
}

.dropdown {
    border-bottom: 2px solid #E2B23D;
}
 
.dropdowns{
  margin-left: 20px !important;
}

.dropdown-toggle::after {
  display: none !important;
}


.image-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 50vh;
}

.excel-data img {
  border: 1px solid #ccc; 
  border-radius: 6px;     
  /* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);  */
}



/* //CREATE A PEER GROUP */

.table-wrapper {
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #ccc; 
}

table{
 border-collapse: collapse; 
  cursor: pointer;
}

th, td {
  border-top: 1px solid #ccc !important;
  border-bottom: 1px solid #ccc !important;
  border-left: none !important;
  border-right: none !important;
}

.table>:not(caption)>*>* {
    padding: 1rem !important;
}

table tr:first-child th,
table tr:first-child td {
  border-top: none !important;
}

table tr:last-child td {
  border-bottom: none !important;
}

/*table input {
  cursor: pointer;
  background-color: #74943D !important;
}*/

small{
  font-family: "Poppins";
font-weight: 300;
font-size: 10px !important;
}
.badge-xs {
    font-size: 8pt;
}

.progressbar {
    display: flex;
    font-family: "Poppins";
    width: fit-content;
    width: 50%;
    margin: 1rem 0;
}
 
   .step {
    position: relative;
    padding: 10px 25px;
    min-width: 100%;
    text-align: center;
   background-color: #F1F1F1;
    color: #333;
  }

  .progressbar .step span{
    font-family: "Poppins";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
  }
 
  #step-create {
    clip-path: polygon(0 0, calc(100% - 45px) 0, 100% 50%, calc(100% - 45px) 100%, 0 100%);  
    z-index: 1;
  }
 
  .step + .step {
    margin-left: -50px;
    z-index: 0;
  }  

/* Active state */
.step.active {
  background-color: #74943D;
  color: #FFF;
}

.step.active span {
  color: #FFF;
}

/* create a peer group */

.accordion-body {
    background-color: #F8F8F8;
}
.accordion-item:first-of-type .accordion-button {
    border: none !important;
}

.accordion-button:not(.collapsed) {
  background-color: transparent !important;
  color: #222 !important;
}

#selectfilter option{
 margin: 0.5rem 0;
}

.list-container{
width: 100%;
margin-left: 1rem;
}

.custom-select-list {
    overflow-y: scroll;
    border: 1px solid #ccc;
    border-radius: 0.3rem;
    padding: 1rem;
  }

  .custom-select-item {
    padding: 8px 12px;
    cursor: pointer;
    /* transition: background 0.2s, color 0.2s; */
  }

  .custom-select-item.selected {
    background-color: #74943D1A;
    color: #74943D;
    font-weight: 500;
  }

.radio-container {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  align-items: flex-start;
}

button.next-btn{
    background-color: #74943D;
    padding: 1rem 5rem;
    border-radius: 8px;
    cursor: pointer;
    border: 0;
    color: #FCF7EB;
}



/* peer-group-manager */

 .search-bar {
    position: relative;
    width: 100%;
  }

  .search-input {
    width: 100%;
    padding: 20px;
    border-radius: 2rem;
    border: none ;
    background-color: #FCF7EB;
    color: #000;
  }

  .search-input::placeholder {
  color: #222;
  opacity: 1;
}

  .search-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    width: 30px;
    height: 30px;
    margin-right: 0.5rem;
  }

     #peer-group-table .icon-btn {
      background-color: #f5b342;
      border: none;
      padding: 6px 10px;
      border-radius: 6px;
      margin-right: 5px;
      font-weight: bold;
      color: #000;
    }

    #peer-group-table .icon-btn:hover{
      background-color: #74943D;
    }

    #peer-group-table .icon-btn:hover img{
      filter: brightness(0) invert(1);
    }

    #peer-group-table .table-striped>tbody>tr:nth-of-type(odd)>*{
      --bs-table-bg-type:  #FCF7EB !important;
    }
    #peer-group-table .table-bordered > :not(caption) > * > * {
    border-radius: 0 !important;
    }

    .pagination{
      gap: 10px !important;
    }

    .page-item:first-child .page-link{
      color: #ccc !important;
      font-family: "Poppins";
      font-size: 13px;
      font-weight: 600;
    }

     .page-item:last-child .page-link{
      color: #777 !important;
      font-family: "Poppins";
      font-size: 13px;
      font-weight: 600;
     }

    .page-item:last-child .page-link, .page-item:first-child .page-link {
      border: none !important;
    }

    .page-link{
      padding: 0.5rem 1rem !important;
      border: none !important;
      border-radius: 10px;
    }

    .active>.page-link{
    background-color: #74943D !important;
    padding: 0.5rem 1rem !important;
    border-radius: 10px;
    color: #FFFFFF !important;
    }

    .page-item:last-child .page-link:hover, .page-item:last-child .page-link:active, .page-item:first-child .page-link:hover, .page-item:first-child .page-link:active{
      background-color: #74943D !important;
      color: #FFFFFF !important;
    }

    .page-link:hover, .page-link.active{
      background-color: #74943D !important;
      color: #FFFFFF !important;
    }

#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;
}

/* common css start */
/* common-jqx css start */
.jqx-grid-cell-alt {
    background-color: #FCF7EB !important; /* light yellow */
}
.jqx-grid-cell-hover {
    background-color: #FFF1D2 !important; /* light green */
}
.jqx-grid-cell {
    font-size: 12pt;
}
.jqx-grid-cell,
.jqx-grid-column-header {
    border: none !important;
}
.jqx-grid-cell.jqx-grid-cell-selected {
    background-color: #FFF1D2 !important; /* yellow */
    color: #000 !important; /* text color */
}
.jqx-grid-column-header {
    font-size: 12pt !important; /* adjust as needed */
    font-weight: 600 !important; /* 400=normal, 600=semi-bold, 700=bold */
}
.jqx-grid-column-header > div > div {
    line-height: 13.5pt !important;
    white-space: normal;
    margin-top: .5rem !important;
}
/*.jqx-grid-column-header .jqx-icon-arrow-up,
.jqx-grid-column-header .jqx-icon-arrow-down {
    visibility: visible !important;
    opacity: 1 !important;
}*/
.jqx-padded-cell-sp > div {
    padding-left: 8px;
    padding-right: 8px;
}
/* jqx grid cell colors - start */
.jqxgrd-cell-pink-sp {
    background-color: rgb(255, 215, 227);
    color: #222;
    margin: 0px !important;
    padding: 17px 4px;
}
.jqxgrd-cell-pink-sp:hover {
    background-color: rgb(255, 203, 218);
}

.jqxgrd-cell-yellow-sp {
    background-color: rgb(255, 239, 200);
    color: #222;
    margin: 0px !important;
    /*margin: 1.0px 0.5px !important;*/
    padding: 17px 4px;
}
.jqxgrd-cell-yellow-sp:hover {
    background-color: rgb(255, 230, 168);
}

.jqxgrd-cell-blue-sp {
    background-color: rgb(178, 241, 255);
    color: #222;
    margin: 0px !important;
    /*margin: 1.0px 0.5px !important;*/
    padding: 17px 4px;
}
.jqxgrd-cell-blue-sp:hover {
    background-color: rgb(150, 236, 255);
}
/* jqx grid cell colors - end */
/* common-jqx css end */

/* loader css start */
.loader-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.18);
    z-index: 99999;
    align-items: center;
    justify-content: center;
}
.loader-overlay.active {
    display: flex;
}
.loader-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.loader-overlay .loader-icon {
    width: 45px;
    margin-bottom: 8pt; /* space between icon and text */
}
.loader-overlay .loader-text {
    font-size: 10pt;
    font-weight: 500;
    color: #333;
}

.loader-overlay img.spin-pulse {
    animation: spin-pulse 2s ease-in-out infinite;
}
@keyframes spin-pulse {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(180deg) scale(1.1);
    }
    100% {
        transform: rotate(360deg) scale(1);
    }
}
.loader-overlay img.spin {
    animation: spin 1.5s linear infinite;
}
@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.loader-overlay img.bounce {
    animation: bounce 1s ease-in-out infinite;
}
@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

.loader-overlay img.pulse {
    animation: pulse 1.2s ease-in-out infinite;
}
@keyframes pulse {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 0 0px rgba(255, 215, 0, 0.5));
    }

    50% {
        transform: scale(1.1);
        filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.8));
    }
}

.loader-overlay img.slide {
    animation: slide 1.5s ease-in-out infinite;
}
@keyframes slide {
    0% {
        transform: translateX(-50px);
        opacity: 0;
    }
    50% {
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        transform: translateX(50px);
        opacity: 0;
    }
}

.loader-overlay img.flip {
    animation: flip 1.2s ease-in-out infinite;
    transform-style: preserve-3d;
}
@keyframes flip {
    0% {
        transform: rotateY(0deg);
    }
    50% {
        transform: rotateY(180deg);
    }
    100% {
        transform: rotateY(360deg);
    }
}

.loader-overlay img.breathe {
    animation: breatheGlow 2s ease-in-out infinite;
}
@keyframes breatheGlow {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 0 5px gold);
    }
    50% {
        transform: scale(1.08);
        filter: drop-shadow(0 0 15px gold);
    }
}

.loader-overlay img.orbit {
    animation: orbit 2s linear infinite;
}
@keyframes orbit {
    0% {
        transform: rotate(0deg) translateX(10px) rotate(0deg);
    }

    100% {
        transform: rotate(360deg) translateX(10px) rotate(-360deg);
    }
}

#nprogress .bar {
    background: #74943D; /* Tailwind blue-500 */
    height: 5px;
    border-radius: 3px;
    box-shadow: 0 0 10px #74943D, 0 0 20px #FFC01E;
}

#nprogress .peg {
    display: none; /* remove default blur effect */
}

#nprogress .spinner-icon {
    border: 3px solid transparent;
    border-top-color: #FFC01E;
    border-radius: 50%;
    width: 28px;
    height: 28px;
}

/* loader css end */

a.link-sp {
    color: #74953D !important;
    text-decoration: none;
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
}
a.link-sp:hover {
    color: #E2B23D !important;
    background-color: transparent;
    text-decoration: underline !important;
}

.btn-warning {
    background-color: #FFC01E;
}
.btn-warning:hover {
    color: #fff !important;
    background-color: #74943D;
    border-color: #198754;
}
.btn-success {
    color: #fff !important;
    background-color: #74943D;
}
.btn-success:hover {
    color: #000 !important;
    background-color: #FFC01E;
    border-color: #ffc107;
}
.btn-outline-success {
    border-color: #74943D;
    color: #74943D;
}
.btn-outline-success:hover {
    color: #fff !important;
    background-color: #74943D;
}
.btn-outline-warning {
    border-color: #E1B13A;
    color: #E1B13A;
}
.btn-outline-warning:hover {
    color: #000 !important;
    background-color: #FFC01E;
}
.btn-xl {
    padding: 1rem 4rem;
}
.cursor-pointer-sp {
    cursor: pointer;
}

/* Show dropdown menu on hover - start */
#page-steps .hover-dropdown:hover > .dropdown-menu {
    display: block;
    margin-top: 0;
}
/* For small screens: open from right side */
@media (max-width: 1880px) {
    /*#page-steps .hover-dropdown:hover > .dropdown-menu {*/
    #page-steps .hover-dropdown:last-child:hover > .dropdown-menu {
    /*#page-steps .hover-dropdown:not(:first-child):hover > .dropdown-menu {*/
        right: 0;
        left: auto;
        position: absolute;
    }
}

#page-steps .nav-link:hover {
    color: #E2B23D !important;
}

#page-steps .nav-link {
    font-weight: 600;
}

#page-steps .dropdown-menu .dropdown-item {
    color: #74943D !important;
    font-weight: 500;
    font-size: 12pt;
}
#page-steps .dropdown-menu .dropdown-header {
    font-size: 12pt;
}
#page-steps .dropdown-menu .dropdown-item:hover {
    color: #E2B23D !important;
    /*background: #74943D !important;*/
}
#page-steps .dropdown-item ul li ul {
    max-height: 480px !important;
    min-width: 300px;
    width:auto;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #74953D #E2B23D;
}
/* Adds horizontal spacing between nav items */
#page-steps .navbar-nav .nav-item {
    padding-right: 12px; /* or any px/rem value */
    margin-top: 10px;
}
#page-steps .navbar-nav .nav-item:last-child {
    padding-right: 0;
}

#page-steps .navbar .dropdown-menu.dropdown-menu-end {
    right: 0;
    left: auto;
}
#page-steps .jqx-combobox-sp, #page-steps .jqx-dropdownlist-sp {
    font-weight: 600;
    font-size: 16px;
    border: none !important;
    border-bottom: 2px solid #E2B23D !important;
    background: transparent;
}
.jqx-listbox-filter-input {
    height: 21pt !important;
    /*padding: 0 4pt;*/
}
#listBoxContentinnerListBoxpeerGroupDropDown.jqx-listbox-content-element {
    top: 27pt !important;
}
#peerGroupDropDown.jqx-fill-state-hover, #peerGroupDropDown.jqx-fill-state-pressed {
    color: #000 !important;
    background: transparent !important;
}
#peerGroupDropDown .jqx-dropdownlist-content {
    font-size: 16px;
    font-weight: 500;
}
#page-steps .jqx-combobox-content {
    border: none;
}
#page-steps .jqx-combobox-arrow-normal {
    background: transparent !important;
}
#page-steps .jqx-combobox .jqx-icon-arrow-down {
    background: transparent;
}
#page-steps .jqx-combobox .jqx-dropdownlist-sp .jqx-combobox-input {
    font-size: 16px;
    font-weight: 500;
}


.jqx-listitem-state-normal {
    /*    color: #E2B23D !important;
    font-weight: 500;*/

    font-size: 10pt;
    /*    padding: 7px 10px !important;*/
}
.jqx-listitem-state-hover, .jqx-fill-state-pressed/*, .jqx-fill-state-hover*/ {
    /*color: #74953D !important;*/
    border: none !important;
    /*background: #f8f9fa !important;*/
    color: #FFF !important;
    background: #74943D !important;
}
.jqx-listbox {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 8px;
    border: 1px solid rgb(210, 210, 210) !important;
    scrollbar-width: thin; /* Make scrollbar thin */
    scrollbar-color: #74953D #E2B23D !important; /* thumb | track */
}

/*.jqx-scrollbar-state-normal .jqx-reset {
    background: #E2B23D;
}
.jqx-scrollbar-state-normal .jqx-reset.jqx-icon-arrow-down, .jqx-reset.jqx-icon-arrow-up {
    background: transparent;
}*/

#page-steps .jqx-combobox-block-sp {
    position: relative;
}
#page-steps .jqx-combobox-block-sp .fa-chevron-down {
    position: absolute;
    right: 13px;
    top: 6px;
    z-index: 9;
    pointer-events: none;
}
/*#page-steps .jqx-combobox-sp .jqx-combobox-arrow-normal {
    background: #E2B23D;
    color: #74953D;
}*/
/*#page-steps .jqx-combobox-sp .jqx-listitem-element:hover {
    background: #74953D !important;
    color: white !important;
}*/
#sidebar .sidebar-scrollable .nav-item.disabled {
    background: #d6d6d6;
    border-radius: var(--bs-nav-pills-border-radius);
    pointer-events: none;
    opacity: 0.6;
}
#page-steps .navbar-nav.disabled {
    pointer-events: none;
    opacity: 0.6;
}
/* Show dropdown menu on hover - end */

/* full screen article box - start */
.article-box {
    background: white;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

/*.article-box button.open-fullscreen, .article-box button.close-fullscreen {
    color: deepskyblue;
    font-size: 16px;
    overflow: hidden;
}*/
/*main {
    position: relative;
    width: 100%;
    padding: 0 1.5rem;
}*/
.dashboard-container.expanded-article {
    /*height: 100vh;*/
    overflow: hidden;
    position: relative;
    margin-top: -75px;
}

.article-box.expanded {
    position: absolute;
    inset: 0;
    z-index: 50;
    background-color: #fff;
    /*height: 100vh;*/
    display: flex;
    flex-direction: column;
    padding: 1rem 1rem;
    /*padding-top: 1rem;*/
    overflow: hidden;
    border: 1px solid #B4B4B4;
    border-radius: 15px;
    padding: 0.5rem 1rem;
    margin: 0px 12px;
}

/*.article-full, */
.article-box.expanded .preview, .article-box.expanded .read-less, .close-fullscreen {
    display: none !important;
}

.article-box.expanded .article-full {
    flex: 1;
    display: block;
    overflow-y: auto;
}

.article-box.expanded .close-fullscreen {
    display: block !important;
}

.article-box.expanded .open-fullscreen {
    display: none;
}

.article-box.expanded > p,
.article-box.expanded > span {
    display: none;
}
/* full screen article box - end */

#btn-back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index:9999;
    display: none;
}

/* powerbi block custom css - start */
.powerbi-block-sp {
    text-align: center;
    display: ruby block;
    border: 1px solid #dedede;
    /*box-shadow: 0 2px 8px rgba(0,0,0,0.1);*/
}
.embeddiv-powerbi-sp {
    /*height: 1430px;
    width: 1500px;*/
    height: 100vw;
    width: 100%;
    /*height: 1240px;
    width: 1310px;*/
}
.embeddiv-powerbi-sp.powerbi-2260-sp {
    height: 87vw;
}

/* --- Large screen mode --- */
/* Trigger when screen width is greater than 1600px (adjust if needed) */
@media screen and (min-width: 1281px) and (max-width: 1920px) {
    .powerbi-block-sp {
        text-align: left;
        width: 1414px;
    }

    .embeddiv-powerbi-sp {
        width: 1410px;
        height: 1340px;
        margin-left: 0;
    }
    .embeddiv-powerbi-sp.powerbi-2260-sp {
        width: 1310px;
        height: 1240px;
    }
}
@media screen and (min-width: 1921px) {
    .powerbi-block-sp {
        text-align: left;
        width: 1814px;
    }

    .embeddiv-powerbi-sp {
        width: 1810px;
        height: 1740px;
        margin-left: 0;
    }
    .embeddiv-powerbi-sp.powerbi-2260-sp {
        width: 1710px;
        height: 1640px;
    }
}
/* powerbi block custom css - end */
.pe-6-sp {
    padding-right:4rem;
}

.icon-btn:hover img {
    filter: brightness(0) invert(1);
}

.access-denied-pg .access-denied-icon {
    width: 300px;
}
.access-denied-pg svg {
    width: 50px;
}

/* CODE ADDED BY: SOMESH; DATE: 11-02-2025; SUB: TO HIDE BLAZOR DEFALUT ERROR MESSAGE - Start */
/* Could not reconnect to the server. Reload the page to restore functionality. / Attempting to reconnect to the server: 1 of 8 - error popup hide code - start */
#components-reconnect-modal {
    /*display: none !important;*/
}
/* Could not reconnect to the server. Reload the page to restore functionality. / Attempting to reconnect to the server: 1 of 8 - error popup hide code - end */
/* End */

.empty-placeholder {
    height: 30px;
    background: #e3e3e330;
    width: 100%;
    border-radius: 5px;
}

.form-check-input {
    border-color: #74943D;
}
.form-check-input:checked {
    background-color: #74943D;
    border-color: #74943D;
}
.form-check-input:focus {
    box-shadow: 0 0 0 .25rem #74943D3B;
}

/* to hide get help button on peer group tracker page and dashboard page */
#launcher-frame {
    display:none;
}
/* Telerik component common css - start */
.k-checkbox {
    border-color: #3d3d3d;
    background-color: var(--kendo-color-surface-alt, #ffffff);
}
.k-checkbox:focus {
    box-shadow: 0 0 0 .25rem #74943D3B !important;
}
.k-checkbox:checked, .k-checkbox.k-checked {
    background-color: #74943D;
    border-color: #74943D;
}
.k-radio {
    border-color: #3d3d3d;
    background-color: var(--kendo-color-surface-alt, #ffffff);
}
.k-radio:focus {
    box-shadow: 0 0 0 .25rem #74943D3B !important;
}
.k-radio:checked, .k-radio.k-checked {
    background-color: #74943D;
    border-color: #74943D;
}

.telerik-window-sp:not(.k-centered) {
    position: fixed;
}
.k-column-title, .k-table-th {
    white-space: normal !important;
}
/* grid font size */
.k-grid th {
    font-size: 11pt !important;
    font-weight: 600 !important;
}
.k-grid td {
    font-size: 11pt !important;
}

.k-grid td.k-table-td:has(button, .btn) {
    padding: 0;
}


/* All grid headers */
/*.k-table-thead {
    background-color: #007bff !important;*/ /* Blue header */
/*}*/

/* Even rows */
.k-grid tbody tr.k-alt {
    background-color: #FCF7EB !important; /* light yellow */
}

/* Optional: Odd rows (default white) */
.k-grid tbody tr:not(.k-alt) {
    background-color: #ffffff;
}
/* Hover row background */
.k-grid tbody tr:hover {
    background-color: #FFF1D2 !important; /* yellow */
    color: #000 !important; /* text color */
}
/* Selected row background */
.k-grid tbody tr.k-selected,
.k-grid td.k-selected, .k-grid .k-table-row.k-selected > td, .k-grid .k-table-td.k-selected, .k-grid .k-table-row.k-selected > .k-table-td {
    background-color: #FFF1D2 !important; /* yellow */
    color: #000 !important; /* text color */
}
.k-grid-column-menu.k-grid-header-menu.k-active {
    color: initial;
    background-color: initial;
}
.readonly-checkbox {
    pointer-events: none; /* prevents user click */
    opacity: 1; /* keeps it visible */
}
/*.k-grid th.text-center .k-link {
    display: initial !important;
}*/
/* telerik grid cell colors - start */
.k-grid tbody tr.telerikgrid-cell-pink-sp {
    background-color: rgb(255, 215, 227) !important;
    color: #222 !important;
}
.k-grid tbody tr.telerikgrid-cell-pink-sp:hover {
    background-color: rgb(255, 203, 218) !important;
}
.k-grid tbody tr.telerikgrid-cell-gray-sp {
    background-color: rgb(241, 241, 241) !important;
    color: #222 !important;
}
.k-grid tbody tr.telerikgrid-cell-gray-sp:hover {
    background-color: rgb(228, 228, 228) !important;
}

.k-grid tbody tr.telerikgrid-cell-yellow-sp {
    background-color: rgb(255, 239, 200) !important;
    color: #222 !important;
}
.k-grid tbody tr.telerikgrid-cell-yellow-sp:hover {
    background-color: rgb(255, 230, 168) !important;
}

.k-grid tbody tr.telerikgrid-cell-blue-sp {
    background-color: rgb(178, 241, 255) !important;
    color: #222 !important;
}
.k-grid tbody tr.telerikgrid-cell-blue-sp:hover {
    background-color: rgb(150, 236, 255) !important;
}
/* telerik grid cell colors - end */
/* Change background and text color of selected items in Telerik ListBox */
.k-listbox .k-list-item.k-selected, .k-list-item.k-selected, .k-list-optionlabel.k-selected, .k-table-row.k-selected {
    background-color: #74943D !important; /* theme green */
    color: #fff !important; /* White text */
}

/* Optional: hover color for selected items */
.k-listbox .k-list-item.k-selected:hover, .k-list-item.k-selected:hover {
    background-color: #8DAE56 !important; /* Darker green on hover */
}

/* Change the active (filled) range color */
.k-slider .k-slider-selection {
    background-color: #74943D !important;
}
/* Optional: change handle (thumb) color */
.k-slider .k-draghandle {
    background-color: #74943D !important;
    border-color: #74943D !important;
}
/* Optional: change hover color slightly darker */
.k-slider .k-draghandle:hover {
    background-color: #5e7a2e !important;
    border-color: #5e7a2e !important;
}

/* Applies to Telerik DropDownList, MultiSelect, and ListBox items on hover */
.k-list-item:hover,
.k-list-optionlabel:hover,
.k-list-item.k-focus,
.k-listbox-item:hover {
    background-color: #74943D !important;
    color: #fff !important;
    cursor: pointer;
}

.k-multicolumncombobox-popup {
    background-color: #ffffff !important;
    border: 1px solid #dcdcdc !important;
    border-radius: 6px !important;
}

.multi-combobox-dropdown-header {
    background: #efefef !important;
    /*font-weight: 600;*/
}

.input-h-40px {
    min-height: 40px;
}
/* Telerik component common css - end */
/* common css end */