:root {
    --hw-primary: #16C4C0;
    --hw-secondary: #9D9DFC;
    --hw-dark: #333;
}
body{
    padding: 0;
    margin: 0;
    font-family: "Poppins", sans-serif !important;
    overflow-x: hidden;
}
.green-btn{
    font-weight: 500;
    font-size: 15px;
    padding: 10px 60px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    background-color: #16C4C0;
    color: #fff;
    gap: 5px;
}
.all-btn .btn{
      font-weight: 500;
    font-size: 14px;
    padding: 14px;
    width: 132px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    border: 1px solid #6B7280;
    color: #6B7280;
    gap: 5px;
    background-color: transparent;
}
.all-btn .btn i{
    font-size: 18px;
}
.input-search{
    display: flex;
    align-items: center;
    position: relative;
}
.input-search .form-control{
    width: 430px;
    height: 42px;
    border-radius: 5px;
    border: 1px solid #6B7280;
    color: #6B7280;
    font-size: 14px;
    background: #FFF;
    padding-left: 38px;
}
.input-search i{
    position: absolute;
    left: 10px;
    font-size: 20px;
}
.top-icons a{
    color: #6B7280;
    text-decoration: none;
}
.top-icons a i{
    font-size: 24px;
}
.gap-18{
    gap: 18px;
}
.drop-user{
    padding-left: 20px;
}
.drop-user .header-profile-user {
    height: 30px;
    width: 30px;
}
.hambarger-menu i{
    width: 25px;
    height: 25px;
    color: #828282;
    font-size: 25px;
}
.top-logo{
    display: flex;
    align-items: center;
    justify-content: space-between;
    vertical-align: middle;
}
.hambarger-menu{
    height: 20px;
    cursor: pointer;
}
/* 2.7.25 */
.project-tab{
    border-bottom: 1px solid #D8D8D8;
    overflow-x: auto;
    gap: 30px;
    flex-wrap: nowrap;
    padding-bottom: 0;
    overflow-y: hidden;
}
.mb-30{
    margin-bottom: 30px !important; 
}
.project-tab li{
    border-bottom: none;
    padding: 0px;
    color: #333;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    height: 40px;
}
.project-tab li button{
    padding: 0;
    color: #333;
    padding: 9px 15px;
    line-height: 20px;
    border-bottom: 2px solid transparent !important;
}
.project-tab li button.active{
    border-radius: 5px 5px 0px 0px;
    border: none;
    border-bottom: 2px solid #44C9C7 !important;
    background-color: #ACF5F2 !important;
}
.project-tab li button:hover, .project-tab li button:focus{
    color: #2B2B2B;
    text-decoration: none;
    margin-bottom: none !important;
    padding-bottom: none !important;
    border-radius: 5px 5px 0px 0px;
    border-bottom: 2px solid transparent;
    background: #ACF5F2;
     padding: 9px 15px;
     line-height: 20px;
}
.project-box{
    padding: 15px;
    border-radius: 5px;
    border: 1px solid #E5E7EB;
    background: #FFF;
    box-shadow: 1px 1px 1px 0px rgba(198, 198, 198, 0.20);
}
.project-box h3{
    font-size: 15px;
    font-weight: 600;
    color: #000;
    margin: 0 0 20px 0;
}
/* Portfolio Breakdown Legend */
.portfolio-legend .color-dot { 
    display:inline-block; 
    width:12px; 
    height:12px; 
    border-radius:50%; 
}
.portfolio-legend li { 
    margin-right:1.25rem; 
    font-size:.875rem; 
}
.portfolio-legend input[type=checkbox] {
     cursor:pointer; 
}
.portfolio-breakdown-wrapper { gap:20px; align-items:center; }
.portfolio-breakdown-chart { flex:0 0 320px; }
/* Fade effect class applied before helpdesk ticket status-triggered reload */
body.ticket-reload-fade { opacity: .4; transition: opacity .35s ease; }
@media (max-width: 767.98px) {
  .portfolio-breakdown-wrapper { flex-direction: column !important; }
  .portfolio-breakdown-chart { width:100%; }
  .portfolio-legend { margin-left:0 !important; }
}
.thead-light{
    background-color: #E8E8E8 !important;
}
.project-table table{
    border-radius: 5px;
    position: relative;
}
.project-table{
    border-radius: 5px;
    overflow: hidden;
   border: 1px solid rgba(4, 62, 97, 0.20);
   padding: 10px;
   background: #FFF;
   display: block;
   overflow-x: auto !important;
       max-width: calc(100vw - 160px);
}
.sticky-col-header-first{
        position: sticky;
        position: -webkit-sticky;
    left: -10px;
    z-index: 2;
    background-color: #E8E8E8 !important;
}
.sticky-col-header-last{
        position: sticky;
        position: -webkit-sticky;
    right: -10px;
    z-index: 2;
    background-color:#E8E8E8 !important;
}
.sticky-col-body-first{
    position: sticky;
        position: -webkit-sticky;
    left: -10px;
    z-index: 2;
    background-color: #fff !important;
}
.sticky-col-body-last{
     position: sticky;
        position: -webkit-sticky;
    right: -10px;
    z-index: 2;
    background-color: #fff !important;
}
.sticky-col-header-first:nth-child(2){
    left: 32px;
}
.sticky-col-header-first:nth-child(3){
    left: 65px;
}
.sticky-col-header-first:nth-child(4){
    left: 160px;
}
.sticky-col-body-first:nth-child(2){
    left: 32px;
}
.sticky-col-body-first:nth-child(3){
    left: 65px;
}
.sticky-col-body-first:nth-child(4){
    left: 160px;
}
.sticky-col-body-last:last-child{
    text-align: right;
}

.project-table table thead tr th{
    padding: 15px 10px;
    font-size: 14px;
    font-weight: 600;
    color: #262A2D;
    border-bottom: none;
    white-space: nowrap;
    box-shadow:none;
}
.pr-input{
    transition: 0.3s ease-in-out;
}
.pr-input .form-check-input {
    width: 52px !important;
    height: 30px;
    background-color: #E7E7E7;
    border-color: #E7E7E7;
    background-image: url(../../img/round.png) !important;
    background-size: 20px;
    background-position-x: 5px;
    transition: 0.3s ease-in-out;
}
.pr-input .form-check-input:checked{
    background-color: #16C4C0 !important;
    background-position-x: 25px;
    transition: 0.3s ease-in-out;
}
.project-table thead tr, .project-table tbody tr{
    vertical-align: middle;
}
.project-table tbody tr td{
    font-size: 15px;
    font-weight: 400;
    color: #42484B;
    border-bottom: 1px solid #F0F0F0;
    padding: 15px 10px;
    min-height: 50px;
}
.project-table tbody tr td b{
    font-size: 15px;
    font-weight: 500;
    color: #000;
}
.p-15{
    padding: 15px !important;
}
.project-table tbody tr:last-child td{
    border-bottom: none;
}


