.bg-slate-200{
  font-size: 15px !important;
color: #0009;
font-weight: 600;
}

.dashboad-zr  .numbers p{
  color: #67748e;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 21px;
}
.dashboad-zr  .numbers h5{
  color: #344767;
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 33px !important;
}
.card {
  box-shadow: 0 0 0rem 0 rgb(136 152 170 / 3%) !important;
}
.bg-slate-200 {
opacity: 1;
background-color: rgb(226 232 240 / 64%);
}
.zr-td-style h6 {
font-size: 14px !important;
font-weight: 500;
line-height: 23px;
color: #344767;
}
.zr-th-style {
font-size: 15px !important;
color: #344767;
font-weight: 600;

}

.zr-add-btn {
/* background-color: #097D67 !important; */
background: linear-gradient(200deg, #0065A2 10%, #0A8269 100%);
font-size: 14px !important;
font-weight: 400 !important;
}

.zr-status-detail {
color: #67748e;
font-size: 14px !important;
font-weight: 400 !important;
}
.icon-shape {
width: 52vpx;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
background: #0065a2;
}

/* .zr-detail-col {
  background: #fff;
  border: 1px solid #deedfc;
  border-radius: 0 8px 8px 0;
  border-left-color: #02581b !important;
  border-width: 3px 3px 4px 4px;
  border-color: transparent;
  box-shadow: 0 0px 10px 0px #4d9fec24;
} */


.zr-form-group {
position: relative;
margin-bottom: 20px;
}
/* .zr-form-group input, .zr-form-group select, .zr-form-group select option, .zr-form-group textarea {
 width: 100%;
 padding: 9px 15px;
 border: 1px solid #e9edf6 !important;
 border-radius: 7px;
 font-size: 13px;
 font-weight: 400;
 line-height: 22px;
 color: rgb(33, 37, 41, 0.65) !important;
 transition: border-color 0.3s ease;
} */
.zr-form-group textarea{
height: 240px;
}
/* Status Dot Styles */

.zr-lead-status .status-dot{
  width: 10px;
  height: 10px;
  border-radius: 20px;
  margin-right: 5px;
}
.operation-btn-div .zr-status-btn {
	padding: 6px;
	width: 32px;
	height: 32px;
	border-radius: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgb(0 137 255 / 8%);
	color: #0B8269 !important;
	border: 1px solid #0B8269 !important;
	margin-bottom: 0px;
}
.zr-lead-status .dot-new.status-dot{
  background-color: #08A9F4;
}
.zr-lead-status .dot-in-review.status-dot{
  background-color: #FF7800;
}
.zr-lead-status .dot-review-complete.status-dot{
  background-color: #2ECD6E;
}
.zr-lead-status .dot-rejected-info-missing.status-dot{
  background-color: #cd2e2e;
}
.zr-lead-status {
	font-size: 12px;
	text-transform: capitalize;
}

.zr-leadPageHeadBtn {
  display: flex;
  column-gap: 30px;
  flex-direction: row;
  align-items: center;
}
.zr-leadPageHeadBtn .btn.zr-custom-btn{
  text-wrap:nowrap;
}
.zr-leadPageFileupload input[type='file'] {
  width: 100%;
  background-color: #f7f7f7;
  padding: 5px;
  border-radius: 5px;
  cursor: pointer;
}
.zr-leadPageFileupload input[type="file"]::file-selector-button{
  background-color: #0A8269;
  margin: 0;
  padding:0px 5px;
  border-radius: 5px;
  border:0;
  color: #ffffff;
  margin-right:5px!important;
  cursor: pointer;
  font-size:12px;
}
.zrNote-EditDel-btn {
  column-gap: 10px;
  display: flex;
}
.zrNote-EditDel-btn i.fa-edit {
  color: #0065a2;
}
.zr-lpFileuploadHead {
  text-transform: unset!important;
}
.zr-lpFileuploadHead-subhead {
  font-size: 12px;
  font-weight: 400;
}
.zr-leadNoteDescription .zr-lpFileDownloadbtn {
  background-color: #0A8269;
  color: #fff;
  font-size: 11px;
  font-weight: 400;
  padding: 2px;
  border-radius: 3px;
  padding-left: 8px;
}
.zr-leadNoteDescription .zr-lpFileDownloadbtn:hover {
  background-color: #076451;
  color: #ffffff;
}
.zr-leadPageHeadBtn .zr-lvSelectStatus {
  width: 165px;
  font-size:12px;
}

.filter-container .zr-leadFilterbtn,  .zr-filterBtn-Outer .zr-leadFilterbtn{
  padding: 5px 10px;
  margin: 0;
  background-color: #0a8269;
  border-radius: 4px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 400;
}
.filter-container .zr-leadClearFilter, .zr-filterBtn-Outer .zr-leadClearFilter {
  padding: 5px 10px;
  margin: 0;
  background-color: #d14848;
  border-radius: 4px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 400;
  margin-left: 10px;
}
.filter-container .zr-leadFilterbtn:hover, .zr-filterBtn-Outer .zr-leadFilterbtn:hover {
  background-color: #09745e;
  color: #ffffff;
}
.filter-container .zr-leadClearFilter:hover, .zr-leadClearFilter:hover, .zr-leadClearFilter:focus, .zr-filterBtn-Outer .zr-leadClearFilter:hover {
  background-color: #a63333!important;
  color: #ffffff;
}
.zr-filterInside {
    padding: 5px 10px 10px 10px;
    border-radius: 10px;
    background-color: #f7f7f7;
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(5, minmax(auto, 1fr));
    grid-auto-flow: dense;
    grid-gap: 10px;
}

/* Dropdown styles */
.status-dropdown {
  position: absolute;
  background-color: #fff;
  border: 1px solid #ccc;
  width: 150px;
  z-index: 10;
  border-radius: 5px;
  top: 30px;
  margin: auto;
}

.status-dropdown .status-name {
  font-size: 13px;
  border-bottom: 1px solid #f1f1f1;
}

.status-dropdown div {
  cursor: pointer;
  padding: 5px;
}

.status-dropdown div:hover {
  background-color: #f0f0f0;
}

.operation-btn-div {
  position: relative;
}

.btn-icon {
  background: none;
  border: none;
  font-size: 16px;
}


.zr-form-group {
position: relative;
margin-bottom: 20px;
}
.zr-form-group input {
 width: 100%;
  padding: 9px;
  border: 1px solid #ccc;
  border-radius: 7px;
  font-size: 16px;
  transition: border-color 0.3s ease;
}
.zr-form-group label {

font-size: 14px;
font-weight: 400;
transition: top 0.3s ease, font-size 0.3s ease, color 0.3s ease;
}
.zr-form-group input:focus {
border-color: #0065a2;
outline: none;
box-shadow: none !important;
}
.zr-form-group input:focus + label,
.zr-form-group input:not(:placeholder-shown) + label {
top: -10px;
font-size: 13px;
color: #0065A2  !important;
background-color: #ffffff;
padding: 0 6px;
border-radius: 0px;
left: 4px;
border-left: 2px;
}


.zr-b-info{
text-transform: capitalize;
font-weight: 600;
font-size: 14px !important;
color: #2e384d !important;
}


.zr-form-group select:focus {
border-color: #0065A2  ;
outline: none;
box-shadow: none !important;
}

.zr-form-group select:focus + label,
.zr-form-group select:not([value=""]) + label {
top: -10px;
font-size: 13px;
color: #0065A2  !important;
background-color: #ffffff;
padding: 0 6px;
border-radius: 0px;
left: 5px;
border-left: 2px;
}




.zr-form-group textarea:focus {
border-color: #0065A2;
outline: none;
box-shadow: none !important;
}

.zr-form-group textarea:focus + label,
.zr-form-group textarea:not(:placeholder-shown) + label {
top: -10px;
font-size: 13px;
color: #0065A2  !important;
background-color: #ffffff;
padding: 0 6px;
left: 13px;
}

/* forgot */
.zr-forgot-password{
font-size: 26px;
font-weight: 700;
color: #0A8269;
}
.zr-login-forgot{
font-weight: 500 !important;
color: #0A8269 !important;
text-decoration:underline;
font-size: 14px;
}
.zr-forgot-parha{
font-size: 17px;
font-weight: 400;
color: #777;
line-height: 20px;
}
.zr-forgot-form .focus\:ring-indigo-500:focus {
--tw-ring-color: rgb(99 102 241 / 0%);
}
.zr-forgot-form input::placeholder{
font-size: 14px;
font-weight: 400;
}
.zr-forgot-mail span, .zr-sigin-field{
text-transform: capitalize;
font-weight: 500;
font-size: 15px !important;
color: #2e384d !important;
}
.zr-reset-btn{
  font-size: 15px !important;
  font-weight: 400 !important;

  background: #097D67 !important;
}
.zr-login-btn{
background: #097D67 !important;
padding: 9px 9px !important;
font-weight: 400 !important;
font-size: 15px !important;
}
.zr-forgot-form input{
color: #333;
font-size: 14px;
}

.zr-login-btn {
display: flex;
align-items: center;
gap: 8px;
border-radius: 6px;
font-size: 16px !important;
font-weight: 400 !important;
padding: 12px 20px !important;
}
.zr-login-btn:hover {
  background-color: #33977be8 !important;
}
.zr-login-btn {
    background: #097D67 !important;
     font-weight: 400 !important;
     color: #fff;
    text-align: center;
    justify-content: center;
}
.zr-forgot-form input{
color: #333;
font-size: 14px;
font-weight: 400;
}
.zr-sigin-field .zr-form-group{
margin-bottom: 2px !important;
}
.form-group.zr-check-box label {
position: relative;
cursor: pointer;
}

.zr-check-box label:before {
border-radius: 4px;
  content: '';
  background-color: white;
  border: 2px solid #097D67;
  padding: 8px;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  cursor: pointer;
  margin-right: 9px;
  transition: background-color 0.3s ease;
}
.zr-check-box input:checked + label:before {
background-color: #097D67;
}
.zr-check-box input:checked + label:after {
content: '';
display: block;
position: absolute;
top: 3px;
  left: 7px;
  width: 6px;
  height: 12px;
border: solid #fff;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.zr-check-box label:before {
border-color: #097D67;
}
.form-check:not(.form-switch) .form-check-input[type=checkbox]{
display: none;
}
.zr-form-group {
  font-family: "Poppins", serif;
  border-radius: 6px;
  border-color: #0064a26c !important;
  box-shadow: 3px 3px 8px 0px rgb(0 101 162 / 5%);
  font-size: 14px;
  color: #313233;
  background-color: #000 !important;
}
.input-group-text{
  background-color: #E8F0FE !important;
  border: 1px solid #E8F0FE;
}
.zr-forgot-parha {
  font-size: 15px;
  line-height: 22px;
}
.filter-containerExtra{
    padding: 5px 10px 10px 10px;
    border-radius: 10px;
    background-color: #f7f7f7;
}


/* .zr-sigin-field .input-group-text i{
  color: #097d67de !important
} */
/* Responsive */

@media screen and (max-width:1400px) {
.filter-containerOuter .filter-container {
    align-items: flex-start!important;
    display: grid!important;
    grid-template-columns: repeat(2, minmax(auto, 1fr));
    grid-auto-flow: dense;
}
}

@media screen and (max-width:1400px) {
    .zr-filterInside {
        grid-template-columns: repeat(3, minmax(auto, 1fr));
    }
    span.zr-add-text {
        display: none;
    }

}

@media screen and (max-width:1366px) {
    .zr-leadPageHeadBtn {
        -moz-column-gap: 15px;
        column-gap: 15px;
    }
    }

@media screen and (max-width:1024px) {
.zr-login-heading{
font-size: 34px !important;
}
.zr-login-sub-heading{
font-size: 18px !important;
line-height: 24px !important;
}
}
@media screen and (max-width:991px) {
    .zr-filterInside {
        grid-template-columns: repeat(2, minmax(auto, 1fr));
    }
}
@media screen and (max-width:767px) {
  .zr-login-btn{
    font-size: 16px !important;
  }
  .zr-forgot-parha {
    font-size: 13px;
    line-height: 15px;
}
.relative.h-\[200px\] {
  height: 345px;
}
.zr-forgot-password {
  font-size: 21px;
  margin-bottom: 6px;
}
.zr-login-heading {
      font-size: 24px !important;
  }
  .zr-login-sub-heading {
    font-size: 15px !important;
    line-height: 20px !important;
}
.zr-login-logo{
  width: 60% !important;
}

}

@media screen and (max-width:676px) {
    .filter-containerOuter .filter-container {
        align-items: flex-start!important;
        display: grid!important;
        grid-template-columns: repeat(1, minmax(auto, 1fr));
        grid-auto-flow: dense;
    }
    }
@media screen and (max-width:575px) {
    .zr-filterInside {
        grid-template-columns: repeat(1, minmax(auto, 1fr));
    }
}
@media screen and (max-width:500px) {
    .zr-custom-responsive{
      flex-wrap: wrap !important;
    }
    .zr-leadPageHeadBtn {
        flex-direction: column;
        align-items: flex-start;
        row-gap: 10px;
    }
    .filter-container .multiselect, .filter-container select {
        min-width: unset;
    }
  }