{#
 # ============================================================================
 # ORGANISM: COURSE CARD
 # ============================================================================
 #
 # Carte de cours Moodia avec badges, statistiques, niveau et métadonnées.
 # Organisme car combine plusieurs molécules et a une logique métier complexe.
 #
 # ============================================================================
 # COMPOSITION (Molécules et Atomes utilisés)
 # ============================================================================
 #
 # - _atoms/icon/icon.html.twig
 # - _atoms/badge/badge.html.twig
 # - _molecules/level-indicator/level-indicator.html.twig
 # - _molecules/mini-stat/mini-stat.html.twig
 #
 # ============================================================================
 # PARAMÈTRES
 # ============================================================================
 #
 # | Paramètre        | Type    | Défaut    | Description                     |
 # |------------------|---------|-----------|--------------------------------|
 # | title            | string  | (requis)  | Titre du cours                 |
 # | href             | string  | (requis)  | URL vers l'éditeur             |
 # | status           | string  | 'draft'   | draft, deployed, generating    |
 # | generationType   | string  | 'course'  | course, course_quiz, quiz_only |
 # | level            | string  | null      | debutant, intermediaire, avance|
 # | duration         | number  | null      | Durée en heures                |
 # | publicTarget     | string  | null      | Public cible                   |
 # | sectionsCount    | number  | 0         | Nombre de sections             |
 # | pagesCount       | number  | 0         | Nombre de pages                |
 # | questionsCount   | number  | 0         | Nombre de questions (quiz)     |
 # | tokensUsed       | number  | null      | Tokens consommés               |
 # | energyWh         | number  | null      | Énergie consommée (Wh)         |
 # | updatedAt        | date    | null      | Date de mise à jour            |
 # | class            | string  | ''        | Classes additionnelles         |
 #
 # ============================================================================
 # EXEMPLES D'UTILISATION
 # ============================================================================
 #
 # Carte de cours simple:
 # {% include '_organisms/course-card/course-card.html.twig' with {
 #     title: 'Introduction à Python',
 #     href: '/moodia/editor/abc123',
 #     status: 'deployed',
 #     generationType: 'course_quiz',
 #     level: 'debutant',
 #     sectionsCount: 5,
 #     pagesCount: 12
 # } %}
 #
 # Carte quiz:
 # {% include '_organisms/course-card/course-card.html.twig' with {
 #     title: 'Quiz JavaScript',
 #     href: '/moodia/editor/xyz789',
 #     generationType: 'quiz_only',
 #     questionsCount: 20
 # } %}
 #
 # ============================================================================
 #}

{# ============================================================================
   CONFIGURATION DES VALEURS PAR DÉFAUT
   ============================================================================ #}

{% set title = title ?? 'Cours sans titre' %}
{% set href = href ?? '#' %}
{% set status = status ?? 'draft' %}
{% set generationType = generationType ?? 'course' %}
{% set level = level ?? null %}
{% set duration = duration ?? null %}
{% set publicTarget = publicTarget ?? null %}
{% set sectionsCount = sectionsCount ?? 0 %}
{% set pagesCount = pagesCount ?? 0 %}
{% set questionsCount = questionsCount ?? 0 %}
{% set tokensUsed = tokensUsed ?? null %}
{% set energyWh = energyWh ?? null %}
{% set updatedAt = updatedAt ?? null %}
{% set class = class ?? '' %}

{# ============================================================================
   CONFIGURATION DES VARIANTES
   ============================================================================ #}

{% set statusConfig = {
    'draft': { 'badge': 'Brouillon', 'variant': 'warning', 'borderColor': 'border-amber-200' },
    'deployed': { 'badge': 'Déployé', 'variant': 'success', 'borderColor': 'border-green-200' },
    'generating': { 'badge': 'En cours', 'variant': 'primary', 'borderColor': 'border-primary/30' }
} %}

{% set typeConfig = {
    'course': { 'label': 'Cours', 'icon': 'book', 'color': 'primary' },
    'course_quiz': { 'label': 'Cours + Quiz', 'icon': 'check-circle', 'color': 'success' },
    'quiz_only': { 'label': 'Quiz', 'icon': 'list', 'color': 'warning' }
} %}

{% set levelConfig = {
    'debutant': { 'num': 1, 'label': 'Débutant' },
    'intermediaire': { 'num': 2, 'label': 'Intermédiaire' },
    'avance': { 'num': 3, 'label': 'Avancé' },
    'expert': { 'num': 4, 'label': 'Expert' }
} %}

{% set sConfig = statusConfig[status] ?? statusConfig['draft'] %}
{% set tConfig = typeConfig[generationType] ?? typeConfig['course'] %}
{% set lConfig = levelConfig[level] ?? null %}

{% set containerClasses = [
    'block bg-white rounded-2xl border-2 transition-all duration-300',
    'hover:shadow-lg hover:-translate-y-1 hover:border-primary/30',
    sConfig.borderColor,
    'overflow-hidden',
    class
]|join(' ')|trim %}

{# ============================================================================
   RENDU HTML
   ============================================================================ #}

<a href="{{ href }}" class="{{ containerClasses }}">
    {# Header avec badges #}
    <div class="flex items-center justify-between p-4 pb-0">
        {# Badge type #}
        {% include '_atoms/badge/badge.html.twig' with {
            text: tConfig.label,
            variant: tConfig.color,
            size: 'sm'
        } only %}

        {# Badge status (si pas draft) #}
        {% if status != 'draft' %}
            {% include '_atoms/badge/badge.html.twig' with {
                text: sConfig.badge,
                variant: sConfig.variant,
                size: 'sm'
            } only %}
        {% endif %}
    </div>

    {# Contenu principal #}
    <div class="p-4 pt-3">
        {# Icône et titre #}
        <div class="flex items-start gap-3 mb-3">
            <div class="w-10 h-10 rounded-xl bg-{{ tConfig.color }}/10 flex items-center justify-center flex-shrink-0">
                {% include '_atoms/icon/icon.html.twig' with {
                    name: tConfig.icon,
                    size: 'lg',
                    color: tConfig.color
                } only %}
            </div>
            <div class="flex-1 min-w-0">
                <h3 class="text-base font-semibold text-gray-900 line-clamp-2 leading-tight">
                    {{ title }}
                </h3>
                {# Statistiques du contenu #}
                <p class="text-sm text-gray-500 mt-1">
                    {% if generationType == 'quiz_only' %}
                        {{ questionsCount }} question{{ questionsCount > 1 ? 's' : '' }}
                    {% else %}
                        {{ sectionsCount }} section{{ sectionsCount > 1 ? 's' : '' }} · {{ pagesCount }} page{{ pagesCount > 1 ? 's' : '' }}
                    {% endif %}
                </p>
            </div>
        </div>

        {# Paramètres du cours #}
        {% if level or duration or publicTarget %}
            <div class="flex flex-wrap items-center gap-2 mb-3">
                {% if level and lConfig %}
                    {% include '_molecules/level-indicator/level-indicator.html.twig' with {
                        level: lConfig.num,
                        maxLevel: 4,
                        showLabel: true,
                        labels: ['Débutant', 'Intermédiaire', 'Avancé', 'Expert'],
                        size: 'sm'
                    } only %}
                {% endif %}

                {% if duration %}
                    <span class="inline-flex items-center gap-1 text-xs text-gray-500">
                        {% include '_atoms/icon/icon.html.twig' with {
                            name: 'clock',
                            size: 'xs',
                            color: 'muted'
                        } only %}
                        {{ duration }}h
                    </span>
                {% endif %}

                {% if publicTarget %}
                    <span class="inline-flex items-center gap-1 text-xs text-gray-500 truncate max-w-[120px]" data-tooltip="{{ publicTarget }}">
                        {% include '_atoms/icon/icon.html.twig' with {
                            name: 'users',
                            size: 'xs',
                            color: 'muted'
                        } only %}
                        {{ publicTarget }}
                    </span>
                {% endif %}
            </div>
        {% endif %}
    </div>

    {# Footer avec date et consommation #}
    <div class="px-4 py-3 bg-gray-50 border-t border-gray-100 flex items-center justify-between">
        <span class="text-xs text-gray-400">
            {% if updatedAt %}
                Créé le {{ updatedAt|date('d/m/Y') }}
            {% else %}
                –
            {% endif %}
        </span>

        <div class="flex items-center gap-3">
            {# Tokens #}
            <span class="inline-flex items-center gap-1 text-xs text-gray-400">
                {% include '_atoms/icon/icon.html.twig' with {
                    name: 'token',
                    size: 'xs',
                    color: 'muted'
                } only %}
                {% if tokensUsed %}
                    {{ (tokensUsed / 1000)|number_format(1) }}k
                {% else %}
                    –
                {% endif %}
            </span>

            {# Énergie #}
            <span class="inline-flex items-center gap-1 text-xs text-gray-400">
                {% include '_atoms/icon/icon.html.twig' with {
                    name: 'power',
                    size: 'xs',
                    color: 'muted'
                } only %}
                {% if energyWh %}
                    {{ energyWh|number_format(2) }} Wh
                {% else %}
                    –
                {% endif %}
            </span>
        </div>
    </div>
</a>