.heading-btn-sec{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 25px;
}
.heading-btn-sec h3{
    margin-bottom: 0;
}
.green-btn-inner{
    padding: 10px 25px;
    background-color: #16C4C0;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    transition: 0.3s ease-in-out;
    outline: none;
    border: none;
    align-items: center;
}
.green-btn-inner i{
    font-size: 15px;
}
.green-btn-inner:hover{
    background-color: #9D9DFC;
    color: #fff;
    transition: 0.3s ease-in-out;
}
.search-field input{
    padding:10px 15px;
    width: 210px;
    border-radius: 5px;
    border: 1px solid #D9D9D9;
    background-color: #FFF;
    font-size: 14px;
    font-weight: 400;
    color: #515151;
}
.search-field input::placeholder{
    color: #C6C6C6;
    font-size: 14px;
    font-weight: 400;
}
.heading-btn{
    display: flex;
    align-items: center;
    gap: 10px;
}
.dark-border td{
    border-bottom: 1px solid #828282 !important;
}
.no-border td{
    border-bottom: none;
}
.search-field{
    display: flex;
    align-items: center;
    position: relative;
}
.search-field i{
    position: absolute;
    right: 10px;
    font-size: 24px;
    color: #C6C6C6;
}
.pr-45{
    padding-right: 45px !important;
}
.filter-btn{
    padding: 8px 12px;
    height: 40px;
    display: flex;
    align-items: center;
}
.filter-btn i{
    font-size: 20px;
}
/* User Show Page (extracted from inline styles) */
.user-info-card-heading{font-weight:600;padding:15px 25px 15px 0;border-bottom:1px solid #e5e7eb;}
.user-info-left-col{border-right:1px solid #e5e7eb;}
.user-info-avatar{max-width:140px;border-radius:6px;}
.user-info-name{font-weight:600;}
.user-info-moved-fields{font-size:13px;}
.user-info-detail-label{font-size:13px;font-weight:600;}
.user-info-detail-value{font-size:13px;}
.user-info-notes-label{font-size:13px;font-weight:600;padding-top:6px;}
.user-info-right-wrapper{padding:15px 25px;}
.user-info-left-wrapper{padding:15px 25px;}
.user-info-right-divider{border-left:1px solid #e5e7eb;}
/* Group action icons */
.group-item .group-actions{min-width:62px;gap:8px;}
.group-item .group-action{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:17px;line-height:1;cursor:pointer;}
.group-item .group-action i{font-size:18px;}
.group-item .group-action.group-star.default{cursor:default;}
.group-item .group-action.group-remove.disabled{opacity:.35;cursor:not-allowed;color:#999 !important;}
.group-item .group-action.btn{background:transparent;border:none;}
.group-item .group-action.btn:focus{outline:none;box-shadow:none;}
/* Relationship remove icons (reports to / manages / calendar) */
.rel-item .rel-action{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:17px;line-height:1;cursor:pointer;}
.rel-item .rel-action i{font-size:18px;}
/* 3.7.25 */
.w-5{
    width: 5%;
}
.project-offcanvas .offcanvas-header{
    padding: 20px;
    background-color: #F5F5F5;
}
.project-offcanvas{
    border-radius: 15px 0px 0px 15px;
    background-color: #FFF;
    overflow: hidden;
}
.project-offcanvas .offcanvas-header h5{
    color: #000;
    font-size: 20px;
    font-weight: 500;
    margin: 0;
}
.project-offcanvas .offcanvas-header .btn{
    padding: 4px 12px;
    height: 30px;
    border-radius: 5px;
    background-color: #16C4C0;
    font-size: 13px;
    font-weight: 400;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: 0.3s ease-in-out;
    vertical-align: middle;
    line-height: 10px;
}
/* === Utility classes consolidated (inline style replacements) === */
/* Collapse header clickable */
.collapse-toggle{cursor:pointer;}
/* Assigned users scroll area */
.assigned-users-scroll{max-height:160px;overflow:auto;}
.assign-users-submit.enabled{opacity:1;pointer-events:auto;}
/* Offscreen hidden autofill blockers */
.visually-hidden-offscreen{position:absolute;left:-9999px;top:-9999px;height:0;width:0;opacity:0;}
/* Sticky tab style */
.sticky-tab-style{position:sticky;right:0;background:#fff;z-index:10;box-shadow:-5px 0 10px -5px rgba(0,0,0,0.1);}
.project-offcanvas .offcanvas-header .btn i{
    font-size: 20px;
}
.project-offcanvas .offcanvas-footer .btn i{
    font-size: 20px;
}
.project-offcanvas .offcanvas-header .btn:hover{
    background-color: #9D9DFC;
    transition: 0.3s ease-in-out;
}
.project-offcanvas .offcanvas-footer{
    border-top: 1px solid #E5E5E5;
    padding: 20px;
    background-color: #F9F9F9;
}
.project-offcanvas .offcanvas-footer div{
    justify-content: flex-end;
}
.project-offcanvas .offcanvas-footer .btn{
    padding: 14px 12px;
    height: 30px;
    border-radius: 5px;
    background-color: #16C4C0;
    font-size: 13px;
    font-weight: 400;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: 0.3s ease-in-out;
}
.project-offcanvas .offcanvas-footer .btn:hover{
    background-color: #9D9DFC;
    transition: 0.3s ease-in-out;
}
.project-form{
    position: relative;
    margin-bottom: 15px;
}
.project-form .form-control{
    border-radius: 5px;
    border: 1px solid #CECECE;
    background-color: #FFF;
    padding: 10px;
     color: #313131;
    font-size: 14px;
    font-weight: 400;
    margin-top: -5px;
}
.project-form label{
    /* position: absolute;
    left: 13px;
    top: -11px;
     */
    padding: 0 8px;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 0;
    margin-left: 5px;
    background-color: #fff;
    z-index: 10000;
    position: relative;
}
.project-checkbox{
    display: flex;
    align-items: center;
    gap: 10px;
}
.project-checkbox label{
    color: #333;
    font-size: 13px;
    font-weight: 400;
    margin-bottom: 0;
    line-height: 20px;
    cursor: pointer;
}
.project-checkbox input{
    width: 20px;
    height: 20px;
    border: 1px solid #82828280;
    cursor: pointer;
}
.table-pagination{
    text-align: right;
    margin-top: 15px;
}
.table-pagination ul{
        padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    align-items: center;
    vertical-align: middle;
    justify-content: end;
    gap: 5px;
    line-height: 5px;
}
.table-pagination ul li{
    list-style: none;
    font-size: 15px;
    font-weight: 400;
    color: #000;
}
.table-pagination ul li i{
    color: #0000004D;
    font-size: 20px;
}
.navbar-header{
    border-bottom: 1px solid #D8D8D8;
}
.simplebar-mask{
    border-right: 1px solid #D8D8D8;
}
.user-img{
    display: block;
    text-align: center;
}
.user-img img{
    max-width: 100%;
}
.user-img h3{
    color: #000;
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 0;
}
.user-img p{
    font-size: 20px;
    font-weight: 400;
    color: #828282;
    margin: 0;
}
.drop-btn{
    display: flex;
    align-items: center;
    gap: 10px;
}
.drop-btn .btn{
    background-color: transparent;
    padding:0 ;
    border: none;
    color: #16C4C0;
    font-size: 15px;
    font-weight: 700;
}
.drop-btn .btn:focus{
    border: none;
    outline: none;
    box-shadow: none;
    border: none;
}
.navbar-brand-box {
    padding: 0 1rem;
}
.head-items {
    display: flex;
    align-items: center;
    gap: 20px;
}
.head-filters .general-filter-form {
    display: flex;
    align-items: center;
    gap: 20px;
}
.head-filters .general-filter-form .form-select {
    font-weight: 500;
    font-size: 14px;
    padding: 10px 14px;
    width: 132px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    border: 1px solid #6B7280;
    color: #6B7280;
    gap: 5px;
    background-color: transparent;
}
.head-filters .general-filter-form .form-control {
    width: 430px;
    height: 42px;
    border-radius: 5px;
    border: 1px solid #6B7280;
    color: #6B7280;
    font-size: 14px;
    background: #FFF;
    padding-left: 38px;
}
.head-filters .general-filter-form i {
    position: absolute;
    left: 10px;
    font-size: 20px;
    top: 11px;
}

.cros-btn{
    background-color: #16C4C0;
    width: 30px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
    border: none;
    outline: none;
    box-shadow: none;
    line-height: 10px;
}
.create-modal{
    border-radius: 5px;
    overflow: hidden;
} 
.create-modal .modal-header{
    padding: 12px 15px;
    border-bottom: 1px solid rgba(130, 130, 130, 0.50);
    background-color: rgba(206, 206, 206, 0.25);
    border-radius: 0;
}
.create-modal .modal-header h5{
    font-size: 18px;
    color: #000;
}
.create-modal .list-group-flush>.list-group-item{
    padding: 20px;
    border-bottom: 1px solid #828282;
    background-color: #FFF;
    transition: 0.3s ease-in-out;
}
.create-modal .list-group-flush>.list-group-item:hover{
    background-color: #F2F2FC;
    transition: 0.3s ease-in-out;
}
.inner-mod-head div{
    display: flex;
    align-items: center;
    gap: 15px;
}
.inner-mod-head div h3{
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0;
}
.inner-mod-head small{
    color: #828282;
    font-size: 14px;
    font-weight: 400;
    margin-top:10px;
    display: block;
}
.modal-right-arrow i{
    font-size: 25px;
}
/* 8.7.25 */
.login-bg{
    background: url(../../img/login-bg.png) top center no-repeat;
    background-size: cover;
}
.login-bg img{
    max-width: 100%;
}
.login-logo{
    max-width: 337px;
    margin-bottom: 60px;
}
.login-form{
    padding: 0 160px;
}
.login-form h1{
    color: #333;
    font-size: 35px;
    font-weight: 600;
    margin: 0 0 10px 0;
}
.login-form h2{
    color: #828282;
    font-size: 20px;
    font-weight: 400;
    margin: 0;
}
.login-form .form-group input{
    border: 1px solid rgba(130, 130, 130, 0.50);
    background:transparent !important;
    border-radius: 0;
    height: 80px;
    padding: 25px;
    font-size: 18px;
    font-weight: 400;
    color: #515151;
}
.bg-grey-login{
    background-color: #FDFDFD;
}
.login-form .form-group{
    margin-bottom: 20px;
}
.forget-txt a{
    color: #828282 !important;
    font-size: 18px;
    font-weight: 600;
    text-decoration: none !important;
    margin-top: 5px;
    display: block;
}
.login-form .btn{
    background-color: #9D9DFC;
    border-radius: 0;
    height: 75px;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    text-transform: uppercase;
    transition: 0.3s ease-in-out;
    border: none;
}
.login-form .btn:hover{
    transition: 0.3s ease-in-out;
    background-color: #16C4C0;
    border: none;
}
.login-form .form-horizontal{
    margin-top: 60px;
}
/* 9.7.25 */
.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a{
    background-color: #16C4C0;
    border-radius: 5px;
    color: #fff;
}
.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a i{
    color: #fff !important;
}
.vertical-collpsed .vertical-menu #sidebar-menu>ul ul li.active a{
    color: #333;
}
.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a{
    min-height: 30px;
    padding: 10px 11px;
    margin: 0 8px !important;
}
#sidebar-menu ul li a{
    padding: 10px;
    margin: 0 10px;
}
.mm-active>a{
    border-radius: 5px;
    background-color: #9D9DFC;
    color: #fff !important;
    margin: 0 8px !important;
    padding: 10px !important;
    min-height: 30px !important;
}
.mm-active .active{
    color: #fff !important;
}
.mm-active>a i {
    color: #fff !important;
}
.mm-active .active i {
    color: #fff !important;
}
#sidebar-menu ul li ul.sub-menu{
    border-radius: 5px;
    background-color: #F2F2FC;
    margin: 10px 12px 10px 35px;
    padding: 5px 0;
}
#sidebar-menu ul li ul.sub-menu li a {
    padding: 10px 15px;
    margin: 0;
}
#sidebar-menu .sub-menu .mm-active>a{
    background-color: transparent !important;
    color: #000 !important;
}
.action-btn{
    background-color: #F8F8F8;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    border-radius: 50px;
    border: none;
    width: 38px;
    height: 38px;
}
.action-btn i{
    color: #626262;
    font-size: 20px;
}
.add-btn{
    border-radius: 5px;
    background-color: #FFF;
    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.10);
    padding: 5px 17px;
    color: #5D5D5D;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    transition: 0.3s ease-in-out;
    line-height: 28px;
    border: 1px solid rgba(0, 0, 0, 0.13);
}
.add-btn:hover{
    background-color: #16C4C0;
    color: #fff;
    transition: 0.3s ease-in-out;
}
.w-15{
    width: 15%;
}
.project-table tbody tr:nth-child(even){
    background-color: #FBFBFB;
}
.pagination-two span{
    color: #6C6C6C;
    font-size: 13px;
    font-weight: 500;
}
.pagination-two{
    display: flex;
    align-items: center;
    justify-content: end;
}
.pagination-two ul{
    margin-bottom: 0;
    display: flex;
    gap: 10px;
    align-items: center;
    list-style: none;
    padding-left: 10px;
}
.pagination-two ul li{
    border-radius: 5px;
    border: 1px solid #CCC;
    min-width: 24px;
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 10px;
}
.pagination-two ul li a{
    color: #BABABA;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
}
.pagination-two ul li.active{
    border-radius: 5px;
    border: 1px solid #16C4C0;
    color: #fff;
    background-color: #16C4C0;
}
.head-form{
    display: flex;
    align-items: center;
    gap: 15px;
}
.head-form form{
    width: 217px;
}
.head-form form .project-form{
    margin-bottom: 0;
}
.nowrap td{
    white-space: nowrap;
}
.metismenu li{
    margin: 8px 0;
}
.metismenu .sub-menu li{
    margin: 0;
}
/* 10.7.25 */
.back-btn{
    background-color: #6B7280;
    padding: 7px 10px;
    border-radius: 5px;
    font-size: 13px;
    color: #fff;
    font-weight: 500;
    display: flex;
    line-height: 20px;
    gap: 7px;
    justify-content: space-between;
    vertical-align: middle;
}
.back-btn:hover,.back-btn:focus{
    background-color: #6B7280;
    color: #fff;
    border-color: #6B7280;
}
.back-section{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.check-gr i{
   font-size: 24px;
    color: #20A93A;
    font-weight: 600;
}
.pen-icon i{
   font-size: 24px;
    color: #20A93A;
    font-weight: 600;
}
.star-icon i{
    color: #F7AD4E;
    font-size: 20px;
}
.black-btn-inner{
    padding: 10px 25px;
    background-color: #5D5D5D;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    transition: 0.3s ease-in-out;
    outline: none;
    border: none;
    align-items: center;
}
.black-btn-inner:hover,.black-btn-inner:focus{
    background-color: #9D9DFC;
    color: #fff;
    transition: 0.3s ease-in-out;
    border-color: #9D9DFC;
}
.normal-text span{
    color: #2F2F2F;
    font-size: 13px;
    font-weight: 500;
    display: block;
    text-align: left;
    margin-bottom: 5px;
}
.inner-boxes ul{
    padding: 0;
    margin: 0;
    list-style: none;
}
.inner-boxes ul li{
    display: inline-block;
    list-style: none;
    margin: 5px 5px 5px 0;
}
.yellow-btn{
    border-radius: 5px;
    background-color: #FFF7D9;
    padding: 10px;
    font-size: 13px;
    font-weight: 500;
    color: #464646;
    border: none;
}
.no-border{
    padding: 0;
    border: none;
}
.display-btn{
    padding: 5px 17px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid #B3EBEA;
    background-color: #FFF;
    font-size: 13px;
    font-weight: 500;
    color: #16C4C0;
}
.action-btn i.dripicons-paperclip {
    font-size: 15px;
}
.admin-form-modern-field .box {
    background-color: #F9F9F9;
    border-radius: 5px;
    border: 1px dashed #9C9C9C; 
    width:100%; 
    height:225px; 
    display:flex; 
    align-items:center; 
    flex-direction:column;
    gap:10px;
    justify-content: center;
}
.admin-form-modern-field .box div span {
    color: #3C3C3C;
    font-size: 16px;
    font-weight: 500;
}
.project-form .position-absolute-i {
    position: absolute;
    right: 10px;
    top: 28px;
    color: #3C3C3C;
    font-size: 18px;
    line-height: 15px;
    z-index: 9;
}
.project-form .position-absolute-i.select-help {
    right: 30px;
    top: 27px;
    z-index: 99999;
}
.seperator-line {
    border: 1px solid #565656;
    margin: 0px 15px 30px 15px;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}
.form-group-background {
    padding: 30px 20px 15px 20px;
    border: 1px solid #EAEAEA;
    background-color: #FAFAFA;
    margin: 0 15px 30px 15px;
}

.hb-group-fields {
    margin: 0 15px 30px 0;
}
.admin-form-group-sub-label p{
    color: #3B3B3B;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 25px;
}
.html-header-label h5 {
    color: #3B3B3B;
    font-size: 15px;
    font-weight: 600;
}
.html-body-text {
    color: #3B3B3B;
    font-size: 13px;
    font-weight: 500;
}
.bottom-buttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.bottom-buttons .left-buttons {
    display: flex;
    align-items: center;
    gap: 10px;
}
.bottom-buttons .right-buttons {
    display: flex;
    align-items: center;
    gap: 10px;
}
.bottom-buttons button {
    justify-content: center;
}
.modal-title {
    color: #353535;
    font-size: 16px;
    font-weight: 600;
}
.gold-colour{
    color: #F7AD4E;
} 
.cross-iconn i{
    color: #F00;
    font-size: 16px;
    font-weight: 600;
}
.resp-50{
    width: 50%;
}
/* Tooltip for required fields */
.required-tooltip {
    position: absolute;
    left: 0;
    top: 100%;
    margin-top: 4px;
    background: #fffbe6;
    color: #d32f2f;
    border: 1px solid #fffbe6;
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 13px;
    font-weight: 500;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    z-index: 99999;
    white-space: nowrap;
}
.table-right-icon i{
    font-size: 18px;
    cursor: pointer;
}
.grey-btn-inner{
    padding: 10px 25px;
    background-color: #BEBEBE;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    transition: 0.3s ease-in-out;
    outline: none;
    border: none;
    display: flex;
    gap: 10px;
    align-items: center;
}
.grey-btn-inner:hover{
    color: #fff;
}
.table-right-icon{
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: right;
}
.inner-yellow-btn{
    padding: 5px 8px;
    font-size: 12px;
}
/* 18.7.25 */
.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a{
    margin: 0;
}
.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>ul{
    margin: 0px 12px 10px 0px;
}
/* 21.7.25 */
body.vertical-collpsed {
    min-height: 1080px;
}
.inner-hed-btn {
    align-items: end;
}
.inner-hed-btn .project-form{
    margin-bottom: 0;
    width: 250px;
}
.inner-hed-btn .heading-btn{
    align-items: end;
}
.form-control::placeholder{
    color: #313131;
}
.radio-txt{
    display: flex;
    align-items: center;
    gap: 25px;
}
.radio-txt h4{
    color: #282828;
    font-size: 13px;
    margin-bottom: 0;
    font-weight: 500;
    margin-right: 40px;
}
.radio-txt label{
    color: #696969;
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    margin-bottom: 0;
}
.radio-txt .custom-radio{
    display: flex;
    align-items: center;
    gap: 8px;
}
.radio-txt .custom-radio input{
    width: 18px;
    height: 18px;
}
.mb-15{
    margin-bottom: 15px;
}
.project-form .select2-container--default .select2-selection{
    border-radius: 5px;
    border: 1px solid #CECECE;
    background-color: #FFF;
    padding: 7px 5px;
    color: #313131;
    font-size: 14px;
    font-weight: 400;
    margin-top: -8px;
    height: 43px;
}
.select2-selection__arrow b{
    display: none;
}
.select2-selection__arrow{
    right: 7px !important;
}
.select2-selection__arrow::before{
    position: absolute;
    top: 0;
    right: 0;
    content: "\e9e2";
    font-size: 18px;
    width: 18px;
    height: 15px;
    font-family: boxicons !important;
}
/* Highlighted option when hovering */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: #16C4C0 !important;
color: white !important;
}

