:root {
    --bg-light-gray: #f2f2f2;
    --dark-black: #222;
}



.application-login-section {
    background-color: #fff;
    height: 100vh;
    width: 100%;
    /* display: flex;
    justify-content: space-between;
    align-items: center; */
    /* background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.23) 0%, rgba(0, 0, 0, 0.296) 100%), url(../img/baner/1.jpg);
    backdrop-filter: blur(10px);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover; */

}

.auth-left-cs {
    /*background-image: linear-gradient(0deg, rgb(0 0 0 / 0%) 0%, #22222200 100%), url(../img/baner/special/1.jpg);*/
    /*background-position: center;*/
    /*background-repeat: no-repeat;*/
    /*background-size: cover;*/
    height: 100vh;
    width: 50%;
    display: flex;
    justify-content: Center;
    align-items: center;
}

.auth-left-cs video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.auth-left {
    width: 30%;
    background-color: #fff;
    height: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    border: 1px solid #113b85;
    padding: 20px;
}

.login-field-box {
    max-width: 500px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;

}

.login-field-box img {
    width: 180px;
}

.auth-left .login-field-box h2 {
    font-weight: 600;
    color: #000;
    font-size: 35px;
}

.auth-left .login-field-box p {
    text-align: center;
    line-height: 27px;
    font-size: 15px;
    color: #000;
}

.auth-left .login-field-box input {
    height: 55px;
}

#rememberMe {
    width: 18px !important;
    height: 18px !important;
    border-color: #222 !important;
}

.login-box-latest {
   
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* height: 100%; */
    margin: auto;
    margin-top: -120px;
    background-color: #fff;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border-radius: 25px;
}

.login-box-latest .btn--form {
    width: 75%;
    border-radius: 40px;
    color: #fff;
    background-color: #13889C;
}

.login-box-latest .btn--form:hover {
    background-color: #0d6b7b;
}

/*.login-box-latest .btn--form.color-1 {*/
/*    background-color: #ea5050;*/
/*}*/
/*.login-box-latest .btn--form.color-1:hover {*/
/*    background-color: #b52424;*/
/*}*/

/*.login-box-latest .btn--form.color-2 {*/
/*    background-color: #45c73e;*/
/*}*/
/*.login-box-latest .btn--form.color-2:hover {*/
/*    background-color: #1d9017;*/
/*}*/

/*.login-box-latest .btn--form.color-3 {*/
/*    background-color: #5489d1;*/
/*}*/
/*.login-box-latest .btn--form.color-3:hover {*/
/*    background-color: #1e4884;*/
/*}*/
.login-box-latest .btn--form-login {
    width: 60%;
    border-radius: 10px;
    background-color: #30a4be;
}

.login-box-latest .btn--form-login:hover {
    border-radius: 40px;
     background-color: #166e82;
}

.login-box-latest h4 {
    font-size: 18px;
    text-align: center;
    line-height: 34px;
    font-weight: 600;

}

.login-box-latest input[type="text"],
.login-box-latest input[type="password"] {
    height: 50px !important;
    /*padding:0 !important;*/
    border: 0 !important;
    border-bottom: 1px solid #ccc !important;
    border-radius: 0 !important;
    color: #000 !important;
    font-weight: 300 !important;

}

.login-box-latest input[type="text"]::placeholder,
.login-box-latest input[type="password"]::placeholder {
    color: #000 !important;

}

.login-box-latest input[type="text"]:focus,
.login-box-latest input[type="password"]:focus {
    border-bottom: 2px dashed #ccc !important;
}

.login-screen-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;

}

.login-screen-left h1 {
    color: #fff;
    font-size: 40px;
    font-weight: 600;
}

.login-screen-left p {
    font-size: 17px;
    font-weight: 600;
    color: #fff;
}

.sidebar-cont {
    position: relative;
    height: 100%;

}

.sidebar-profile {
    position: sticky;
    bottom: 0;
    left: 0;
    width: 100%;
    /* top: 100%; */
    background-color: #3b3b3b;
}

.sidebar-profile .side-profile-box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 20px;
    gap: 10px;
}

.sidebar-profile .side-profile-box img {
    width: 50px;
    height: 50px;
    max-width: 50px;
    max-height: 50px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px dashed #fff;
}

.sidebar-profile .side-profile-box .side-profile-dt {
    padding-left: 10px;
}

.sidebar-profile .side-profile-box .side-profile-dt h3 {
    font-size: 17px;
    font-weight: 600;
    color: #fff;
    margin: 0;
}

.sidebar-profile .side-profile-box .side-profile-dt p {
    margin: 0;
    font-size: 12px;
    margin-top: 2px;
    color: #20cc20;
    font-weight: 600;
}

.header-top-cs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    padding-right: 20px;

}

.header-top-cs .header-section-dt h3 {
    font-size: 27px;
    font-weight: 500;
    color: #000;
    margin: 0;
}

.header-top-cs .header-section-dt p {
    font-size: 14px;
    margin: 0;
    color: #858585;
    font-weight: 400;
}

.header-top-cs .header-section-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 7px;
    width: 56%;
}

.header-top-cs .header-section-right a {
    font-size: 16px;
    border: 1px solid #ababab;
    min-width: 45px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 7px;
    background: #ffffff6b;
}

.header-top-cs .header-section-right a i {
    color: #000;
}

.section-top-padding {
    padding-top: 20px;
}

.progress-bar {
    background-color: #025187 !important;
}

.dashboard-top-section select {
    height: 45px;
    /* background-color: #eeeeee; */
    border: 0;
    outline: 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-black);
    border: 1px solid #9f9b9b;
}

