body {
    font-family: "Inter", sans-serif;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    height: 100vh;
    font-size: 0.9rem;
}
main {
    flex: 1; /* Grow to fill the remaining vertical space */
    background-color: #E2EDE9;
}
.content-wrapper, .main-content, .lighter-green-background{
    background-color: #E2EDE9;
    height: inherit;
}
.lighter-red-background {
    background-color: #ff000014;
}

.lighter-blue-background {
    background-color: #d0e9ff;
}

.bg-datatable-header {
    background-color: #D5E3DF;
}

.custom-light-green-background{
    background-color: #CADFD5;
    height: inherit;
}
/* custom gap starts */
.px-60 {
  padding-left: 60px;
  padding-right: 60px;
}
.px-120 {
    padding-left: 120px;
    padding-right: 120px;
}
.px-10 {
    padding-left: 10px;
    padding-right: 10px;
}
.py-40 {
  padding-top: 40px;
  padding-bottom: 40px;
}
.py-60-40 {
    padding-top: 60px;
    padding-bottom: 40px;
}
.py-60-60 {
    padding-top: 60px;
    padding-bottom: 60px;
}
.py-18 {
    padding-top: 18px;
    padding-bottom: 18px;
}
.mb-24 {
    margin-bottom: 24px;
}
.p-36 {
    padding: 36px;
}
.pt-60 {
    padding-top: 60px;
}
.pb-28 {
    padding-bottom: 28px;
}
.pb-60 {
    padding-bottom: 60px;
}
.p-24 {
    padding: 24px;
}
.gap-40 {
    padding-left: 35px;
    padding-right: 10px;
}
.gap-24 {
    padding: 24px;
}
.gap-y-24 {
    padding-top: 24px;
    padding-bottom: 24px;
}
.p-32 {
    padding: 32px;
}
.p-15 {
  padding: 15px;
}
.pt-gap {
    margin-top: 1.125rem;
}
.py-20 {
    padding-top: 20px;
    padding-bottom: 20px;
}
/* custom gap ends */
/* color starts */
.download-btn-bg{
    background: rgba(157, 158, 152, 1);
}
.bg-light-gray {
    background-color: lightgray;
}
.bg-light-red {
    background-color: #B711111A;
}
.bg-mint-green {
    background-color: #DAF3D4;
}
.gray {
    color: #6c757d;
}
.gray-bg {
    background-color: #f2f4f7;
}
.gray-bg-200 {
    background-color: #e9ecef;
}
.red {
    color: red;
}
.bg-lighter-green {
    background-color: #b5d5ca;
}
.dark-blue {
    color: #031b4d;
}
.dark-blue-text {
    color: #031b4d;
}
.dark-black-text {
    color: #212529;
    opacity: 75%;
}
.dark-black {
    color: #212529;
}
.green-opacity {
    color: #146c43;
}
.dark-blue {
  background-color: #031b4d;
}
.orange-bd {
    background-color: rgba(255, 246, 244, 1);
}
.red-bd {
    background: rgba(255, 227, 230, 1);
}
.dark-red-bg {
    background-color: rgba(220, 53, 69, 1);
}
.dark-gray-bg{
    background-color: rgba(239, 239, 239, 255);
}
.text-red {
    color: rgba(176, 42, 55, 1);
}
.text-light-gray {
    color: #9D9E98;
}
.text-green {
    color: #01573C;
}
.dark-blue-bg {
    /*background-color: #000000;*/
    background-color: #00000080;

}
.header-background {
    background-color: rgb(240, 248, 255);
}
.dark-green {
    background-color: rgba(17, 136, 15, 1);
}
.header-background-dark {
    background-color: rgb(240, 244, 255);
}
.pink-bg {
    background: rgba(255, 242, 243, 1);
}
.light-green {
    background: rgba(243, 255, 242, 1);
}
.border-color {
    border: 1px solid rgba(199, 203, 207, 1);
}
.close-btn-background {
    background-color: rgba(199, 203, 207, 1);
}
.custom-radius {
    border-radius: 10px;
    overflow: hidden;
}
.border-radius-24 {
    border-radius: 24px;
}
.border-radius-30 {
    border-radius: 30px;
}
.active-dynamic-content-btn {
    border-radius: 24px;
    border: 1px solid #01573C4D;
    background-color: #01573C;
    color: white;
    font-size: 14px;
    font-weight: 700;
    line-height: 21px;
    box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.3);
}
.inactive-dynamic-content-btn {
    color: #212529;
    font-size: 14px;
    font-weight: 500;
    line-height: 21px;
    border-radius: 24px;
}
.aoa-bg {
    background-color: #e9e9ea;
}
.aoa-text-color {
    color: #ffffff;
}
.custom-bg-blue{
    background-color: #3450B7;
}
.custom-bg-green{
   background-color: rgba(1, 87, 60, 1);
}
.custom-bg-hover-green:hover {
   background-color: rgba(1, 87, 60, 1);
}
.custom-border-green{
    border: 1px solid rgba(1, 87, 60, 1);
}
.custom-green-border {
    border-color: #01573C4D;
}
.custom-text-green{
  color: #01573C;
}
.custom-text-red{
    color: rgba(228, 17, 17, 1);
}
.custom-text-dark{
    color: #212529;
}
.custom-text-grey{
    color: #4A545C;
}
.custom-text-grey2{
    color: #212529;
}
.custom-bg-red{
    background: rgba(228, 17, 17, 1);
}
/* color ends */
/* fonts starts */