/* Selected tag in multiple select */
.select2-container--default .select2-selection--multiple .select2-selection__choice {
background-color: #16C4C0 !important;
border: 1px solid #16C4C0 !important;
color: white !important;
}

/* Optional: remove "x" hover color override */
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
color: white !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
color: #f0f0f0 !important;
}
.select2-container, .select2-results{z-index: 9999 !important;}
.pagination-links ul {
    gap: 10px;
    margin-bottom: 0;
}
.pagination-links ul li .page-link {
    background-color: transparent !important;
    border-color: rgb(204, 204, 204) !important;
    padding: 5px;
    min-width: 30px;
    min-height: 25px;
    display: flex;
    align-items: center;
    color: rgb(186, 186, 186);
    font-size: 13px;
    font-weight: 500;
    justify-content: center;
    border-radius: 5px;
}
.pagination-links ul li.active .page-link {
    background-color: #16C4C0 !important;
    color: #fff !important;
    border-color: #16C4C0 !important;
}
.pagination-links ul li .page-link:focus {
    box-shadow: none !important;
    outline: none !important;
}
.per-page-select .select2-container--default .select2-selection--single {
    border-radius: 5px;
    border: 1px solid #CECECE;
    background-color: #FFF;
    padding: 7px 5px;
    color: #313131;
    font-size: 13px;
    font-weight: 500;
    height: 32px;
}
.per-page-select .select2.select2-container {
    width: 70px !important;
}
.per-page-select .select2-selection__rendered {
    line-height: 13px !important;
}
/* 22.7.25 */
 .billing-card{
   border-radius: 5px;
    border: 2px solid #B3E2E1;
    overflow: hidden;
    margin-bottom: 15px;
 }
 .billing-card-body{
    background-color: #B3E2E1;
    padding: 17px 14px 30px 14px;
 }
 .billing-card-body .custom-checkbox{
    margin: 0 0 30px 0;
    display: flex;
    align-items: center;
    gap: 10px;
 }
 .billing-card-body .custom-checkbox label{
    color: #FFF;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 0;
 }
 .billing-card-body .custom-checkbox input{
    width: 20px;
    height: 20px;
     background-color: transparent;
  border: 1px solid #fff;
 }