.dashboard-top-section ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.dashboard-top-section ul li {
    margin: 0 10px;
    font-size: 15px;
    font-weight: 600;
    color: #9a9a9a;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}

.dashboard-top-section ul li span {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.dashboard-top-section ul li span.bg_Gray {
    background-color: #ababab;
}

.dashboard-top-section ul li span.bg_Orange {
    background-color: #ea8436;
}

.dashboard-top-section ul li span.bg_Green {
    background-color: #16a816;
}

.dashboard-list-btns ul {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    padding-bottom: 20px;
}

.dashboard-list-btns ul li {
    margin-right: 5px;
}

.dashboard-list-btns ul li a {
    padding: 7px 11px;
    text-decoration: none;
    font-size: 14px;
    /* border: 1px solid #025187; */
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 500;
    border-radius: 5px;
    transition: 0.5s;
}

/* 
.dashboard-list-btns ul li a.active {
    background-color: #025187;
    color: #fff;
} */

.dashboard-list-btns ul li a:hover {
    /* background-color: #025187;
    color: #fff; */
    border-radius: 40px;
}

.dashboard-list-btns ul li a.bg_1 {
    background-color: #39B27C;
}

.dashboard-list-btns ul li a.bg_2 {
    background-color: #1a7bb9;
}

.dashboard-list-btns ul li a.bg_3 {
    background-color: #f8d347;
}

.dashboard-list-btns ul li a.bg_4 {
    background-color: #b52323;
}

.dashboard-list-btns ul li a.bg_5 {
    background-color: #cb4ec9;
}

.dashboard-list-btns ul li a.bg_6 {
    background-color: #7a339e;
}

.dashboard-project-view {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 15px;
}

.dashboard-project-view h3 {
    /* background-color: #afce333b; */
    color: #000;
    border: 1px solid #222;
    padding: 15px 15px;
    font-size: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    width: 100%;
    border-radius: 5px;
}

.dashboard-project-view h3 span {
    margin-left: 15px;
}

.dashboard-project-view ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    padding: 20px 0 0 30px;
}

.dashboard-project-view ul li {
    width: 47%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    position: relative;
    margin-bottom: 30px;
    font-size: 16px;
    /* font-weight: 600; */
    color: #000;
}

.dashboard-project-view ul li:nth-child(even) {
    padding-left: 40px;
}

.dashboard-project-view ul li:nth-child(even)::before {
    left: 13px;
}

.dashboard-project-view ul li span {
    font-weight: 400;
    font-size: 14px;
    color: #575656;
}

.dashboard-project-view ul li::before {
    content: '';
    width: 20px;
    height: 20px;
    background-color: #aec942;
    border-radius: 50%;
    border: 4px solid #d9e89d;
    position: absolute;
    left: -27px;
    top: 4px;

}

/* canvas#doughnut {
    width: 300px !important;
    height: 300px !important;
    margin: auto;
} */

.flex-col-bet {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.project-view-bottom .col-lg-4 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
}

.project-view-bottom .project-view-bottom-icon {
    width: 50px;
    height: 50px;
    border: 1px solid #025187;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.project-view-bottom .project-view-bottom-icon i {
    font-size: 18px;
    color: #025187;
}

.project-view-bottom .project-view-bottom-dt {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.project-view-bottom .project-view-bottom-dt h4 {
    font-size: 25px;
    font-weight: 600;
    color: #000;
    margin: 0;
}

.project-view-bottom .project-view-bottom-dt p {
    margin: 0;
    font-size: 16px;
    color: #575656;
    font-weight: 600;
}

.border-right-cs {
    border-right: 1px solid #ccc;
}

.add-project-btn {
    padding: 7px 15px;
    font-size: 14px;
    font-weight: 600;
    height: 37px;
    background-color: #113b85;
    color: #fff;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    width: fit-content;
    transition: 0.5s;
}

.add-project-btn:hover {
    border-radius: 40px;
    color: #fff;

}

.dashboard-top-section {
    margin-bottom: 30px;
}

.project-progress-main-container {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 15px;
}

.project-process-box ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.project-process-tree-box {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    position: relative;
    z-index: 3;
}

.project-process-tree-box span {
    font-size: 15px;
    font-weight: 400;
}

.project-process-tree-box h6 {
    font-size: 15px;
    font-weight: 600;
    color: #000;
}

.project-process-tree-box i {
    font-size: 20px;
}

.project-process-tree-box i.fs_30 {
    font-size: 30px;
}

.project-process-tree-box-short {
    position: absolute;
    padding: 10px;
    background-color: #e9fd98ed;
    border: 1px solid #025187;
    top: -73px;
    width: 185px;
    border-radius: 10px;

}

.project-process-tree-box-short span {
    width: 25px;
    height: 25px;
    background-color: #e9fd98ed;
    border: 1px solid #025187;
    border-left: 0;
    border-top: 0;
    display: flex;
    margin: auto;
    margin-bottom: -22px;
    rotate: 46deg;
}

.project-process-tree-box-short p {
    text-align: center;
    font-weight: 600;
    font-size: 13px;
    margin: 0;
}

.project-process-box {
    position: relative;
}

.project-process-box .project-process-line {
    width: 100%;
    height: 4px;
    background-color: #d5d5d5;
    position: absolute;
    left: 0px;
    top: 45px;
}

.project-process-box .project-process-line-2 {
    width: 50%;
    /* height: 4px; */
    border: 2px dashed #15ee3a;
    position: absolute;
    left: 0px;
    top: 45px;
}

.v-none {
    visibility: hidden;
}

.project-process-tree-box i.fa-circle-check {
    color: #2ec517;
    background: #fff;
}

.project-process-tree-box i.fa-stopwatch {
    color: #d5af15;
    background: #fff;
}

.project-process-tree-box i.fa-circle-info {
    color: #f70e0e;
    background: #fff;
}

.dashboard-project-container p {
    margin-bottom: 0;
    font-size: 19px;
    font-weight: 500;
    color: #000;
}

.dashboard-project-container p span {
    font-size: 14px;
    font-weight: 400;
}

.dashboard-project-container p span i {
    margin: 0 10px;
}

.main-table-container {
    background-color: #ffffff;
    padding: 15px;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    /* box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px; */
    /* background: rgba(255, 255, 255, 0.771); */
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.main-table-container-top-btns-box {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 5px;
}

.main-table-container-top-btns-box a {
    width: fit-content;
    padding: 6px 13px;
    border-radius: 5px;
    font-size: 14px;
    color: #fff;
    background-color: #e04d4d;
    text-decoration: none;
    font-weight: 600;
    transition: 0.5s;
    border: 1px solid #e04d4d;
}

.main-table-container-top-btns-box a i {
    margin-left: 5px;
}

.main-table-container-top-btns-box a:hover {
    border-radius: 40px;
    background-color: transparent;
    color: #e04d4d;
    border: 1px dashed #e04d4d;
}

.main-table-container-top-filter input,
.main-table-container-top-filter select {
    height: 37px;
    border-radius: 4px;
    font-size: 15px;
}

.main-table-container-top-filter label {
    font-weight: 600;
    margin-bottom: 5px;
}


.entry-select {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 7px;
}

.entry-select p {
    font-size: 14px;
    font-weight: 500;
    margin: 0;
    color: #000;
}

.entry-select select {
    width: 100px;
    background-color: #efefef;
    border: 0;
}

.table_bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 10px;
}

.table_bottom p {
    font-size: 14px;
    font-weight: 500;
    margin: 0;
    color: #000;
    white-space: nowrap;
}

.table-pagination .page-item {
    margin: 0 5px;
}

.table-pagination .page-item .page-link {
    border-radius: 10% !important;
    padding: 0;
    padding: 4px 11px;
    font-size: 14px;
    border: 0;
    color: #222;
}

.table-pagination .page-item .page-link.page_active {
    background-color: #222;
    color: #fff;
}

.table-pagination .pagination {
    margin: 0;
}

.td-project-box {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;

}

.td-project-box img {
    width: 40px;
    height: 40px;
    border-radius: 5px;
    object-fit: cover;
}

.td-project-box .td-project-info {
    padding-left: 10px;
}

.td-project-box .td-project-info h3 {
    font-size: 16px;
    font-weight: 600;
    text-align: left;
    color: #000;

}

.td-project-box .td-project-info p {
    font-size: 14px;
    text-align: left;
    color: #636363bf;
    font-weight: 400;
}

.td-project-dt h3 {
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    color: #000;
    margin-bottom: 2px;
    line-height: 22px;
}

.td-project-dt small {
    font-size: 13px;
    text-align: center;
    color: #636363bf;
    font-weight: 500;
}

.action-box {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

tr td div.action-box a {
    font-size: 13px;
    font-weight: 500;
    padding: 4px 15px;
    white-space: nowrap;
    color: #fff !important;
    background-color: #089748;
    border-radius: 30px;
    border-radius: 25px !important;
}

.action-box a.dlt {
    background-color: #970808;
}

.action-box a.view {
    background-color: #2c6c74;
}

.action-box a.cstm {
    background-color: #c7ad19;
}

.action-box a.dropdown-toggle {
    border-radius: 2px;
}

.action-box .dropdown ul li a {
    padding: 8px;
    background-color: transparent;
    color: #000 !important;
    font-size: 12px;
}

.action-box .dropdown ul li a i {
    font-size: 15px;
}

.action-box .dropdown ul li a.edit {
    color: #027009 !important;
}

.action-box .dropdown ul li a.dlt {
    color: #b23939 !important;
}

.action-box .dropdown ul li a.cstm {
    color: #707002 !important;
}

.action-box .dropdown ul li a.cstm1 {
    color: #027049 !important;
}

.action-box .dropdown ul li a.cstm2 {
    color: #023970 !important;
}

.action-box .dropdown ul li a.cstm3 {
    color: #70025a !important;
}

.action-box .dropdown ul li a.cstm4 {
    color: #704d02 !important;
}

.badge-progess {
    font-size: 14px;
    font-weight: 600;
    padding: 4px 15px;
    white-space: nowrap;
    color: #3fc943 !important;
    background-color: #6dd47f3d;
    border-radius: 30px;
}

.badge-completed {
    font-size: 14px;
    font-weight: 600;
    padding: 4px 15px;
    white-space: nowrap;
    color: #45c50a !important;
    background-color: #94f26875;
    border-radius: 30px;
}

.badge-cancelled {
    font-size: 14px;
    font-weight: 600;
    padding: 4px 15px;
    white-space: nowrap;
    color: #d63b35 !important;
    background-color: #e36b6733;
    border-radius: 30px;
}

td.department-project-td {
    min-width: 250px;
}

.progres-cs {
    width: 80%;
    margin: auto;
    height: 9px;
}

.modal-form-btns {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
}

.modal-form-btns button {
    width: 110px;
    height: 37px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0;
    background-color: #236c64;
    color: #fff;
    border-radius: 5px;
    transition: 0.5s;
    font-size: 15px;
    font-weight: 500;

}

.modal-form-btns button:first-child {
    background-color: #970808;
}

.modal-form-btns button:hover,
.modal-form-btns a.pdf-download:hover {
    border-radius: 40px;
}

.modal-form-btns a.pdf-download {
    width: 180px;
    height: 37px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0;
    background-color: #b23939;
    color: #fff;
    border-radius: 5px;
    transition: 0.5s;
    font-size: 15px;
    font-weight: 500;
}

.table-csv-btns {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.table-csv-btns ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.table-csv-btns ul li {
    margin: 0 4px;
}

.table-csv-btns ul li a {
    padding: 4px 15px;
    background-color: #b23939;
    text-decoration: none;
    color: #fff;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    transition: 0.5s;
}

.table-csv-btns ul li a:hover {
    border-radius: 40px;
}

.dashboard-project-team {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 15px;
}

.dash-team-box-top h3 {
    margin: 0;
    font-weight: 600;
    font-size: 20px;
    color: #000;
    margin-bottom: 5px;
}

.dash-team-box-top p {
    font-size: 14px;
    margin: 0;
    font-weight: 600;
    color: #6a6a6a;
}

.project-team-main-container {
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    /* background-color: #f7f7f7; */
}

.project-team-main-container h3 {
    margin: 0;
    font-weight: 600;
    font-size: 18px;
    color: #000;
    margin-bottom: 5px;
}

.project-team-main-container p {
    font-size: 13px;
    margin: 0;
    font-weight: 500;
    color: #6a6a6a;
}

.project-team-main-container ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.project-team-main-container ul li img {
    width: 45px;
    height: 45px;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid #fff;
}

.project-team-main-container ul li {
    margin-left: -10px;
}

.eclipse-btn {
    font-size: 23px;
    color: #000;
}

.df-flex {
    display: flex;
    justify-content: flex-end;
    align-items: center;

}

.dasboard-project-bottom-right {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 15px;
}

.header-display {
    display: flex;
    align-items: center;
}

.header-display p {
    color: #025187;
    margin: 5px;
    font-size: 1.2rem;
    word-spacing: 0.5rem;
}

pre {
    padding: 10px;
    margin: 0;
    cursor: pointer;
    font-size: 1.2rem;
    color: #025187;
}

.days,
.week {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    margin: auto;
    /* padding: 0 20px; */
    justify-content: space-between;

}

.week div,
.days div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3rem;
    width: 2.5em;
    border-radius: 100%;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

/* .days div:hover {
    background:#f2f2f2;
    color: rgb(40, 201, 25);
    cursor: pointer;
  } */
.week div {
    opacity: 0.5;
}

.current-date {
    background-color: var(--accent);
    color: var(--white);
}

.display-selected {
    margin-bottom: 10px;
    /* padding: 20px 20px; */
    text-align: center;
}

.calendar-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
}

.dasboard-project-bottom-right h3 {
    font-size: 20px;
    font-weight: 600;
    color: #000;
}

.dashboard-leads-box {
    padding: 10px;
    /* border: 1px solid #ccc; */
    border-radius: 5px;
    background-color: #efefef;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.dashboard-leads-box img {
    width: 55px;
    height: 55px;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid #fff;
}

.dash-leads-dt {
    padding-left: 20px;
    width: 100%;
}

.dash-leads-dt h6 {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
    font-size: 15px;
    font-weight: 600;
    color: #000;
    margin-bottom: 0px;
}

.dash-leads-dt h6 span {
    font-weight: 400;
    font-size: 13px;
    background-color: #9ca380;
    border-radius: 40px;
    padding: 4px 9px;
    color: #fff;
}

.dash-leads-dt small {
    font-weight: 500;
    font-size: 13px;
    color: #676464;
}

.project-main-overview {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 15px;
}

.btn-common {
    padding: 7px 15px;
    font-size: 14px;
    font-weight: 600;
    height: 37px;
    background-color: #e04d4d;
    color: #fff;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* margin-top: 20px; */
    width: fit-content;
    transition: 0.5s;
}

.btn-common:hover {
    border-radius: 40px;
    color: #fff;

}

.btn-more {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    color: #000;
}

.widget-title {
    font-size: 28px;
    font-weight: 600;
    color: #000;
    margin: 0;
}

.project-dashboard-main-box .project-main-title {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.project-dashboard-main-box .project-main-title img {
    width: 50px;
    height: 50px;
    border-radius: 10px;
    object-fit: cover;
}

.project-dashboard-main-box .project-main-title h3 {
    font-size: 19px;
    font-weight: 600;
    color: #000;
}

.project-dashboard-main-box {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 6px;
}

.project-main-desc {
    padding-top: 10px;
}

.project-main-desc p {
    font-size: 14px;
    line-height: 25px;
    margin-bottom: 10px;
}

.project-main-desc span {
    background: antiquewhite;
    color: #d7442b;
    padding: 8px 19px;
    font-weight: 600;
    border-radius: 40px;
    font-size: 14px;
}

.df-flex-col-bet {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
}

.project-step {
    padding: 15px;
    background-color: #fff;
    border-radius: 10px;
}

.project-step ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.project-step ul li {
    margin: 7px 0;
}

.project-step ul li a {
    padding: 10px 15px;
    display: flex;
    width: 100%;
    background-color: #eff4db;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #BDD460;
    border-radius: 40px;
    color: #000;
    font-size: 17px;
    font-weight: 600;
}

.project-step ul li a span {
    width: 40px;
    height: 40px;
    background-color: #d8dec0;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;

}

.project-step ul li a.active {
    background-color: #8aa034;
    color: #fff;
}

.project-step ul li a.active span {
    background-color: #fff;
    color: #BDD460;
}

.project-create-step {
    /* padding: 15px; */
    background-color: #fff;
    margin: 20px 0 40px 0;
    /* border: 1px solid #ccc; */
    border-radius: 8px;


}

.project-create-step ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;

}

.project-create-step ul li a {
    color: #909090;
    font-weight: 600;
    font-size: 16px;

}

.project-create-step ul li a span {
    width: 180px;
    height: 5px;
    background-color: #c7c7c7;
    display: flex;
    border-radius: 10px;
    margin-bottom: 10px;
}

.project-create-step ul li a.active span {
    background-color: #113b85;
}

.project-create-step ul li a.active {
    color: #000;
}

.project-create-container {

    padding: 20px;
    background-color: #ffffffdb;
    border-radius: 10px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.o-f-p {
    margin: 0;
    font-weight: 600;
    font-size: 16px;
    color: #000;
    margin-bottom: 5px;
}

.project-create-btns {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 19px;
}

.project-create-btns a {
    padding: 6px 20px;
    background-color: #113b85;
    border: 1px solid #113b85;
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    border-radius: 4px;
    text-decoration: none;
    align-items: center;
    display: flex;
    justify-content: center;
    transition: 0.5s;
    border-radius: 40px;

}

.project-create-btns a:hover {
    background-color: #023970;
    color: #fff;
    border-radius: 40px;
}

.project-create-btns a:first-child {
    background-color: transparent;
    color: #b23939;
    border-color: #b23939;
}

.project-create-btns a:first-child:hover {
    background-color: #b23939;
    color: #fff;
}


.project-preview-table tr th {
    padding: 15px;
}

.project-preview-table tr th .project-prev-td {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    color: #5f5f5f;
}

.project-preview-table tr td {
    font-size: 15px;
    line-height: 28px;
    font-weight: 600;
    padding: 15px;
}

.project-success {
    border-radius: 15px;
    background-color: #fff;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.project-success img {
    width: 200px;
}

.project-success h3 {
    margin: 20px 0;
    font-size: 25px;
    color: #000;
    font-weight: 600;
}

.project-success a {
    width: 100px;
    background-color: #b23939;
    color: #fff;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px;
    text-decoration: none;
    transition: 0.5s;
}

.project-success a:hover {
    border-radius: 40px;
}

.mt_70 {
    margin-top: 70px !important;
}

.project-updates-top h3 {
    font-size: 22px;
    font-weight: 600;
    color: #000;
}

.project-updates-top p {
    font-size: 15px;

}

.project-sidebar {
    /* background-color: #fff; */
    padding: 5px;
    /* border: 1px solid #ccc; */
    border-radius: 5px;
    /* position: sticky;
    top: 100px; */
}

.project-sidebar ul {
    padding: 15px;
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    background: rgb(80 78 78 / 14%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(7px);
    border-radius: 10px;
}

.project-sidebar ul li a {
    padding: 5px 23px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    background-color: #ffffff3d !important;
    /* border-bottom: 1px solid #2222222b; */
    border: 1px solid #ffffff3d !important;
    font-weight: 500;
    border-radius: 5px;
}

.project-sidebar ul li a.active {
    background-color: #fff !important;
    color: #222 !important;
    border-radius: 40px;
}

.project-sidebar ul li a:hover {
    border-radius: 40px;
}

.project-sidebar ul li a.a-disable {
    background-color: #d2d2d2;
    color: #000;
}

.project-sidebar ul li a.bg-nav-top-1 {
    background-color: #ffc107;
    border-color: #ffc107;
}

.project-sidebar ul li a.bg-nav-top-2 {
    background-color: #b528da;
    border-color: #b528da;
}

.project-sidebar ul li a.bg-nav-top-3 {
    background-color: #2fb4c8;
    border-color: #2fb4c8;
}

.project-sidebar ul li a.bg-nav-top-4 {
    background-color: #e045c0;
    border-color: #e045c0;
}

.project-sidebar ul li a.bg-nav-top-5 {
    background-color: #fd7f0d;
    border-color: #fd7f0d;
}

.project-list-container-main h3 {
    font-size: 22px;
    font-weight: 600;
    color: #000;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.project-list-container-main-member {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
}

.project-list-container-main-member-img {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.project-list-container-main-member-img img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50%;
}

.project-list-container-main-member p {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
}

.project-list-container-main-member p span {
    padding: 3px 10px;
    border-radius: 5px;
    background: #025187;
    font-weight: 500;
    color: #ffff;
    font-size: 11px;
    margin-left: 10px;
}

.project-list-container-main-member-img p {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #333333;
}

.project-list-container-main-desc h5 {
    color: #025187;
    font-size: 15px;
    font-weight: 600;
}

.project-list-container-main-desc p {
    margin-bottom: 4px;
    font-size: 14px;
    color: #000;
}

h4.info-text-proect-view {
    font-size: 19px;
    font-weight: 600;
    color: #000;
}

h4.info-text-proect-view i {
    font-size: 15px;
    color: #025187;
}

.project-main-over-view {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 15px;
}

.project-over-main-img {
    width: 100%;
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.project-over-main-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 15px;
}

.project-over-main-dt h2 {
    font-weight: 600;
    color: #000;
    font-size: 25px;
}

.project-over-main-dt h3 {
    font-weight: 600;
    color: #454545;
    font-size: 16px;
}

.project-over-main-dt h3.date-h3 i {
    font-size: 15px;
    margin-right: 5px;
}

.project-over-main-dt h3.date-h3 span {
    color: red;
}

.project-over-main-dt p {
    font-size: 15px;
}

.project-over-main-dt p strong {
    color: #4b4b4b;
}

.project-over-view-tasks {
    /* background-color: #f2f2f2; */
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 10px;
}

.project-over-view-tasks-mem-img {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.project-over-view-tasks-mem-img img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 50%;
    border: 4px solid #fff;
}

.project-over-view-tasks-dt h3 {
    font-size: 19px;
    font-weight: 600;
    color: #000;
}

.project-over-view-tasks-dt ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;

}

.project-over-view-tasks-dt ul li {
    width: 49%;
    margin-bottom: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    color: #000;
}

.project-over-view-tasks-dt ul li a {
    color: #000;
}

.project-over-view-tasks-dt ul li span {
    color: red;
    margin-left: 10px;
}


.task-progress {
    width: 49%;
    margin: unset;
    height: 9px;
    background: #fff;
    border: 1px solid #ccc;
    margin-right: 5px;
}

.project-task-top {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

.project-task-top select {
    width: 200px;
    height: 40px;
    border-radius: 4px;
    font-size: 15px;
    font-weight: 600;
}

.project-task-top .project-team-main-container {
    padding: 0;
    border: 0;
}

.project-task-main-box {
    background-color: #fff;
    padding: 20px;
    /* border: 1px solid #ccc; */
    border-radius: 10px;
    margin: 10px 0;
}

.project-task-badge-add {
    background-color: #efefef;
    /* border: 1px solid #ccc; */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    border-radius: 5px;
}

.project-task-badge-add p {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #000;
}

.project-task-badge-add a {
    width: 35px;
    height: 35px;
    background-color: #025187;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}

.project-task-badge-add a:hover {
    background-color: #b23939;
}

.project-task-main-container {
    background-color: #eeeeee;
    padding: 20px;
    /* border: 1px solid #ccc; */
    border-radius: 15px;
}

.project-task-main-container h6 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 17px;
    font-weight: 600;
    color: #000;
}

.project-task-main-container h6 a {
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #6e6e6e;
    color: #000;
    border-radius: 50%;
    rotate: -40deg;
    font-size: 14px;
}

.project-task-main-container h6 a:hover {
    background-color: #025187;
    color: #fff;
}

.project-task-main-container-dt h3 {
    font-size: 20px;
    font-weight: 700;
    color: #000;
}

.project-task-main-container-dt p {
    font-size: 14px;
    color: #222;
    line-height: 25px;
}

.project-task-main-container-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.project-task-main-container-bottom .project-team-main-container {
    padding: 0;
    background-color: transparent;
    border: 0;
}

.project-task-main-container-bottom small {
    font-size: 13.5px;
}

.project-task-main-container.bg_success {
    background-color: #a1dca261;
}

.project-task-main-container.bg_wrn {
    background-color: #efcf6d59;
}

.task-status {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 40px;
}

.task-status ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.task-status label {
    font-weight: 600;
    font-size: 15px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.task-status label i {
    width: 25px;
}

.task-status label span {
    padding: 5px 18px;
    background-color: #26a660;
    color: #fff;
    border-radius: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 10px;
}

.modal-btn-footer {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.modal-btn-footer .btn-common {
    width: 120px;
    border-radius: 10px;
}

.modal-btn-footer .btn-common:hover {
    border-radius: 40px;
}

.modal-btn-footer a.btn-cancel {
    padding: 7px 15px;
    font-size: 14px;
    font-weight: 600;
    height: 37px;
    background-color: transparent;
    color: #b23939;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    width: 120px;
    transition: 0.5s;
    border-radius: 10px;
    border: 1px solid #b23939;
}

.modal-btn-footer a.btn-cancel:hover {
    background-color: #b23939;
    color: #fff;
    border-radius: 40px;
}

.modal-title-cs {
    font-size: 16px;
    font-weight: 600;
    color: #000;
}

.create-members-preview ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.create-members-preview ul li a {
    padding: 4px 6px;
    background-color: #f7f7f7;
    border-radius: 40px;
    color: #000;
    border: 1px solid #ccc;
}

.create-members-preview ul li a i {
    margin-right: 5px;
    color: #2c6c74;

}

.project-doc-main-container {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 10px;
    margin: 10px 0;
}

.project-doc-container {
    background-color: #eeeeee;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #adadad;
}

.project-doc-container h3 {
    font-size: 17px;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    border-bottom: 1px solid #ccc;
    color: #000;
}

.project-doc-container h3 a {
    color: #000;
}

.project-doc-box {
    width: 100%;
    height: 150px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.project-doc-box i {
    font-size: 35px;
    color: #737373;
}

.pop_add_user_profile img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 10px;
}

.pop_add_user_profile {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.pop_add_user_profile input {
    display: none;
}

.pop_add_user_profile label {
    width: 140px;
    height: 40px;
    background-color: #025187;
    color: #fff;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.pop_add_user_profile a {
    width: 140px;
    height: 40px;
    background-color: #eeeeee;
    color: #222;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 13px;
    font-weight: 600;
}

.pop_add_user_profile_top {
    padding-top: 20px;
}

.pop_add_user_profile_top p {
    margin: 0;
    margin-top: 7px;
    font-size: 13px;
    font-weight: 600;
}

.project-calendar-main {
    background-color: #fff;
    margin: 0;
    padding-right: 0;
}

.project-calendar-filter h3 {
    font-size: 22px;
    font-weight: 600;
    color: #000;
    margin-bottom: 20px;
}

.project-calendar-filter ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.project-calendar-filter ul li {
    margin: 10px 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.project-calendar-filter ul li input {
    width: 18px;
    height: 18px;
}

.project-calendar-filter ul li label {
    font-weight: 600;
    color: #444444;
}

.project-calendar-top-left {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 10px 0;
    gap: 10px;
}

.project-calendar-top-left button {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #025187;
    background-color: #f7f7f7;
    color: #025187;
    transition: 0.5s;
}

.project-calendar-top-left button:hover {
    background-color: #025187;
    color: #fff;
}

.project-calendar-top-left p {
    margin: 0;
    font-weight: 600;
    font-size: 17px;
}

.project-calendar-top-right {
    padding-top: 15px;
}

.project-calendar-top-right ul {

    display: flex;
    justify-content: flex-end;
    align-items: center;
    list-style: none;

}

.project-calendar-top-right ul li a {
    padding: 7px 20px;
    background-color: #f7f7f7;
    color: #000;
    border-right: 1px solid #ccc;
}

.project-calendar-top-right ul li:last-child a {
    border-right: 0;
}

.project-calendar-top-right ul li:first-child a {
    background-color: #025187;
    color: #fff;
}

.project-calendar-top-right ul li a:hover {
    background-color: #025187;
    color: #fff;
}

.border-bottom-cs {
    border-bottom: 1px solid #ccc;
}

.calender-table thead tr th {
    text-align: center;
    padding: 15px 5px;
    font-weight: 600;
    color: #3a3a3a;
    border: 1px solid #ccc;
    width: 200px;
}

.calender-table tbody tr td {
    border: 1px solid #ccc;
    min-width: 100px;
}

.calender-table tbody tr td .td-calendar-box {
    max-width: 200px;
    height: 100px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.calender-table tbody tr td .td-calendar-box p {
    font-size: 16px;
    margin-bottom: 3px;
    font-weight: 600;
    color: #000;
}

.calender-table tbody tr td .td-calendar-box p.disable-p {
    color: #7c7c7c;
}

.calender-table tbody tr td .td-calendar-box ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.calender-table tbody tr td .td-calendar-box ul li {
    margin-bottom: 5px;
}

.calender-table tbody tr td .td-calendar-box ul li a {
    font-size: 12px;
    font-weight: 600;
    background-color: #f7f7f7;
    color: #000;
    padding: 4px 7px;
    border-radius: 5px;
    white-space: nowrap;

}

.calender-table tbody tr td .td-calendar-box ul li a.pink-a {
    background-color: #f39ace61;
    color: #ce0a7c;
}

.calender-table tbody tr td .td-calendar-box ul li a.green-a {
    background-color: #a9f39a61;
    color: #31c014d1;
}

.calender-table tbody tr td .td-calendar-box ul li a.orange-a {
    background-color: #f3d89a61;
    color: #d99c0de9;
}

.calender-table tbody tr td .td-calendar-box ul li a.blue-a {
    background-color: #9adbf361;
    color: #1c96c2;
}

.calender-table {
    overflow-x: auto;
}

.calender-table::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

/* Track */
.calender-table::-webkit-scrollbar-track {
    background-color: #f7f7f7;
    border-radius: 10px;
}

/* Handle */
.calender-table::-webkit-scrollbar-thumb {
    background: #025187;
    border-radius: 10px;
}

.project-activiy-main-container {
    background-color: #fff;
    padding: 10px;
}

.project-activiy-top ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    /* gap: 5px; */
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    margin-bottom: 20px;
}

.project-activiy-top ul li a {
    padding: 7px 11px;
    text-decoration: none;
    font-size: 14px;
    /* border: 1px solid #025187; */
    color: #222;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    /* border-radius: 5px; */
    transition: 0.5s;
    width: 150px;
    text-transform: uppercase;
    height: 50px;

}

.project-activiy-top ul li a:hover,
.project-activiy-top ul li a.active {
    background-color: #025187;
    color: #fff;
}

.project-activiy-top-left {
    padding-top: 15px;
}

.project-activiy-top-left p {
    margin: 0;
    font-weight: 600;
    font-size: 17px;
}


.project-activiy-top-right ul {

    display: flex;
    justify-content: flex-end;
    align-items: center;
    list-style: none;

}

.project-activiy-top-right ul li a {
    padding: 10px 20px;
    /* background-color: #f7f7f7; */
    color: #000;
    border: 1px solid #ccc;
}

.project-activiy-top-right ul li:last-child a {
    border-right: 0;
}

.project-activiy-top-right ul li:first-child a {
    background-color: #025187;
    color: #fff;
}

.project-activiy-top-right ul li a:hover {
    background-color: #025187;
    color: #fff;
}

.td-project-name {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.td-project-name span {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: #cce85b;
}

.td-project-name span.round-gray {
    background-color: #ccc;
}

.color-green {
    color: #16a816;
}

.f-size {
    font-size: 18px;
}

.sidebar-radio input {
    border: 1px solid #696969;
}

.sidebar-radio .form-check {
    margin: 10px 0;
}

.sidebar-radio .form-check label {
    font-weight: 600;
    font-size: 15px;
    color: #000;
}

.project-access-main {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.project-access-top h3 {
    font-weight: 600;
    color: #000;
    margin-bottom: 5px;
}

.project-access-top p {
    font-size: 15px;
    font-weight: 500;
}

.project-access-top-search {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5px;
    padding-right: 15px;
}

.project-access-top-search input {
    border: 0;
    font-size: 14px;
    font-weight: 500;
}

.access-admin span {
    font-size: 11px;
    font-weight: 600;
    padding: 5px;
    background-color: #a9f39a61;
    color: #31c014d1;

    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    margin: auto;
    margin-top: 5px;
}

td.access-tb-field {
    max-width: 100px;
}

.access-tb-field input,
.access-tb-field select {
    height: 40px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 2px;
}

.proeject-view-bottom-cs {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    column-gap: 20px;

}

.btn-view-cs {
    width: 120px;
    margin-top: 20px;
}

.btn-more {
    font-weight: 600;
    color: #288dd1;
    text-decoration: underline;
}

.project-create-field {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 30px;
}

.project-create-field label {
    white-space: nowrap;
    font-weight: 500;
}

.project-create-field input,
.project-create-field textarea {
    width: 75%;
}

.w-80 {
    width: 76%;
    margin: 0;
}

.w-100-inp input {
    width: 100%;
}

.w-75 {
    width: 75%;
}

.btn-vw-project {
    background-color: transparent;
    border: 1px solid #222;
    color: #222;
}

.btn-vw-project:hover {
    background-color: #113b85;
    border-color: #113b85;
}

.project-view-date {
    padding: 10px 15px;
    border: 1px solid #ccc;
    border-radius: 10px;
    width: fit-content;
    margin-top: 23px;
}

.project-view-date p {
    margin: 0;
    color: #000;
    font-size: 15px;
}

.project-view-date .col-3 {
    width: 120px;
}

.project-view-date small {
    font-weight: 600;
    margin-bottom: 10px;
}

.project-view-date .icon-flex {
    display: flex;
    justify-content: center;
    align-items: center;
}

.task-modal-head small {
    font-weight: 600;
    color: #a7a7a7;
}

.task-create-field {
    display: flex;
    justify-content: flex-start;
    align-items: center;

}

.task-create-field label {
    white-space: nowrap;
    width: 190px;
    font-weight: 600;
    color: #444444;
}

.task-create-field label i {
    width: 25px;
}

.task-create-field input {
    width: 40%;
}

.task-create-attach {
    margin: 0;
    padding: 0;
    list-style: none;
}

.task-create-attach li {
    margin: 10px 0;
}

.task-create-attach li a {
    font-size: 14px;
    font-weight: 600;
    color: #444444;
}

.task-create-attach li a i {
    width: 25px;
}

.border-top-cs {
    border-top: 1px solid #ccc;
}

.h-border {
    height: 55px;
    border-bottom: 1px solid #ccc;
    margin-left: -10px;
    margin-right: -12px;
}

.shadow-table tr th {
    background-color: transparent;
    color: #222;
    border: 0;
}

/* .shadow-table tbody tr{
   border-bottom: 1px solid #ccc;
} */

.shadow-table tbody tr {
    border: 0;
    box-shadow: 0px 15px 10px -15px #111;
    box-shadow: 5px -15px 10px -17px #111;

}

/* .shadow-table tr td:first-child{
    box-shadow: -15px 0px 10px -15px #111; 
}
.shadow-table tr td:last-child{
    box-shadow: 15px 0px 10px -15px #111;  
} */
.btn-loadMore {
    margin: auto;
    display: flex;
    width: 130px;
    border-radius: 5px;
    margin-top: 20px;
}

.bg-th tr th {
    background-color: #025187;
    color: #fff;
}




/* Department */

.w-110 {
    width: 110px;
}

.pt_30 {
    padding-top: 30px;
}

.department-tab-btns {
    background-color: #fff;
    padding: 10px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border-radius: 5px;
    margin-top: 5px;
}

.department-tab-btns ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.department-tab-btns ul li a {
    padding: 7px 15px;
    color: #414040;
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    width: 120px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
}

.department-tab-btns ul li a:hover,
.department-tab-btns ul li a.active {
    background-color: #72871d;
    color: #fff;
}

.department-middle-box {
    background-color: #fff;
    padding: 15px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border-radius: 5px;
    margin-top: 10px;
}

.department-middle-box select {
    height: 45px;
    background-color: #f2f2f2;
    border: 1px solid #ccc;
    font-size: 15px;
    font-weight: 600;

}

.department_call_box {
    padding: 14px;
    border: 1px solid #6a6a6a;
    border-radius: 10px;
    margin: 12px 0;
}

.department_call_top {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.department_call_top img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 50%;
}

.department_call_top-title p {
    margin: 0;
    font-weight: 600;
    color: #000;
    font-size: 18px;
}

.department_call_top-title p span {
    font-size: 13px;
    color: #878686;
}

.department_call_top-title p span i {
    margin: 0 10px;
}

.department_bottom_desc {
    padding-top: 15px;
}

.department_bottom_desc p {
    font-size: 15px;
    line-height: 25px;
    color: #000;
}

.department_bottom_desc a {
    width: 150px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #222;
    color: #222;
    border-radius: 5px;
    font-size: 15px;
    font-weight: 600;
    transition: 0.5s;
}

.department_bottom_desc a i {
    margin-right: 10px;
}

.department_bottom_desc a:hover {
    background-color: #72871d;
    color: #fff;
    border-color: #72871d;
}

.department_call_right {
    flex-direction: column;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    height: 100%;
}

.department_call_date {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.department_call_date p {
    font-weight: 600;
}

.department_call_right a {
    color: #000;
    text-decoration: underline;
    font-weight: 600;
    font-size: 15px;
}

.department_call_right a:hover {
    color: #025187;
}

.form-title {
    font-size: 24px;
    font-weight: 600;
    color: #000;
}

.department-project-form {
    background-color: #f2f2f2;
    margin: 10px 0;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #ccc;
}

.department-project-form input {
    background-color: #fff;
}

.department-project-form input:focus {
    background-color: #fff;
}

.department_note_box {
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 10px;
    margin: 10px 0;
}

.department_note_box p {
    margin: 0;
    font-size: 15px;
    line-height: 25px;
}

.department_logo img {
    width: 200px;
}

.department_form_top_sale {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

.department_form_top_sale label {
    white-space: nowrap;
    font-weight: 600;
    color: #000;
}

.department_form_top_sale input {
    background-color: #cfcfcf;
    font-size: 15px;
    font-weight: 600;
    color: #000;
}

.department_form_top_sale input:focus {
    background-color: #cfcfcf;
}

.department_form_right {
    background-color: #fff;
    padding: 15px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border-radius: 5px;
    margin-top: 10px;
}

.department_form_right ul {
    list-style: none;
    padding: 0;
    margin: 0;

}

.department_form_right ul li {
    margin: 10px 0;
}

.department_form_right ul li a {
    width: 100%;
    padding: 7px 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #dfdfdf;
    font-weight: 600;
    color: #000;
    transition: 0.5s;
    border-radius: 5px;
    font-size: 15px;
}

.department_form_right ul li a:hover {
    background-color: #6b7e23;
    color: #fff;
}

.form_department input {
    height: 40px;
}



.check-with-label:checked+.label-for-check {
    border: 1px solid #025187;
    color: #025187;
    background-color: #fff;
}

.department_doc_select .label-for-check {
    width: 100%;
    height: 90px;
    border: 1px solid #ccc;
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 60px;
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    text-align: left;
    padding-right: 20px;
    background-color: #fff;

}

.department_doc_select {
    position: relative;
    margin: 10px 0;
}

.department_doc_select input {
    position: absolute;
    top: 33px;
    left: 25px;
    width: 25px;
    height: 25px;
    border-radius: 50% !important;
}

.department_doc_select .check-label-1 {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.department_doc_select .check-label-2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.department_doc_select .check-label-1 p {
    font-size: 13px;
    font-weight: 300;
    line-height: 20px;
    text-align: left;
    color: #54687B;
    margin: 0;
    margin-top: 10px;
}

.department_doc_select input[type="radio"] {
    /* remove standard background appearance */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /* create custom radiobutton appearance */
    display: inline-block;
    width: 23px;
    height: 23px;
    padding: 3px;
    /* background-color only for content */
    background-clip: content-box;
    border: 1px solid #025187;
    background-color: #fff;
    border-radius: 50%;
}

/* appearance for checked radiobutton */
.department_doc_select input[type="radio"]:checked {
    background-color: #025187;
}

.department_file_name p {
    font-weight: 600;
    color: #000;
    font-size: 19px;
    margin: 0;
    margin-bottom: 5px;
}

.check-with-label:checked+.label-for-check .department_file_name p {
    color: #72871d;
}

.department_file_name small {
    color: #000;
    text-decoration: underline;
}

.dpt_file_selected,
.dpt_file_select {
    font-size: 17px;
    font-weight: 600;
}

.dpt_file_selected {
    color: #6b7e23;
}

.dpt_file_selected {
    display: none;
}

.check-with-label:checked+.label-for-check .dpt_file_selected {
    display: block;
}

.check-with-label:checked+.label-for-check .dpt_file_select {
    display: none;
}

.department_doc_table {
    background-color: #fff;
    padding: 15px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border-radius: 5px;
    margin-top: 10px;
}

.department_doc_table ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.department_doc_table ul li a {
    width: 120px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 5px;
    color: #323232;
    font-size: 14px;
    font-weight: 600;
}

.department_doc_table ul li a.active {
    border: 1px solid #323232;
}

.department_doc_table ul li a:hover {
    background-color: #dbdbdb;
}

.department_doc_table_search {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    border: 1px solid #222;
    border-radius: 5px;
    padding: 0 10px;
    gap: 5px;
}

.department_doc_table_search input {
    border: 0;
    font-size: 14px;
    font-weight: 600;
    height: 37px;
}

.department_doc_table table tr th {
    background-color: #FFDEC4;
    /* text-align: center; */
    font-size: 17px;
    padding: 10px 6px;
}

.department_doc_table table tr td {
    padding: 13px 5px;
    vertical-align: middle;
}

.dept_file_table tr td input {
    width: 22px;
    height: 22px;
}

.dept-td-file-box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}

.dept-td-file-box i {
    width: 30px;
    height: 30px;
    background-color: #cfcfcf;
    color: #767676;
    display: flex;
    justify-content: center;
    align-items: center;
}

.dept-td-file-box p {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #444444;
}

.dept_file_table .td-icon-text {
    font-size: 15px;
}

.dept_file_table .td-icon-text i {
    font-size: 14px;
    margin-right: 5px;
}

.dept_file_table tr td a {
    color: #000;
}

.meet-contract-name {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.meet-contract-name p {
    font-size: 15px;
    font-weight: 600;
    margin: 0;
}

.meet-contract-name img {
    width: 40px;
}

.dept_meet-field-box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 75%;
    gap: 10px;
}

.dept_meet-field-box input {
    width: 250px;
}

.dept_meet-field-box ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dept_meet-field-box ul li {
    white-space: nowrap;
    background-color: #dcdcdc;
    padding: 5px 15px;
    border-radius: 40px;
    font-weight: 600;
    color: #000;
}

.dept_meet-field-box ul li a {
    color: #000;
    margin-left: 10px;
}

.dept_meet_attendees ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.dept_meet_attendees ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    border-bottom: 1px solid #a3a1a1;
    margin: 10px 0;
}

.dept_meet_attendees_left {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.dept_meet_attendees_left span {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #6b7e23;
    color: #fff;
    border-radius: 50%;
}

.dept_meet_attendees_left_member h3 {
    font-size: 20px;
    font-weight: 600;
    color: #000;
    margin-bottom: 0;
}

.dept_meet_attendees_left_member small {
    font-weight: 600;
}

.dept_meet_attendees ul li a {
    font-size: 15px;
    font-weight: 600;
    color: #696969;
}

.w-fit {
    width: fit-content !important;
}

.section-title span {
    font-size: 14px;
}

.section-title {
    font-size: 23px;
    /* background-color: #799700; */
    color: #fff;
    /* padding: 14px; */
    border-radius: 6px;
    font-weight: 600;
    margin-bottom: 15px;
}

.margin-top-70 {
    margin-top: 70px !important;
}

.shadow-box {
    background-color: #ffffffc9;
    padding: 20px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    /* box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px; */
    background: rgb(255 255 255 / 73%);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.o-f-check {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}

.o-f-check input {
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

.o-f-check label {
    font-weight: 600;
}

.shadow-box .box-title {
    font-weight: 600;
    font-size: 19px;
    line-height: 30px;
    color: #ea8436;
}

.save-btn {
    width: 110px;
    height: 37px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0;
    background-color: #e04d4d;
    color: #fff;
    border-radius: 5px;
    transition: 0.5s;
    font-size: 15px;
    font-weight: 500;
    margin: auto;
}

.save-btn:hover {
    border-radius: 40px;
}


.user-view-left {
    padding: 15px;
    background-color: #fff;
    border-radius: 10px;
}

.user-basic-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.user-basic-info img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
}

.user-basic-info {
    background-color: #ebf7bc;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #BDD460;
}

.user-basic-info h3 {
    font-size: 25px;
    font-weight: 600;
    color: #000;
    margin: 0;
}

.user-basic-info p {
    margin: 0;
    font-size: 13px;
}

.user-view-left ul {
    margin: 0;
    margin-top: 10px;
    padding: 0;
    list-style: none;
}

.user-view-left ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 7px 0;
    font-size: 14px;
    font-weight: 600;
    color: #000;
    border-bottom: 1px solid #ccc;
}

.user-view-left ul li:last-child {
    border-bottom: 0 !important;
}

.user-view-left ul li span.badge {
    background-color: #16a816;
}

.user-view-left ul li a.user-edit-btn {
    padding: 5px 20px;
    border-radius: 40px;
    background-color: #e52d2d;
    color: #fff;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 500;
}

.user-view-left ul li a.user-edit-btn:hover {
    background-color: #b23939;
}

.user-view-container {
    padding: 15px;
    background-color: #fff;
    border-radius: 10px;
}

.user-view-box {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    padding: 15px;
    border-radius: 10px;
}

.user-view-box h3 {
    font-weight: 600;
    font-size: 16px;
    line-height: 30px;
    color: #ea8436;
}

.user-view-box ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}

.user-view-box ul li {
    width: 33%;
    margin: 10px 0;
    font-size: 15px;
    font-weight: 600;
    color: #000;
}

.user-view-box ul li span {
    font-weight: 400;
    margin-left: 10px;
    color: #5f5f5f;
}

.user-view-box ul li span.Yellow-badge {
    background-color: #da9f21;
    color: #fff;
    padding: 0px 10px;
    border-radius: 40px;
}

.user-view-address ul li {
    width: 49%;
    background-color: #fff;
    padding: 10px;
    border: 1px solid #eeeeee;
    border-radius: 5px;
    margin: 4px 0;
}

.user-view-address ul li span {
    color: red;
}

.user-view-address ul {
    justify-content: space-between;
}

.user-view-address ul li .adrress-user strong {
    font-weight: 600;
}

.user-view-address ul li .adrress-user p {
    font-size: 14px;
    font-weight: 400;
    margin: 0;
    margin-top: 10px;
}


.modal-btn-box {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-top: 20px;
}

.modal-btn-box a {
    width: 100px;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    font-size: 15px;
}

.bg-default {
    background-color: #089748 !important;
}

.bg-epn-red {
    background-color: #dd4b39 !important;
}

.modal-btn-box a:hover {
    border-radius: 40px;
}

.modal-not h3 {
    text-align: center;
    font-size: 17px;
    margin-top: 30px;
    font-weight: 500;
    line-height: 30px;

}

.permissions-box ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}

.permissions-box ul li {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 6px;
    margin: 12px 0;
    width: 33%;
}

.permissions-box ul li label {

    color: #000;
    font-size: 14px;
}

.permissions-box ul li input {
    width: 16px;
    height: 16px;
}

.input-tb-field input,
.input-tb-field select {
    font-size: 14px;
    font-weight: 500;
    height: 37px;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.nowrap-table tr th {
    white-space: nowrap;
}

.salary-bottom {
    background-color: #f7f7f7;
    padding: 15px;
    margin: 10px 0;
    border: 1px solid #ccc;
    border-radius: 15px;
}

.salary-bottom input,
.salary-bottom textarea {
    background-color: #fff;
}

.salary-bottom input:focus,
.salary-bottom textarea:focus {
    background-color: #fff;
}

.salary-print-section {
    background-color: #f2f2f2;
    padding: 50px;
    min-height: 100vh;
}

.salary-print-widget {
    background-color: #fff;
    /* padding: 12px; */
    border-radius: 10px;
    /* border: 1px solid #ccc; */
}

.salary-print-widget h3 {
    font-size: 19px;
    margin: 0;
    font-weight: 600;
}

.salary-print-widget h3 span {
    color: #b23939;
}

.salary-print-table {
    background-color: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;

}

.form-check-cs p {
    font-weight: 600;
    font-size: 15px;
    margin: 0;
    color: #ad1919;
}

.form-check-cs .form-check {
    margin: 15px 0;
}

.form-check-cs .form-check input {
    width: 18px;
    height: 18px;
    border: 1px solid #222;
}

.form-check-cs .form-check label {
    font-size: 15px;
    font-weight: 600;
    color: #000;
}

.Attendance-tab-btns {
    box-shadow: none;
    padding: 0;
    margin-bottom: 15px;
}

.Attendance-tab-btns ul li a {
    width: fit-content;
    background-color: #e8e8e8;
}

.Attendance-top-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.Attendance-top-title a {
    padding: 7px 15px;
    background-color: #b23939;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    border-radius: 5px;
    transition: 0.5s;
}

.Attendance-top-title a i {
    margin-right: 5px;
}

.Attendance-top-title a:hover {
    border-radius: 40px;
}

.mbsc-scroller-wheel-item div {
    display: none;
}

.input-tb-label-check {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    padding-left: 20px;
}

.input-tb-label-check input {
    width: 18px;
    height: 18px;
}

.input-tb-label-check label {
    font-size: 16px;
    font-weight: 600;
    color: #000;

}

.Attendance-add-table tr th {
    white-space: nowrap;
    min-width: 180px;
}

.file-cs-cstm input {
    border-color: #8e8e8e;
}

.file-cs-cstm input::file-selector-button {
    background-color: #BDD460 !important;
}

.filter-cs-20 h3 {
    font-size: 17px;
    font-weight: 600;
    color: #ea8436;
}

.filter-cs-20 .col-lg-20 {
    width: 20%;
}

.hrm-dashboard-widget {
    background-color: #fff;
    padding: 15px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    height: 100%;
}

.hrm-dashboard-widget h3 {
    font-weight: 600;
    font-size: 19px;
    line-height: 30px;
    color: #ea8436;
}

.hrm-dashboard-widget-inner p {
    font-size: 14px;
    font-weight: 500;
    margin: 0;
}

.hrm-dashboard-widget-inner .widget-inner-hrm {
    background-color: #ebf5c447;
    border: 1px solid #c2da634d;
    border-radius: 5px;
    padding: 10px;
    height: 100%;
}

.hrm-dashboard-widget-inner .widget-inner-hrm h6 {
    font-weight: 600;
    color: #000;
    margin: 0;
    line-height: 20px;
    font-size: 14px;
}

.hrm-dashboard-widget-inner .widget-inner-hrm h5 {
    font-size: 20px;
    font-weight: 600;
    margin: 0;
    margin-top: 10px;
    color: #b23939;

}

.hrm-dashboard-widget-inner tr th {
    font-size: 14px;
    font-weight: 600;
    padding: 10px 10px;
    background-color: #f2f2f2;
    text-align: center;
}

.hrm-dashboard-widget-inner table {
    margin: 10px 0;
}

.hrm-dashboard-widget-inner tr td {
    font-size: 14px;
    text-align: center;
}

.hrm-dash-left-table tr th,
.hrm-dash-left-table tr td {
    text-align: left !important;
}

.hrm-dashboard-widget h3 {
    display: flex;
    align-items: center;
}

.hrm-dashboard-widget h3 span {
    min-width: 33px;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #afa21c;
    color: #fff;
    border-radius: 50%;
    font-size: 16px;
    margin-right: 5px;
}

.hrm-dashboard-widget h3 span.icon-bg-1 {
    background-color: #39B27C;
}

.hrm-dashboard-widget h3 span.icon-bg-2 {
    background-color: #1a7bb9;
}

.hrm-dashboard-widget h3 span.icon-bg-3 {
    background-color: #b52323;
}

.hrm-dashboard-widget h3 span.icon-bg-4 {
    background-color: #cb4ec9;
}

.hrm-dashboard-widget h3 span.icon-bg-5 {
    background-color: #14aa11;
}

.hrm-dashboard-widget h3 span.icon-bg-6 {
    background-color: #7a339e;
}

.hrm-settings-container {
    display: flex;
    justify-content: flex-start;
    /* align-items: center; */
}

.hrm-settings-container ul.hrm-settings-nav {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    width: 25%;
    border: 1px solid #a9a9a9;
    border-radius: 10px;
    overflow: hidden;
    height: fit-content;
}

.hrm-settings-container ul.hrm-settings-nav li {
    width: 100%;
}

.hrm-settings-container ul.hrm-settings-nav li button {
    width: 100%;
    margin: 0 !important;
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid #a9a9a9;
    height: 60px;
    font-size: 18px;
    font-weight: 500;
}

.hrm-settings-container ul.hrm-settings-nav li button:hover {
    background-color: #99ae42;
    color: #fff;
}

.hrm-settings-container ul.hrm-settings-nav li button.active {
    border: 1px solid #BDD460;
}

.hrm-settings-container ul.hrm-settings-nav li:last-child button {
    border-bottom: 0px solid #a9a9a9;
}

.hrm-settings-container .tab-content {
    width: 75%;
    padding-left: 20px;
}

.small-label small {
    font-size: 12px;
    font-weight: 500;
    color: #877e7e;
}

.status-green {
    padding: 2px 13px;
    background-color: #bbf7d6c6;
    border: 1px solid #089748;
    color: #089748;
    border-radius: 40px;
    font-size: 13px;
    font-weight: 600;
}

.status-blue {
    padding: 2px 13px;
    background-color: #8cdbf4;
    border: 1px solid #087697;
    color: #087697;
    border-radius: 40px;
    font-size: 13px;
    font-weight: 600;
}

.status-orange {
    padding: 2px 13px;
    background-color: #ffecd0;
    border: 1px solid #e49629;
    color: #e49629;
    border-radius: 40px;
    font-size: 13px;
    font-weight: 600;
}

.status-red {
    padding: 2px 13px;
    background-color: #fbdede;
    border: 1px solid #e42929;
    color: #e42929;
    border-radius: 40px;
    font-size: 13px;
    font-weight: 600;
}

.uploadFIleDocument {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 12px;
    padding: 15px;
    padding-top: 0;

    gap: 10px;
    margin-bottom: 10px;
}

.uploadFIleDocument .uploadFIleDocument-action-btn {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: #089712;
    color: #fff;
    border: 0;
    margin-top: 15px;
    margin-left: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.uploadFIleDocument .uploadFIleDocument-action-btn:hover {
    background-color: #027009;
}

.uploadFIleDocument .uploadFIleDocument-action-btn.bg-danger:hover {
    background-color: #b23939 !important;
}

.uploadFIleDocument input {
    background-color: #fff !important;
    height: 37px;
}

.uploadFIleDocument input::file-selector-button {
    height: 37px;
}

.td-check-field {
    display: flex;
    justify-content: center;
    align-items: center;
}

.td-check-field input {
    width: 18px;
    height: 18px;
}

.badge-font .badge {
    font-size: 14px;
    margin: 2px;
}

.leave-activity h3 {
    padding: 5px 13px;
    background-color: #bbf7d6c6;
    border: 1px solid #089748;
    color: #089748;
    border-radius: 40px;
    font-size: 17px;
    font-weight: 600;
    width: fit-content;
}

.leave-activity h4 {
    font-size: 16px;
    font-weight: 600;
    color: #000;
}

.leave-activity h4 span {
    color: red;
}

.leave-manage-tabs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.leave-manage-tabs ul li a {
    width: 150px;
}

.Probation-manage-tabs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.Probation-manage-tabs ul li a {
    width: fit-content;
}

.flex-input-pop {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;

}

.flex-input-pop label {
    white-space: nowrap;
    font-weight: 500;
    color: #000;
}

.flex-input-pop input,
.flex-input-pop select,
.flex-input-pop textarea {
    height: 37px;
    background-color: #ededed;
    border: 0;
    max-width: 300px;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
}

.flex-input-pop input:focus,
.flex-input-pop select:focus,
.flex-input-pop textarea:focus {
    background-color: #ededed;
}

.flex-input-pop textarea {
    height: 70px;
}

.review-note {
    background-color: #fbdede;
    border: 1px solid #e42929;
    color: #e42929;
    border-radius: 10px;
    padding: 10px 20px;
}

.review-note ul {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    gap: 30px;
}

.review-note ul li {
    font-weight: 500;
    font-size: 14px;
}

.review-pop-preview {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.review-pop-preview label {
    white-space: nowrap;
    font-weight: 500;
    color: #000;
    width: 300px;
    font-size: 16px;
}

.review-pop-preview ul {
    display: flex;
    justify-content: flex-end;
    list-style: none;
    width: 100%;
    padding: 0;
    margin: 0;
}

.review-pop-preview ul li {
    font-size: 17px;
    margin: 0 5px;
    font-weight: 500;
}

.review-pop-preview ul li i {
    color: #ef9b34;
}

.review-pop-preview p {

    width: 100%;
    font-size: 13px;
    margin: 0;

}

.review-pop-preview {
    border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
}

.check-select-colored ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 3px;
}

.check-select-colored ul li a {
    padding: 5px 15px;
    background-color: #14aa11;
    color: #fff;
    border-radius: 5px;
    font-size: 13px;
    font-weight: 600;
}

.check-select-colored ul li a.orange {
    background-color: orange;
}

.check-select-colored ul li a.red {
    background-color: red;
}

.employee-basic-info {
    background-color: #83d99673;
    border: 1px solid #7ae391;
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 10px;
}

.employee-basic-widget {
    background-color: #fff;
    padding: 5px 15px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    height: 100%;
}

.employee-basic-widget ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.employee-basic-widget ul li {
    margin: 10px 0;
    font-weight: 500;
    color: #000;
    font-size: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.employee-basic-widget ul li span.blue {
    color: #0ebe11;
}

.employee-basic-widget ul li span.red {
    color: #d30e0e;
}

.e-performance-widget {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;

}

.e-performance-widget .review-pop-preview {
    padding: 0;
    border: 0;
    width: 100%;
}

.e-performance-widget .review-pop-preview label {
    font-size: 15px;
}

.payslip-logo {
    display: flex;
    justify-content: center;
    align-items: center;

}

.payslip-logo img {
    width: 200px;
}

.payslip-logo h3 {
    font-size: 25px;
    font-weight: 600;
    color: #000;
}

.payslip-widget {
    background-color: #a9f9bb73;
    border: 1px solid #7ae391;
    padding: 5px 10px;
    border-radius: 10px;
    margin-bottom: 10px;
}

.payslip-widget ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.payslip-widget ul li {
    margin: 12px 0;
    font-weight: 600;
    color: #000;
    font-size: 15px;
}

.payslip-widget ul li span {
    font-weight: 400;
    margin-left: 10px;
}

.payslip-table-bottom ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;

}

.payslip-table-bottom ul li {
    width: 33%;
    background-color: #f2f2f2;
    padding: 10px;
    margin: 13px 0;
    border: 1px solid #ccc;
    font-weight: 600;
    color: #000;
    justify-content: space-between;
    align-items: center;
    display: flex;
    border-radius: 10px;
    font-size: 14px;
}

.pay-slip-amount {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding: 20px;
}

.pay-slip-amount h3 {
    font-weight: 600;
    font-size: 25px;
}

.pay-slip-amount h4 {
    font-size: 18px;
}

.sign-payslip {
    height: 80px;
    border-top: 1px solid #222;
    display: flex;
    justify-content: center;
    align-items: end;
    font-weight: 600;
    font-size: 15px;
    color: #000;
}

.payroll-edit-top h3 {
    font-weight: 600;
    color: #000;
    font-size: 25px;
    text-align: center;
    border-bottom: 1px solid #ccc;
    padding-bottom: 15px;
    margin-bottom: 10px;
}

.payroll-edit-box {
    background-color: #f2f2f2;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 12px;
}

.payroll-edit-box input,
.payroll-edit-box textarea,
.payroll-edit-box select {
    background-color: #fff !important;
}

.payroll-edit-box h3,
.payroll-edit-tb-box h3 {
    font-size: 22px;
    font-weight: 600;
    color: #dd6422;
}

.payroll-edit-table tr td {
    max-width: 150px;
}

.payroll-edit-tb-box p {
    font-weight: 600;
    color: #000;
    margin-top: 10px;
    font-size: 16px;
}

.payroll-edit-box p {
    font-weight: 600;
    color: #000;
    font-size: 18px;
}

.payroll-view-top-ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    color: #000;
    font-size: 17px;
    margin: 20px 0;
}

.payroll-tb-widget ul {
    padding: 0;
    margin: 0;
    list-style: none;
    padding: 0 15px;
}

.payroll-tb-widget ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    color: #000;
    margin: 12px 0;
}

.bonus_track_top ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 5px;
}

.bonus_track_top ul li {
    padding: 10px 15px;
    background-color: #ff737345;
    color: #ad1f1fd9;
    border: 1px solid #ad1f1f7a;
    width: 25%;
    border-radius: 7px;
    font-weight: 600;
    font-size: 15px;
}

.employee_salary_bonus {
    background-color: #f7f7f7;
    padding: 5px 15px;
    border-radius: 10px;
    border: 1px solid #ccc;
}

.employee_salary_bonus ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.employee_salary_bonus ul li {
    margin: 15px 0;
    font-weight: 600;
    color: #000;
    font-size: 16px;
}

.employee_salary_bonus ul li:first-child span {
    color: #16a816;
}

.employee_salary_bonus ul li span {
    color: red;
    margin-left: 10px;
}

.chart-tree-container {
    display: flex;
    /* justify-content: center; */
    align-items: center;
    flex-direction: column;
    max-width: 1000px;
    margin: auto;
}

.chart-tree-top {
    padding: 6px;
    background-color: #f2f2f2;
    border: 1px solid #ccc;
    border-radius: 40px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    min-width: 180px;
    position: relative;
}

.chart-tree-top::before {
    content: '';
    width: 0.1px;
    height: 80px;
    background-color: #b8afaf;
    position: absolute;
    left: 50%;
    top: 100%;
}

.chart-tree-top img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50%;
}

.chart-tree-info h3 {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    margin: 0;
}

.chart-tree-info p {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    color: #39B27C;
}

.chart-tree-ul {
    width: 90%;
}

.chart-tree-ul ul {
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    margin: 0;
    margin-top: 79px;
    gap: 20px;
    /* border-top: 1px solid #b8afaf; */
    padding-top: 20px;
    position: relative;
}

.chart-tree-ul ul::before {
    content: '';
    width: 80%;
    height: 1px;
    background-color: #b8afaf;
    position: absolute;
    left: 10%;
    top: 0;
}

.chart-tree-ul ul li .chart-tree-top::after {
    content: '';
    width: 1px;
    height: 20px;
    background-color: #b8afaf;
    position: absolute;
    left: 50%;
    bottom: 100%;
}

.chart-tree-ul2 {
    width: 100%;
}

.chart-tree-ul2 ul {
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    margin: 0;
    margin-top: 79px;
    gap: 100px;
    /* border-top: 1px solid #b8afaf; */
    padding-top: 20px;
    position: relative;
}

.chart-tree-ul2 ul li {
    display: flex;
    justify-content: flex-start;
    gap: 10px;
    margin-left: -80px;
    position: relative;

}

.chart-tree-ul2 ul li::before {
    content: '';
    width: 51.5%;
    height: 1px;
    background-color: #b8afaf;
    position: absolute;
    top: -20px;
    left: 24.3%;
}

.chart-tree-ul2 ul li .chart-tree-top::before {
    display: none;
}

.chart-tree-ul2 ul li .chart-tree-top::after {
    content: '';
    width: 1px;
    height: 20px;
    background-color: #b8afaf;
    position: absolute;
    left: 50%;
    bottom: 100%;
}


.btn-title-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.btn-title-top a {
    padding: 7px 15px;
    background-color: #b23939;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    border-radius: 5px;
    transition: 0.5s;
}

.btn-title-top a i {
    margin-right: 5px;
}

.btn-title-top a:hover {
    border-radius: 40px;
}

.salary-table tr td input {
    min-width: 110px;
}

.tooltip-btn {
    border: 0;
    background-color: transparent;
    color: #1c96c2;
}

.tooltip-inner {
    background-color: #1c96c2 !important;
    color: #fff !important;
}

.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before,
.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: #1c96c2 !important;
}

.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before,
.bs-tooltip-top .tooltip-arrow::before {
    border-right-color: #1c96c2 !important;
}

.view-current-performance {
    background-color: #cbf8ce;
    border-color: #027009;
    padding: 15px;
    border-radius: 15px;
    border: 1px solid #77ce7d;
}

.view-current-performance .review-pop-preview {
    padding-bottom: 0;
    border-bottom: 0;
    padding: 10px 0;
}

.currnt-performance-title {
    color: #027009;
    font-size: 18px;
    text-align: center;
}

.view-Previous-performance {
    background-color: #fff0da;
    border-color: #027009;
    padding: 15px;
    border-radius: 15px;
    border: 1px solid #faad3d;
}

.view-Previous-performance .review-pop-preview {
    padding-bottom: 0;
    border-bottom: 0;
    padding: 10px 0;
}

.Previous-performance-title {
    color: #cb7f0a;
    font-size: 18px;
    text-align: center;
}

.currnt-perfo-info {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    height: 100%;
}

.currnt-perfo-info ul {
    width: 100%;
    padding: 0 30px;
}

.currnt-perfo-info ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin: 15px 0;
    font-weight: 500;
    color: #000;
}

.currnt-perfo-info table {
    margin-top: 30px;

}

.currnt-perfo-info table tr th {
    padding: 8px 10px !important;
}

.currnt-perfo-info table tr td {
    padding: 8px 10px !important;
    font-size: 14px;
}

.view-attendance-table tr td i.fa-circle-check {
    color: #199521;
    font-size: 23px;
}

.view-attendance-table tr td {
    font-size: 16px;
}

.view-attendance-table tr td i.fa-circle-xmark {
    color: #b23939;
    font-size: 23px;
}

.salery-print-top-ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    margin-bottom: 20px;
}

.salery-print-top-ul li {
    font-size: 17px;
    font-weight: 600;
    background-color: #f7f7f7;
    width: 24%;
    padding: 10px 15px;
    border-radius: 5px;
    color: #fff;

}

.salery-print-top-ul li span {
    margin-left: 5px;
    /* color: #dc3545; */
}

.salery-print-top-ul li.bg-1 {
    background-color: #1a7bb9;
}

.salery-print-top-ul li.bg-2 {
    background-color: #b52323;
}

.salery-print-top-ul li.bg-3 {
    background-color: #cb4ec9;
}

.salery-print-top-ul li.bg-4 {
    background-color: #7a339e;
}

.performancec-tooltip-btns-ul ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

.performancec-tooltip-btns-ul ul li button {
    color: #000;
    font-weight: 600;
}

.performancec-tooltip-btns-ul ul li button i {
    color: #1a7bb9;
}

.radio-container {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
    padding-top: 10px;
}

.radio-label,
.radio-container label {
    font-weight: 500;
    color: #000;
    font-size: 14px;
}

.radio-container input {
    width: 18px !important;
    height: 18px !important;
    border: 1px solid #222 !important;
}

.tb-checkox input {
    width: 18px;
    height: 18px;
}

a.bg-blue-cs {
    background-color: #288dd1 !important;
    color: #fff !important;
    border-color: #288dd1 !important;
}

.late-entry {
    padding: 2px 13px;
    background-color: #fbdede;
    border: 1px solid #e42929;
    color: #e42929;
    border-radius: 40px;
    font-size: 13px;
    font-weight: 600;
}

.early-entry {
    padding: 2px 13px;
    background-color: #bbf7d6c6;
    border: 1px solid #089748;
    color: #089748;
    border-radius: 40px;
    font-size: 13px;
    font-weight: 600;
}

.attendance-leave-badge ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.attendance-leave-badge ul li {
    padding: 5px 10px;
    font-size: 13px;
    font-weight: 500;
    color: #fff;
    background-color: violet;
    border-radius: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;

}

.attendance-leave-badge ul li span {
    margin-left: 10px;
    background-color: #fff;
    color: #000;
    padding: 0 2px;
    border-radius: 5px;
}

.attendance-leave-badge ul li.s-leave {
    background-color: #dc891d;
}

.attendance-leave-badge ul li.p-leave {
    background-color: #0da09e;
}

.attendance-leave-badge ul li.c-leave {
    background-color: #a00d0d;
}

.performance-edit-btn {
    display: flex;
    justify-content: flex-end;
    align-items: center;

}

.performance-edit-btn a {
    background-color: #b23939;
    padding: 4px 15px;
    color: #fff;
    border-radius: 5px;
    font-size: 15px;
}

.reviewer-history {
    background-color: #fff;
    padding: 5px 15px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    height: 100%;
    margin-top: 10px;
    padding-top: 10px;
}

.reviewer-history h3 {
    font-size: 20px;
    font-weight: 600;
    color: #000;
    text-align: center;
}

.reviewer-history table {
    margin: 0;
    margin-bottom: 10px;
}

img.bonus-flag-performance {
    width: 60px;
    margin: auto;
    display: flex;
}



.searchDropDown a:hover {
    background-color: #ddd;
}

.showDrop {
    display: block;
}


.inner-tabs-cs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.inner-tabs-cs {
    box-shadow: none;
    padding: 0;
    margin-bottom: 15px;
}

.inner-tabs-cs ul li a {
    width: fit-content;
    background-color: #e8e8e8;
}

.tb-form-field input,
.tb-form-field select {
    font-size: 12px;
    border: 1px solid #222;
    border-radius: 3px;
    height: 35px;
}

.print-box-widget {
    padding: 10px;
    /* background-color: var(--bg-light-gray); */
    border: 1px solid #ccc;
    border-radius: 10px;
}

.print-box-widget h5 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    font-size: 19px;
    line-height: 30px;
    color: #ea8436;

}

.print-inner-widget {
    background-color: var(--bg-light-gray);
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 10px;
}

.print-inner-widget ul {
    padding: 0;
    margin: 0;
    list-style: none;

}

.print-inner-widget ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    font-weight: 500;
    font-size: 15px;
    color: #000;
}

.print-trio-ul ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.print-trio-ul ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    font-weight: 500;
    font-size: 15px;
    color: #000;
    background-color: var(--bg-light-gray);
    border-radius: 5px;
    width: 33%;
    border: 1px solid #ccc;
}

.print-trio-ul-bg ul li {
    background-color: #a9f9bb73;
    border: 1px solid #7ae391;
}

table tr td.td-text-danger {
    color: red !important;
}


.multiple-items-container {
    padding: 15px;
    background-color: #f2f8d8;
    border-radius: 7px;
    border: 1px solid #BDD460;
}

.multiple-items-container input,
.multiple-items-container select {
    height: 37px;
    background-color: #fff;
    border-radius: 5px;
}

.multiple-items-container input:focus,
.multiple-items-container select:focus {
    background-color: #fff;
}

.multi-add-dlt-btns {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}

.multi-add-dlt-btns button {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #25a925;
    color: #fff;
}

.multi-add-dlt-btns button.multie-dlt {
    background-color: red;
}

.bottom-container-fields {
    padding: 15px;
    background-color: #f2f8d8;
    border-radius: 7px;
    border: 1px solid #BDD460;
}

.bottom-container-fields input,
.bottom-container-fields select {
    height: 37px;
    background-color: #fff;
    border-radius: 5px;
}

.bottom-container-fields input:focus,
.bottom-container-fields select:focus,
.bottom-container-fields textarea:focus {
    background-color: #fff;
}

.bottom-container-fields textarea {
    background-color: #fff;
}

.bottom-container-fields-ul ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.bottom-container-fields-ul ul li {
    margin: 10px 0;
    background-color: #f7f7f7;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    color: #000;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.info-top-widget {
    background-color: #f7f7f7;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid #ccc;

}

.info-top-widget h5 {
    font-weight: 600;
    font-size: 19px;
    line-height: 30px;
    color: #ea8436;
}

.info-top-widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
    padding-left: 20px;

}

.info-top-widget ul li {
    margin: 15px 0;
    font-weight: 500;
    color: #000;
}

.info-top-widget ul li span {
    font-weight: 300;
    margin-left: 10px;
}

.five-col-row .col-lg-20 {
    width: 20%;
}

.top-btns-cs {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 5px;
    padding-bottom: 10px;
}

.top-btns-cs a {
    padding: 7px 15px;
    font-size: 13px;
    font-weight: 500;
    color: #fff;
    background-color: #ea8436;
    text-decoration: none;
    border-radius: 5px;
    transition: 0.5s;
}

.top-btns-cs a:hover {
    border-radius: 40px;
}

.print-title {
    font-weight: 600;
    font-size: 19px;
    line-height: 30px;
    color: #ea8436;
}

.remark-box {
    width: 100%;
    height: 100%;
    background-color: #f7f7f7;
    padding: 15px;
    border-radius: 12px;
    border: 1px solid #ccc;
}

.remark-box h3 {
    font-size: 17px;
    font-weight: 600;
    color: #000;
}

.remark-box p {
    font-size: 14px;
    margin: 0;
}

.delivery-track-title {
    text-align: center;
    font-weight: 600;
    font-size: 23px;
    line-height: 30px;
    color: #BDD460;
}

.track-container {
    padding: 30px 0;
    /* border-radius: 10px;
   
    background-color: rgba(13, 162, 56, 0.06);
    border: 1px solid rgba(13, 162, 56, 0.21); */
}

.track-container ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    /* flex-wrap: wrap; */
    gap: 13px;
}

.track-container ul li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 19%;
}