.header {
  font-size: 40px;
  font-weight: 500;
}
.sub-header {
    font-size: 16px;
    font-weight: 600;
}

.fs-16 {
    font-size: 16px;
}
.date-time-label {
    font-size: 12px;
    color: gray;
    font-weight: normal;
}
.font-label {
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    opacity: 1;
}
.light-label{
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: rgba(74, 84, 92, 1);
}

.fs-16-24-bold {
    font-size: 16px;
    font-weight: bold;
    line-height: 24px;
}

.fs-16-24-500 {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
}
.error-font {
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    color: #dc3545;
}

.font-btn {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    color: #0d6efd;
}
.submit-btn-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #fff;
}
.plc {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #070707;
    opacity: 0.8;
}
.fs-20b {
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
}
.fs-22 {
    font-size: 22px;
}
.fs-20-20-400 {
    font-size: 20px;
    font-weight: 400;
    line-height: 20px;
}
.aoa-font-12{
    font-size: 14px;
    font-weight: 800;
    line-height: 12px;
}
.aoa-font-20{
    font-size: 20px;
    font-weight: 700;
    line-height: 26px;
}
.border-end-black{
    border-right: 1px solid #0000004d;
}
.table-bordered {
    table {
        width: 100%;
        border-collapse: collapse;
    }

    th, td {
        border: 1px solid black !important;
        padding: 8px;
        text-align: left;
    }
}
.black-border{
    border: 1px solid #6c757d;
}
.black-bottom{
    border-bottom: 1px solid #6c757d;
}
.border-left-right{
    border-left: 1px solid #6c757d;
    border-right: 1px solid #6c757d;
}
.mt-110{
    margin-top: 110px;
}
/* fonts ends */

/* custom width starts */

.w-100 {
  width: 100%;
}
.w-50 {
  width: 50%;
}
.w-120px{
    width: 120px;
    height: 35px;
}

.w-170px {
    width: 170px;
    height: 35px;
}
.w-120px-39h{
    width: 120px;
    height: 39px;
}
.w-100px{
    width: 120px;
}
.w-92px{
    width: 92px;
}
.w-25px{
    width: 25px;
}
.fs-16-24-700 {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}
.fs-20-24-500 {
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
}
.fs-20-24-bold {
    font-size: 20px;
    font-weight: bold;
    line-height: 24px;
}
.fs-18-24-500-white {
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: white;
}
.fs-24-38-500 {
    font-size: 24px;
    font-weight: 500;
    line-height: 38px;
}
.fs-24-38-500-bold {
    font-size: 24px;
    font-weight: bold;
    line-height: 38px;
}
.fs-24-34-500 {
    font-size: 24px;
    font-weight: 500;
    line-height: 30px;
}
.fs-32-38-700 {
    font-size: 32px;
    font-weight: 700;
    line-height: 38px;
}
.fs-40-48-500 {
    font-size: 40px;
    font-weight: 500;
    line-height: 48px;
}
.fs-14-20-500 {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}
.fs-14-21-400 {
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
}
.fs-14-21-500 {
    font-size: 14px;
    font-weight: 500;
    line-height: 21px;
}
.fs-14-21-600 {
    font-size: 14px;
    font-weight: 600;
    line-height: 21px;
}
.fs-14-21-700 {
    font-size: 14px;
    font-weight: 700;
    line-height: 21px;
}
.fs-16-20-500{
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
}
.fs-18-21-700 {
    font-size: 18px;
    font-weight: 700;
    line-height: 21px;
}
.fs-18-28-700 {
    font-size: 18px;
    font-weight: 700;
    line-height: 28px;
}
.fs-18-500 {
    font-size: 18px;
    font-weight: 500;
}
.fs-24-32-700 {
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
}
.fs-24-32 {
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
}
/* fonts ends */
.main-body-color {
    background-color: rgba(246, 246, 249, 1);
}
/* custom width starts */
.w-100 {
    width: 100%;
}
.w-90 {
    width: 90%;
}
.w-80 {
    width: 80%;
}
.w-70 {
    width: 70%;
}
.w-60 {
    width: 60%;
}
.w-50 {
  width: 50%;
}
.w-40 {
    width: 40%;
}
.w-30 {
    width: 30%;
}
.w-20 {
    width: 20%;
}
.w-10 {
    width: 10%;
}
.w-50x {
    width: 50px;
}
.aoa-sidebar {
    width: 75px !important;
}
.aoa-table-body {
    width: calc(100% - 75px);
}
/* custom width ends */
.form-control:focus {
    border-color: #ff0000;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 0, 0, 0.6);
}
.custom-box-shadow {
    box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.3);
}
/*.btn-secondary {*/
/*  background-color: transparent;*/
/*  border: none;*/
/*}*/
.profile-img {
  height: 40px;
  width: 40px;
}
.setting-icon {
  height: 12px;
  width: 12px;
}

