.readonly-field {
    background-color: #f1f0ef !important;
    color: #6c757d !important;
    pointer-events: none;
    opacity: 0.9;
}

.step {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 2px solid #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    background: #f8f9fa;
    margin: auto;
    font-size: 15px;
    position: relative;
    z-index: 2;
}

.step.active {
    border-color: #653b47 !important;
    background-color: #653b47 !important;
    color: #fff !important;
}

.step.completed {
    border-color: #653b47 !important;
    background-color: #653b47 !important;
    color: #fff !important;
}

.step-label {
    font-size: 14px;
    margin-top: 8px;
}


.step-indicators {
    display: flex;
    justify-content: space-between;
    position: relative;
    width: 100%;
}

.step-item {
    position: relative;
    flex: 1;
    text-align: center;
}

.step-circle {
    width: 20px;
    height: 20px;
    background: #ccc;
    border-radius: 50%;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.step-item::after {
    content: "";
    position: absolute;
    top: 18px;
    left: 50%;
    width: 100%;
    height: 2px;
    background: #ccc;
    z-index: 1;
}

.step-item:last-child::after {
    content: none;
}

.btn-main {
    font-size: 16px;
    padding: 10px 30px;
    margin-right: 20px;
    margin-top: 30px;
}

.btn-main:hover {
    background-color: #653b47;
    color: white;
}

.success-heading {
    color: #653b47;
}

.file-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.file-chip {
    margin: 2px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: white;
    /* color: #fff; */
    /* padding: 6px 10px; */
    font-size: 0.875rem;
    line-height: 1;
    max-width: 100%;
    padding: .5625em;
    border-radius: .5em;
}


.required::after {
    content: " *";
    color: red;
    font-weight: bold;
}

.form-label {
    color: rgb(31, 41, 55) !important;
    font-weight: 500;
}

.bg-light-gray {
    background-color: #f1f0ef;
}

.bg-main {
    background-color: var(--main-color);
}

.px-20 {
    padding-left: 8%;
    padding-right: 8%;
}

.custom-lh {
    line-height: 1.6 !important;
}

.fw-400 {
    font-weight: 400;
}

.filepond--max-files .filepond--drop-label {
  display: none !important;
}

.filepond--drop-label {
  transition: opacity 0.2s ease;
}



.filepond--root {
  background: white !important;
  border: 1px dotted gray !important;
  border-radius: 8px !important;
  color: black !important;
}

/* Remove all default internal backgrounds */
.filepond--panel-root,
.filepond--panel,
.filepond--file,
.filepond--item-panel,
.filepond--item-panel-root {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* File chip (uploaded file row) */
.filepond--item {
  background: transparent !important; /* Remove chip bg */
  color: black !important;
  border: none !important; /* No red border around chip */
}

/* File name and size */
.filepond--file-info-main {
  color: black !important;
  font-weight: 500 !important;
}

.filepond--file-info-sub {
  color: gray !important;
}


/* === DROP LABEL === */
.filepond--drop-label {
  color: gray !important;
  background: white !important;
}

/* === DELETE (X) ICON === */
.filepond--action-remove-item {
  border: 1px solid red !important; /* Red border around icon only */
  border-radius: 50% !important;
  width: 30px !important;
  height: 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: white !important;
  transition: all 0.2s ease;
}

.filepond--action-remove-item svg {
  stroke: red !important;
  fill: red !important;
}

.filepond--action-remove-item:hover {
  background: red !important;
}

.filepond--action-remove-item:hover svg {
  stroke: white !important;
  fill: white !important;
}

.filepond--file-info-sub {
  color: #222324ef !important;
}

.filepond--root {
  border: 1px dotted #ccc !important;
  background-color: #fff !important;
  border-radius: 6px;
  padding: 0.5rem !important;
  min-height: 90px;
  box-sizing: border-box;
}

.filepond--panel-root {
  background-color: transparent !important;
  box-shadow: none !important;
}

.filepond--drop-label {
  background-color: transparent !important;
  color: #333 !important;
  position: relative;
  z-index: 1;
}

.filepond--item-panel {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.filepond--file-action-button {
  color: red !important;
}

.invalid-feedback {
  font-size: 11px !important;
}

.consent {
  font-size: 12.75px !important;
}

.font-12px {
  font-size: 12px !important;
}

input.form-control:focus, 
select.form-control:focus, 
textarea.form-control:focus {
    border-color: #bfbfbf;
    box-shadow: 0 0 0 2px #e6e6e6;
    outline: none;
    transition: all 0.2s ease;
}

input[type="file"] {
    color: #999;
}

input[readonly] {
    background-color: #e9ecef !important;
    color: #6c757d !important;
}

textarea[readonly] {
    background-color: #e9ecef !important;
    color: #6c757d !important;
}

select[readonly] {
    background-color: #e9ecef !important;
    color: #6c757d !important;
    pointer-events: none;
    opacity: 0.7;
}
/* .show-required {
  border: 1px solid red !important;
} */