.billing-card-body-txt{
    text-align: center;
}
.billing-card-body-txt h4{
    color: #FFF;
    margin-bottom: 0;
    font-size: 24px;
    font-weight: 600;
}
.billing-card-footer{
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.billing-card-footer span{
    color: #888;
    font-size: 15px;
    font-weight: 500;
}
.billing-card.active{
    border: 2px solid #16C4C0;
}
.billing-card.active .billing-card-body {
    background-color: #16C4C0;
}
.buy-heading h2{
    color: #000;
    font-size: 20px;
    font-weight: 500;
    margin: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #D8D8D8;
}
/* 24.7.25 */
.black-link-txt{
    color: #252525;
    text-decoration:none;
    font-size: 13px;
    font-weight: 600;
}
.black-link-txt:hover{
    color:#16C4C0;
}
.thead-light-inner{
    background-color:#F0F0F0;
}
.table-dropdown .btn{
    color: #5D5D5D;
    font-size: 13px;
    font-weight: 400;
    border-radius: 5px;
    border: 1px solid #CACACA;
    background: #FFF;
    padding:8px 10px;
}
.rule-btn{
    color: #5D5D5D;
    font-size: 13px;
    font-weight: 400;
    border-radius: 5px;
    border: 1px solid #CACACA;
    background: #FFF;
    padding: 8px 10px;
    line-height:24px;
}
.rule-btn i{
    color:#16C4C0;
}
.w-165{
    width: 165px;
}
.search-field {
    position: relative;
}
.search-clear-icon {
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 10;
    font-size: 18px;
}
.search-clear-icon:hover {
    color: #16C4C0;
}
/* 25.7.25 */
.form-button{
    display: flex;
    align-items: end;
}
.form-button .green-btn-inner{
    padding: 10px 22px;
    text-align: center;
    height: 43px;
    border-radius: 0 5px 5px 0;
}
.form-button .project-form{
    flex-grow: 1;
}
.form-button .project-form .form-control{
    border-radius: 5px 0 0 5px;
}
/* 28.7.25 */
.manage-inner-box{
    border-radius: 5px;
    border:2px solid;
}
.manage-blue{
    border-color: #16C4C0;
}
.manage-purple{
    border-color: #9D9DFC;
}
.manage-inner-box-head{
    padding: 16px 23px;
}
.manage-inner-box-head h3{
    color: #4D4D4D;
    font-size: 15px;
    font-weight: 600;
    margin: 0 5px 0 0;
}
.manage-inner-box-body{
    width: 90px;
    height: 90px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    margin: 0 auto;
    border:2px solid;
    border-radius: 50px;
    z-index: 1;
    position: relative;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.13);
    background-color: #fff;
}
.manage-inner-box-body h4{
    color: #000;
    font-size: 32px;
    font-weight: 600;
    margin: 0;
}
.manage-blue .manage-inner-box-body{
    border-color: #16C4C0;
}
.manage-blue .manage-inner-box-footer{
    background-color: #16C4C0;
}
.manage-purple .manage-inner-box-body{
    border-color: #9D9DFC;
}
.manage-purple .manage-inner-box-footer{
    background-color:#9D9DFC;
}
.manage-inner-box-footer{
    padding: 55px 0 15px 0;
    text-align: center;
        margin-top: -23px;
}
.manage-inner-box-footer .btn{
    color: #626262;
    font-size: 15px;
    font-weight: 500;
    background-color: #fff;
    border-radius: 5px;
    border: none;
}
.manage-inner-box-footer .btn:hover{
    border: none;
}
.prefix-select{
    border-radius: 5px 0 0 5px;
    border: 1px solid #CECECE;
    background-color: #FFF;
    padding: 10px;
    color: #313131;
    font-size: 14px;
    font-weight: 400;
    margin-top: -5px; 
}
.p-m-p-table .collapse td {
    padding-top: 5px;
    padding-bottom: 5px;
}
.p-m-p-table td{
    vertical-align: middle;
}
input[switch]+label {
    width: 45px;
}
input[switch]:checked+label:after {
    left: 22px;
}
.p-m-p-table tbody tr:hover {
    background-color: rgba(0,0,0,0.03);
}
.p-m-p-table .has-children .toggle-icon {
    display: inline-block;
    width: 18px;
    text-align: center;
    transition: transform 0.2s;
}
.p-m-p-table .permission-row td {
    border-top: none;
    border-bottom: 1px solid #eee;
}
.p-m-p-table tr.has-children.active  {
    background-color: rgba(0,0,0,0.02);
}
/* .p-m-p-table .permission-row td:hover{
    background-color: rgba(0,0,0,0.02);
} */
/* 4.8.25 */
.head-filters .select2-selection--single{
    font-weight: 500;
    font-size: 14px;
    padding: 10px 14px;
    width: 132px;
    height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between;
    border-radius: 5px !important;
    border: 1px solid #6B7280 !important;
    color: #6B7280 !important;
    gap: 5px ;
    background-color: transparent !important;
}
.head-filters .select2-selection__rendered{
    padding: 0 !important;
}
.head-filters .select2-selection__arrow{
    top: 3px !important;
    right: 15px !important;
}
.head-filters .select2-selection__arrow:before{
    font-size: 24px;
}
.manage-bottom-heading{
    padding: 18px 0px;
}
.manage-bottom-heading div{
    border-bottom: 1px solid #D8D8D8;
    display: flex;
    align-items: center;
    gap: 18px;
    padding-bottom: 18px;
    margin-bottom: 18px;
}
.manage-bottom-heading h3{
    color: #000;
    font-size: 16px;
    font-weight: 500;
    margin: 0;
}
.manage-bottom-heading i{
    color: #5C5C5C;
    font-size: 20px;
}
.manage-bottom-heading p{
    color: #4C4C4C;
    margin-bottom: 0;
    font-size: 15px;
    font-weight: 500;
}
.manage-accordian .accordion-item{
    border: none;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 5px;
}
.manage-accordian .accordion-header button{
    border: none;
    padding: 18px 20px ;
    background-color: #5C5C5C;
    color: #FFF;
    font-size: 17px;
    font-weight: 600;
}
.manage-accordian .accordion-button::after{
    background-image: url(../../img/down-arrow.svg);
}
.manage-accordian .accordion-body{
    background-color: #F8F8F8;
    color: #000;
    font-size: 13px;
    font-weight: 500;
}
.manage-form {
    width: 50%;
}
/* 5.8.25 */
.skyblue-btn-inner{
        padding: 10px 25px;
    background-color: #9D9DFC;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    transition: 0.3s ease-in-out;
    outline: none;
    border: none;
    display: flex;
    gap: 10px;
    align-items: center;
}
.blue-btn-inner{
        padding: 10px 25px;
    background-color: #3362AB;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    transition: 0.3s ease-in-out;
    outline: none;
    border: none;
    display: flex;
    gap: 10px;
    align-items: center;
}
.yellow-btn-inner{
        padding: 10px 25px;
    background-color:#F7AD4E;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    transition: 0.3s ease-in-out;
    outline: none;
    border: none;
    display: flex;
    gap: 10px;
    align-items: center;
}
/* 6.8.25 */
.project-accordian .accordion-button{
    justify-content: space-between;
    transition: 0.3s ease-in-out;
}
.project-accordian .accordion-button::after{
    display: none;
}
.project-accordian .acc-text{
    display: flex;
    align-items: center;
    gap: 15px;
    transition: 0.3s ease-in-out;
}
.project-accordian .acc-text-icon{
    display: flex;
    align-items: center;
    gap: 8px;
    transition: 0.3s ease-in-out;
}
.project-accordian .acc-text-icon a{
    height: 25px;
    width: 25px;
    transition: 0.3s ease-in-out;
    color: #424242;
}
.project-accordian .accordion-body{
    display: flex;
    justify-content: space-between;
    transition: 0.3s ease-in-out;
    color: #424242;
    padding-left: 55px;
}
.project-accordian .accordion-item{
    margin-bottom: 10px;
    border-radius: 8px;
    overflow: hidden;
    transition: 0.3s ease-in-out;
}
.project-accordian .accordion-item:not(:first-of-type){
    border-top: 1px solid rgba(0, 0, 0, 0.13);
}
.project-accordian .accordion-header{
    background-color: #F8F8F8;
     transition: 0.3s ease-in-out;
}
.project-accordian .action-btn{
    background-color: #fff;
     transition: 0.3s ease-in-out;
}
.project-accordian .accordion-button:not(.collapsed){
    background-color: #F8F8F8;
    color: #424242;
     transition: 0.3s ease-in-out;
}
.project-accordian .acc-main-txt{
    color: #424242;
}
.project-accordian .acc-main-txt h4{
    margin-bottom: 0;
    font-size: 15px;
    font-weight: 500;
}
.project-accordian .collapsed .acc-text-icon a i{
    transform: rotate(180deg);
    transition: 0.3s ease-in-out;
    color: #424242;
}

