/* Current step styling */
// ::ng-deep .steps-indicator li.current .step-indicator {
//   background-color: #d4643e !important; /* Orange for the current step */
//   color: white; /* Optional: text color for the current step */
// }

/* Current step styling */
::ng-deep .steps-indicator li.current .step-indicator {
  background-color: #007bff !important; /* Blue for the current step */
  color: #ffffff !important; /* White text for contrast */
}

/* Valid step styling */
::ng-deep .steps-indicator li.valid-step:not(.current) .step-indicator {
  background-color: #28a745 !important; /* Green for valid steps */
  color: white; /* Optional: text color */
}

/* Invalid step styling */
::ng-deep .steps-indicator li.invalid-step:not(.current) .step-indicator {
  background-color: #dc3545 !important; /* Red for invalid steps */
  color: white; /* Optional: text color */
}

/* Step title styling */
::ng-deep .steps-indicator li .label {
  margin-top: 5px;
  font-size: 14px;
  text-align: center;
  color: #6c757d !important; /* Default text color */
}

/* Highlight the current step title */
::ng-deep .steps-indicator li.current .label {
  font-weight: bold;
  color: #007bff !important; /* Highlighted color for the current step title */
}

/* Styling for completed steps */
::ng-deep .steps-indicator li.done:not(.invalid-step):not(.current) .step-indicator {
  background-color: #28a745 !important; /* Green for completed and valid steps */
  color: white;
}

::ng-deep .steps-indicator li.done.invalid-step:not(.current) .step-indicator {
  background-color: #dc3545 !important; /* Red for completed but invalid steps */
  color: white;
}