.bg1 {
  background-image: url("../assets/main-bg.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
}

.completed {
    background-color: #0a662e; /* Completed circle color */
    color: white; /* Text color for completed circle */
}
.active-circle {
    background-color: #0a662e; /* Active circle color */
    color: white; /* Text color for active circle */
}
.non-active {
    background-color: #93dba1;
    color: #1A6B39;
}
/* Base dash style */
.dash {
    width: 100%; /* Full width for the connecting line */
    position: relative; /* For the pseudo-element */
}

.dash::after {
    content: '';
    width: 100%;
    height: 4px; /* Thickness of the line */
    background-color: #93dba1;
    display: block; /* Ensures it appears as a line */
    position: absolute; /* Positioning within the container */
    top: 50%; /* Center the line vertically */
    transform: translateY(-50%); /* Adjusts for exact centering */
}

/* Styles for completed and active dash */
.completed-dash::after {
    background-color: #0a662e; /* Color for completed steps */
}

.active-dash::after {
    background-color: #93dba1;
}