.btn-sm-custom {
    padding: 7px 15px;
    font-size: 14px;
    width: 100px;
}
/* 7.8.25 */

.project-checkbox input[type="checkbox"]:checked {
    background-color: #fff !important;
    background-size: 12px !important;
    background-repeat: no-repeat !important;
    background-position-x: 3px !important;
    background-position-y: 4px !important;
    outline: none;
    box-shadow: none;
    background: url(../../img/check-tik.svg) ;
    appearance: none;
    -webkit-appearance: none;
}
.project-accordian-two button::after{
    display: inline-block !important;
}
.project-accordian-two .accordion-button{
    font-weight: 600;
    font-size: 14px;
}
.project-accordian-two .accordion-body{
    padding: 1rem;
}
.drag-handle{
    cursor: pointer;
}
.manage-e-buttons{
    border: 1px solid #16C4C0;
    border-radius: 5px;
}
.manage-e-buttons button{
    padding: 15px;
    font-size: 14px;
    font-weight: 500;
    color: #606060;
    background-color: #E0FFFE !important;
    border-radius: 0 !important;
}
.manage-e-buttons button:hover{
    color: #606060;
}
.manage-e-buttons button.active{
    background-color: #16C4C0 !important;
    color: #fff !important;
    position: relative;
}
.manage-e-buttons button.active::after{
    position: absolute;
    content: "\ed0b";
    font-family: boxicons !important;
    font-size: 15px;
    color: #606060;
    top: 30%;
    right: -13px;
}
.sp-line{
    width: 100%;
    height: 1px;
    background-color: #DFDFDF;
}
.project-checkbox input[type="radio"]:checked {
     background: url(../../img/radio-i.png) ;
    appearance: none;
    -webkit-appearance: none;
      background-color: #fff !important;
    background-size: 12px !important;
    background-repeat: no-repeat !important;
    border: 1px solid #16C4C0;
    border-radius: 50px;
     background-position-x: 3px !important;
    background-position-y: 3px !important;
}
.green-light-btn-inner{
    background-color: #F0FFFF;
    border-radius: 5px;
    border: 1px solid #16C4C0;
    padding: 7px 12px;
    color: #16C4C0;
    font-size: 18px;
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
}
.email-notofication-dropdown{
    display: flex;
    align-items: center;
    gap: 10px;
}
.email-notofication-dropdown-main{
    width: 80%;
}
.email-notofication-dropdown-main .project-form{
    width: 100%;
}
.project-form .bootstrap-tagsinput {
    overflow-x: hidden;
    overflow-y: auto;
    margin-top: -10px;
    padding-top: 15px;
}
.project-form .bootstrap-tagsinput .tag{
    margin-bottom: 3px;
    display: inline-block;
}
/* width */
.project-form .bootstrap-tagsinput::-webkit-scrollbar {
  width: 5px;
}