.track-container ul li .track-img {
    width: 100%;
    height: 150px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    background-color: #fff;
    border-radius: 10px;
    gap: 6px;
    padding: 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;

}

.track-container ul li .track-img p {
    font-size: 15px;
    font-weight: 600;
    margin: 0;
}

.track-container ul li.track-active .track-img {
    border: 2px dashed #bdd460;
    background-color: #bdd46069;
}

.track-container ul li .track-img img {
    width: 70px;
}

.track-container ul li .track-img img.w__80 {
    width: 80px;
}

.track-bottom {
    padding-top: 20px;
}

.track-bottom p {
    margin: 0;
    margin-top: 12px;
    font-size: 15px;

}

.project-widget-container {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 15px;
}


.invoice-short-top ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    list-style: none;
    gap: 20px
}

.invoice-short-top ul li {
    width: 49%;
    border-bottom: 1px solid #ccc;
    padding: 10px 0;
    font-weight: 600;
    color: #000;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.invoice-short-top ul li:nth-child(even) {
    justify-content: flex-end;

}

.color-green {
    color: #19c419;
}

.color-red {
    color: red;
}

.color-orange {
    color: #d8a304;
}

.project-modal-documents-content h1 {
    font-size: 21px;
    font-weight: 600;
    color: #023970;

}

