/************ Start Background CSS **********/
.bg-green {
    background: #27B24D !important;
}
.bg-light-green {
    background: #F0FFF4 !important;
}
.bg-darkgreen {
    background: #123237 !important;
}
.bg-light-green {
    background: #EFFFF3 !important;
}
.bg-about-card {
    background: #e9e9e9 !important;
}
.bg-light-white {
    background: #f5f5f5 !important;
}
/************ End Background CSS **********/

/************ Start Text CSS **********/
.text-green {
    color: #27B24D !important;
}
.text-black {
    color: #272727 !important;
}
.text-light-black {
    color: #444444 !important;
}
.text-gray {
    color: #606060 !important;
}
/************ End Text CSS **********/

/************ Start Green Border CSS **********/
.border-green {
    border: 1px solid #27B24D !important;
}
.border-bottom-green {
    border-bottom: 1px solid #27B24D !important;
}
/************ End Green Border CSS **********/

/*********** Start Font Size CSS **********/
.fs-12 {
    font-size: 12px !important;
}
.fs-13 {
    font-size: 13px !important;
}
.fs-14 {
    font-size: 14px !important;
}
.fs-15 {
    font-size: 15px !important;
}
.fs-16 {
    font-size: 16px !important;
}
.fs-17 {
    font-size: 17px !important;
}
.fs-18 {
    font-size: 18px !important;
}
.fs-19 {
    font-size: 19px !important;
}
.fs-20 {
    font-size: 20px !important;
}
.fs-21 {
    font-size: 21px !important;
}
.fs-22 {
    font-size: 22px !important;
}
.fs-23 {
    font-size: 23px !important;
}
.fs-24 {
    font-size: 24px !important;
}
.fs-25 {
    font-size: 25px !important;
}
.fs-26 {
    font-size: 26px !important;
}
.fs-27 {
    font-size: 27px !important;
}
.fs-28 {
    font-size: 28px !important;
}
.fs-29 {
    font-size: 29px !important;
}
.fs-30 {
    font-size: 30px !important;
}
.fs-31 {
    font-size: 31px !important;
}
.fs-32 {
    font-size: 32px !important;
}
.fs-33 {
    font-size: 33px !important;
}
.fs-34 {
    font-size: 34px !important;
}
.fs-35 {
    font-size: 35px !important;
}
.fs-36 {
    font-size: 36px !important;
}
.fs-37 {
    font-size: 37px !important;
}
.fs-38 {
    font-size: 38px !important;
}
.fs-39 {
    font-size: 39px !important;
}
.fs-40 {
    font-size: 40px !important;
}
.fs-41 {
    font-size: 41px !important;
}
.fs-42 {
    font-size: 42px !important;
}
/*********** End Font Size CSS **********/
html {
    margin-top: 0px !important;
}
body {
    top: 100px !important;
}
.header {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
}
.text-justify {
  text-align: justify !important;
}
.step-indicator {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 30px;
  user-select: none;
}
.card-stepper {
    border-radius: 10px;
}
.step {
  flex: 1 1 auto;
  text-align: center;
  position: relative;
  cursor: default;
  min-width: 60px;
}
.step::before {
  content: "";
  position: absolute;
  top: 32%;
  transform: translateY(-50%);
  left: -50%;
  width: 100%;
  height: 3px;
  background-color: #dee2e6;
  z-index: -1;
}
.step:first-child::before {
  display: none;
}
.step.completed + .step::before {
  background-color: #198754;
}
.step .circle {
  width: 40px;
  height: 40px;
  position: relative;
  display: flex;
  margin: 0 auto 5px;
  align-items: center;
  font-weight: bold;
  font-size: 18px;
  border-radius: 50%;
  background-color: #dee2e6;
  justify-content: center;
}
.step .label {
  font-size: 15px;
  word-wrap: break-word;
}
.step.active .circle {
  background-color: #27b24d;
  color: #fff;
}
.step.completed .circle {
  background-color: #198754;
  color: #fff;
}
.step.completed .circle > span {
  display: none;
}
.step.completed .circle::after {
  content: "✔";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 16px;
}
.step-content {
  display: none;
}
.step-content.active {
  display: block;
}
.is-valid {
  border-color: #198754 !important;
  background-color: #d1e7dd !important;
  color: #0f5132 !important;
}
.is-valid:focus {
  border-color: #145c32 !important;
  box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
}
#stepper-form input[type="text"], #stepper-form input[type="email"], #stepper-form input[type="url"], #stepper-form input[type="password"], #stepper-form input[type="search"], #stepper-form input[type="number"], #stepper-form input[type="tel"], #stepper-form input[type="range"], #stepper-form input[type="date"], #stepper-form input[type="month"], #stepper-form input[type="week"], #stepper-form input[type="time"], #stepper-form input[type="datetime"], #stepper-form input[type="datetime-local"], #stepper-form input[type="color"], #stepper-form textarea
{
    height: 40px;
    padding: 5px 8px;
    color: #444;
    font-weight: 400;
    background-color: #effff3;
    border: 1px solid #ccc;
    border-radius: 7px;
}
#stepper-form input[type=number]::-webkit-inner-spin-button, #stepper-form input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
#stepper-form input[type=number] {
    -moz-appearance: textfield;
}
#stepper-form .form-control:focus {
    background-color: #effff3;
    border: 1px solid #3333334f;
    box-shadow: 0 0 0 .2rem #27b24d4d !important;
}
#stepper-form .custom-select.is-invalid, #stepper-form .form-control.is-invalid, #stepper-form .was-validated .custom-select:invalid, #stepper-form .was-validated .form-control:invalid {
    border-color: #dc3545;
}
#stepper-form .btn {
    /* width: 100px; */
    max-width: -webkit-fill-available;
    padding: 7px 15px;
    font-size: 16px;
    border-radius: 7px;
}
#stepper-form .btn-success:hover {
    border-color: #27b24d;
}
#stepper-form .btn-secondary {
    color: #fff;
    background-color: #868e96;
    border-color: #868e96;
}
#stepper-form .btn-secondary:hover {
    color: #fff;
    background-color: #727b84 !important;
    border-color: #6c757d !important;
}
#stepper-form .btn-secondary::before {
    color: #fff;
    background-color: #727b84 !important;
    border-color: #6c757d !important;
}
#stepper-form .remove-btn {
    cursor: pointer;
    color: red;
    font-weight: bold;
}
#stepper-form .property-row {
    position: relative;
    margin-bottom: 10px;
}
#stepper-form .btn-addproperty {   
    width: max-content;
    margin: 0 auto; 
    display: block;
    color: #FFF !important;
    text-decoration: none;
}
#stepper-form .is-invalid { 
    border-color: red !important;
}
.property-search-dropdown {
    width: 99% !important;
    max-height: 250px;
    position: absolute !important;
    display: none; 
    top: 42px;
    /* margin-top: 95px; */
    background-color: #fff !important;
    border: 1px solid #ccc !important;
    border-radius: 5px !important;
    z-index: 1000 !important;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 4px !important;
}
.property-search-dropdown:has(ul) {
    display: block;
    /* margin-top: 300px; */
}
.property-search-dropdown ul {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 245px;
    overflow-y: hidden;
}
.property-search-dropdown li.item {
    padding: 10px;
    cursor: pointer;
}
.property-search-dropdown li.item:hover {
    background-color: #f0f0f0;
}
.property-search-dropdown .item-county {
    position: absolute;
    right: 10px;
}
.property-search-dropdown .fw-bold {
    font-weight: 700 !important;
}
.disclaimer-card {
    border-left: 4px solid #28a745;
    background-color: #f3f3f3;
    padding: 20px;
    border-radius: 5px;
}
.disclaimer-icon {
    font-size: 1.5rem;
    color: #28a745;
    margin-right: 10px;
}
.disclaimer-checkbox {
    margin-left: 21px;
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}
.form-check-input {
  width: 15px;
  height: 15px;
}
.form-check-input:checked {
  background-color: #28a745 !important;
  border-color: #28a745 !important;
}
.form-check-input:checked::before {
  color: white; 
  border-color: #28a745 !important;
}
.disclaimer-alert-warning {
    color: #856404;
    background-color: #fff3cdab;
    border-color: #ffeeba;
}