/* Track */
/* === Merchant Batches Additions (Analytics) === */
.merchant-batches-range-select{min-width:140px;}
#merchant-batches-volume-chart .apexcharts-canvas{margin:0 auto;}
#merchant-batches-legend .legend-dot{display:inline-block;width:12px;height:12px;border-radius:50%;}
#merchant-batches-legend .legend-dot-volume{background:#0B6FA4;}
#merchant-batches-legend .legend-dot-transactions{background:#E39A19;}
.batches-card-totals-table tbody td{vertical-align:middle;font-size:13px;}
.batches-card-totals-table tfoot th{font-weight:600;border-top:2px solid #e5e7eb;font-size:13px;}
.batches-card-totals-summary th{background:#fafafa;}
#merchant-batches-empty-msg,#merchant-batches-card-totals-empty{font-size:13px;}
/* Custom range layout */
.merchant-batches-date-range-group{gap:12px;}
.merchant-batches-date-range-group .range-field{min-width:160px;}
.merchant-batches-date-range-group .range-field label{display:block;}
@media (max-width:575.98px){
    .merchant-batches-date-range-group{flex-direction:column;}
    .merchant-batches-date-range-group .range-field{width:100%;}
}
@media (max-width: 991.98px){
    #merchant-batches-analytics .col-lg-7,#merchant-batches-analytics .col-lg-5{margin-bottom:15px;}
}
/* === End Merchant Batches Additions === */
.project-form .bootstrap-tagsinput::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
/* Handle */
.project-form .bootstrap-tagsinput::-webkit-scrollbar-thumb {
  background: #888; 
}

/* Handle on hover */
.project-form .bootstrap-tagsinput::-webkit-scrollbar-thumb:hover {
  background: #555; 
}

.field-types-desc ul {
    padding: 0;
    list-style: none;
}
.field-types-desc ul li .font-bold {
    font-weight: 700;
}
.field-types-desc ul li {
    line-height: 20px;
    padding-bottom: 5px;
}
/* 11.8.25 */
.red-btn-inner{
    padding: 10px 25px;
    background-color: #FC7E6F;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    transition: 0.3s ease-in-out;
    outline: none;
    border: none;
    align-items: center;
}
.red-btn-inner:hover{
    background-color: #9D9DFC;
    color: #fff;
}
.blue-img{
    text-align: center;
    margin-top: 50px;
}
.form-anchor-wrapper{
    margin-top: 11px !important;
}
/* 18.8.25 */
.select2-selection--multiple{
    overflow-x: hidden;
    overflow-y: auto;
}
body .disabled-effect, body .disabled-effect:hover {
    background-color: #e9ecef !important;
    color: #6c757d;
    cursor: not-allowed;
    opacity: 0.7 !important;
}

.heading-btn .fw-30{
    font-size: 30px;
}
.brd-bottom{
    padding: 14px;
    border-radius: 5px;
    background: #FFF;
    box-shadow: 0 4px 10px 0 rgba(198, 198, 198, 0.20);
}
.email-btn{
    padding: 2px 25px;
    border: 1px solid #333;
    background-color: transparent;
    border-radius: 5px;
    color: #333;
    font-size: 13px;
    text-align: center;
}
.email-btn span{
    font-size: 11px;
    color: #828282;
    display: block;
}
.inner-dropp{
    border: 1px dashed #9C9C9C;
    border-radius: 8px;
    background-color: #F9F9F9;
    padding: 20px 20px;
    text-align: center;
    transition: all 0.3s ease;
    min-height: 100px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.inner-dropp p{
    color: #333;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 5px;
}
/* 21.8.25 */

.set-default-btn.active i {
    color: #F7AD4E !important;
}

.top-head{
    font-size: 20px;
    font-weight: 500;
    color: #333;
    margin: 0 0 20px 0;
}
/* 25.8.25 */
.info-heading{
    display: flex;
    align-items: flex-start;
    gap: 15px;
}
.info-heading-icon i{
    color: #16C4C0;
    font-size: 24px;
}
.info-heading-text h3{
    color: #333;
    font-size: 15px;
    font-weight: 500;
    margin: 0;
}
.info-heading-text p{
    color: #828282;
    font-size: 12px;
    font-weight: 500;
    margin: 0;
}
.fill-txt{
    color: #000;
    font-size: 16px;
    font-weight: 400;
    margin: 0;
}
.link-add-txt{
    display: flex;
    align-items: center;
    gap: 12px;
}
.link-add-txt p{
    margin-bottom: 0;
}
.link-add-txt .green-btn-inner{
    padding: 10px 15px;
    justify-content: center;
    margin: 0;
}
.chart-box-line{
    display: flex;
    align-items: center;
    border-radius: 5px;
    border: 1px solid rgba(4, 62, 97, 0.20);
    background: #FFF;
    gap: 20px;
    justify-content: center;
    padding: 15px;
}
.box-chart-txt {
    text-align: center;
}
.box-chart-txt span{
    display: block;
    font-size: 13px;
    font-weight: 400;
    color: #000;
}
.modal-table-scroll {
    max-height:500px; 
    overflow-y:auto;
}
.modal-table-scroll thead tr th {
    position:sticky; 
    top:0; z-index:2; 
    background-color:var(--bs-body-bg, #fff);
}
.category-box{
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    gap: 15px; 
}
.category-box li{
    display: inline-block;
    width: 20%;
}
.normal-para{
    font-size: 14px;
    font-weight: 500;
    color: #333;
}
.pen-icon{
    color: #16C4C0;
    text-decoration: none;
}
.pen-icon i{
    font-size: 25px;
}
.project-table table thead{
    background-color: #E8E8E8;
}
.mb-20{
    margin-bottom: 20px;
}
.mini-scroll-box{
    max-height: 450px;
    overflow-y: auto;
}
.w-fit{
    width: fit-content;
}
hr{
    border-top: 1px solid rgb(229, 231, 235);
}

input[switch=dark]:checked+label{
    background-color: #4cd964; 
}
.custom-dropzone-inner{
    min-height: unset;
}
.w-60 {
    width: 60%;
}
.c-dzone-upload-btn-title {
    white-space: nowrap;
    font-size: 12px !important;
}
.custom-dz-message {
    cursor: pointer;
}

.hw-export-wrapper { position:relative; }
.hw-export-btn { display:inline-flex !important; align-items:center; gap:6px; }
.hw-export-menu { display:none; position:absolute; top:100%; left:0; background:#fff; z-index:50; min-width:116px; border-radius:4px; overflow:hidden; }
.hw-export-wrapper.show .hw-export-menu { display:block; }
.hw-export-menu .hw-export-item { width:100%; text-align:left; padding:8px 14px; background:#fff; border:0; font-size:14px; cursor:pointer; }
.hw-export-menu .hw-export-item:hover { background:#F2FDFD; color:#16C4C0; }

/* #ticket-types-export-wrapper .hw-export-menu .hw-export-item { width:100%; text-align:left; padding:8px 14px; background:#fff; border:0; font-size:14px; cursor:pointer; }
#ticket-types-export-wrapper .hw-export-menu .hw-export-item:hover { background:#F2FDFD; color:#16C4C0; } */
.ml-4 {
    margin-left: 1.8rem !important;
}


/* 26-09-2025 Start */

.main_title{
    padding: 10px 0px 25px 0px;
}
.main_title h2 {
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-transform: capitalize;
    margin: 0;
    padding: 0;
}
.grid_viewlistview ul{
    padding: 0;
    margin: 0;
    list-style: none;

}
.grid_viewlistview ul li{
    padding: 0;
    margin: 0;
    list-style: none;
    border:1px solid #16C4C0;

}
.grid_viewlistview ul li:first-child {
    border-radius: 5px 0 0 5px;
}
.grid_viewlistview ul li:last-child {
    border-radius: 0 5px 5px 0;
}
.grid_viewlistview ul li a{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 9px;
    font-size: 15px;
    font-weight: 400;
    color: #16C4C0;
    cursor: pointer;
}
.grid_viewlistview ul li a:hover, .grid_viewlistview ul li a.active {
    background-color: #16C4C0;
    color: #fff;
} 
.leads_tabs .nav-tabs{
    border: 0;
    margin:0 0 25px 0;
    flex-wrap: nowrap;
}
.leads_tabs .nav-tabs li{
    flex-grow: 1;
    width: 8.25%;
    flex-shrink: 0;
    display: flex;
    
}
.leads_tabs .nav-tabs li .nav-link{
    display:flex;
    flex-direction: column;
    gap:10px;
    padding:15px 10px 10px 10px;
    font-size: 14px;
    font-weight: 400;
    color:#000;
    line-height: 18px;
    border: 0!important;
    border-right: 1px solid #E1E4EE!important;
    border-top: 2px solid #fff!important;
    background: #FFF;
    border-radius: 0;
    width:100%;
}
.leads_tabs .nav-tabs li:last-child .nav-link {
    border-right: 0!important;
}
.leads_tabs .nav-tabs li .nav-link span{
    font-size: 18px;
    font-weight: 700;
    color:#000;
}
.leads_tabs .nav-tabs li .nav-link.active, .leads_tabs .nav-tabs li .nav-link:hover{
    border-top: 2px solid #16C4C0!important;
    background: #F0F8F8;
}
.search-icon{
    position: absolute;
    right: 10px;
    top: 9px;
}
.green-btn_action {
    background: #81B98D;
    transition: all linear 0.3s;
}
.green-btn_action:hover {
    background: #6cab7a;
    transition: all linear 0.3s;
}
.project-table.leads-table tbody tr:nth-child(even), .project-table.leads-table tbody tr:nth-child(odd) {
    background-color: #fff;

}
.project-table tbody tr td a{
    font-size: 15px;
    font-weight: 400;
    color: #42484B;
    text-decoration: none;
}

.lead_accordion .accordion-button{
    padding: 15px;
    border-radius: 5px;
    background: #FFF;
    box-shadow: 0 4px 10px 0 rgba(198, 198, 198, 0.20);
    font-size: 15px;
    font-weight: 600;
    color:#000;
}
.lead_accordion .accordion-item{
    margin:0 0 15px 0;
    padding: 15px;
    border-radius: 5px;
    border: 1px solid #E5E7EB;
    background: #FFF;
    box-shadow: 1px 1px 1px 0 rgba(198, 198, 198, 0.20);
}
.qualify_top .form-check-label{
    color: #333;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.qulify_list .form-check-label {
    color: #333;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.qulify_list p{
    color: #000;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    padding: 0;
    margin:0;
}
.qulify_list p span{
    color: #828282;
}
.pl-20{
    padding-left: 20px;
}
.qulify_list:nth-child(even){
    background: #F9F9F9;
}
.mt-18{
    margin-top:18px;
}
.project-box h3.saveview{
    font-weight: 500;
    border-bottom: 1px solid #CECECE;
    margin-bottom: 15px;
    padding-bottom: 12px;
        
}
.pl-30{
    padding-left: 30px;
}






/* 26-09-2025 End */
/* //========= START:: Record set field============ */
.sortable-container .card {
    position: relative;
}
.sortable-container .collapsible-header {
    cursor: grab;
}
.sortable-container .collapsible-header:active {
    cursor: grabbing;
}
.sort-placeholder {
    border: 2px dashed #ccc;
    height: 60px;
    margin-bottom: 1rem;
    border-radius: 0.25rem;
    background-color: #f8f9fa;
}
.record_set_form .drag-handle {
    margin-right: 10px;
    color: #999;
}


.drag-handle {
    cursor: grab !important;
    color: #888;
    font-size: 18px;
    margin-right: 8px;
    padding: 2px;
    transition: color 0.2s;
}
.drag-handle:hover {
    color: #444;
}
.drag-handle:active {
    cursor: grabbing !important;
}
.sort-placeholder {
    border: 2px dashed #ccc;
    height: 60px;
    margin-bottom: 1rem;
    border-radius: 0.25rem;
    background-color: #f8f9fa;
}
.sticky-tab {
    margin-left: auto;
}
.sticky-tab .tab-counter {
    background-color: #f8f9fa !important;
    color: #333 !important;
    font-weight: 500;
    min-width: 60px;
    text-align: center;
    border-radius: 30px;
    padding: 5px 12px;
}
.sticky-tab .current-tab {
    font-weight: 700;
    color: #0d6efd;
}
/* //========= END:: Record set field============ */
.w-90 {
    width: 90% !important;
}
.w-85 {
    width: 85% !important;
}
.w-80 {
    width: 80% !important;
}
.w-75 { 
    width: 75% !important;
}
.w-70 {
    width: 70% !important;
}
.w-40 {
    width: 40% !important;
}
.w-35 {
    width: 35% !important;
}
.w-30 {
    width: 30% !important;
}
.w-20 {
    width: 20% !important;
}
.w-25 {
    width: 25% !important;
}
.w-15 {
    width: 15% !important;
}
.w-10 {
    width: 10% !important;
}



 /* Action buttons styling */
.secondary-button {
    width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 6px !important;
    margin-right: 8px !important;
    border: 1px solid #e0e0e0 !important;
    background-color: #fff !important;
    color: #555 !important;
}

.secondary-button i {
    font-size: 18px;
}

.secondary-button:hover {
    background-color: #f8f9fa !important;
    border-color: #d0d0d0 !important;
}
.list-group-flush{
    max-height: 400px;
    overflow-y: auto; 
}
.list-group-flush>.list-group-item{
    margin-bottom: 5px;
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.avatar-circle {
    width: 28px;
    height: 28px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 13px;
    color: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.user-name {
    cursor: pointer;
} 
.event-row.done-event{ 
    box-shadow: inset 10px 0 0 0 var(--hw-primary);
}
.event-title-row.done-event{
    box-shadow: inset 3px 0 0 0 var(--hw-primary);
}
.event-row.not-done-event{ 
    box-shadow: inset 10px 0 0 0 var(--hw-secondary);
}
.event-title-row.not-done-event{
    box-shadow: inset 3px 0 0 0 var(--hw-secondary);
}


.event-row.High {
    background-color: #ffebeb !important;
}
.event-row.Medium {
    background-color: #fff8cf !important;
}
.toggleUserList i{
    cursor: pointer;
    border: 1px solid #CECECE;
    padding: 8px 10px;
    border-radius: 3px;
}
.toggleUserList.active i{ 
    background-color: #16C4C0;
    color: white;
    padding: 8px 10px;
    border-radius: 3px;
}


/* //===  START:: Calender details modal view  */
.view-row {
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px dotted #e0e0e0;
}
.view-label {
    font-weight: 600;
    color: #555;
    margin-bottom: 5px;
}
.view-value {
    color: #333;
}
.modal-footer .btn {
    min-width: 120px;
}
/* //===  END:: Calender details modal view  */


  /* Improved Calendar Event Styling */
.fc-event {
    border-radius: 3px !important;
    margin: 1px 0 !important;
    overflow: hidden !important;
    position: relative !important; 
}

.fc-event-main {
    background-color: #ffffff !important;
    color: #333333 !important;
    padding: 3px 6px 3px 16px !important; /* Extra left padding for priority dot */
}

.fc-event-title {
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.85em;
    line-height: 1.3;
    text-align: left;
}

.event-time {
    font-weight: normal;
    color: #666;
    margin-right: 4px;
    font-size: 0.95em;
}

/* Priority dot positioning */
.priority-dot {
    position: absolute;
    left: 4px;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    z-index: 10;
}

/* Month view specific styles */
.fc-daygrid-event {
    padding: 2px 0 !important;
}

/* Week/day view specific styles */
.fc-timegrid-event .fc-event-main {
    padding: 2px 2px 2px 14px !important;
}

/* Adjust dot position in week/day view */
.fc-timegrid-event .priority-dot {
    left: 3px;
}

/* Mobile optimizations */
@media (max-width: 767px) {
    .fc-event-title {
        font-size: 0.8em;
    }
    
    .fc-event-main {
        padding: 2px 2px 2px 14px !important;
    }
}
/* 21.20.25 */
#calendar .fc-toolbar-title{
    font-weight: 600;
    font-size: 20px;
    color: #000;
}
#calendar .fc-today-button, 
#calendar .fc-dayGridMonth-button, 
#calendar .fc-timeGridWeek-button, 
#calendar .fc-timeGridDay-button, 
#calendar .fc-prev-button, #calendar .fc-next-button  {
    padding: 8px 15px !important;
    background-color: var(--hw-primary);
    border-radius: 5px; 
    font-size: 15px;
    border: none;
    opacity: 9;
    text-transform: uppercase;
}
#calendar .fc-button-active { 
    background-color: var(--hw-secondary); 
}
#calendar .fc-button-group{
    gap: 0.75em;
} 
#calendar .fc-prev-button span, #calendar .fc-next-button span{
    font-size: 15px;
    font-weight: 700;
}
#calendar table{
    border: none;
}
#calendar .fc-col-header thead tr th{
    border-right: 0;
}
#calendar .fc-daygrid-body tbody tr{
    border-bottom: 1px solid #E7E8EA;
}
#calendar .fc-daygrid-body tbody tr td{
    border-top: 0;
    padding: 5px 10px;
}
#calendar .fc-col-header-cell-cushion {
    display: block;
    padding: 5px 10px;
    text-align: left;
    color: #1c1c1c;
    font-size: 15px;
    font-weight: 500;
}
#calendar .fc-daygrid-day-number{
    color: #1c1c1c;
    font-weight: 400;
    font-size: 14px;
    padding: 0;
}
#calendar .fc-daygrid-day.fc-day-today{
    background-color: #F2F2FC;
}
.ipad_column .action-buttons-wrapper .secondary-button{
    margin-right: 0 !important;
}
#calendar .fc-daygrid-day-top{
    justify-content: left;
}
/* 21.20.25 */
.merchantDetailsAccStatus .accordion-item{
    margin-top: 15px;
    border-radius: 5px;

    .accordion-header{
        border-radius: 5px;
        border-left: 5px solid #16C4C0;
        background-color: #F0F8F8;
        button{
            font-size: 16px;
            font-weight: 600;
            color: #555555;
            padding: 15px;
        }
    }

    strong {
        font-weight: 600;
        color: #333333;
        width: 190px;
    }
}