.gallery-label {
    margin-bottom: 10px;
}

.gallery-label img {
    width: 100%;
    height: 80px;
    border-radius: 4px;
    object-fit: cover;
    cursor: pointer;
}

.gallery-main-img img {
    width: 100%;
    height: 380px;
    object-fit: cover;
    border-radius: 4px;
}

#expandedImg,
#srcExpandImg,
#svcExpandImg,
#productsvcImgExpnd,
#typeExpandImg {
    display: none;
}

.gallery-col {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding-top: 15px;
}

.document-feedback {
    background-color: #f7f7f7;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #ccc;
    margin-bottom: 8px;

}

.document-feedback-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.document-feedback-top img {
    width: 40px;
    height: 40px;
    border: 3px solid #023970;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 10px;
}

.document-feedback-top span {
    font-weight: 600;
    color: #000;
}

.document-feedback-top ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

.document-feedback-top ul li {
    margin: 10px 0;
    font-weight: 500;
    color: #000;
    font-size: 15px;

}

.document-feedback-top ul li i {
    color: #ef9b34;
}

.document-feedback-text {
    padding: 10px;
}

.document-feedback-text p {
    margin: 0;
    margin-top: 10px;
    font-size: 15px;
    color: #000;

}

.upload-doc-img img {
    width: 150px;
    height: 100px;
    border-radius: 10px;
    margin-top: 10px;
    object-fit: cover;
}