/**************** Table CSS **************/ 
.table-bordered thead th {
    border-bottom-width: 0px;
}
.table thead th {
    vertical-align: bottom;
    border-bottom: 0px solid #e9ecef;
    background: #27b24d;
    color: #FFF;
}
.table-bordered td, .table-bordered th {
    border: 1px solid #ccc;
}
.table tr > td {
    color: #444;
    font-weight: 500;
}
.edit-all {
    cursor: pointer;
}
.table .fa-save {
    color: #27b24d;
    font-weight: 500;
}

/************** Media Query CSS *************/ 
@media (max-width: 576px) {
    .step-indicator {
        gap: 1rem;
        flex-direction: row;
        align-items: center;
    }
    .step {
        min-width: 100px;
    }
    .step::before {
        display: none;
    }
    #stepper-form .d-flex.justify-content-between {
        flex-direction: column;
        gap: 10px;
    }
    #stepper-form .btn {
        width: 100%;
    }
    .d-flex.justify-content-between {
        flex-direction: column !important;
        gap: 0.75rem;
    }
    h4.fs-26 {
        font-size: 20px !important;
    }
    .fs-18 {
        font-size: 16px !important;
    }
} 
@media (max-width: 768px) {
    .step-indicator {
        overflow-x: auto;
        flex-wrap: nowrap;
    }
}
textarea.form-control:disabled,
textarea.form-control[disabled] {
    background-color: #6c757d54 !important;
    border-color: #6c757d54 !important;
}