{% load i18n %}{% comment %}
Sig Select overlay — dark Gaussian modal over the dormant table hex.
Rendered for the current user's polarity group only.
Context: sig_cards, user_polarity, user_seat, sig_reserve_url, sig_reservations_json
{% endcomment %}
<div class="sig-backdrop"></div>
<div class="sig-overlay"
     data-polarity="{{ user_polarity }}"
     data-user-role="{{ user_seat.role }}"
     data-reserve-url="{{ sig_reserve_url }}"
     data-ready-url="{% url 'epic:sig_ready' room.id %}"

     data-ready="{{ user_ready|yesno:'true,false' }}"
     data-reservations="{{ sig_reservations_json }}">

    <div class="sig-modal">

        <div class="sig-stage" id="id_sig_stage">

            <div class="sig-stage-card" style="display:none">
                <div class="fan-card-corner fan-card-corner--tl">
                    <span class="fan-corner-rank"></span>
                    <i class="fa-solid stage-suit-icon" style="display:none"></i>
                </div>
                <div class="fan-card-face">
                    <div class="fan-card-face-upright">
                        <p class="fan-card-name-group"></p>
                        <p class="sig-qualifier-above"></p>
                        <p class="fan-card-name"></p>
                        <p class="sig-qualifier-below"></p>
                    </div>
                    <p class="fan-card-arcana"></p>
                    <p class="fan-card-correspondence"></p>{# not shown in sig-select — game-kit only #}
                    <div class="fan-card-face-reversal">
                        {# Default DOM order — matches non-major arcana layout (qualifier visually #}
                        {# on top after spin, title visually below). stage-card.js swaps the class #}
                        {# names on these <p>s for Major arcana so each element's class still #}
                        {# matches its semantic content (title → .fan-card-reversal-name etc.). #}
                        <p class="fan-card-reversal-name"></p>
                        <p class="fan-card-reversal-qualifier"></p>
                    </div>
                </div>
                <div class="fan-card-corner fan-card-corner--br">
                    <span class="fan-corner-rank"></span>
                    <i class="fa-solid stage-suit-icon" style="display:none"></i>
                </div>
            </div>
            <div class="sig-stat-block">
                <button class="btn btn-reverse spin-btn" type="button">SPIN</button>
                <button class="btn btn-info fyi-btn" type="button">FYI</button>
                <div class="stat-face stat-face--upright">
                    <p class="stat-face-label">Emanation</p>
                    <ul class="stat-keywords" id="id_stat_keywords_upright"></ul>
                </div>
                <div class="stat-face stat-face--reversed">
                    <p class="stat-face-label">Reversal</p>
                    <ul class="stat-keywords" id="id_stat_keywords_reversed"></ul>
                </div>
                {% include "apps/gameboard/_partials/_sig_fyi_panel.html" with panel_id="id_sig_tooltip" %}
            </div>
        </div>

        <div class="sig-deck-grid" id="id_sig_deck">
            {% for card in sig_cards %}
            <div class="sig-card {{ user_polarity }}-deck"
                 data-card-id="{{ card.id }}"
                 data-suit-icon="{{ card.suit_icon }}"
                 data-corner-rank="{{ card.corner_rank }}"
                 data-name-group="{{ card.name_group }}"
                 data-name-title="{{ card.name_title }}"
                 data-arcana="{{ card.get_arcana_display }}"
                 data-correspondence="{{ card.correspondence|default:'' }}"
                 data-keywords-upright="{{ card.keywords_upright|join:',' }}"
                 data-keywords-reversed="{{ card.keywords_reversed|join:',' }}"
                 data-energies="{{ card.energies_json }}"
                 data-operations="{{ card.operations_json }}"
                 data-levity-qualifier="{{ card.levity_qualifier }}"
                 data-gravity-qualifier="{{ card.gravity_qualifier }}"
                 data-reversal-qualifier="{{ card.reversal_qualifier }}"
                 data-reversal-drops-qualifier="{{ card.reversal_drops_qualifier|yesno:'true,false' }}"
                 data-levity-emanation="{{ card.levity_emanation }}"
                 data-gravity-emanation="{{ card.gravity_emanation }}"
                 data-levity-reversal="{{ card.levity_reversal }}"
                 data-gravity-reversal="{{ card.gravity_reversal }}"
                 data-italic-word="{{ card.italic_word }}">
                <div class="fan-card-corner fan-card-corner--tl">
                    <span class="fan-corner-rank">{{ card.corner_rank }}</span>
                    {% if card.suit_icon %}<i class="fa-solid {{ card.suit_icon }}"></i>{% endif %}
                </div>
                <div class="sig-card-actions">
                    <button class="sig-ok-btn btn btn-confirm" type="button">OK</button>
                    <button class="sig-nvm-btn btn btn-cancel" type="button">NVM</button>
                </div>
                <div class="sig-card-cursors">
                    <i class="fa-solid fa-hand-pointer sig-cursor sig-cursor--left"></i>
                    <i class="fa-solid fa-hand-pointer sig-cursor sig-cursor--mid"></i>
                    <i class="fa-solid fa-hand-pointer sig-cursor sig-cursor--right"></i>
                </div>
            </div>
            {% endfor %}
        </div>

    </div>
</div>