.list-png {
  width: 16px;
  height: 16px;
  margin-top: -4px;
}

.footer {
  height: 56px;
}
a {
  text-decoration: none;
}
.btn-border {
    border-radius: 5px;
    padding: 1px 2px;
    border: 1px solid;
}
.all-submit-btn {
    background-color: rgba(25, 82, 244, 1);
    color: #fff;
    border: 1px solid rgba(25, 82, 244, 1);
    padding: 10px;
    font-size: 16px;
    font-weight: 24;
}
.all-submit-btn:hover {
    background-color: #fff;
    color: rgba(25, 82, 244, 1);
    border: 1px solid rgba(25, 82, 244, 1);
}
.d-plus-btn {
    background-color: rgba(25, 82, 244, 1);
    color: #fff;
    border: 1px solid transparent;
}

.d-plus-btn:hover {
    background-color: #fff;
    border: 1px solid rgba(25, 82, 244, 1);
    color: rgba(25, 82, 244, 1);
    padding: 10px;
}

.d-view-btn {
    background-color: transparent;
    color: rgba(25, 82, 244, 1);
    border: 1px solid rgba(25, 82, 244, 1);
}
.d-view-btn:hover {
    background-color: rgba(25, 82, 244, 1);
    color: #fff;
}
/* data table style starts*/
.statusLabelMini{
    font-size: 14px;
    border-radius: 7px;
    padding: 5px;
    min-width: 150px;
    text-align: center;
    font-weight: 500;
}
.label-success-border {
    border: 1px solid #55ce6385;
    color: #0aa11b;
    background-color: #17b5290f;
    display: inline-block;
    min-width: 80px;
}
.table-bordered > :not(caption) > * {
    border: none;
}
.table > :not(:last-child) > :last-child > * {
    border: none;
}
.table-bordered > :not(caption) > * > * {
    border: none;
}
.table-striped>tbody>tr:nth-of-type(odd) {
    --bs-table-accent-bg: rgb(255, 255, 255);
    padding: 10px 0;
}
table.dataTable thead th, table.dataTable tbody td{
    padding: 10px 10px !important;
    border-color: #E2EDE9;
    border-left: 1px solid #E2EDE9;
}
table.dataTable thead th.p-0, table.dataTable tbody td.p-0{
    padding: 0 !important;
}
table.dataTable thead th{
    border-color: #B9CCC7;
}
table.dataTable thead th{
    background-color: #E2EDE9 !important
}
.table > :not(:last-child) > :last-child > *{
    padding: 10px 10px;
}
.dataTables_length label{
    display: flex;
    gap: 15px;
    margin-bottom: 20px;
    justify-content: center;
}
.dataTables_wrapper .dataTables_length select{
    width: 60px;
}
.invoice-icon{
    width: 30px;
    color: black;
}
/* data table style ends*/
#aoaTable.custom-border{
 border: 1px solid #0000004d;
}
#aoaTable.custom-b-black{
    border-right: 1px solid black;
}
#aoaTable tr td{
    font-size: 12px;
    font-weight: normal;
}
#aoaTable tr th{
    font-size: 12px;
    font-weight: normal;
}
#aoaTable.table > thead{
background-color: #e9e9ea;
}

/*Radio button toggle*/
.custom-button {
    padding: 5px 20px;
    background-color: white;
    /*border: none;*/
    cursor: pointer;
    transition: background-color 0.3s ease;
    border-radius: 0 !important;
}

.custom-button:hover,
.custom-button.selected {
    background-color: rgba(1, 87, 60, 1);
    color: white;
}

.radio-button-group {
    border: 1px solid #f2f2f2;
}

#leftRadioButton { /* First button */
    border-top-left-radius: 0.1875rem !important;
    border-bottom-left-radius: 0.1875rem !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

#rightRadioButton { /* Second button */
    border-top-right-radius: 0.1875rem !important;
    border-bottom-right-radius: 0.1875rem !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

/* end */
.fnt{
    font-family: 'Inter', sans-serif;
    font-family: 'Roboto', sans-serif;
}
.subscriber-header{
    font-size: 12px;
    font-weight: bolder;
}
.mab-10{
    margin-bottom: 10px;
}
.withness-gap{
    margin-top: 100px;
}
.subscriber-info{
    font-size: 12px;
    font-weight: normal;
}
.has-search .form-control {
    padding-left: 2.375rem;
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
}
.iframe-style {
    height: 500px;
    width: 100%;
}
.custom-border-color{
    color: rgba(222, 226, 225, 1)
}
/*menu style starts*/