/* 12.11.25 */
.pr-main_title h2 {
    color: #000;
    font-size: 20px;
    font-weight: 500;
    margin: 0;
}

.arrow-box {
    border-radius: 5px;
    border: 1px solid #E5E7EB;
    padding: 10px;
    background: #FFF;
}

.arrow-box ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    align-items: center;
    gap: 25px;
}

.arrow-box ul li {
    display: inline-block;
    width: 100%;
}

.arrow-btn {
    font-size: 12px;
    font-weight: 500;
    background-color: #D5F2E2;
    padding: 10px;
    width: 100%;
    border-radius: 0;
    color: #2D516C;
    border: none;
    position: relative;
    white-space: nowrap;
}

.arrow-btn::after {
    width: 38px;
    height: 38px;
    border-left: solid 18px #D5F2E2;
    border-bottom: solid 18px transparent;
    border-top: solid 18px transparent;
    position: absolute;
    content: "";
    top: 0;
    right: -37px;
}

.arrow-btn.active {
    background-color: #2D516C;
    color: #fff;
}

.arrow-btn.active::after {
    border-left: solid 18px #2D516C;
}

.narrow-green-btn {
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    padding: 10px;
    text-align: center;
    background-color: #16C4C0;
    border: none;
    border-radius: 5px;
    width: 100%;
}

.list-project-form {
    display: flex;
    align-items: center;
    gap: 15px;
}

.ticket-page-subhead {
    color: #000;
    font-size: 10px;
    font-weight: 500;
}

.form-select {
    border-radius: 5px !important;
    border: 1px solid #CECECE !important;
    padding: 10px !important;
    color: #8F8F8F !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

.form-control-two {
    border-radius: 5px;
    border: 1px solid #CECECE;
    padding: 10px;
    color: #8F8F8F;
    font-size: 14px;
    font-weight: 400;
}

.gap-15 {
    gap: 15px;
}

.green-btn-inner-short {
    padding: 10px 15px;
    border-radius: 5px;
    background: #16C4C0;
    color: #FFF;
    font-size: 10px;
    font-weight: 500;
    border: none;
}

.ticket-page-para {
    color: #000;
    font-size: 10px;
    font-weight: 500;
}

.blue-col {
    color: #16C4C0;
}

.pencil-colour {
    color: #16C4C0;
    font-size: 15px;
}

.input-upload-file-box label {
    color: #000;
    font-size: 10px;
    font-weight: 500;
}

.input-upload-file-main-box {
    padding: 6px;
    border-radius: 5px;
    border: 1px dashed #9099A1;
    position: relative;
    display: flex;
    align-items: center;
    gap: 55px;
}

.input-upload-file-main-box .btn {
    border-radius: 5px;
    border: 1px solid #ADB5BD;
    background: #FFF;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.04);
    color: #000;
    font-size: 10px;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
}

.input-upload-file-main-box .main-file {
    width: 50%;
    height: 100%;
    position: absolute;
    top: 10px;
    left: 10px;
    opacity: 0;
}

.input-upload-file-main-box span {
    color: #757C84;
    font-size: 10px;
    font-weight: 400;
}

.cross-btn span {
    color: red;
    font-size: 20px;
}

.table-text {
    text-align: center;
}

.table-text p {
    color: #333;
    font-size: 14px;
    font-weight: 400;
}

.pr-upload-box {
    background-color: #F9F9F9;
    text-align: center;
    padding: 15px;
    border: 1px dashed #8F8F8F;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 15px;
}

.pr-upload-box .btn {
    padding: 6px 20px;
    border-radius: 5px;
    background: #16C4C0;
    font-size: 10px;
    font-weight: 500;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
}

.pr-upload-box .mdi {
    color: #fff;
    font-size: 15px;
}

.pr-upload-box .btn:hover {
    background: #16C4C0;
    color: #fff;
}

.pr-upload-box span {
    color: #8F8F8F;
    font-size: 12px;
    font-weight: 500;
}

.pr-upload-box .file-sec {
    font-size: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0;
    cursor: pointer;
}

/* .text-line{
    padding: 0 0 15px 0;
}
.text-line h4{
    color: #000;
    font-size: 12px;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 10px;
    justify-content: center;
    background-color: #fff;
    position: relative;
}
.text-line h4 i{
    font-size: 20px;
}
.text-line h4::after{
    width: 50%;
    height: 1px;
    background-color: #000;
    top: 0;
    left: 0;
    content: "";
    position: absolute;
}
.text-line h4::before{
    width: 50%;
    height: 1px;
    background-color: #000;
    top: 0;
    right: 0;
    content: "";
    position: absolute;
} */

.divider {
    display: flex;
    align-items: center;
    width: 100%;
    color: #000;
    font-size: 14px;
}

.divider::before,
.divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #000;
    margin: 0 10px;
}

.divider h4 {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #000;
    font-size: 12px;
    font-weight: 400;
    margin: 0;
}

.divider h4 i {
    font-size: 20px;
}

.f-logo-text h4 {
    color: #000;
    font-size: 12px;
    font-weight: 500;
    margin: 0;
}
.f-logo-text h4 .mdi{
    color: #000;
    font-size: 14px;
}
.f-logo-text h4 span{
    color: #000;
    font-size: 10px;
    font-weight: 300;
}
.f-logo-text p{
    color: #000;
    font-size: 10px;
    font-weight: 300;
    margin: 0;
}

