/* Guided learning paths (/learn, /chs/learn) — hub cards, step lists and the badge. */

.lp-card {
    transition: transform 0.15s ease;
}

.lp-card:hover {
    transform: translateY(-2px);
}

/* ---------- Step rows ---------- */
.lp-step {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.7rem 0;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}

.lp-step:last-child {
    border-bottom: 0;
}

.lp-step.is-done .lp-step-title {
    text-decoration: line-through;
    opacity: 0.6;
}

.lp-step.is-done .lp-step-why {
    opacity: 0.5;
}

.lp-step-check {
    width: 1.35rem;
    height: 1.35rem;
    margin-top: 0.15rem;
    flex-shrink: 0;
    cursor: pointer;
}

.lp-step-icon {
    width: 1.6rem;
    text-align: center;
    flex-shrink: 0;
    margin-top: 0.2rem;
    opacity: 0.75;
}

.lp-step-title {
    font-weight: 600;
}

.lp-step-why {
    font-size: 0.9rem;
    opacity: 0.75;
}

/* ---------- Progress ---------- */
.lp-progress-wrap {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--bs-body-bg, #fff);
    padding: 0.6rem 0;
}

.lp-badge {
    border: 2px dashed var(--bs-success, #198754);
    border-radius: 0.6rem;
}

.lp-badge-icon {
    font-size: 2.6rem;
    color: var(--bs-success, #198754);
}

/* ---------- Placement quiz ---------- */
.lp-quiz-option {
    text-align: left;
}

@media print {
    .lp-step-check,
    .ad-container,
    .ad-placeholder {
        display: none !important;
    }
}