/* ===== Scoped styles for Automatic Progress Timeline ===== */

.apt-wrapper {
    width: 100%;
/*     max-width: 1200px; */
    margin: 0 auto;
    padding: 20px 10px;
    box-sizing: border-box;
    overflow-x: hidden; /* avoid horizontal scroll on mobile */
    font-family: 'Poppins', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

.apt-wrapper .container {
    width: 100%;
    margin: 0 auto;
    position: relative;
}

/* --- Path & Steps Container - DESKTOP DEFAULT --- */
.apt-wrapper .curve {
    width: 100%;
    height: 600px;
    position: relative;
}

.apt-wrapper svg { 
    width: 100%; 
    height: 100%; 
    position: absolute;
    top: 0;
    left: 0;
}

/* Path Styling - Base Line */
.apt-wrapper #path-bg {
    stroke: #e0e0e0; 
    stroke-width: 10;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Path Styling - Progress Line with Gradient */
.apt-wrapper #path-progress {
    stroke-width: 10;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
	
    transition: stroke-dashoffset 0.6s ease-out; 
    stroke: url(#multiColorGradient); 
}

/* --- Step Boxes - DESKTOP DEFAULT --- */
.apt-wrapper .step-box {
    position: absolute;
    transform: scale(0.9);
    width: 150px !important;
    background: #ffffff; 
    padding: 8px 12px;
    border-radius: 10px; 
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    font-size: 1em;
    font-weight: 600;
    color: #333;
    opacity: 0;
    transition: 0.5s ease-out, box-shadow 0.3s;
    z-index: 10;
    border: 1px solid #eee;
    text-align: left;
}

.apt-wrapper .show { 
    opacity: 1; 
    transform: scale(1); 
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    border-color: #f0f0f0;
}

.apt-wrapper .highlight-box {
    border-color: var(--step-color, #ffb300);
    background: var(--step-bg-color, #fff8e1);
    color: #1a237e;
}

/* --- Dot/Node on Path --- */
.apt-wrapper .dot {
    width: 50px; 
    height: 50px;
    border-radius: 50%;
    background: var(--step-color, #6200ea);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 22px;
    position: absolute;
    transition: 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    z-index: 15;
    transform: translate(-50%, -50%);
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.apt-wrapper .highlight-dot {
    box-shadow: 0 0 0 0 rgba(255, 179, 0, 0.7);
    animation: pulse-dynamic 1.5s infinite;
}

@keyframes pulse-dynamic {
    0% { box-shadow: 0 0 0 0 var(--step-color-trans, rgba(255, 179, 0, 0.7)); }
    70% { box-shadow: 0 0 0 10px transparent; }
    100% { box-shadow: 0 0 0 0 var(--step-color-trans, rgba(255, 179, 0, 0.7)); }
}

/* ---------------------------------------------------------------------- */
/* --- MOBILE VIEW MEDIA QUERY (Max-width 768px) --- */
/* ---------------------------------------------------------------------- */
@media (max-width: 768px) {

    .apt-wrapper {
        padding: 20px 10px;
    }

    .apt-wrapper .container {
        width: 100%;
    }

    .apt-wrapper .curve { 
        height: 550px;
    }

    .apt-wrapper .step-box { 
        width: 70%; 
        max-width: 320px; 
        font-size: 0.9em; 
        padding: 12px;
        text-align: left; 
    }

    .apt-wrapper .dot { 
        width: 40px; 
        height: 40px; 
        font-size: 18px; 
    }
}