/* 12.11.25 */
/* 28.11.25 */
.calendar-color-swatch {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 1px solid #888;
    border-radius: 4px;
    vertical-align: middle;
    box-shadow: inset 0 0 2px rgba(0,0,0,0.15);
    margin-right: 6px;
}
td .calendar-color-swatch { margin-top: -2px; }
/* 28.11.25 */
/* responsive */
@media only screen and (min-width: 1023px) and (max-width: 1400px) {
    .login-form {
        padding: 30px 100px;
    }
    .login-logo {
        max-width: 280px;
        margin-bottom: 50px;
    }
    .login-form h1 {
        font-size: 30px;    
    }
    .login-form h2 {
        font-size: 18px;
    }
    .login-form .form-horizontal {
        margin-top: 50px;
    }
    .login-form .form-group input{
        height: 60px;
        padding: 20px;
        font-size: 14px;
    }
    .forget-txt a {
        font-size: 14px;
        margin-top: 8px;
    }
    .login-form .btn {
        height: 60px;
        font-size: 15px;
    }
    .head-filters .general-filter-form .form-control {
        width: 250px;
    }
    .head-filters .general-filter-form .form-select {
        width: 88px;
    }
    .leads_tabs .nav-tabs{
        overflow-y: hidden;
        overflow-x: auto;
            
    }
        .leads_tabs .nav-tabs li{
            width:auto;
            flex-shrink: inherit;
        }
        .leads_tabs .nav-tabs li .nav-link{
            font-size: 12px;
            padding: 10px;
        }
    .qualify_top{
        flex-direction: column;
        align-items: flex-start!important;
    }
    .green-btn-inner{
         padding: 10px 15px;
    }
  
    .qulify_list>.d-flex .w-25{
        width: 50% !important;
    }
        .qulify_list>.d-flex .w-75 {
            width: 50% !important;
        }
    .ipad_column{
        flex-direction: column;
        align-items: flex-start !important;
        gap: 10px;
    }
}
@media only screen and (min-width:1024px) and (max-width:900){
     .heading-btn-sec {
        align-items: baseline;
        flex-direction: column;
    }
}
@media only screen and (max-width:990px) {
    .mobile-mb-15{
        margin-bottom: 15px !important;
    }
    .form-anchor-wrapper{
        margin-top: 0px !important;
    }
    .login-form {
        padding: 30px 50px;
    }
    .login-logo {
        max-width: 280px;
        margin-bottom: 50px;
    }
    .login-form h1 {
        font-size: 30px;    
    }
    .login-form h2 {
        font-size: 18px;
    }
    .login-form .form-horizontal {
        margin-top: 50px;
    }
    .login-form .form-group input{
        height: 60px;
        padding: 20px;
        font-size: 14px;
    }
    .forget-txt a {
        font-size: 14px;
        margin-top: 8px;
    }
    .login-form .btn {
        height: 60px;
        font-size: 15px;
    }
    .green-btn {
    font-size: 0px;
    padding: 10px 10px;
    }
    .green-btn i{
        font-size: 30px;
    }
    .head-filters .general-filter-form .form-select {
        width: 80px;
    }
    .head-filters .general-filter-form .form-control {
        width: 160px;
    }
    .top-icons .gap-18{
       gap: 10px;
    }
    .head-items {
        gap: 10px;
    }
    .head-filters .general-filter-form {
        gap: 10px;
    }
    .drop-user {
        padding-left: 0px;
    }
    .header-item{
        padding: 0 8px;
    }
    .drop-user .header-profile-user {
        height: 25px;
        width: 25px;
    }
    .top-icons a i {
        font-size: 18px;
    }
    .user-img img {
        max-width: 30%;
    }
    .user-img h3 {
        font-size: 24px;
    }
    .user-img p {
        font-size: 18px;
    }
    .filter-btn {
        justify-content: center;
    }
    .heading-btn-sec {
        flex-direction: row;
        gap: 17px;
        align-items: baseline !important;
    }
    .form-group-background {
        padding: 30px 20px 20px 20px;
    }
    .billing-card{
        margin-bottom: 15px;
    }
    .project-table{
        max-width: 100%;
    }
    .head-form{
        align-items: baseline;
    }
    .project-form{
        width: 100% !important;
    }
    .resp-fix{
        flex-direction: column;
        gap:0;
    }
    /* .heading-btn{
        width: 100%;
    } */
    .search-field {
    width: 100%;
    }
    .search-field input{
       width: 100%; 
    }
    .manage-bottom-heading p{
        font-size: 13px;
    }
    .manage-accordian .accordion-header button {
        padding: 15px 15px;
        font-size: 12px;
    }
    .manage-accordian .accordion-body{
        font-size: 12px;
    }
    .manage-form {
        width: 100%;
    }
    .gap-20 {
        gap: 20px;
    }
    .manage-e-buttons button.active::after{
        display: none;
    }
    .manage-e-buttons{
        overflow: hidden;
        margin-bottom: 30px;
        flex-direction: row !important;
    }
    /* .manage-e-buttons button{
        width: 100%;
    }  */
    .email-notofication-dropdown-main {
        width: 100%;
    }
    .resp-i{
        flex-direction: column;
    }
    .resp-i .black-btn-inner,.resp-i .green-btn-inner,.resp-i .red-btn-inner{
        width: 100%;
    }
    .page-title-box{
        margin-bottom: 25px;
    }
    .resp-flex-column{
        flex-direction: column;
    }
    .show-modal{
        margin-bottom: 15px;
    }
    .in-re{
        flex-direction: row !important;
    }
    .form-button .green-btn-inner {
        padding: 10px 0px;
        white-space: nowrap;
        width: 100%;
    }
    .category-box li{
        width: 100%;
    }
    .category-box{
        flex-direction: column;
    }
    .leads_tabs .nav-tabs li {
        width: 100px;
        flex-shrink: 0;
    }
    
    .leads_tabs .nav-tabs li .nav-link {
        font-size: 12px;
        padding: 10px;
    }
    .leads_tabs .nav-tabs {
        overflow-y: hidden;
        overflow-x: auto;
        
    }
    .qualify_top .green-btn-inner{
        display:inline-flex;
    }
        .ipad_column {
            flex-direction: column;
            align-items: flex-start !important;
            gap: 10px;
        }
        .ipad_column .heading-btn .search-field{
           max-width:200px;
        }
        .ipad_column .heading-btn .show-modal{
            margin-bottom: 0;
        }
        
}
@media (min-width: 320px) and (max-width: 767px) {
     .mobile-mb-15{
        margin-bottom: 15px !important;
    }
    .manage-e-buttons button{
        width: 100%;
    }
     .form-anchor-wrapper{
        margin-top: 0px !important;
    }
.green-btn {
    font-size: 0px;
    padding: 10px 10px;
    }
    .green-btn i{
        font-size: 30px;
    }
    .head-filters .general-filter-form .form-select {
        width: 80px;
    }
    .head-filters .general-filter-form .form-control {
        width: 40px;
    }
    .top-icons .gap-18{
       gap: 10px;
    }
    .head-items {
        gap: 10px;
    }
    .head-filters .general-filter-form {
        gap: 10px;
    }
    .drop-user {
        padding-left: 0px;
    }
    .header-item{
        padding: 0 8px;
    }
    .drop-user .header-profile-user {
        height: 25px;
        width: 25px;
    }
    .top-icons a i {
        font-size: 18px;
    }
    .user-img img {
        max-width: 30%;
    }
    .user-img h3 {
        font-size: 24px;
    }
    .user-img p {
        font-size: 18px;
    }
    .filter-btn {
        justify-content: center;
    }
    .heading-btn-sec {
        flex-direction: column;
        gap: 17px;
        align-items: baseline;
    }
    .top-icons .gap-18{
        display: none !important;
    }
    .heading-btn {
        flex-direction: column;
        width: 100%;
        align-items: baseline;
    }
    .heading-btn .search-field,.heading-btn button{
        width: 100%;
        justify-content: space-between;
    }
    .search-field input{
        width: 100%;
    }
    .pagination-two {
        align-items: baseline;
        flex-direction: column;
        gap: 10px;
    }
    .login-form h1 {
        font-size: 24px;
    }
    .login-logo {
        max-width: 215px;
        margin-bottom: 40px;
    }
    .login-form .form-group input {
        height: 50px;
    }
    .login-form .btn{
        height: 50px;
        font-size: 14px;
    }
    .forget-txt a {
        font-size: 13px;
    }
    .resp-50{
        width: 100%;
    }
    .mobile-serch{
        flex-direction: column;
        width: 100%;
        gap: 15px;
    }
    .mobile-serch .search-field{
        width: 100%;
    }
    .mobile-serch .green-btn-inner{
        width: 100%;
        justify-content: space-between;
    }
    .form-group-background {
        padding: 30px 20px 20px 20px;
    }
    .pagination-info {
        flex-direction: column;
        gap: 15px;
    }
    .pagination-info .pagination-info-inner {
        flex-direction: column;
        gap: 10px;
    }
     .billing-card{
        margin-bottom: 15px;
    }
    .project-table{
        max-width: 100%;
    }
    .project-form{
        width:100% !important;
    }
    .head-form, .head-form form {
        width: 100%;
    }
    .head-form{
        align-items: baseline;
    }
    .project-form{
        width: 100% !important;
    }
    .resp-fix{
        flex-direction: column;
        gap:0;
    }
    .heading-btn{
        width: 100%;
    }
    .search-field {
    width: 100%;
    }
    .search-field input{
       width: 100%; 
    }
    .manage-accordian .accordion-header button {
        padding: 15px 15px;
        font-size: 12px;
    }
    .manage-accordian .accordion-body{
        font-size: 12px;
    }
    .manage-form {
        width: 100%;
    }
    .manage-inner-box{
        margin-bottom: 15px;
    }
    .gap-20 {
        gap: 20px;
    }
    .manage-e-buttons button.active::after{
        display: none;
    }
    .manage-e-buttons{
        overflow: hidden;
        margin-bottom: 30px;
    }
    .email-notofication-dropdown-main {
        width: 100%;
    }
    .resp-i{
        flex-direction: column;
        margin-bottom: 15px;
    }
    .resp-i .black-btn-inner,.resp-i .green-btn-inner,.resp-i .red-btn-inner{
        width: 100%;
    }
    .email-notofication-dropdown {
        align-items: baseline;
        flex-direction: column;
    }
    .email-notofication-dropdown .green-light-btn-inner{
        margin-bottom: 15px;
    }
    .mob-i{
        flex-direction: row;
        align-items: center;
    }
    .qualify_top{
        flex-direction: column;
        align-items: flex-start !important;
    }
    .qulify_list>.d-flex{
        flex-direction: column;
        gap:10px;
    }
        .qulify_list>.d-flex .w-25{
            width: 100% !important;
            padding-left: 20px;
        }

}