.left-link {
    font-size: 16px;
    line-height: 18px;
    color: rgba(0, 0, 0, .8);
}
.left-link a{
    color: #000000;
}
.left-link i {
    color: #000000;
}

.left-link:hover {
    background: rgba(243, 245, 235, 1);
    color: rgba(1, 87, 60, 1);
}

.left-link:hover a {
    color: rgba(1, 87, 60, 1);
}
.dropdown-toggle { outline: 0; }

.nav-flush .nav-link {
    border-radius: 0;
}

.left-link.active,
.left-link:hover,
.left-link:focus {
    background: rgba(243, 245, 235, 1);
    color: rgba(1, 87, 60, 1);
}
.left-link.focus-none:focus {
    background-color: inherit;
    color: inherit;
}
.left-link.active.focus-none:focus,
.left-link.focus-none:hover {
    background: rgba(243, 245, 235, 1);
    color: rgba(1, 87, 60, 1);
}
.left-link.btn-check:focus+.btn, .btn:focus{
    box-shadow: none !important;
}

.regular-box {
    background-color: rgba(231,232,230,255);
}
.border-comment-color {
    border: 1px solid #b9bcbc;
}
.btn-toggle::after {
    width: 1.25em;
    line-height: 0;
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
    transition: transform .35s ease;
    transform-origin: .5em 50%;
}

.btn-toggle[aria-expanded="true"] {
    color: rgba(0, 0, 0, 1);
}
.btn-toggle[aria-expanded="true"]::after {
    transform: rotate(90deg);
}
.btn-toggle-p-1::after {
    width: 1.5rem;
    padding: .25rem !important;
    transform-origin: 50% 50%;
}

.btn-toggle-nav a {
    display: inline-flex;
    padding: 5px 20px;
    margin-top: 5px;
    text-decoration: none;
}
.btn-toggle-nav a:hover,
.btn-toggle-nav a:focus {
    color: rgba(1, 87, 60, 1);
}
.scrollarea {
    overflow-y: auto;
}

/*menu style ends*/
/* misc style starts */
.error-back-img{
    width: 100%;
}
.invoice-button span{
    color: #000000;
}
#profileDropdown{
    border: transparent;
}
.user-image{
    width: 40px;
    height: 40px;
}
#profileDropdownContent{
    padding: 20px 10px;
}
#profileDropdownContent a{
    color: black;
    padding: 5px;
    font-size: 16px;
    font-weight: 500;
    line-height: 14px;
}
#profileDropdownContent a:hover {
    color: rgba(1, 87, 60, 1);
    background-color: rgba(213, 221, 217, 0.6);
}
.nextBtn{
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: white;
    border-radius: 5px;
}
.prevBtn{
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: white;
    border-radius: 5px;
}
.nextBtn:hover{
    background-color: rgba(1, 87, 60, 1);
    color: white;
}
.nextBtnDisabled {
    pointer-events: none;
}
.prevBtn:hover{
    background-color: rgba(1, 87, 60, 1);
    color: white;
}
.btn-md {
    min-width: 200px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px;
}
.green-hover:hover{
    background-color: rgba(1, 87, 60, 1) !important;
    color: white !important;
}
.view-btn span:hover{
    color: rgba(1, 87, 60, 1);
}
.accordion-button:not(.collapsed){
    background-color: rgba(246, 246, 249, 1);
    color: black;
}
.accordion-button:not(.collapsed) a{
    color: black;
}
.accordion-button a {
    color: black !important;
}
/* misc style ends */
.accordion-button{
    padding: 0;
    font-size: 16px;
    font-weight: 500;
    line-height: 18px;
    color: black;
}
.accordion-button::after {
    width: 1rem;
    height: 1rem;
    background-size: 1rem;
}
.custom-alert-color-bg{
    background: rgba(255, 227, 230, 1);
}
.custom-alert-color-text{
    color: rgba(210, 8, 8, 1);
}
.custom-alert-color-bg-success{
    background: rgb(229, 255, 227);
}
.custom-alert-color-text-success{
    color: rgb(0, 255, 0);
}
#design-bg{
    background-image: url("../../images/login/new-login-bg.png");
    /*background-position: center;*/
    background-repeat: no-repeat;
    background-size: 51% 93vh;
    /*min-height: -webkit-fill-available;*/
    height: inherit;
}