.dashboard-customer-widget {
    background-color: #e2f0f9;
    border-radius: 10px;
    padding: 15px;
    border: 1px solid #a5aad8;
}

.dashboard-customer-widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.dashboard-customer-widget ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    margin-bottom: 5px;
    border-bottom: 1px solid #ccc;
    font-weight: 500;
    font-size: 15px;
    color: #000;
}

.dashboard-customer-widget a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    background-color: #025187;
    color: #fff;
    text-decoration: none;
    height: 40px;
    border-radius: 5px;
    margin-top: 10px;
    transition: 0.5s;

}

.dashboard-customer-widget a:hover {
    border-radius: 40px;
}

.dashboard-project-btns {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

/*.dashboard-project-btns a:last-child{*/
/*    background-color: #b23939;*/
/*}*/
/*.dashboard-project-btns a:first-child{*/
/*     background-color: #025187 !important;*/
/*}*/
.dashboard-project-btns a {
    font-size: 14px;
    font-weight: 500;
    width: unset;
    padding: 5px 10px;
    height: unset;
}

/*.dashboard-project-btns a.green-color{*/
/*    background-color:#239f04 !important;*/
/*}*/
.dashboard-project-btns a.red-color {
    background-color: #b23939 !important;
}

.dashboard-project-btns a.dark-orange-color {
    background-color: #987318 !important;
}

.dashboard-project-btns a.blue-color {
    background-color: #113b85 !important;
}

.project_view_doc_img {
    background-color: #fff;
    border-radius: 5px;
}

.project_view_doc_img img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    border-radius: 10px;
}


.prev-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px;
    border-radius: 15px;
    background-color: #f7f7f7;
}

.prev-logo img {
    width: 200px;
}


.invoice-prev-title {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px;
}

.invoice-prev-title h3 {
    color: #000;
    font-size: 25px;
    font-weight: 600;
    margin: 0;
}

.invoice-sign {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding-top: 50px;

}

.invoice-sign p {
    padding-top: 10px;
    margin-top: 30px;
    border-top: 1px solid #7f7f7f;
    font-size: 15px;
    font-weight: 600;
    width: 30%;
    text-align: center;
}

.invoice-info-bottom ul {
    padding: 0;
    margin: 0;
    list-style: none;

}

.invoice-info-bottom ul li {
    margin: 13px 0;
    background-color: #f2f2f2;
    padding: 10px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 600;
}

.invoice-info-cnt ul {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: flex-start;
    margin: 0;
    padding: 0;
    list-style: none;
    flex-wrap: wrap;

}

.invoice-info-cnt ul li {

    font-size: 15px;
    margin: 8px 0;
    font-weight: 600;

}

.invoice-info {
    background-color: #fff;
    padding: 4px 15px;
    border-radius: 10px;
    height: 100%;
    /* box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; */
    border: 1px solid #fff;
}

.invoice-info h4 {
    font-size: 16px;
    font-weight: 700;
    color: #000;
    margin-top: 10px;
}

.invoice-info ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.invoice-info ul li {
    font-size: 14px;
    margin: 13px 0;
    font-weight: 500;
    color: #171717;
}

.invoice-info ul li span {
    font-weight: 400;
}



.invoice_bottom_pay {
    /*box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;*/
    /*padding:12px;*/
    /*border-radius:12px;*/
}

.invoice_bottom_pay ul {
    padding: 0;
    margin: 0;
    /*display:flex;*/
    list-style: none;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;

}

.invoice_bottom_pay ul li {
    border: 0;
    border: 1px solid #ccc;
    background-color: transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 15px;
    font-weight: 600;
    color: #000;
    padding: 10px;
    width: 100%;
    background-color: #f7f7f7;
    border-radius: 5px;
    margin-bottom: 10px;

}

/*.invoice_bottom_pay ul li:last-child{*/
/*    border-bottom:0 !important;*/
/*}*/

.invoice_bottom_pay ul li span {
    font-weight: 400;
}

.term-ul-invoice {
    margin-top: 0;
    height: 100%;
    background-color: #f7f7f7;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 10px;
}

.term-ul-invoice h3 {
    font-size: 17px;
    font-weight: 700;
    color: #000;

}

.vat-dt p {
    font-size: 15px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 10px;
}


.invoice_gen_basic {
    padding: 8px 15px;
    background-color: #b0b0b00f;
    border: 1px solid #ccc;
    border-radius: 10px;
    height: 100%;
    margin: 0;
}

.invoice_gen_basic ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.invoice_gen_basic ul li {
    color: #222;
    font-size: 16px;
    font-weight: 500;
    margin: 15px 0;

}

.invoice_gen_basic ul li span {
    font-weight: 400;
    margin-left: 5px;
}


.flex-check-box {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin-top: 18px;
}

.flex-check-box input {
    width: 18px;
    height: 18px;
}

.flex-check-box label {
    margin: 0;
    margin-top: 2px;
}

.flex-between-list ul {
    padding: 0;
    list-style: none;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 20px
}

.flex-between-list ul li {
    width: 32%;
    padding: 10px;
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    font-size: 15px;
    font-weight: 500;
    border-radius: 5px;

}

.invoice-title-h2 h2 {
    font-size: 21px;
    font-weight: 500;
    margin-bottom: 15px;
    margin-top: 15px;
    color: #f8b042;
    /* display: flex
; */
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    text-align: left;
    /* background: #ec881121; */
    padding: 10px 0;
    border-bottom: 1px solid #ccc;
}


.invoice_gen_last_box {
    background-color: #f7f7f7;
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #2f509e47;
}

.invoice_gen_last_box h2 {
    margin-top: 0;
    padding-top: 2px;
}

.invoice_gen_last_box input,
.invoice_gen_last_box select,
.invoice_gen_last_box textarea {
    background-color: #fff;
}

.invoice_gen_last_box input:focus,
.invoice_gen_last_box select:focus,
.invoice_gen_last_box textarea:focus {
    background-color: #fff;

}

.invoice_gen_last_box input[type='checkbox'] {
    border: 1px solid #ccc;
}

.invoice_gen_last_box input[type='checkbox']:focus {
    background-color: transparent;
}


.customer-project-widget a:hover {
    border-radius: 40px;
}

.project-top-view-main {
    background-color: #ffffffb3;
    padding: 20px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    background: rgb(255 255 255 / 73%);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.project-top-view-main ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}

.project-top-view-main ul li {
    width: 33%;
    margin: 13px 0;
    font-weight: 600;
    font-size: 16px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;

}

.project-top-view-main ul li p {
    margin: 0;
}

.project-top-view-main ul li span {
    font-weight: 500;
}

.project-main-view-right {
    background-color: #fff;
    border-radius: 5px;
}

.project-main-view-right img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 10px;
}

.project-main-view-right a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65%;
    background-color: #025187;
    color: #fff;
    text-decoration: none;
    height: 40px;
    border-radius: 5px;
    margin: auto;
    margin-top: 10px;
    transition: 0.5s;
}

.project-main-view-right a:hover {
    border-radius: 40px;
}

.image-updating-list {
    padding: 15px;
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 10px;
    margin-bottom: 10px;
    max-width: 350px;
    overflow: auto;
}

.image-updating-list ol {
    padding: 0 15px;
    margin: 0;
}

.image-updating-list ol li {
    margin: 10px 0;
    font-size: 16px;
    font-weight: 500;
    color: #b23939;
}

.image-updating-list ol p {
    margin: 10px 0;
    font-size: 16px;
    font-weight: 500;
    color: #b23939;
    margin-left: -16px;
}

.project-status-green {
    padding: 3px 13px;
    background-color: #039445;
    border: 1px solid #089748;
    color: #fff;
    border-radius: 40px;
    font-size: 13px;
    font-weight: 500;
}

.project-status-orange {
    padding: 3px 13px;
    background-color: #ffc107;
    border: 1px solid #ffc107;
    color: #fff;
    border-radius: 40px;
    font-size: 13px;
    font-weight: 500;
}

.project-status-red {
    padding: 3px 13px;
    background-color: #f1606e;
    border: 1px solid #f1606e;
    color: #fff;
    border-radius: 40px;
    font-size: 13px;
    font-weight: 500;
}


.user-dropdown-top .dropdown-toggle {
    width: fit-content !important;
    padding: 0 18px;
    background: #ffffff6b;
    color: #fff !important;
    border-radius: 40px !important;
    font-weight: 300;
}

.user-dropdown-menu li a {
    border: 0 !important;
    text-align: left;
    color: #222;
    justify-content: flex-start !important;
    font-size: 14px !important;
    font-weight: 500;
}



.text-editor-cs .ck.ck-editor__main>.ck-editor__editable {
    height: 300px !important;
}

.phase-group {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 15px 6px;
    margin: 0;
    margin-bottom: 10px;
}

.phase-group input,
.phase-group select {
    background-color: #fff !important;
}

.phase-group input:focus,
.phase-group select:focus {
    background-color: #fff !important;
}

.doc-group {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 15px 6px;
    margin: 0;
    margin-bottom: 10px;
}

.doc-group input,
.doc-group select {
    background-color: #fff !important;
}

.doc-group input:focus,
.doc-group select:focus {
    background-color: #fff !important;
}

.doc-view-file {
    padding: 3px 10px;
    border-radius: 40px;
    background-color: #43be5f;
    font-size: 13px;
    color: #fff;
}

.doc-view-file:hover {
    background-color: #29873f;
    color: #fff;
}

.doc-file-view-box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
    background-color: #fff;
    height: 45px;
    border: 1px solid #222;
    border-radius: 5px;
    padding: 0 15px;

}

.doc-dlt {
    padding: 3px 10px;
    border-radius: 40px;
    background-color: #ff1919;
    font-size: 13px;
    color: #fff;
}

.doc-dlt:hover {
    background-color: #b23939;
}

.doc-folder-create {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;

}

.doc-folder-create input {
    height: 45px;
    font-size: 13px;
    border-color: #222;
    background-color: transparent;
    color: #222 !important;
    width: 400px;
    background-color: #fff !important;
}

.doc-folder-create button {
    width: 150px;
    height: 45px;
    background-color: #239f04 !important;
    color: #fff;
    border-radius: 8px;
    border-color: #239f04;
    font-size: 15px;
    font-weight: 500;
    transition: 0.5s;

}

.doc-folder-create button:hover {
    border-radius: 40px;
}

.textarea-h-45 {
    height: 45px;
}

.project-view-main-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.project-view-main-top h3,
.project-view-main-top h4 {
    font-size: 19px;
    font-weight: 600;
    margin: 0;
}

.project-view-main-top h3 span {
    color: #ea3a3a;
}

.project-view-info {
    background-color: #fffaeb;
    border: 1px solid #f6e9c2;
    padding: 5px 15px;
    border-radius: 15px;
    height: 100%;
}

.project-view-info ul {
    display: unset;
    list-style: none;
    padding: 0;
    margin: 0;

}

.project-view-info ul li {
    width: 100%;
    margin: 17px 0;
    font-weight: 600;
    font-size: 15.5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}

.project-view-info ul li span {
    margin-left: 10px;
    font-weight: 400;
    color: #6c6c6c;
}

.project-view-info ul li p {
    margin: 0;
}


.box-title-center {
    font-weight: 600;
    font-size: 19px;
    line-height: 30px;
    color: #ea8436;
    text-align: center;
}


.edit-btn-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 111px;
    background-color: #37a90a;
    color: #fff;
    text-decoration: none;
    height: 36px;
    border-radius: 5px;
    margin-top: 10px;
    transition: 0.5s;
    color: #fff !important;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 20px;
}

.edit-btn-main:hover {
    border-radius: 40px;
}

.edit-btn-main-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    background-color: #3f97f6;
    color: #fff;
    text-decoration: none;
    height: 40px;
    border-radius: 5px;
    margin-top: 10px;
    transition: 0.5s;
    color: #fff !important;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 20px;
    margin-left: auto;
}

.edit-btn-main-icon:hover {
    border-radius: 40px;
}


.project-view-accordion .accordion-item {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    border-radius: 11px;
    overflow: hidden;
}

.project-view-accordion .accordion-item .accordion-button {
    font-size: 18px;
    font-weight: 600;
}

.project-view-accordion .accordion-item .accordion-button:not(.collapsed) {
    color: #fff;
    background-color: #025187;
}

.doc-folder-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #222;
    padding-right: 10px;
}

.doc-folder-top h3 {
    border: 0 !important;
}

.doc-folder-top input {
    width: 24px;
    height: 24px;
    border: 1px solid #ccc;
    border-radius: 2px;
}

