.onboarding-header {
    width: 100%;
    padding: 16px;
    display: flex;
    gap: 16px;
    flex-direction: column;
    align-items: center;
}

.onboarding-header h1 {
    font-size: 38px;
}

.onboarding-header span {
    font-size: var(--fontSize-big);
}

.shapes-container {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
}

.shapes-container img {
    width: 32px;
    height: 32px;
}

#onboarding-tribe-selector {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 16px;
}

#onboarding-tribe-selector button {
    background-color: var(--color-background);
    color: var(--tribe-color);
    border: solid 2px var(--tribe-color);
    width: 100%;
}

.tribe-container {
    display: flex;
    gap: 16px;
    align-items: center;
}

@keyframes star-rotate {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}
.tribe-container svg {
    width: 64px;
    height: 64px;
    opacity: 0;
    animation: star-rotate 10s linear infinite;
}

.tribe-container.active svg {
    opacity: 1;
}

.tribe-container svg * {fill: var(--tribe-color);}

#onboarding-validate-tribe {
    opacity: 0.5;
    pointer-events: none;
}

#onboarding-validate-tribe.active {
    opacity: 1;
    pointer-events: all;
}

/* Questions tribe */
/* 
#btn-onboarding-question-fingerprint {
    padding: 8px;
    border-radius: 32px;
    background-color: var(--color-secondary-1);
    width: fit-content;
}

#btn-onboarding-question-fingerprint > svg {
    width: 128px;
    height: 128px;
}

#onboarding-question-fingerprint-status {
    width: 100%;
    height: 32px;
    min-height: 32px;
    background-color: var(--color-secondary-1);
}

#onboarding-question-fingerprint-status>div {
    height: 100%;
    background-color: var(--color-primary);
}

#dishes {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    justify-content: center;
} */