#design-bg-admin {
    background-image: url("../../images/login/admin-login-bg.png");
    /*background-position: center;*/
    background-repeat: no-repeat;
    background-size: 51% 93vh;
    /*min-height: -webkit-fill-available;*/
    height: inherit;
}
.design-bg-40{
    background-image: url("../../images/login/new-login-bg.png");
    background-repeat: no-repeat;
    background-size: 41% 90vh;
    height: inherit;
}
.custom-dropdown {
    position: relative;
    display: inline-block;
}
.custom-dropdown:hover {
    color: black;
}
.selected-option {
    padding: 5px 10px;
    cursor: pointer;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    z-index: 999;
    width: 100%;
    margin-left: -12px;
    margin-top: 10px;
}
.dropdown-option {
    padding: 5px 10px;
    cursor: pointer;
}
.custom-profile-dropdown {
    width: auto;
    transform: translateX(-40%);
}
.error-shadow{
    /*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
    text-align: center;
    height: 100px;
    background: linear-gradient(179.72deg, #D1D1D1 -15.99%, rgba(235, 235, 235, 0) 31.39%);
}
.error-header{
    font-size: 128px;
    font-weight: 700;
    color: rgba(187, 125, 11, 1);
}
.error-sub-header{
    font-size: 18px;
    font-weight: 700;
    color: rgba(33, 37, 41, 1);
}
.custom-border {
    border: 1px solid #000000;
}
/* Custom styles for the toggle button */
.custom-toggle .form-check-input {
    background-color: #dc3545;
    border-color: #dc3545;
    width: 3.5rem;
    height: 1.5rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='white'/%3e%3c/svg%3e");
}

.custom-toggle .form-check-input:focus{
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='white'/%3e%3c/svg%3e");
}

.custom-toggle .form-check-input:checked {
    background-color: rgba(1, 87, 60, 1);
    border-color: rgb(0, 66, 46);
}

/* responsive starts */

@media (min-width: 420px) {
    .header {
        font-size: 32px;
        font-weight: 500;
    }
}

@media (min-width: 576px) {
    .header {
        font-size: 36px;
        font-weight: 500;
    }
}
.py-1 {
  padding-top: 1.2rem!important;
  padding-bottom: 1.2rem!important;
}
.fs-23 {
  font-size: 23px;
}
.fs-32 {
  font-size: 32px;
}

@media (min-width: 768px) {
    .header {
        font-size: 40px;
        font-weight: 500;
    }
}
@media (min-width: 992px) {
}

.login-wrapper-div{
    width: 500px;
    /*box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.10);*/
    border-radius: 8px;
    padding-left: 30px !important;
    padding-right: 30px !important;
}
.form-control {
    border-radius: 6px !important;
}
.common-footer{
    margin-top: -35px;
    background-color: black;
    padding: 11px;
}
.footer-text{
    color: white;
    text-align: center;
}
.font-color-white{
    color: white;
}
.content-border{
    border: 1px solid #B9CCC7;
}
.content-dark-border{
    border: 1px solid #1a9d7a;
}
.content-top-green-bg{
    background-color: #01573C;
}
.content-top-color-2-bg{
    background-color: #786b0a;
}
.content-top-color-3-bg{
    background-color: #0a7874;
}
.content-light-green-bg{
    background-color: #B9CCC7;
}
.content-light-border{
    border: 1px solid #B9CCC7;
}
.min-height-800{
    min-height: 800px;
}
.font-color-black{
    color: black !important;
}
.fs-20-500 {
    font-size: 20px;
    font-weight: 500;
}
.fs-22-500 {
    font-size: 22px;
    font-weight: 500;
}
.bottom-border-2{
    border-bottom: 2px solid #01573c4a;
}
.top-border-2{
    border-top: 2px solid #01573c4a;
}
.bottom-border-1 {
    border-bottom: 1px solid #01573c4a;
}
.fs-14{
    font-size: 14px;
}
.fs-12{
    font-size: 12px;
}
.fs-8 {
    font-size: 8px;
}
.min-height-500{
    min-height: 500px;
}
.max-height-500{
    max-height: 500px;
}
.max-height-100{
    max-height: 100px;
}
.entity-dashboard-summary-icon{
    width: 40px;
    height: 40px;
}
.cyan-bg{
    background-color: #DCFCEB;
}
.pest-bg{
    background-color: #D0FFF4;
}
.margin-top-11{
    margin-top: 11px;
}
.no-before:before {
    content:none !important;
}
.w-200{
    width: 200px;
}
.govt-logo{
    width: 60px;
}
.rjsc-logo{
    height: 100%;
    margin-top: 9px;
}
.custom-white-anchor-tag:hover{
    color: #e0eae6;
    text-decoration: underline;
}
.btn-primary {
    color: #fff;
    background-color: rgba(1, 87, 60, 1);
    border-color: rgba(1, 87, 60, 1);
}

.btn-primary:hover,
.btn-check:focus + .btn-primary,
.btn-primary:focus {
    color: #fff;
    background-color: rgba(1, 87, 60, 1);
    border-color: rgba(1, 87, 60, 1);
}

.btn-primary:disabled,
.btn-primary.disabled {
    color: #fff !important;
    background-color: rgba(1, 87, 60, 0.6); /* Optional: dim effect */
    border-color: rgba(1, 87, 60, 0.6);
    cursor: not-allowed;
    opacity: 0.8;
}

.btn-blue {
    color: #fff;
    background-color: rgba(13, 112, 240, 0.84);
    border-color: rgba(13, 112, 240, 0.84)
}

.btn-blue:hover, .btn-check:focus + .btn-blue, .btn-blue:focus {
    color: #fff;
    background-color: rgba(13, 112, 240, 0.78);
    border-color: rgba(13, 112, 240, 0.78)
}
.btn-green {
    color: #fff;
    background-color: rgb(18, 157, 102);
    border-color: rgb(18, 157, 102);
}

.btn-green:hover, .btn-check:focus + .btn-green, .btn-green:focus {
    color: #fff;
    background-color: rgb(18, 157, 102, 0.8);
    border-color: rgb(18, 157, 102, 0.8);
}
.disabled{
    background-color: rgba(221, 221, 221, 0.7);
}
.no-background-color{
    background: none;
}
/*custom checkbox*/


 .checkbox-wrapper-33 {
     --s-xsmall: 0.625em;
     --s-small: 1.2em;
     --border-width: 1px;
     --c-primary: #01573C;
     --c-primary-20-percent-opacity: #E2EDE9;
     --c-primary-10-percent-opacity: #01573C;
     --t-base: 0.4s;
     --t-fast: 0.2s;
     --e-in: ease-in;
     --e-out: cubic-bezier(.11,.29,.18,.98);
 }

.checkbox-wrapper-33 .visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.checkbox-wrapper-33 .checkbox {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.checkbox-wrapper-33 .checkbox + .checkbox {
    margin-top: var(--s-small);
}
.checkbox-wrapper-33 .checkbox__symbol {
    display: inline-block;
    display: flex;
    margin-right: calc(var(--s-small) * 0.7);
    border: var(--border-width) solid var(--c-primary);
    position: relative;
    border-radius: 0.1em;
    width: 1.1em;
    height: 1.1em;
    /*transition: box-shadow var(--t-base) var(--e-out), background-color var(--t-base);*/
    /*box-shadow: 0 0 0 0 var(--c-primary-10-percent-opacity);*/
    background-color: white;
}
.checkbox-wrapper-33 .checkbox__symbol:after {
    content: "";
    position: absolute;
    top: 0.5em;
    left: 0.5em;
    width: 0.25em;
    height: 0.25em;
    background-color: var(--c-primary-20-percent-opacity);
    opacity: 0;
    border-radius: 3em;
    /*transform: scale(1);*/
    /*transform-origin: 50% 50%;*/
}
.checkbox-wrapper-33 .checkbox .icon-checkbox {
    width: 0.7em;
    height: 0.7em;
    margin: auto;
    fill: none;
    stroke-width: 3;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-miterlimit: 10;
    color: var(--c-primary);
    display: inline-block;
    background-color: white;
}
.checkbox-wrapper-33 .checkbox .icon-checkbox path {
    transition: stroke-dashoffset var(--t-fast) var(--e-in);
    stroke-dasharray: 30px, 31px;
    stroke-dashoffset: 31px;
}
.checkbox-wrapper-33 .checkbox__textwrapper {
    margin: 0;
}
.checkbox-wrapper-33 .checkbox__trigger:checked + .checkbox__symbol:after {
    /*-webkit-animation: ripple-33 1.5s var(--e-out);*/
    /*animation: ripple-33 1.5s var(--e-out);*/
}
.checkbox-wrapper-33 .checkbox__trigger:checked + .checkbox__symbol .icon-checkbox path {
    /*transition: stroke-dashoffset var(--t-base) var(--e-out);*/
    stroke-dashoffset: 0px;
}
.checkbox-wrapper-33 .checkbox__trigger:focus + .checkbox__symbol {
    /*box-shadow: 0 0 0 0.25em var(--c-primary-20-percent-opacity);*/
}

@-webkit-keyframes ripple-33 {
    from {
        transform: scale(0);
        opacity: 1;
    }
    to {
        opacity: 0;
        transform: scale(20);
    }
}

@keyframes ripple-33 {
    from {
        transform: scale(0);
        opacity: 1;
    }
    to {
        opacity: 0;
        transform: scale(20);
    }
}
.checkbox-wrapper-33.dashed-border {
    border: 1px dashed #00000080;
}
.checkbox-wrapper-33.double-border {
    border: 1px double #00000080;
}

.text-bg-danger {
    background-color: #dc3545;
    color: #ffffff;
}

.custom-fw-bold {
    font-weight: 850 !important
}

.main-content {
    padding-left: 10px;
    padding-right: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 40px;
}

.cross-icon-start::before {
    font-family: "Font Awesome 6 Free", serif;
    content: "\f057";
    padding-right: 0.25rem;
    font-weight: 900;
}

.check-circle-icon-start::before {
    font-family: "Font Awesome 6 Free", serif;
    content: "\f058";
    padding-right: 0.25rem;
    font-weight: 900;
}

.opacity-90 {
    opacity: 0.9;
}

.min-w-fit {
    min-width: fit-content;
}
.bg-light-yellow {
    background-color: rgb(255 245 208);
}
.text-color-darkred{
    color: #bd0000e0;
}

/**
 *	This element is created inside your target element
 *	It is used so that your own element will not need to be altered
 **/
.time_circles {
    position: relative;
    width: 100%;
    height: 100%;
}
.border-bottom-2 {
    border-bottom: 2px solid #000; /* Change the color as needed */
}

.sign-out-link {
    color: rgba(1, 87, 60, 1);
    text-decoration: none;
}

.sign-out-link:hover {
    color: rgba(0, 67, 46);
    text-decoration: underline;
}
.form-check-input-role-select {
    appearance: none;
    -webkit-appearance: none;
    width: 1em;
    height: 1em;
    border: 2px solid #ccc;
    border-radius: 50%;
    background-color: white;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    margin-top: 0;
}

.form-check-input-role-select:checked {
    background-color: white;
    border: 3px solid #005435;
    box-shadow: 0 0 0 3px #91ee8e;
}

.form-check-input-role-select.checked {
    color: #005435;
    font-weight: bold;
}
.form-check-input:checked {
    background-color: rgba(1, 87, 60, 1);
    border-color:  rgba(0, 67, 46, 1);
}
.form-check-label.checked {
    color: rgba(1, 87, 60, 1);
    font-weight: bold;
}
/**
 *	This is all the elements used to house all text used
 * in time circles
 **/
.time_circles > div {
    position: absolute;
    text-align: right;
}

/**
 *	Titles (Days, Hours, etc)
 **/
.time_circles > div > h4 {
    margin: 0;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
    font-family: 'Century Gothic', Arial;
    line-height: 1;
    /*font-size: 9px !important;*/
    /*position: absolute;*/
    /*bottom: -24px;*/
    /*left: 14px;*/
}

/**
 *	Time numbers, ie: 12
 **/
.time_circles > div > span {
    margin: 0;
    padding: 0;
    display: block;
    width: 100%;
    text-align: center;
    font-family: 'Century Gothic', Arial;
    line-height: 1;
    font-weight: bold;
    /*font-size: 16px !important;*/
}

.anti-d-plus-btn {
    background-color: #FFFFFF !important;
    color: #01573C;
    border: 1px solid #01573C;
    border-radius: 2px!important;
}

.anti-d-plus-btn:hover {
    background-color: #01573C !important;
    border: 1px solid #01573C;
    color:  white !important;
}
#advanced-filter-btn::after,
.advanced-filter-btn::after {
    width: 1.25em;
    line-height: 0;
    content: url("/images/icons/green-down-arrow.svg");
    transition: transform .35s ease;
    transform-origin: .5em 50%;
}
#advanced-filter-btn[aria-expanded="true"],
.advanced-filter-btn[aria-expanded="true"] {
    color: #fff;
    background-color: rgba(1, 87, 60, 1);
    border-color: rgba(1, 87, 60, 1);
}
#advanced-filter-btn[aria-expanded="true"]::after,
.advanced-filter-btn[aria-expanded="true"]::after {
    content: url("/images/icons/white-up-arrow.svg");
}
.vh-87 {
    height: 87vh;
}
.vh-80 {
    height: 80vh;
}
.vh-90 {
    height: 90vh;
}
.max-vh-78 {
    max-height: 78vh;
}
.max-vh-40 {
    max-height: 40vh;
}
.nav-pills .nav-link-green.active {
    background-color: #01573C;
}
.nav-pills .nav-link-green {
    color: #01573C;
}
.group-submission-search-field {
    border-bottom-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
}
.nav-tabs .nav-link-green.active,
.active-tab {
    background-color: #01573C;
    color: white;
}
.nav-tabs .nav-link-green,
.inactive-tab {
    color: #212529;
    background-color: white;
}

/* Vertical layout: tables are stacked one after the other */
.vertical-layout table {
    width: 100%;
    margin-bottom: 20px;
}

/* Horizontal layout: tables are side by side */
.horizontal-layout {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.horizontal-layout table {
    width: 48%;
    margin: 0; /* Remove margin to ensure both tables align */
    vertical-align: top;/* Adjust the width of the tables as needed */
}
caption {
    caption-side: top; /* Ensures the caption stays at the top */
    font-weight: bold;
    text-align: center;
    padding: 5px;
    margin-bottom: 5px;
}
.dropdown-toggle.toggle-icon-none::after {
    display: none;
}
.min-height-400{
    min-height: 400px;
}
.min-height-400{
    min-height: 400px;
}

#notificationIcon .badge {
    margin-top: -1.2rem;
    font-size: 0.9rem;       /* Smaller text size */
    padding: 0.25em 0.4em;   /* Reduced padding */
    line-height: 1;
    margin-left: 7px;
}

#notificationDropdown {
  display: none;
  max-height: 300px;
  margin-left: -120px;
  overflow-y: auto;
  width: auto;
}

/* Title Text */
.notification-title {
  word-wrap: break-word;
  white-space: normal;
  flex-grow: 1;
  margin-right: 10px;
}

/* View Button */
.view-button {
  margin-left: 1px;
}

/* Dropdown Item (for better spacing and alignment) */
.dropdown-item {
  display: flex;
  align-items: center;
  padding: 8px 12px;
}

.dropdown-item i {
  margin-right: 8px;
}

/* Empty Notification Message */
.dropdown-item span {
  font-style: italic;
  color: #888;
}

.custom-bell-icon {
  font-size: 15px; /* Adjust the size as needed */
  color: rgba(53, 54, 57, 0.64);      /* Optional: Change the icon color */
  position: relative;
}
#notificationDropdown .dropdown-item small {
  margin-top: 5px; /* Adds some space between the message and the date */
  font-size: 0.85rem; /* Slightly smaller font size */
  color: #6c757d; /* Muted color for the date */
}