.file-dlt-btn {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: red;
    color: #fff;
    border: 0;
    margin-top: 15px;
    margin-left: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.file-dlt-btn:hover {
    background-color: #b23939;
}

.view-document p {
    font-size: 16px;
    margin: 6px 0;
}

.view-document p strong {
    font-weight: 500;
}



.plus-cs-btn {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: #22b922;
    color: #fff;
    border: 0;

    display: flex;
    justify-content: center;
    align-items: center;
}

.plus-cs-btn:hover {
    background-color: #158115;
}

.minus-cs-btn {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: red;
    color: #fff;
    border: 0;

    display: flex;
    justify-content: center;
    align-items: center;
}

.minus-cs-btn:hover {
    background-color: #b23939;
}

.center-align {
    display: flex;
    justify-content: center;
    align-items: center;
}

.invoice_field_form input,
.invoice_field_form select {
    background-color: #fff;
}

.invoice_field_form input:focus,
.invoice_field_form select:focus {
    background-color: #fff;
}


.reset-btn {
    width: 110px;
    height: 37px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0;
    background-color: #b23939;
    color: #fff;
    border-radius: 5px;
    transition: 0.5s;
    font-size: 15px;
    font-weight: 500;

}

.reset-btn:hover {
    border-radius: 40px;
    color: #fff;
}

.search-btn {
    width: 110px;
    height: 37px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0;
    background-color: #18a0b8 ;
    color: #fff;
    border-radius: 5px;
    transition: 0.5s;
    font-size: 15px;
    font-weight: 500;

}

.search-btn:hover {
    border-radius: 40px;
    color: #fff;
}

.project-view-desc ul li {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.project-view-desc ul li span {
    margin: 0 !important;
}

.project-view-desc ul li h1,
.project-view-desc ul li h2,
.project-view-desc ul li h3,
.project-view-desc ul li h4,
.project-view-desc ul li h5,
.project-view-desc ul li h6,
.project-view-desc ul li h1 strong,
.project-view-desc ul li h2 strong,
.project-view-desc ul li h3 strong,
.project-view-desc ul li h4 strong,
.project-view-desc ul li h5 strong,
.project-view-desc ul li h6 strong {
    font-size: 20px;
    color: #b23939;
    font-weight: 500;
}

.project-view-desc ul li p {
    font-size: 15px;
    line-height: 25px;
}

.project-view-main-top h5.project-status-badge {
    font-size: 15px;
}

.project-view-collapse {
    background-color: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.survey-title {
    text-align: center;
    color: #f99905;
}

.survay-rating-section {
    padding: 15px;
    background-color: #f7f7f7f7;
    border-radius: 15px;
    border: 1px solid #ccc;
}

.suravey-rating-box {
    padding: 10px 15px;
    background-color: #fff;
    border-radius: 7px;
    border: 1px solid #ccc;
}

.text-inp textarea {
    height: 100px;
}

.radio-comtent-list ul {
    padding: 0;
    margin: 0;
    list-style: none;
    padding-left: 10px;

}

.radio-comtent-list ul li {
    margin: 10px 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 500;

}

.radio-comtent-list ul li input {
    width: 18px;
    height: 18px;
}

.back-btn-csr {
    background-color: #d94242 !important;
}

.back-btn-csr:hover {
    background-color: #b23939 !important;
    color: #fff !important;
}


.folder-wrapper-cs {
    background-color: #fff6db;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #f6e4b0;
}

.folder-wrapper-cs h3 {
    background: #ffffff7a;
    color: #000 !important;
}

.pagination-custom .table_bottom {
    margin: 12px 0;
}

.table_bottom svg {
    width: 30px;
}


.table_bottom .table-pagination {
    width: 100%;
    justify-content: flex-end;
    display: flex;
}

.table_bottom .table-pagination nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.table_bottom .table-pagination nav div:last-child {
    display: flex;
    align-items: center;
    gap: 10px;
}

.image-table tr td img {
    width: 100px;
    height: 70px;
    border-radius: 7px;
    object-fit: cover;
}

.main-table-container .chart h3{
   font-size: 16px;
    color: #0f0905;
    font-weight: 600;
}
.page-title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px !important;
}
.page-title h3{
    font-size: 25px;
    color: #000;
}
.page-title h3 span{
    font-size: 15px;
}
.page-title{
    padding: 10px 0;
    padding-top: 0;
}
.active-toggle{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}
.max-width-250 td{
    max-width: 250px;
}


.action-btns{
    display: flex !important
;
    justify-content: center !important;
    align-items: center;
    gap:5px;
}

.action-btns .btn-delete{
   min-width: 30px;
    height: 30px;
    background-color: #d92f2f;
    color: #fff;
   border-radius: 20%;
    display: flex
;
    justify-content: center;
    align-items: center;
    border: 0;
    font-size:13px;
    text-decoration:none;
}
.action-btns i{
    color: #fff;
}
.action-btns .btn-edit{
   min-width: 30px;
    height: 30px;
    background-color: #17922a;
    color: #fff;
  border-radius: 20%;
    display: flex
;
    justify-content: center;
    align-items: center;
    border: 0;
    font-size:13px;
    text-decoration:none;
}
.action-btns .btn-view{
   min-width: 30px;
    height: 30px;
    background-color: #1c83b1;
    color: #fff;
   border-radius: 20%;
    display: flex
;
    justify-content: center;
    align-items: center;
    border: 0;
    font-size:13px;
    text-decoration:none;
}
.action-btns .btn-cstm{
  
    height: 30px;
    padding:10px;
    background-color: #b2b815;
    color: #fff;
   border-radius: 5px;
    display: flex
;
    justify-content: center;
    align-items: center;
    border: 0;
    font-size:13px;
    text-decoration:none;
    color: #fff !important;
}
.action-btns .btn-nowrap{
    white-space:nowrap;
    border-radius:5px;
    font-size:13px;
    color:#fff;
}
.action-btns .full-width-btn{
    white-space:nowrap;
    border-radius:5px;
    font-size:13px;
    color:#fff !important;
     height: 30px;
     background-color: #2fa9bc;
     display: flex;
     justify-content: center;
     align-items: center;
     padding: 0 10px;
}
.action-btns .btn-nowrap i{
    margin-right:3px !important;
}


.submit-btn{
       width: 150px;
    height: 40px;
   background: #0c6c0d;
    border: 0;
    display: flex
;
    justify-content: center;
    align-items: center;
    color: #fff;
    transition: 0.5s;
    border-radius: 5px;
    font-size:15px;
    text-decoration:none;
    margin:10px auto;
}
.submit-btn:hover{
      border-radius:40px;
}

.price-select{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}
.price-select select{
    width: 80px;
}
.nowrap{
    white-space: nowrap;
}
.table-img-logo tr td img{
    width: 100px;
    height:  80px;
    object-fit: cover;
    border-radius: 5px;
}

.cms-field-container h3{
    margin: 10px 0;
    font-size: 20px;
    font-weight: 600;
    color: #1e126f;
}
td div.text-line-3{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
}

.modal-btn-box{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  margin-top: 30px;
}
.modal-btn-box button{
  width: 80px;
  height: 33px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  text-decoration: none;
  border-radius: 10px;
  font-size: 15px;
  border: 0;
}
.bg-default{
  background-color: #000 !important;
}
.bg-epn-red{
  background-color: #dd4b39  !important;
}

.time-to-select{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}
h3.setting-title{
    font-size: 18px;
    font-weight: 600;
}

.backup-container ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.backup-container ul li{
    margin: 20px 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}
.backup-container ul li label{
    font-size: 15px;
    font-weight: 600;
    color: #000;
}
.backup-container ul li button{
    width: fit-content;
    padding: 7px 15px;
    border: 0;
    border-radius: 40px;
    background-color: #027009;
    color: #fff;
    font-size: 15px;
}
.bg-modal-btn{
    background-color: #236c64 !important;
}
.page-title-btn h3{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.page-title-btn h3 a{
    padding: 7px 15px;
    font-size: 15px;
    background-color: #1e126f;
    border-radius: 5px;
    color: #fff;
    transition: 0.5s;
}
.page-title-btn h3 a:hover{
    border-radius: 40px;
}


/* UGE */


.login-img-right{
    width: 100%;
    height: 95vh;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.login-img-right img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 30px;
}



@media screen and (min-width:1200px){
    .container-max-cs{
        max-width: 1800px  !important;
    }
}
.login-overlay{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 30px;
  /* background: #13889C;
background: linear-gradient(170deg, rgba(19, 136, 156, 0.41) 0%, rgba(1, 7, 8, 0.27) 100%); */
}

.btns-header-top{
    display: none;
    justify-content: flex-start;
    align-items: center;
    gap: 7px;
}
.btns-header-top a{
       padding: 10px 15px !important;
    font-size: 13px !important;
    background-color: #18a0b8 !important;
    color: #fff !important;
    border-color: #13889C !important;
    height: 35px !important;
    transition: 0.5s;
}
.btns-header-top a:hover{
    border-radius: 40px;
}
.btns-header-top a.bg1{
    background-color: #3961b2 !important;
     border-color: #3961b2 !important;
}
.btns-header-top a.bg2{
    background-color: #dab522 !important;
     border-color: #dab522 !important;
}
.btns-header-top a.bg3{
    background-color: #269e68 !important;
     border-color: #269e68 !important;
}
ul.qk-action-btns{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 5px;
}
ul.qk-action-btns li{
    width: 25%;
}
ul.qk-action-btns li a{
    width: 100%;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #025187;
    color: #fff;
    border-radius: 5px;
    font-size: 15px;
    transition: 0.5s;
}
ul.qk-action-btns li a:hover{
    border-radius: 40px;
}
ul.bottom-dashboard-list{
     list-style: none;
    margin: 0;
    padding: 0;
   
}
ul.bottom-dashboard-list li{
    margin-bottom: 15px;
}
ul.bottom-dashboard-list li:last-child{
    margin-bottom: 0;
}
ul.bottom-dashboard-list li a{
    font-size: 14px !important;
    background-color: #ccc;
    font-size: 15px;
    color: #000;
    padding: 4px 15px;
    border: 1px solid #ccc;
    border-radius: 40px;
}
ul.company-check-box{
     list-style: none;
    margin: 0;
    padding: 0;
}
ul.company-check-box li{
    margin: 14px 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}
ul.company-check-box li input{
    width: 20px;
    height: 20px;
}
ul.company-check-box li label{
    font-size: 15px;
    color: #000;
    margin: 0;
}
.office-time{
    background-color: #fff;
    padding: 20px;
    border-radius: 15px;
    margin-top: 25px;
    border: 1px solid #ccc;
}
.office-time h6{
    font-weight: 600;
    color: #c35d0f;
}
h5.title-cs-bnk{
    font-size: 17px;
    font-weight: 600;
    color: #043783;
}
h6.title-cs-bnk{
    font-size: 15px;
    font-weight: 600;
    color: #043783;
}
a.viewFilesbtn{
    background-color: #113b85;
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    padding: 7px 15px;
    color: #fff;
    border-radius: 40px;
    font-size: 15px;
}
.bg-filter{
    background-color: #025187 !important;
}
.btn-flex{
    display: flex;
    justify-content: flex-end;
    gap: 7px;
    align-items: center;
}
.btn-flex a,.btn-flex button{
    margin: unset;
}
.filter-btns-top{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.td-select select{
    font-size: 14px;
    border-color: #22222217;
    background-color: #efefef;
    color: #222 !important;
    border-radius: 11px;
}
.mobile-flex{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}
.mobile-flex select{
    width: 100px;
}
.min-width-150{
    min-width: 250px;
}
.w-fit-content{
    width: fit-content;
}

.advanced-search-content .modal-header{
    padding-bottom: 10px;
}
.advanced-search-content .modal-header h1{
    font-size: 17px !important;
    font-weight: 600;
}

.advanced-search-box{
    background-color: #f7f7f7;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #ccc;
}
.advanced-box div{
    margin: 8px 0;
}
.advanced-box label{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 10px;
    font-size: 14.5px;
    color: #000;
}
.advanced-box label input{
    margin-top:2px;
    width: 18px;
    height: 18px;
}
.advanced-search-box .o-f-inp input,.advanced-search-box .o-f-inp select{
    background-color: #fff;
}

ul.qk-filters{
       list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
}
ul.qk-filters li a{
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    padding: 5px 10px;
    font-size: 14px;
    color: #000;
    border-radius: 10px;
}

.check-label{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}
.check-label input{
    width: 18px;
    height: 18px;
}
.check-label label{
    font-size: 14px;
    color: #000;
}
.flex-filter-both{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}
.flex-filter-both div:first-child{
    width: 75%;
}




.range-slider {
    width: 100%;
    margin: auto;
    text-align: center;
    position: relative;
    height: 4em;
}

/* .range-slider svg,
.range-slider input[type=range] {
	position: absolute;
	left: 0;
	bottom: 0;
} */

.rng-input[type=number] {
    border: 0;
    font-size: 1.6em;
    -moz-appearance: textfield;
    font-size: 12px;
}

.rng-input[type=number]::-webkit-outer-spin-button,
.rng-input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.rng-input[type=number]:invalid,
.rng-input[type=number]:out-of-range {
    color: #ff6347;
}

.rng-input {
    border: 0;
    font-size: 1.6em;
    -moz-appearance: textfield;
    font-size: 12px;
}

.rng-input::-webkit-outer-spin-button,
.rng-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.rng-input:invalid,
.rng-input:out-of-range {
    color: #ff6347;
}

.type-rng-inp[type=range] {
    -webkit-appearance: none;
    width: 100%;
}

.type-rng-inp[type=range]:focus {
    outline: none;
}

.type-rng-inp[type=range]:focus::-webkit-slider-runnable-track {
    background: #18a0b8;
}

.type-rng-inp[type=range]:focus::-ms-fill-lower {
    background: #18a0b8;
}

.type-rng-inp[type=range]:focus::-ms-fill-upper {
    background: #18a0b8;
}

.type-rng-inp[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 3px;
    cursor: pointer;
    animate: 0.2s;
    background: #18a0b8;
    border-radius: 1px;
    box-shadow: none;
    border: 0;
}

.type-rng-inp[type=range]::-webkit-slider-thumb {
    z-index: 2;
    position: relative;
    border: 1px solid #286276;
    height: 18px;
    width: 18px;
    border-radius: 25px;
    background: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -9px;
}

.type-rng-inp[type=range]::-moz-range-track {
    width: 100%;
    height: 5px;
    cursor: pointer;
    animate: 0.2s;
    background: #18a0b8;
    border-radius: 1px;
    box-shadow: none;
    border: 0;
}

.type-rng-inp[type=range]::-moz-range-thumb {
    z-index: 2;
    position: relative;
    border: 1px solid #07395b;
    height: 18px;
    width: 18px;
    border-radius: 25px;
    background: #18a0b8;
    cursor: pointer;
}

.type-rng-inp[type=range]::-ms-track {
    width: 100%;
    height: 5px;
    cursor: pointer;
    animate: 0.2s;
    background: transparent;
    border-color: transparent;
    color: transparent;
}

.type-rng-inp[type=range]::-ms-fill-lower,
.type-rng-inp[type=range]::-ms-fill-upper {
    background: #18a0b8;
    border-radius: 1px;
    box-shadow: none;
    border: 0;
}

.type-rng-inp[type=range]::-ms-thumb {
    z-index: 2;
    position: relative;
    border: 1px solid #18a0b8;
    height: 18px;
    width: 18px;
    border-radius: 25px;
    background: #a1d0ff;
    cursor: pointer;
}

.price-top {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 3px;
}

.price-top input {
    font-size: 12px;
    font-weight: 500;
    color: #64748B;
    width: 50%;
    margin-top: 10px;
    background-color: transparent;
}

.pos-inp {
    position: absolute;
    left: 0;
    bottom: 22px;
}

.range-slider label {
    font-size: 14px;
    font-weight: 600;
    color: #000;
    text-align: left;
    width: 100%;
}

.program-left-filter{
    background-color: #ffffff;
    padding: 15px;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    background: rgba(255, 255, 255, 0.908);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.program-filter-top{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.program-filter-top label{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
    font-size: 16px;
    font-weight: 600;
    color: #000;
}
.program-filter-top label input{
    width: 20px;
    height: 20px;

}
.program-filter-top select{
    width: 150px;
    height: 40px;
    border-radius: 40px;
    font-size: 14px;
}
.program-info-container{
     background-color: #ffffff;
    padding: 15px;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    background: rgba(255, 255, 255, 0.908);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}
.program-info-container h3{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 18px;
    gap: 10px;
}
.program-info-container h3 a {
    text-decoration: none;
    font-size: inherit;
    color: #000;
}
.program-info-container h3 input{
    width: 18px;
    height: 18px;
}
.program-info-top ul{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 8px;
    margin: 20px 0;
}

.program-info-top ul li span{
    padding: 7px 15px;
    background-color: red;
    color: #fff;
    font-size: 14px;
    border-radius: 10px;
    display: flex;
}
.program-info-top ul li span i{
    margin-right: 5px;
}
.program-info-top ul li span.bg-1{
    background-color: #18a0b8;
}
.program-info-top ul li span.bg-2{
    background-color: #18b857;
}
.program-info-top ul li span.bg-3{
    background-color: #b2b818;
}

.program-info-second ul{
     display: flex;
    justify-content: flex-start;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 8px;
}
.program-info-second ul i{
    color: #113b85;
    margin-right: 10px;
}
.program-info-second ul li{
    font-size: 15px;
}

.program-info-second ul li img{
    width: 25px;
    height: 25px;
    object-fit: cover;
    border-radius: 50%;
    margin-right: 10px;
}
.program-info-bottom{
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    padding:5px 15px;
    border-radius: 15px;
    height: 100%;
}
.program-info-bottom ul{
    padding: 0;
    margin:  0;
    list-style: none;
}
.program-info-bottom ul li{
    margin: 10px 0;
    font-size: 15.5px;
    color: #000;
}
.program-info-bottom ul li small{
    background-color: #8a9fb4;
    color: #fff;
    padding: 5px 10px;
    border-radius: 40px;
}
.program-info-bottom-second ul{
      padding: 0;
    margin:  0;
    list-style: none;
}
.program-info-bottom-second ul li .btn{
    font-size: 14px;
    background-color: #dbf8d2;
    color: #000;
    border-color: #dbf8d2;
}
.program-info-bottom-second ul li{
    margin: 10px 0;
}

.program-details-left{
      background-color: #ffffff;
    padding: 15px;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    background: rgba(255, 255, 255, 0.908);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    position: sticky;
    top: 70px;
}
.program-dt-logo{
    background-color: #deecfb;
    padding: 15px;
    border-radius: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.program-dt-logo img{
    width: 250px;
}
.program-details-left h3{
    margin: 10px 0;
    font-size: 18px;
}
ul.program-details-left-ul{
    padding: 0;
    margin: 0;
    list-style: none;
}
ul.program-details-left-ul li{
    margin: 10px 0;
    font-size: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.program-info-bottom-third li .btn{
    text-align: left;
    display: flex;
    justify-content:space-between;
    align-items: center;
}
a.progrm-dt-a{
    font-size: 14px;
    text-align: center;
    margin: 10px auto;
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
}
.program-container-right h3{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    font-size:22px;
}
.program-container-right h3 span{
    font-size: 13px;
    font-weight: 400;
    white-space: nowrap;
}
.list-program-dt ul{
    margin: 0;
    list-style: none;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.list-program-dt ul li{
    width: 47%;
    font-size: 15px;
    font-weight: 500;
    color: #000;
    border-bottom: 1px solid #ccc;
    padding: 7px 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.list-program-dt ul li span{
    font-weight: 400;
    color: #6d6d6d;
}
.program-dt-right-bottom ul{
    padding-left: 0;
    padding-left: 20px;
}
.program-dt-right-bottom ul li{
    font-size: 13px;
    margin-bottom:7px;
}

.enq-center{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    min-height: 60vh;
}
.enq-center img{
    width:450px;
}
.enq-center h3{
    font-size: 35px;
    font-weight: 600;
    color: #000;
    margin: 0;
}
.enq-center p{
    font-size: 16px;
    margin: 10px 0;

}
.enq-center a{
    padding: 7px 15px;
    background-color: #113b85;
    color: #fff;
    border-radius: 7px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    font-size: 15px;
    transition: 0.5s;
}
.enq-center a:hover{
    border-radius: 40px;
}
.form-fied-checkbox div{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
}
.form-fied-checkbox div label{
   display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px; 
}
.form-fied-checkbox div label input{
    width: 18px;
    height: 18px;
}



/* Container */
.txn-container {
  width: fit-content;
  margin: auto;
}

/* Row Card */
.txn-row {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  margin-bottom: 12px;
}

/* Header Row (FLEX — no grid issues) */
.txn-header {
  display: flex;
  align-items: center;
  padding: 12px;
  gap: 10px;
}

/* Columns */
.txn-col {
  font-size: 14px;
  white-space: nowrap;
  min-width: 180px;
}

/* Status colors */
.txn-credit {
  color: #00a86b;
  font-weight: 500;
}

.txn-debit {
  color: orange;
  font-weight: 500;
}

/* Arrow button */
.txn-arrow {
  flex: 0 0 35px;
  height: 30px;
  border: 1px solid #ccc;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
  background: #113b85;
  user-select: none;
  transition: transform 0.3s ease;
  color: #fff;
}

/* Rotate when active */
.txn-arrow.active {
  transform: rotate(180deg);
}

/* Hidden details */
.txn-details {
  display: none;
  padding: 10px;
  border-top: 1px solid #ddd;
  background: #fafafa;
}

/* Inner table */
.txn-details table {
  width: 100%;
  border-collapse: collapse;
}

.txn-details th,
.txn-details td {
  padding: 10px;
  border-bottom: 1px solid #ddd;
  text-align: left;
  font-size: 14px;
}

.txn-details th {
  background-color: #e0eff3;
    color: #2a7c9b;
    border: 1px solid #a1bde566;
    font-size: 13px;
    padding: 15px 10px;
    text-transform: uppercase;
    text-align: center;
    font-weight: 600;
}
.txn-details td{
        color: #222 !important;
    border: 0;
    border: 1px solid #dadada;
    text-align: center;
    padding: 15px 12px !important;
    font-size: 14px;
    font-weight: 400;
}
.txn-header-cs div{
    font-weight: 600;
    color: #000;
}

.profile-preview{
  background-color: #f2f2f2;
  padding:25px;
  border-radius: 10px;
  height: 80%;
  display: flex;
  justify-content: flex-start;
  align-items: center;


}
.profile-preview ul{
  padding: 0;
  list-style: none;
}
.profile-preview ul li{
  margin: 15px 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 600;
}
.profile-preview ul li span{
  font-weight: 400;
}
.permission-Bottom ul li label{
    font-size: 15px;
    font-weight: 600;
}
.permission-top ul li label{
    width: 100%;
    font-size: 14.5px;
    font-weight: 400;
    
}
.permission-top ul li{
    margin: 7px 0 !important;
}
.permission-top ul li:nth-child(2) label{
    white-space: nowrap;
    min-width: 100px;
}
.permission-top ul li:last-child label{
    white-space: nowrap;
    min-width: 80px;
}
.permission-Bottom ul{
    padding-left: 0 !important;
  
}
.permission-top ul{
  gap: 80px !important;
}
.permission-Bottom ul li{
    margin-top: 15px;
}
.settings-save-btn{
    padding-top: 25px;
}
.settings-save-btn button{
    margin: 0;
}
.settings-form{
    border: 1px solid #ccc;
    border-radius: 15px;
    padding: 20px;
    background-color: #f7f7f7;
}
.settings-form input,.settings-form select{
    background-color: #fff;
}
.tab-studet-tg{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tab-studet-tg ul{
    margin: 0;
    list-style: none;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
}
.tab-studet-tg ul li a {
    font-size: 16px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    color: #000;
    font-weight: 500;
}
.tab-studet-tg ul li a span{
    width: 50px;
    height: 50px;
    border: 1px solid #000;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.tab-studet-tg ul li a.active span{
    background-color: #13889C;
    border-color: #113b85;
    color: #fff;
}
a.stps{
    background-color: #039445;
    color: #fff;
    padding: 7px 15px;
    width: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    gap: 10px;
    border-radius: 7px;
    font-size: 14px;
    font-weight: 400;
}
.student-info-add-cont{
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    padding: 15px;
    border-radius: 15px;
}
.student-info-add-cont input,.student-info-add-cont select,.student-info-add-cont textarea{
    background-color: #fff !important;
}
.student-info-add-cont h5{
    font-size: 20px;
    color: #023970;
    margin: 10px 0;
}
a.add-field-exp{
    width: 35px;
    height: 35px;
    background-color: #027009;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    border-radius: 50%;
}

.app-info-left{
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    padding: 15px;
    border-radius: 10px;
}
.app-info-left h5{
    font-size: 15px;
    color: #089748;
}
.app-info-left ul{
    margin: 0;
    padding: 0;
}
.app-info-left ul li{
    margin: 10px 0;
    font-size: 15px;
    list-style: none;
    font-size: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.app-info-left ul li span{
    max-width: 250px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
}
.app-info-right{
    background-color: #f7f7f7;
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 12px;
}
.app-info-right-top{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.app-info-right-top small{
    font-size: 13px;
}
.app-info-right-top span{
    background-color: #ffe0e0;
    color: red;
    padding: 7px 15px;
    border-radius: 5px;
    font-size: 14px;
    border-radius: 40px;
}
.app-info-right-bottom h5 a{
    font-size: 18px;
}
.app-info-right-bottom h4{
    margin: 7px 0;
    font-size: 20px;
    
}
.app-info-right-bottom p{
    font-size: 15px;
    margin: 5px 0;
    color: #7e7a7a;
}
.app-info-right-bottom-2{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.app-info-right-bottom-2 a{
    background-color: #039445;
    color: #fff;
    padding: 7px 15px;
    font-size: 13px;
    border-radius: 7px;
}





.msger {
    display: flex;
    flex-flow: column wrap;
    justify-content: space-between;
    width: 100%;
    height: calc(100% - 50px);
    border-radius: 5px;
    background-color: #fff;
    padding: 15px;
    margin-top: 10px;
    border-radius: 10px;
}

.msger-header {
    display: flex;
    justify-content: space-between;
    padding: 10px;
    color: #666;
    border-bottom: 1px solid #ccc;
}

.msger-chat {
    /* flex: 1; */
    overflow-y: scroll;
    padding: 10px;
    height: 400px;
}

.msger-chat::-webkit-scrollbar {
    width: 3px;
}

.msger-chat::-webkit-scrollbar-track {
    background: #fff;
}

.msger-chat::-webkit-scrollbar-thumb {
    background: #bdbdbd;
}

.msg {
    display: flex;
    align-items: flex-end;
    margin-bottom: 10px;
}

.msg:last-of-type {
    margin: 0;
}

.msg-img {
    width: 50px;
    height: 50px;
    margin-right: 10px;
    background: #ddd;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 50%;
  
}

.msg-bubble {
    max-width: 450px;
    padding: 15px;
    border-radius: 15px;
    background: #f2f2f2;
}

.msg-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.msg-info-name {
    margin-right: 10px;
    font-weight: 500;
    font-size: 13px;
    font-family: var(--font-main);
}

.msg-text {
    font-family: var(--font-main);
}

.msg-info-time {
    font-size: 0.85em;
}

.left-msg .msg-bubble {
    border-bottom-left-radius: 0;
}

.right-msg {
    flex-direction: row-reverse;
}

.right-msg .msg-bubble {
    background: #7ca4a3;
    color: #fff;
    border-bottom-right-radius: 0;
}

.right-msg .msg-img {
    margin: 0 0 0 10px;

}

.msger-inputarea {
    display: flex;
    padding: 10px;
    border-top: var(--border);
    background: #fff;
}

.msger-inputarea * {
    padding: 10px;
    border: none;
    border-radius: 3px;
    font-size: 1em;
}

.msger-input {
    flex: 1;
    background: #f2f2f2 !important;
    outline: none;
    border: none;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.msger-send-btn {
    margin-left: 10px;
    background: #13889C;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    min-width: 50px;
    height: 50px;
    border-radius: 50%;
    transition: background 0.23s;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
}

.msger-send-btn i {
    padding: 0;
}

.msger-send-btn:hover {
   background: #13889C;
}

.msger-chat {
    background-color: #fcfcfe;

}

.chat-img-bx {
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #fff;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    padding: 4px;
}

.chat-img-bx img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.msger-header-title h3 {
    font-size: 17px;
    font-weight: 500;
    margin-left: 10px;
    margin-bottom: 0;
}

.file-attch {
    background-color: #f2f2f2;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.title-search-field h5{
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    font-weight: 600;
    color: #025187;
}
.title-search-field h5 input{
    width: 300px;
    height: 45px;
    font-size: 15px;
    border-radius: 7px;
}
.title-search-field p{
    font-size: 14px;
    color: #000;
}
.p-info-top-container{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 15px;
    border-bottom: 1px solid #222;
    margin-bottom: 15px;
}
.p-info-top-container a.dlt{
    min-width: 35px;
    height: 35px;
    background-color: red;
    color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.p-info-c-top{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}
.p-info-c-top select{
      width: 300px;
    height: 45px;
    font-size: 15px;
    border-radius: 7px;
}
.p-info-c-top a.dtv{
     background-color: #039445;
    color: #fff;
    padding: 7px 15px;
    font-size: 13px;
    border-radius: 7px;
}
.program-upload-btns{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding-top: 20px;
}
.program-upload-btns a{
    padding: 7px 15px;
    font-size: 14px;
    background-color: #023970;
    color: #fff;
    border-radius: 7px;
}

h3.title-spa{
    font-size: 20px;
   margin: 0;
   margin-bottom: 15px;
    font-weight: 600;
    color: #000;
}

.g-settings-left{
    padding:5px 15px;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    /* box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px; */
    background: rgba(255, 255, 255, 0.908);
    background: #ffffffc7;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    position: sticky;
    top: 80px;
    left: 0;
}
.g-settings-left ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.g-settings-left ul li{
    margin: 10px 0;
    border-bottom: 1px solid #ccc;
}
.g-settings-left ul li a{
    padding: 7px;
    font-size: 15px;
    color: #000;
    display: flex;
}
.g-settings-left ul li a:hover{
    background-color: #f7f7f7;
}
.g-settings-right{
     padding: 15px;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    /* box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px; */
    background: rgba(255, 255, 255, 0.908);
    background:#ffffffc7;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}
.g-settings-right h3{
    font-size: 18px;
    font-weight: 600;
}
.g-settings-right p{
    font-size: 14px;
}
html{
    scroll-padding-top:4.5rem;
}
input.fieldCheck{
    width: 18px;
    height: 18px;
}
button.exp-btn{
    border: 0;
    background-color: #109896;
    width: 150px;
    padding: 7px 15px;
    height: 40px;
    border-radius: 7px;
    color: #fff !important;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #109896;
    transition: 0.5s;
    margin-left: 10px;
    font-size: 15px;
}
button.exp-btn:hover{
    border-radius: 40px;
}
img.img-td{
    width: 120px;
    height: 80px;
    border-radius: 10px;
    object-fit: cover;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border: 5px solid #ccc;
}
.min-width-350.tds{
    min-width: 350px;
}
.masters-btns ul{
    margin: 0;
    list-style: none;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}
.masters-btns ul li{
    width:24%;

}
.masters-btns ul li a{
    width: 100%;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 7px;
    font-size: 14px;
    font-weight: 500;
    transition: 0.5s;
}
.masters-btns ul li a:hover{
    border-radius: 40px;
}
button.tgle-cs-btns{
    min-width: 30px;
    height: 30px;
    background-color: #0d6efd;
    color: #fff;
    border-radius: 20%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0;
    font-size: 13px;
    text-decoration: none;
}
.dromenu-cs li a.dropdown-item{
    color: #000 !important;
    padding: 10px !important;
}
.dromenu-cs li a.dropdown-item:hover{
    background-color: #f2f2f2;
}




.toggle-btn[type="checkbox"] {
  position: relative;
  width: 40px;
  height: 20px;
  -webkit-appearance: none;
  appearance: none;
  background: gray;
  outline: none;
  border-radius: 2rem;
  cursor: pointer;
  border: none;
  /* box-shadow: inset 0 0 5px rgb(0 0 0 / 50%); */
  background-color: #c0bdbd !important;
}
.toggle-btn:focus{
  border: none !important;
  outline: none !important;
}

.toggle-btn[type="checkbox"]::before {
  content: "";
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff !important;
  border: 1px solid #222;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.5s;
}

.toggle-btn[type="checkbox"]:checked::before {
  transform: translateX(100%);
  background: #fff !important;
}

.toggle-btn[type="checkbox"]:checked {
  background: #409717 !important;
}
.v-preview{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #e0eff2;
    padding: 15px;
    border-radius: 15px;
    position: relative;
}
.v-preview img{
    width: 200px;
    border-radius: 20px;
}
.v-preview span{
    padding: 7px 15px;
    border-radius: 40px;
    position: absolute;
    top: 20px;
    right: 20px;
    background-color: #039445;
    color: #fff;
}
.v-title{
    font-size: 20px;
    font-weight: 600;
    color: #000;
    margin: 0;
    text-align: center;
}
.v-preview-widget {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    padding:5px 15px;
    border-radius: 10px;
    height: 100%;
}
.v-preview-widget ul{
    padding: 0;
    list-style: none;
    margin: 0;
}
.v-preview-widget ul li{
    margin: 10px 0;
    font-size: 15px;
    font-weight: 600;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 3px;
}
.v-preview-widget ul li span{
    font-weight: 400;
    font-size: 14px;
}
.v-document-view{
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 15px;
    padding: 15px;
}

.v-document-view h6,.v-preview-widget h6{
    font-weight: 600;
    color: #000;
    font-size: 17px;
}
.v-doc-preview{
    background-color: #fff;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid #ccc;
}
.v-doc-preview img{
    width: 100%;
    height: 120px;
    border-radius: 10px;
    object-fit: contain;
}
.v-doc-preview a{
    padding: 7px 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 10px auto;
    width: fit-content;
    background-color: #043783;
    color: #fff;
    font-size: 14px;
    border-radius: 40px;
    margin-bottom: 0;
}
.wrap-ul ul{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.wrap-ul ul li{
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
}

.v-preview-bottom ul{
    margin: 0;
    list-style: none;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.v-preview-bottom ul li{
    font-weight: 600;
    color: #000;
}
.v-preview-bottom ul li select{
    width: 250px;
    font-size: 14px;
    border: 1px solid #ccc;
    height: 45px;
}

.sub-active{
  background: #0e0e0d5c;
    color: #fff !important;
}




.lock-title {
    text-align: center;
    font-size: 20px;
    margin: 0;
    color: #000;
    margin-top: 0;
    
    font-weight: 600;
    color: #000;
}
.lock-modal-footer{
    display: flex;
    justify-content: center;
    align-items: center;
    padding:10px 30px;
    gap: 10px;
}
.lock-modal-footer button, .lock-modal-footer a{
    width: 100px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    font-weight: 500;
    transition: 0.5s;
    border-radius: 4px;
    text-decoration: none  !important;
    border: 0;
}
.lock-modal-footer a{
    background-color:#109896;
    color: #fff;
  
}
.lock-modal-footer button{
    background-color: #E5D8CB;
    color: #222;
}
.lock-modal-footer button:hover, .lock-modal-footer a:hover{
    border-radius: 40px;
}

.modal{
    background-color: #1d505340;
    backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
}


#lockedAccount i{
    font-size: 40px;
    color: #027009;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    margin-bottom: 7px;
}
.company-days-listing{
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    padding: 15px;
  
    border-radius: 15px;
}
.company-days-listing ul{
    
    display: flex;
    justify-content:space-between;
    align-items: center;
    flex-wrap: wrap;
    
}
.company-days-listing ul li{
    width: 33%;
}
.company-days-listing h6{
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    color: #c35d0f;
}

.company-days-listing h6 label{
    font-size: 16px;
    color: green;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}
.company-days-listing h6 label input{
    width: 18px;
    height: 18px;
}

.add-modal-field{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;

}
.add-modal-field button{
    min-width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: #089712;
    color: #fff;
    border: 0;
}
#leadFieldModal3 h5,#leadFieldModal2 h5,#leadFieldModal1 h5{
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
}
.mn-0{
    min-width: unset !important;
}

.select2-container--default .select2-selection--multiple{
        height: 45px !important;
    font-size: 14px !important;
    border-color: #22222217 !important;
    background-color: #efefef !important;
    color: #222 !important;
    border-radius: 11px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__display {
    font-size: 13px;
}

.form-control:disabled,.form-select:disabled{
    background-color: #c4c4c4;
    cursor: not-allowed;
}

#convertDealModal2 i,#successModal i {
    font-size: 40px;
    color: #027009;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    margin-bottom: 7px;
}
.flex-check{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    padding-top: 20px;
}
.flex-check input{
    width: 18px;
    height: 18px;
}

.student-preview-profile img{
    width: 100%;
    height: 200px;
    border-radius: 15px;
    object-fit: cover;
}
.s-preview-widget ul{
    flex-wrap: wrap;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.s-preview-widget ul li{
    flex-direction: row;
    width: 50%;
}
.s-preview-widget h3{
    font-size: 22px;
    margin-top: 5px;
    margin-bottom: 0;
}
.s-preview-widget ul li{
    margin: 8px 0;
}

.s-preview-address h6{
     font-size: 18px;
     color: #109896;
    margin-top: 5px;
    margin-bottom: 0;
}
.s-preview-address ul li{
    flex-direction: row;
}
.s-preview-address ul li label{
    min-width: 160px;
}

.s-doc-preview p{
    text-align: center;
    font-weight: 600;
    margin: 0;

}
.s-doc-preview small{
    display: block;
    font-size: 13px;
    text-align: center;
}
.desc-program-dt{
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 10px;
    margin-top: 10px;
}
.desc-program-dt h6{
    font-size: 16px;
    margin: 5px 0;
    color: #000;
    font-weight:600 ;
}
.desc-program-dt p,.p-b-para{
    margin: 0;
    font-size: 14px;
}
ul.p-dt-ul{
    margin: 0;
}
.p-dt-ul li{
     margin: 5px 0;
    font-size: 14px; 
}
.u-details-preview {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 15px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.u-details-preview h6{
    font-size: 16px;
    margin: 5px 0;
    color: #000;
    font-weight:600 ;
}
.u-details-preview ul{
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 10px;
    flex-wrap: wrap;
}
.u-details-preview ul li{
    margin: 0 0;
    width: 49%;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    font-size: 15.5px;
    padding-right: 20px;
}
.u-details-preview ul li label{
    font-weight: 600;
    color: #000;
    white-space: nowrap;
    margin-right: 10px;
    min-width: 150px;
}


.table-over {
  overflow: auto;
  position: relative;
}

.table-over .dropdown {
  position: static;
}

.table-over .dropdown-menu {
  position: absolute;
}




.invoice-info{
  background-color: #f2f2f2;
  padding:4px 15px;
  border-radius: 10px;
  height: 100%;
}
.invoice-info h4{
  font-size: 16px;
  font-weight: 700;
  color: #012970;
  margin-top: 10px;
}
.invoice-info ul{
  padding: 0;
  margin: 0;
  list-style: none;
}
.invoice-info ul li{
  font-size: 14px;
  margin: 13px 0;
  font-weight: 500;
}
.invoice-info ul li span{
  font-weight: 400;
}

.applicant-details {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    padding: 15px;
    border-radius: 12px;
}
.applicant-details input,.applicant-details textarea,.applicant-details select{
    background-color: #fff !important;
}
.applicant-details h3{
    font-size: 18px;
    color: #109896;

}
.td-field select,.td-field input{
    font-size: 14px;
    border-radius: 5px;
    border: 1px solid #222;
    width: 180px;
    margin: 0 auto;
}
.invoice-info-bottom-cs ul{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}
.invoice-info-bottom-cs ul li{
    width: 32.6%;
    margin: 0;
}




/*Preview pages*/

.wo-preview-top {
    display: flex;
    justify-content: center;
    align-items: Center
}

.wo-preview-top img {
    width: 300px;
}

.preview-container-center h3 {
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    color: #000;
    margin-bottom: 20px;
}

.line-hr {
    width: 100%;
    height: 2px;
    background-color: #000;
    margin: 25px 0;
    display: flex;
    margin-top: 2px;

}

.preview-container-center h4 {
    font-size: 18px;
    color: #000;
    font-weight: 700;
}

.preview-container-center p {
    font-size: 15px;
    margin: 5px 0;
}

.preview-container-center-right table tr,
.preview-container-center-right table tr th,
.preview-container-center-right table tr td {
    border: 0 !important;
}

.preview-container-center-right table tr th,
.preview-container-center-right table tr td {
    padding: 5px 0 !important;
    font-size: 15px;
    font-weight: 400;
}

.preview-container-center-right table tr th {
    text-transform: uppercase;
}

.preview-container-center-bottom table tr th {
    border: 0 !important;
    border-top: 1px solid #222 !important;
    border-bottom: 1px solid #222 !important;
    padding: 5px;
    background-color: transparent;
    font-size: 16px;
    text-align: center;
}

.preview-container-center-bottom table tr td {
    border: 0;
    padding: 5px;
    background-color: transparent;
    font-size: 16px;
    text-align: center;
}

.preview-bottom-left table tr td {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 15px;
}

.preview-bottom-right ul {
    margin: 0;
    padding: 0;
    list-style: none;
}


.preview-bottom-right ul li {
    display: flex;
    justify-content: space-between;
}

.preview-bottom-right table tr th {
    font-size: 16px;
    font-weight: 600;
    padding: 0px !important;
}

.preview-bottom-right table tr td {
    font-weight: 300 !important;
    padding: 0px !important;
}

.preview-bottom-right table tr td.pdt,
.preview-bottom-right table tr th.pdt {
    padding-top: 35px !important;
}

.preview-bottom-right table tr td .line-cs {
    height: 0.5px;
    width: 100%;
    background-color: #000;
}

.preview-bottom-btns {
    display: Flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    padding-top: 20px;
}

.preview-bottom-btns a,
.preview-bottom-btns button {
    margin: unset !important;
}


.wo-preview-top-2 {
    flex-direction: column;
    align-items: flex-start;
}

.wo-preview-top-2 .line-cs-2 {
    height: 0.8px;
    width: 100%;
    background-color: #000;
    margin: 3px 0;
}

.preview-container-center-two ul {
    margin: 0;
    list-style: none;
    padding: 0;
}

.preview-container-center-two ul li {
    margin: 7px 0;
    font-size: 15px;
    font-weight: 400;
    color: #000;
}

.p-tag p {
    color: #000;
    font-weight: 500;
}

.preview-container-center h2 {
    font-size: 25px;
    margin: 10px 0;
    color: #000;
    margin-top: 30px;
}

.figures-list ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.figures-list ul li {
    padding: 7px 15px;
    border-radius: 10px;
    margin: 5px 0;
    font-size: 15px;
    font-weight: 500;
    color: #fff;
}

.figures-list ul li.bg1 {
    background-color: #ff6300;
}

.figures-list ul li.bg2 {
    background-color: #094fb6;
}

.figures-list ul li.bg3 {
    background-color: #19871a;
}

.figures-list ul li.bg4 {
    background-color: #e61b1b;
}

.figures-list ul li.bg5 {
    background-color: #875119;
}


.label-between {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px
}


.label-between button {
    background: #31b331 !important;
    border-color: #31b331 !important;
    padding: 5px 15px;
    border-radius: 40px;
}

.center-text{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.center-text p{
    text-align: center;
}

.remark-invoice{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}
.remark-invoice h3{
    font-size: 16px;
    margin-bottom: 2px;
    font-weight: 600;
}
.remark-invoice p{
    font-size: 13px;
    color: #323232;
}

.flex-radio{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
}

.flex-radio label{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}
.flex-radio input{
    width: 18px;
    height: 18px;
}


.login-btns-index{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
}
.login-btns-index a{
    width:300px;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #5BC1D7;
    color: #fff;
    margin: 5px 0;
    border-radius: 7px;
    font-size: 14px;
    transition: 0.5s;
}
.login-btns-index a.bg1{
    background-color: #0f5f70;
}
.login-btns-index a.bg2{
    background-color: #49a25f;
}

.login-btns-index a:hover{
    border-radius: 40px;
}

/* Wrapper */
/* .ax-preview-wrap {
    max-width: 1150px;
    margin: auto;
    padding: 30px;
} */

/* Section Card */
.ax-card {
    background: #fff;
    border-radius: 14px;
    padding: 25px;
    margin-bottom: 20px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    
}

/* Title */
.ax-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 20px;
}

/* Section Heading */
.ax-head {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 15px;
    color: #4f46e5;
    border-left: 4px solid #4f46e5;
    padding-left: 10px;
}

/* Grid */
.ax-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 18px;
}

/* Field */
.ax-label {
    font-size: 12px;
    color: #6b7280;
}

.ax-value {
    font-size: 14px;
    font-weight: 500;
}

/* Document Box */
.ax-doc {
    padding: 10px 14px;
    background: #eef2ff;
    border-radius: 8px;
    font-size: 13px;
}

/* Buttons */
.ax-actions {
    text-align: right;
}

.ax-btn {
    padding: 10px 18px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
}

.ax-edit { background: #e5e7eb; }
.ax-submit { background: #4f46e5; color: #fff; }

.input-edit{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}
.input-edit button{
    min-width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #b23939;
    color: #fff;
    border: 0;
}



/* Wrapper */
/* .cn-preview-shell {
    max-width: 1200px;
    margin: auto;
    padding: 30px;
} */

/* Header */
.cn-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

.cn-title {
    font-size: 24px;
    font-weight: 600;
}

/* Card */
.cn-box {
    background: #fff;
    border-radius: 16px;
    padding: 22px;
    margin-bottom: 20px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.3);
}

/* Section Title */
.cn-section {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 5px;
    color: #000;
    text-transform: uppercase;
}

/* Grid */
.cn-flex {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
    gap: 10px;
}

/* Field */
.cn-label {
    font-size: 11px;
    color: #94a3b8;
}

.cn-value {
    font-size: 14px;
    font-weight: 500;
}

/* Highlight Strip */
.cn-highlight {
    background: linear-gradient(135deg, #38bdf8, #6366f1);
    border-radius: 14px;
    padding: 20px;
    margin-bottom: 20px;
    color: white;
}
.cn-highlight .cn-label{
    color: #fff;
}

/* Document Tag */
.cn-tag {
    background: #f2f2f2;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 13px;
    display: inline-block;
}

/* Action Buttons */
.cn-actions {
    text-align: right;
}

.cn-btn {
    padding: 10px 18px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
}

.cn-edit {
    background: #334155;
    color: white;
}

.cn-submit {
    background: #22c55e;
    color: white;
}



/* Title */
.csx-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 20px;
}

/* Card */
.csx-card {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 20px;
    background-color: #fff;
}

/* Section */
.csx-head {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 15px;
}

/* Grid */
.csx-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 15px;
}

/* Field */
.csx-label {
    font-size: 12px;
    color: #6b7280;
}

.csx-value {
    font-size: 14px;
    font-weight: 500;
}

/* Docs */
.csx-doc {
    border: 1px dashed #d1d5db;
    padding: 8px 10px;
    border-radius: 6px;
    font-size: 13px;
}

/* Actions */
.csx-actions {
    text-align: right;
}

.csx-btn {
    padding: 8px 16px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
}

.csx-edit {
    background: #e5e7eb;
}

.csx-submit {
    background: #111;
    color: #fff;
}


/* SYSCON */


.login-screen-top-img {
    width: 100%;
    height: 60vh;
    background-color: red;
    border-radius: 0 0 200px 200px;
    /* background-image:linear-gradient(348deg,rgba(0, 39, 95, 0.46) 0%, rgba(0, 39, 95, 0.46) 100%),url(../img/baner/1.jpg) ; */
    background-image: linear-gradient(348deg, rgb(18 84 98 / 46%) 0%, rgb(15 101 121 / 46%) 100%), url(../img/baner/1.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 100px;
}
.login-screen-top-img h2{
    color: #fff;
    font-size: 30px;
    font-weight: 600;
    margin: 0;
}





.login-mtop{
    margin-top: -180px;
}


.modal-mark-icon{
    margin: auto;
    font-size: 30px;
    color: red;
    display: flex;
    justify-content: center;
    align-items: center;
}
.cnt-modal-cs{
    border-radius: 25px !important;
}

.title-w-sec{
    font-size: 20px;
    font-weight: 600;
    color: #087697;
}







/* CARD */
.dp-card {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(12px);
    border-radius: 16px;
    padding: 25px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.1);
}

/* HEADER */
.dp-title {
    font-size: 26px;
    font-weight: 600;
    color: #111827;
    margin-bottom: 20px;
}

/* GRID */
.dp-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 15px;
}

/* METRIC BOX */
.dp-metric-box {
    background: white;
    border-radius: 12px;
    padding: 15px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    transition: 0.3s;
}

.dp-metric-box:hover {
    transform: translateY(-5px);
}

.dp-label {
    font-size: 13px;
    color: #6b7280;
}

.dp-value {
    font-size: 22px;
    font-weight: bold;
    color: #111827;
    margin-top: 5px;
}

/* SCORE SECTION */
.dp-score-area {
    margin-top: 25px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* CIRCLE */
.dp-score-circle {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: conic-gradient(#4f46e5 90%, #e5e7eb 0%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.dp-score-inner {
    width: 110px;
    height: 110px;
    background: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dp-score-text {
    font-size: 28px;
    font-weight: bold;
    color: #4f46e5;
}

/* RATING BADGE */
.dp-rating-badge {
    padding: 10px 20px;
    border-radius: 30px;
    font-weight: 600;
    font-size: 16px;
}

.dp-excellent {
    background: #dcfce7;
    color: #16a34a;
}

.dp-good {
    background: #dbeafe;
    color: #2563eb;
}

.dp-average {
    background: #fef9c3;
    color: #ca8a04;
}

.dp-poor {
    background: #fee2e2;
    color: #dc2626;
}

/* TABLE */
.dp-table {
    margin-top: 30px;
    width: 100%;
    border-collapse: collapse;
}

.dp-table th {
    text-align: left;
    padding: 12px;
    background: #f9fafb;
    font-size: 14px;
}

.dp-table td {
    padding: 12px;
    border-bottom: 1px solid #e5e7eb;
    font-size: 14px;
}

.btns-driver-bottom{
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 15px;
    gap: 10px;
}

.btns-driver-bottom a{
    padding: 7px 15px;
    background-color: #025187;
    color: #fff;
    font-size: 14px;
    border-radius: 7px;
    transition: 0.5s;
}
.btns-driver-bottom a:hover{
    border-radius: 40px;
}
.btns-driver-bottom a.bg1{
    background-color: #00a825;
}
.btns-driver-bottom a.bg2{
    background-color: #8335c2;
}
.btns-driver-bottom a.bg3{
    background-color: #9c711c;
}
.btns-driver-bottom a.bg4{
    background-color: #bf2323;
}



/* CARD */
.dpd-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 20px;
    margin-bottom: 25px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

/* TITLE */
.dpd-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
}

/* SUMMARY GRID */
.dpd-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 15px;
}

.dpd-box {
    background: linear-gradient(135deg, #4f46e5, #6366f1);
    color: white;
    padding: 15px;
    border-radius: 12px;
    transition: 0.3s;
}

.dpd-box:hover {
    transform: translateY(-5px);
}

.dpd-label {
    font-size: 13px;
    opacity: 0.9;
}

.dpd-value {
    font-size: 22px;
    font-weight: bold;
    margin-top: 5px;
}

/* FILTERS */
.dpd-filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 15px;
}

.dpd-input {
    width: 100%;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #d1d5db;
    outline: none;
}

/* TABLE */
.dpd-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

.dpd-table th {
    text-align: left;
    background: #f3f4f6;
    padding: 12px;
    font-size: 14px;
}

.dpd-table td {
    padding: 12px;
    border-bottom: 1px solid #e5e7eb;
    font-size: 14px;
}

/* BADGES */
.dpd-badge {
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

.dpd-excellent { background:#dcfce7; color:#16a34a; }
.dpd-good { background:#dbeafe; color:#2563eb; }
.dpd-average { background:#fef9c3; color:#ca8a04; }
.dpd-poor { background:#fee2e2; color:#dc2626; }




/* CARD */
.dpdx-card {
    background: rgba(255,255,255,0.7);
    backdrop-filter: blur(10px);
    border-radius: 18px;
    padding: 25px;
    margin-bottom: 25px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* TITLE */
.dpdx-title {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 20px;
}

/* GRID */
.dpdx-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
}

/* METRIC CARD */
.dpdx-metric {
    border-radius: 16px;
    padding: 20px;
    color: white;
    position: relative;
    overflow: hidden;
    transition: 0.3s;
    display: flex;
    align-items: center;
    gap: 10px;
}

.dpdx-metric:hover {
    transform: translateY(-6px);
}

/* ICON CIRCLE */
.dpdx-icon {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.2);
    font-size: 18px;
    margin-bottom: 12px;
}

/* TEXT */
.dpdx-label {
    font-size: 14px;
    opacity: 0.9;
}

.dpdx-value {
    font-size: 26px;
    font-weight: bold;
    margin-top: 5px;
    margin-left: auto;
}

/* BACKGROUND VARIANTS */
.dpdx-blue { background: linear-gradient(135deg, #4f46e5, #6366f1); }
.dpdx-green { background: linear-gradient(135deg, #16a34a, #22c55e); }
.dpdx-orange { background: linear-gradient(135deg, #ea580c, #f97316); }
.dpdx-red { background: linear-gradient(135deg, #dc2626, #ef4444); }
.dpdx-yellow { background: linear-gradient(135deg, #ca8a04, #facc15); }
.dpdx-purple { background: linear-gradient(135deg, #7c3aed, #a855f7); }

/* DECORATIVE SHAPE */
.dpdx-metric::after {
    content: "";
    position: absolute;
    width: 120px;
    height: 120px;
    background: rgba(255,255,255,0.15);
    border-radius: 50%;
    top: -30px;
    right: -30px;
}




/* CONTAINER */
.dpx-container {
    max-width: 1200px;
    margin: 30px auto;
    padding: 20px;
}

/* CARD */
.dpx-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 22px;
    margin-bottom: 25px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

/* TITLE */
.dpx-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
}

/* GRID */
.dpx-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 15px;
}

/* ITEM BOX */
.dpx-item {
    background: #f9fafb;
    padding: 15px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.dpx-icon {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}

/* COLORS */
.dpx-blue { background:#3b82f6; }
.dpx-green { background:#22c55e; }
.dpx-orange { background:#f97316; }
.dpx-red { background:#ef4444; }
.dpx-purple { background:#8b5cf6; }
.dpx-yellow { background:#eab308; }

/* TABLE */
.dpx-table {
    width: 100%;
    border-collapse: collapse;
}

.dpx-table th {
    background: #f3f4f6;
    padding: 12px;
    text-align: left;
    font-size: 14px;
}

.dpx-table td {
    padding: 12px;
    border-bottom: 1px solid #e5e7eb;
}

/* BADGES */
.dpx-badge {
    padding: 5px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

.dpx-open { background:#fee2e2; color:#dc2626; }
.dpx-progress { background:#fef9c3; color:#ca8a04; }
.dpx-closed { background:#dcfce7; color:#16a34a; }

/* BUTTON */
.dpx-btn {
    display: inline-block;
    padding: 10px 15px;
    border-radius: 10px;
    color: white;
    text-decoration: none;
    margin-right: 10px;
    font-size: 14px;
    color: #fff !important;
}

.dpx-call { background:#16a34a; }
.dpx-whatsapp { background:#25D366; }
.it-color-cs i{
    color: #025187;
    font-size: 22px;
}




/* Card */
.route-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 25px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

/* Header */
.route-header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 20px;
    gap: 15px;
}

.route-title {
    font-size: 20px;
    font-weight: 500;
}

.route-time {
    color: #b23939;
    font-size: 14px;
    font-weight: 500;
}

/* Timeline */
.timeline {
    position: relative;
    margin-left: 15px;
}

.timeline::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 0;
    width: 3px;
    height: 100%;
    background: #dfe6f1;
}

/* Stop */
.stop {
    position: relative;
    padding: 15px 15px 15px 40px;
    margin-bottom: 10px;
    border-radius: 10px;
    transition: 0.3s;
}

.stop:hover {
    background: #f1f5ff;
}

/* Dot */
.stop::before {
    content: '';
    position: absolute;
    left: 3px;
    top: 20px;
    width: 16px;
    height: 16px;
    background: #c5d1ff;
    border-radius: 50%;
    border: 3px solid white;
}

/* Active stop */
.stop.active {
    background: #eef3ff;
}

.stop.active::before {
    background: #4a6cf7;
}

/* Stop text */
.stop-name {
    font-weight: 500;
}

.stop-time {
    font-size: 13px;
    color: #777;
}

/* Badge */
.badge-cs {
    background: #4a6cf7;
    color: white;
    font-size: 11px;
    padding: 4px 8px;
    border-radius: 6px;
    margin-left: 8px;
}
.min-width-route  td{
    min-width: 150px !important;
}
.min-width-route td.nomin{
    min-width: unset !important;
}

td.w-min-c {
    min-width: 220px !important;
}

.gmap-select{
    width: 100%;
    height: 250px;

}
.gmap-select iframe{
    width: 100%;
    height: 100%;
    border-radius: 10px;
}
/* 
.col-20 .col-lg-4{
    width: 20%;
} */

.min-width-150  td{
    min-width: 150px;
}

td.nomin{
    min-width: unset !important;
}

.oem-dt-box{
    background-color: #f7f7f7;
    padding: 12px;
    border-radius: 10px;
    margin: 10px 0;
    border: 1px solid #ccc;
}
.oem-dt-box h3{
    font-size: 18px;
    font-weight:600 ;
    margin: 0;
}

.widget-preview-sys{
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    padding: 12px;
    border-radius: 10px;
}
.widget-preview-sys ul li{
    width: 100%;
    padding: 0;
    border: 0;
}



/* Wrapper */
.holiday-calendar-wrapper {
    background-color: #ffffff;
    padding: 15px;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    /* box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px; */
    /* background: rgba(255, 255, 255, 0.771); */
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

/* Card */
.holiday-calendar-card {
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(10px);
    border-radius: 16px;
    padding: 20px;
    color: #fff;
}

/* Header */
.holiday-calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.holiday-calendar-header h4 {
    margin: 0;
    font-weight: 600;
    color: #000;
}

/* Controls */
.holiday-calendar-controls {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #000;
}

.hc-btn {
    background: #0d6efd;
    border: none;
    color: #fff;
    padding: 5px 10px;
    border-radius: 6px;
    cursor: pointer;
}

.hc-btn:hover {
    background: #0b5ed7;
}

/* Calendar Grid */
.holiday-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 8px;
}

/* Day Cell */
.hc-day {
    padding: 10px;
    text-align: center;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.05);
    position: relative;
    color: #000;
}

/* Header Days */
.hc-day-name {
    font-weight: bold;
    background: transparent;
    color: #000;
}

/* Weekend */
.hc-weekend {
    background: #afcaf2;
}

/* Holiday */
.hc-holiday {
    background: #e77373;
    border: 1px solid #ccc;
}

/* Today */
.hc-today {
    border: 2px solid #ccc;
}

/* Legend */
.holiday-legend {
    margin-top: 15px;
    display: flex;
    gap: 20px;
    font-size: 14px;
}
.holiday-legend span{
    color: #000;
}

.legend-dot {
    width: 10px;
    height: 10px;
    display: inline-block;
    border-radius: 50%;
    margin-right: 5px;
}

.holiday-dot {
    background: red;
}

.weekend-dot {
    background: #446390;
}


/* Holiday name inside box */
.hc-holiday-name {
    font-size: 10px;
    margin-top: 5px;
    line-height: 1.2;
    color: #000;
    font-weight: 500;
}

/* Better spacing */
.hc-day {
    min-height: 60px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* Hover effect */
.hc-day:hover {
    transform: scale(1.05);
    transition: 0.2s;
    cursor: pointer;
}
.row-col-5 .col-lg-3{
    width: 20%;
}







.payroll-add-box{
  background-color: #c5d9eb;
  border-radius: 10px;
  padding: 20px;
 }
 .pay-roll-add-dlt{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
 }
 .pay-roll-add-dlt button{
  width: 35px;
  height: 35px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 0;
  transition: 0.5s;
 }
 .pay-roll-add-dlt button.payroll-add{
  background-color: #00b253;
  color: #fff;
  border: 1px solid #00b253;
 }
 .pay-roll-add-dlt button.payroll-add:hover{
  background-color: transparent;
  color: #00b253;
 }
 .pay-roll-add-dlt button.payroll-dlt{
  background-color: #b23939;
  color: #fff;
  border: 1px solid #b23939;
 }
 .pay-roll-add-dlt button.payroll-dlt:hover{
  background-color: transparent;
  color: #b23939;
 }
 .payroll-view-top ul{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
 }
 .payroll-view-top ul li{
  font-size: 16px;
  font-weight: 600;
  padding: 7px 15px;
  background-color: red;
  color: #fff;
  border-radius: 10px;

 }
 
 .payroll-view-info{
  background-color: #f7f7f7;
  padding: 20px;
  margin: 10px 0;
  border-radius: 15px;
 }
 .payroll-view-info ul{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-items: center;
 }
 .payroll-view-info ul li{
  width: 50%;
  margin: 15px 0;
  font-size: 16px;
  font-weight: 600;
 }
 .payroll-view-info ul li span{
  font-weight: 400;
  margin-left: 10px;
 }
 .payroll-table th{
  min-width: 180px;
 }
 .payroll-table th:first-child{
  min-width: 80px !important;
 }

 .payroll-print-section{
  background-color: #c5d9eb;
  min-height: 100vh;
  padding: 50px;
 }
 .payroll-print-preview{
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
 }
 .payroll-print-table tr th{
   font-size: 15px;
   padding: 12px;
   color: #012970;
 }
 .payroll-print-table tr td{
  padding: 12px;
  font-size: 14px;
 }
 .print-btn-cs{
  width: 100px;
  border: 0;
  height: 35px;
  background-color: #b23939;
  border-radius: 5px;
  color: #fff;
  transition: 0.5s;
 }
 .print-btn-cs:hover{
  border-radius: 40px;
 }




.ps_container {
    width: 800px;
    margin: 10px 0;
    background: #fff;
    padding: 25px;
    border: 1px solid #ddd;
    border-radius: 25px;
}

/* Header */
.ps_header {
    text-align: center;
    border-bottom: 2px solid #333;
    padding-bottom: 10px;
}

.ps_company {
    font-size: 22px;
    font-weight: bold;
}
.ps_company img{
    width: 200px;
}
.ps_title {
    font-size: 16px;
    margin-top: 5px;
}

/* Sections */
.ps_section {
    margin-top: 20px;
}

.ps_section h3 {
    background: #f1f1f1;
    padding: 8px;
    font-size: 14px;
}

/* Grid */
.ps_grid {
    display: flex;
    flex-wrap: wrap;
}

.ps_item {
    width: 50%;
    margin: 5px 0;
    font-size: 13px;
}

/* Tables */
.ps_table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

.ps_table th, .ps_table td {
    border: 1px solid #ccc;
    padding: 8px;
    text-align: left;
}

.ps_table th {
    background: #f7f7f7;
}

/* Summary */
.ps_summary {
    margin-top: 15px;
}

.ps_summary div {
    display: flex;
    justify-content: space-between;
    margin: 5px 0;
}

.ps_net {
    font-size: 18px;
    font-weight: bold;
    color: green;
    border-top: 2px solid #000;
    padding-top: 10px;
}

/* Footer */
.ps_footer {
    margin-top: 20px;
    font-size: 12px;
    text-align: center;
    border-top: 1px solid #ccc;
    padding-top: 10px;
}


.filters-complaint{
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 12px;
    padding: 12px;
    margin: 10px 0;
}

.multi-btns{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}
.multi-btns button{
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: 0;
    background-color: #0ebe11;
    color: #fff;
}

/* 
.wa-container {
  padding: 20px;
  font-family: "Segoe UI", sans-serif;
} */

.wa-card {
  background: #ffffff;
  border-radius: 16px;
  padding: 20px;
  max-width: 700px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
  border: 1px solid #eaeaea;
}

.wa-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.wa-title {
  font-size: 20px;
  margin: 0;
}

.wa-badge {
  background: #25D366;
  color: #fff;
  padding: 5px 10px;
  border-radius: 20px;
  font-size: 12px;
}

.wa-description {
  margin: 12px 0 18px;
  color: #555;
  font-size: 14px;
}

.wa-section {
  margin-bottom: 18px;
}

.wa-section h3 {
  margin-bottom: 8px;
  font-size: 15px;
  color: #333;
}

.wa-list {
  padding-left: 18px;
  color: #444;
  font-size: 14px;
}

.wa-list li {
  margin-bottom: 6px;
}

.wa-preview {
  background: #f4fdf7;
  border-left: 4px solid #25D366;
  padding: 12px;
  border-radius: 8px;
  font-size: 13px;
  color: #222;
}

.wa-footer {
  text-align: right;
}

.wa-btn {
  background: #ccc;
  color: #666;
  border: none;
  padding: 10px 16px;
  border-radius: 8px;
  cursor: not-allowed;
  font-size: 14px;
}

.coming-soon-sec {
    height: 85vh;
    display: flex;
    justify-content: center;
    align-items: center;
    /* background: #ffffff; */
    position: relative;
    overflow: hidden;
}

/* Text styling */
.coming-soon-sec h1 {
    font-size: 50px;
    color: #222;
    letter-spacing: 4px;
    font-weight: 600;
    z-index: 2;
    animation: fadeInUp 1.5s ease forwards;
}

/* Floating shapes */
.shape {
    position: absolute;
    border-radius: 50%;
    opacity: 0.2;
    animation: float 10s infinite ease-in-out;
}

/* Different shapes */
.shape1 {
    width: 120px;
    height: 120px;
    background: #0072ff;
    top: 10%;
    left: 20%;
}

.shape2 {
    width: 80px;
    height: 80px;
    background: #00c6ff;
    bottom: 15%;
    right: 25%;
    animation-duration: 12s;
}

.shape3 {
    width: 150px;
    height: 150px;
    background: #ff7eb3;
    top: 60%;
    left: 10%;
    animation-duration: 14s;
}

.shape4 {
    width: 100px;
    height: 100px;
    background: #8e44ad;
    top: 20%;
    right: 10%;
    animation-duration: 11s;
}

/* Floating loop animation */
@keyframes float {
    0% {
        transform: translateY(0px) translateX(0px);
    }
    50% {
        transform: translateY(-30px) translateX(20px);
    }
    100% {
        transform: translateY(0px) translateX(0px);
    }
}

/* Text entry */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.field-table tr td select,.field-table tr td input{
    height: 40px;
    border-radius: 5px;
}

.field-table-cs tr td {
    text-align: left !important;
}
.field-table-cs tr td select,.field-table-cs tr td input{
    border: 1px solid #22222282;
    box-shadow: none !important;
    font-size: 15px;
}



.dor-wrap {
  /* max-width: 1200px; */
  margin: 30px auto;
  margin-top: 0;
  padding: 20px;
  background-color: #d9e4f2;
  border-radius: 20px;
}

/* Header */
.dor-header {
  background: linear-gradient(135deg, #1e3c72, #2a5298);
  color: white;
  padding: 25px;
  border-radius: 12px;
  margin-bottom: 25px;
}

.dor-header h2 {
  margin: 0;
}

/* Section */
.dor-section {
  margin-bottom: 25px;
}

.dor-section-title {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #000;
}

/* Grid */
.dor-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
}

/* Card */
.dor-card {
  background: white;
  padding: 15px;
  border-radius: 10px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.dor-label {
  font-size: 12px;
  color: #565353;
}

.dor-value {
  font-size: 15px;
  font-weight: 600;
  margin-top: 4px;
  color: #000;
}

/* Auto */
.dor-auto {
  color: #504d4d;
  font-style: italic;
}

/* Wide */
.dor-wide {
  grid-column: span 4;
}

@media(max-width:768px){
  .dor-grid { grid-template-columns: 1fr; }
}

.vehicle-short-preview {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    border-radius: 12px;
    padding: 15px;
}

.vehicle-short-preview ul{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}
.vehicle-short-preview ul li{
    width: 33%;
    margin: 10px 0;
    font-weight: 600;
    color: #000;
}
.vehicle-short-preview ul li span{
    font-weight: 400;
    margin-left: 10px;
}

.vehicle-short-preview h4{
    font-size: 18px;
    font-weight: 600;
    color: #0072ff;
}

.xl-table tr th{
    background-color: #ccc ;
    font-weight: 600;
    padding: 7px 15px !important;
}
.xl-table tr td{
    color: #000 !important;
    padding: 15px 15px !important;
    font-size: 14px;
}
.bt-ween-print{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.bt-ween-print a{
    background-color: #b23939;
    border-color: #b29339;
    display: flex;
}