<!--
    Component informations:
    - id: ACCORDION
    - name: Accordion Component
-->
<?php
    $component_accordion = array(
        'items' => 3
    );
?>

<section class="component-ACCORDION component-ACCORDION-TOURNOI component-ACCORDION--fullpage">
    <div class="component-ACCORDION-container">
        <div class="component-ACCORDION-wrapper">
            <div class="component-ACCORDION-TOURNOI-headline">
                <h3>Juillet</h3>
            </div>
            <div class="component-ACCORDION-widget panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                <?php for ($i = 0; $i < $component_accordion['items']; $i++) : ?>

                    <div class="component-ACCORDION-item panel">

                        <div class="component-ACCORDION-item-header" id="item-<?= $i ?>-header" role="tab">
                            <a class="component-ACCORDION-item-header-content component-ACCORDION-TOURNOI-item-header-content bg-color-grey-light " data-toggle="collapse" data-parent="#accordion" href="#item-<?= $i ?>-content" role="button" aria-expanded="false" aria-controls="item-<?= $i ?>-content">
                                
                                <div class="component-ACCORDION-TOURNOI-item-header-date">
                                    <p class="lucien-light component-ACCORDION-TOURNOI-item-header-date-j">mar</p>
                                    <p class="lucien-regular component-ACCORDION-TOURNOI-item-header-date-jn">1</p>
                                    <p class="lucien-regular component-ACCORDION-TOURNOI-item-header-date-m">jui</p>
                                </div>

                                <div class="component-ACCORDION-TOURNOI-item-header-image">

                                    <picture class="component-ACCORDION-TOURNOI-item-header-image-file">
                                        <source media="(min-width: 1024px)" srcset="img/modules/ACCORDION-TOURNOI/tournoi-header-img.png">
                                        <source media="(min-width: 481px)" srcset="img/modules/ACCORDION-TOURNOI/tournoi-header-img.png">
                                        <source media="(max-width: 480px)" srcset="img/modules/ACCORDION-TOURNOI/tournoi-header-img.png">
                                        <img src="img/modules/ACCORDION-TOURNOI/tournoi-header-img.png" alt="">
                                    </picture>

                                </div>

                                <div class="component-ACCORDION-TOURNOI-item-header-title">
                                    <div>
                                        <h4>Tournoi Freezeout</h4>
                                        <p><span class="lucien-regular">16:00</span><span class="pipe-sep">&nbsp;|&nbsp;</span><span  class="lucien-regular">surivor</span></p>
                                        <p><span class="lucien-regular">60€</span><span class="pipe-sep mobile-hidden">&nbsp;|&nbsp;</span><span class="lucien-book mobile-hidden">12 500 jetons - 30 min</span></p>
                                    </div>
                                    
                                    <!-- TITLE -->
                                    <!-- <span class="component-ACCORDION-item-header-title">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</span> -->
                                    <!-- ICON -->
                                    <span class="component-ACCORDION-item-header-icon component-ACCORDION-TOURNOI-item-header-icon"></span>
                                </div>
                            </a>
                        </div>
                        

                        <div class="component-ACCORDION-item-content panel-collapse collapse" id="item-<?= $i ?>-content" role="tabpanel" aria-labelledby="item-<?= $i ?>-header">
                            <div class="component-ACCORDION-TOURNOI-item-header-image-inner">
                                <picture class="component-ACCORDION-TOURNOI-item-header-image-file">
                                    <source media="(min-width: 1024px)" srcset="img/modules/ACCORDION-TOURNOI/tournoi-header-img.png">
                                    <source media="(min-width: 481px)" srcset="img/modules/ACCORDION-TOURNOI/tournoi-header-img.png">
                                    <source media="(max-width: 480px)" srcset="img/modules/ACCORDION-TOURNOI/tournoi-header-img.png">
                                    <img src="img/modules/ACCORDION-TOURNOI/tournoi-header-img.png" alt="">
                                </picture>

                            </div>

                            <div class="component-ACCORDION-item-content-wrapper component-ACCORDION-TOURNOI-item-content-wrapper">
                                <ul class="lucien-regular component-ACCORDION-TOURNOI-item-content-left">
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Nom : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">Tournoi Knockout Re-entry 200€</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Date : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">Du 1er Juillet au 5 Juillet</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Heure : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">18h00</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Buy in : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">50 € + 250 €</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Re Buy : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">2 / 150€ / 12000 jetons</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Add-on : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">150€ / 12000 jetons</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Jetons : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">12 500</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Rounds : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">30 mn</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Type : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">Knockout</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Late Reg : </span>
                                        <span class="component-ACCORDION-TOURNOI-item-txt">10 € pour 2 500 jetons</span>
                                    </li>
                                    <li>
                                        <span class="lucien-book component-ACCORDION-TOURNOI-item-lib">Dealer Bonus : </span><br />
                                        <span class="component-ACCORDION-TOURNOI-item-txt">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                        tempor incididunt ut labore et dolore magna aliqua. Joueurs à table / 6</span>
                                    </li>
                                </ul>

                                <div class="component-ACCORDION-TOURNOI-item-content-right">
                                    <a class="button-golden-outline component-ACCORDION-TOURNOI-button">stucture détaillée du tournoi</a>
                                    <a class="button-golden-outline component-ACCORDION-TOURNOI-button">Hébergement à proximité</a>
                                    <a class="button-golden component-ACCORDION-TOURNOI-button">s'inscrire</a>
                                </div>
                            </div>
                        </div>
                    </div>


                <?php endfor; ?>
            </div>
        </div>
    </div>

    <a class="button-golden component-ACCORDION-TOURNOI-button component-ACCORDION-TOURNOI-button-30">Afficher Plus de tournois</a>
</section>