.min-height-0 {
    min-height: 0;
}
.overflow-y-auto {
    overflow-y: auto;
}

.hidden {
    display: none !important;
}
.top-1rem {
    top: 1rem;
}
.bottom-1rem {
    bottom: 1rem;
}
.table-row-selected {
    border: 2px solid #54d554 !important;
    box-shadow: 0px 4px 10px rgba(0, 128, 0, 0.5); /* Green shadow */
    transition: all 0.3s ease-in-out;
}

#profileDropdownContent {
    position: absolute;
    z-index: 9999;
    border: solid #dfd6d6 2px;
}

#hideDropdown {
    position: relative;
}
.h-30px {
    height: 30px;
}

.tree {
    margin-left: 20px;
}

.tree-node {
    position: relative;
    margin-left: 20px;
    list-style-type: none;
}

.tree-node::before {
    content: "";
    position: absolute;
    top: 0;
    left: -20px;
    border-left: 1px solid #ccc;
    height: 100%;
}

.tree-node:last-child::before {
    /*height: 20px;*/
    height: 50%;
}

.tree-toggler {
    position: relative;
    cursor: pointer;
    padding: 8px 0 0;
}

.tree-toggler::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -20px;
    width: 20px;
    border-top: 1px solid #ccc;
}

.tree-parent {
    font-weight: bold;
    padding: 5px 10px;
    border-radius: 4px;
    background-color: #f8f9fa;
    display: inline-block;
}

