{#
 # ============================================================================
 # MOLECULE: UPGRADE TOOLTIP (simple & soigné)
 # ============================================================================
 #
 # Tooltip affiché au hover des boutons de création quand le solde est
 # insuffisant. Propose le plan suivant si l'utilisateur n'est pas déjà
 # sur le plan maximum (Expert) ni en B2B.
 #
 # ============================================================================
 # PARAMÈTRES
 # ============================================================================
 #
 # | Paramètre        | Type   | Défaut    | Description                       |
 # |------------------|--------|-----------|-----------------------------------|
 # | minTokens        | int    | (requis)  | Tokens minimum requis             |
 # | currentPlanSlug  | string | 'freemium'| Slug du plan actuel               |
 # | upgradeUrl       | string | (requis)  | URL vers la page upgrade          |
 #
 # ============================================================================
 #}

{%- set minTokens = minTokens ?? 0 -%}
{%- set currentPlanSlug = currentPlanSlug ?? 'freemium' -%}
{%- set upgradeUrl = upgradeUrl ?? '#' -%}
{%- set nextPlanName = {'freemium': 'Pro', 'starter': 'Pro', 'pro': 'Expert'}[currentPlanSlug] ?? null -%}

<div style="text-align:center;font-family:inherit;">
    <div style="font-size:12px;color:#374151;line-height:1.5;{% if nextPlanName %}margin-bottom:8px;{% endif %}">
        Il vous faut <strong style="color:#111827;">{{ minTokens|number_format(0, ',', ' ') }} tokens</strong>
    </div>
    {% if nextPlanName %}
        <a href="{{ upgradeUrl }}"
           style="display:flex;align-items:center;justify-content:center;gap:5px;width:100%;padding:7px 10px;border-radius:8px;font-size:11px;font-weight:600;color:#fff;background:linear-gradient(135deg, #0d1b3e 0%, #0C81E4 100%);text-decoration:none;transition:filter 200ms;box-sizing:border-box;"
           onmouseover="this.style.filter='brightness(1.1)'"
           onmouseout="this.style.filter='brightness(1)'">
            {% include '_atoms/icon/icon.html.twig' with { name: 'crown', size: 'xs', color: 'white' } only %}
            Passer en {{ nextPlanName }}
        </a>
    {% endif %}
</div>