/* test-memoria-a-tempo – Stili specifici */

/* Memorization phase */
#test-memoria-a-tempo-wrapper .test-memorize {
    text-align: center;
}

#test-memoria-a-tempo-wrapper .memorize-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--color-primary, #6c5ce7);
    margin-bottom: 0.5rem;
}

#test-memoria-a-tempo-wrapper .memorize-subtitle {
    color: var(--color-text-light, #666);
    margin-bottom: 1.5rem;
    font-size: 0.95rem;
}

/* Words grid */
#test-memoria-a-tempo-wrapper .words-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    max-width: 600px;
    margin: 0 auto 2rem;
}

#test-memoria-a-tempo-wrapper .word-card {
    background: linear-gradient(135deg, #f0ecff 0%, #e8e0ff 100%);
    border: 2px solid var(--color-primary, #6c5ce7);
    border-radius: var(--radius-md, 8px);
    padding: 1rem 0.75rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-primary-dark, #5a4bd1);
    text-align: center;
    transition: transform 0.2s ease;
}

#test-memoria-a-tempo-wrapper .word-card:hover {
    transform: scale(1.05);
}

/* Result ranges */
#test-memoria-a-tempo-wrapper .result-ranges {
    background: var(--color-bg-light, #f8f9fa);
    border-radius: var(--radius-md, 8px);
    padding: 1.5rem;
    margin-top: 1.5rem;
}

#test-memoria-a-tempo-wrapper .result-ranges h4 {
    margin-bottom: 0.75rem;
    color: var(--color-text, #333);
    font-size: 1rem;
}

#test-memoria-a-tempo-wrapper .result-ranges ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

#test-memoria-a-tempo-wrapper .result-ranges li {
    padding: 0.4rem 0;
    border-bottom: 1px solid var(--color-border, #e0e0e0);
    font-size: 0.9rem;
    color: var(--color-text, #333);
}

#test-memoria-a-tempo-wrapper .result-ranges li:last-child {
    border-bottom: none;
}

/* Responsive */
@media (max-width: 600px) {
    #test-memoria-a-tempo-wrapper .words-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.5rem;
    }

    #test-memoria-a-tempo-wrapper .word-card {
        font-size: 0.95rem;
        padding: 0.75rem 0.5rem;
    }
}