.tree-children {
    display: none;
    padding-left: 0;
    margin-bottom: 0 !important;
}

.tree-child {
    position: relative;
    /*margin-top: 8px;*/
    padding: 5px 10px;
    /*border-radius: 4px;*/
    background-color: #fff;
}

.tree-child::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -20px;
    width: 20px;
    border-top: 1px solid #ccc;
}

.badge-in-progress {
    background-color: #ffc107;
    color: #212529;
}

.badge-approved {
    background-color: #198754;
    color: white;
}

@media (min-width: 768px) {
    .modal-xxl {
        max-width: 1400px;
        width: 90%;
    }
}

#customViewToggle .btn-check:checked + .btn {

    background-color: rgba(1, 87, 60, 1);
    border-color: green;
    color: #fff;
}

#customViewToggle .btn {
    transition: background-color 0.3s, color 0.3s;
    border-color: green;
}

#customViewToggle .btn:hover {
    background-color: rgba(164, 226, 164, 0.2);
}

#listView {
    max-width: 70%;
    margin: 0 auto;
}

.custom-switch {
    display: flex;
    align-items: center;
    padding: 10px;
    background-color: #f3f4f6;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    max-width: 250px;
}

.custom-switch .form-check-input {
    width: 2.5em;
    height: 1.5em;
    margin-right: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.custom-switch .form-check-input:checked {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

.custom-switch .form-check-label {
    font-weight: bold;
    font-size: 1rem;
    color: #495057;
    cursor: pointer;
}

#customViewToggle .btn-check:checked + .btn {

    background-color: rgba(1, 87, 60, 1);
    border-color: green;
    color: #fff;
}

#customViewToggle .btn {
    transition: background-color 0.3s, color 0.3s;
    border-color: green;
}

#customViewToggle .btn:hover {
    background-color: rgba(164, 226, 164, 0.2);
}

#listView {
    max-width: 70%;
    margin: 0 auto;
}

.custom-switch {
    display: flex;
    align-items: center;
    padding: 10px;
    background-color: #f3f4f6;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    max-width: 250px;
}

.custom-switch .form-check-input {
    width: 2.5em;
    height: 1.5em;
    margin-right: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.custom-switch .form-check-input:checked {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

.custom-switch .form-check-label {
    font-weight: bold;
    font-size: 1rem;
    color: #495057;
    cursor: pointer;
}