/* Explain: Styles for the onboarding wizard and progress tracker. */
/* --- Parcours d'accueil après l'inscription --- */
.sa-onb-progress {
    height: 6px;
    border-radius: 999px;
    background: rgba(160, 120, 255, 0.16);
    overflow: hidden;
}
.sa-onb-progress span {
    display: block;
    height: 100%;
    width: 25%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--primary-color), var(--gold-color));
    transition: width .5s var(--ease-soft);
}

.sa-onb-dots { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.sa-onb-dot {
    width: .7rem;
    height: .7rem;
    border-radius: 50%;
    background: rgba(160, 120, 255, 0.18);
    border: 1px solid var(--border-color);
    transition: background .3s, transform .3s;
}
.sa-onb-dot.is-on { background: var(--gold-color); transform: scale(1.2); }
.sa-onb-dot.is-done { background: var(--primary-color); }

.sa-onb-step h2 { margin: 0; }

.sa-onb-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    align-items: center;
    margin-top: 2rem;
}

@media (max-width: 560px) {
    .sa-onb-actions .sa-btn { width: 100%; }
}

.sa-onb-tools { display: grid; gap: .9rem; }
.sa-onb-tool {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.1rem 1.25rem;
    border-radius: 16px;
    border: 1px solid var(--border-color);
    background: rgba(18, 10, 38, 0.7);
    transition: border-color .3s var(--ease-soft);
}
.sa-onb-tool:hover { border-color: var(--border-gold); }
.sa-onb-tool h3 { margin: 0; }