/* ===== THÈMES SPÉCIALISÉS ===== */

/* Thème Mathématiques */
.math-theme {
    --module-primary: var(--primary-soft);
    --module-secondary: #e6f3ff;
    --module-accent: #4a90e2;
}

.math-theme .module-card,
.math-theme .exercise-card {
    border-left: 4px solid var(--module-primary);
}

.math-theme .module-icon {
    color: var(--module-accent);
}

/* Thème Français */
.french-theme {
    --module-primary: var(--secondary-soft);
    --module-secondary: #fff0f8;
    --module-accent: #e91e63;
}

.french-theme .module-card,
.french-theme .exercise-card {
    border-left: 4px solid var(--module-primary);
}

.french-theme .module-icon {
    color: var(--module-accent);
}

/* ===== ANIMATIONS DOUCES ===== */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-10px);
    }
    60% {
        transform: translateY(-5px);
    }
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}

/* Classes d'animation */
.fade-in {
    animation: fadeIn 0.6s ease-out;
}

.slide-in {
    animation: slideIn 0.5s ease-out;
}

.bounce {
    animation: bounce 1s ease-in-out;
}

.pulse {
    animation: pulse 2s ease-in-out infinite;
}

/* ===== ÉTATS INTERACTIFS CHILD-FRIENDLY ===== */
.interactive:hover {
    transform: scale(1.02);
    transition: transform 0.2s ease;
}

.interactive:active {
    transform: scale(0.98);
}

/* Feedback visuel pour les enfants */
.success-feedback {
    background: var(--success-soft) !important;
    border-color: var(--accent-soft) !important;
    animation: pulse 0.6s ease-in-out;
}

.error-feedback {
    background: #ffe6e6 !important;
    border-color: #ff9999 !important;
    animation: bounce 0.6s ease-in-out;
}

/* ===== ACCESSIBILITÉ ===== */
.focus-visible {
    outline: 3px solid var(--primary-soft);
    outline-offset: 2px;
}

/* Amélioration du contraste pour la lisibilité */
.high-contrast {
    --text-primary: #2d3748;
    --text-secondary: #4a5568;
    --border-medium: #a0aec0;
}

/* Mode sombre doux (optionnel) */
@media (prefers-color-scheme: dark) {
    :root {
        --bg-primary: #f7fafc;
        --bg-secondary: #edf2f7;
        --bg-card: #ffffff;
        /* Garde les couleurs claires pour les enfants */
    }
}

/* ===== PRINT STYLES ===== */
@media print {
    .header,
    .footer,
    .sidebar {
        display: none;
    }
    
    .main .container {
        grid-template-columns: 1fr;
    }
    
    .content {
        box-shadow: none;
        border: 1px solid var(--border-medium);
    }
}