{% extends '@App/partials/base_light.html.twig' %}

{% block styles %}
  {{ parent() }}

  <style>
    .card {
      margin-bottom:0;
      border-radius: 0px;
    }
   
  </style>
{% endblock %}


{% block content %}
  {% set pageStyle = { bgColor: '#ffffff', bgImageUrl: '' } %}
  {% for b in presentation.projetBlocks %}
    {% if b.type == 'page_style' %}
      {% set pageStyle = b.data %}
    {% endif %}
  {% endfor %}
  {% set formuleBlockPresent = false %}

  <div class="bg-light-gray" style="height: 700px; background-size:cover; background-position:center; {% if presentation.background is not null %}background-image: url('{{asset('uploads/projets/presentations/' ~ presentation.background )}}'); {% endif %}" data-ride="carousel">

  </div>

  <div class="container bg-white" style="
    margin-top: -200px; padding-bottom: 200px; position: relative; z-index: 2;
">
      <div class="row feature-light-row p-4">
          <h2 class="fs-15 fw-bolder mb-0">
            {{presentation.projet.titre}}
          </h2>
          <h2 class="fs-7 fw-bolder mb-0">
            {{presentation.projet.societe.nom}}
          </h2>
      </div>
    </div>

  
  <div class="container-fluid overflow-hidden" style="background-color: {{ pageStyle.bgColor|default('#ffffff') }}; {% if pageStyle.bgImageUrl|default('') %}background-image: url('{{ pageStyle.bgImageUrl }}'); background-size:cover; background-position:center;{% endif %} margin-top: -200px;padding: 200px 0px 0px 0px;z-index: 1;">

    <div class="d-flex flex-column">
    {% for block in presentation.projetBlocks|sort((a,b)=> a.position <=> b.position) %}

      {# --- BLOC TEXTE (rich text TinyMCE) --- #}
      {% if block.type == 'text' %}
        {% set titleColor = block.data.titleColor|default('#111827') %}
        {% set textColor = block.data.textColor|default('#374151') %}
        {% set backgroundColor = block.data.backgroundColor|default('#ffffff') %}
        <section class="p-4" style="background-color: {{ backgroundColor }};">
          <div class="container card-body" style="color: {{ textColor }};">
            {% if block.data.titre ?? '' %}<h2 style="color: {{ titleColor }};">{{ block.data.titre }}</h2>{% endif %}
            {{ (block.data.text ?? '')|raw }}
          </div>
        </section>
      {% endif %}

      {# --- BLOC CHIFFRES (jusqu’à 4) --- #}
      {% if block.type == 'chiffres' %}
        {% set titleColor = block.data.titleColor|default('#ffffff') %}
        {% set textColor = block.data.textColor|default('#ffffff') %}
        {% set backgroundColor = block.data.backgroundColor|default('#111111') %}
        <section class="card p-4" style="background-color: {{ backgroundColor }}; color: {{ textColor }};">

          
          {% set figures = block.data.figures ?? [] %}
          {% if figures is not empty %}
            
              <div class="container card-body">
                <h2 class="fs-7 fw-bolder mb-0" style="color: {{ titleColor }};">
                  {{ block.data.titre ?? '' }}
                </h2>
                <span class="fs-4" style="color: {{ textColor }};">{{ (block.data.text ?? '')|raw }}</span>
                <div class="row g-3 row-cols-1 row-cols-sm-2 row-cols-md-4 text-center">
                  {% for fig in figures %}
                    <div class="col">
                      <div class="p-3 h-100">
                        <div class="fs-7 fw-bold" style="color: {{ textColor }};">{{ fig.value ?? '' }}</div>
                        <div class="fs-5" style="color: {{ textColor }};">{{ fig.label ?? '' }}</div>
                      </div>
                    </div>
                  {% endfor %}
                </div>
              </div>
            
          {% endif %}
        </section>
      {% endif %}

      {# --- BLOC IMAGE (image simple) --- #}
      {% if block.type == 'image' %}
        {% set backgroundColor = block.data.backgroundColor|default('#ffffff') %}
        {% set imageUrl = block.data.imageUrl ?? '' %}
        {% if imageUrl %}
          <figure class="container card" style="background-color: {{ backgroundColor }};">
            <div class="card-body">
              <img src="{{ imageUrl }}" alt="Image du projet" class="img-fluid rounded">
            </div>
          </figure>
        {% endif %}
      {% endif %}

      {# --- BLOC PRESENTATION (2 colonnes : image + texte) --- #}
      {% if block.type == 'description' %}
        {% set titleColor = block.data.titleColor|default('#111827') %}
        {% set textColor = block.data.textColor|default('#374151') %}
        {% set backgroundColor = block.data.backgroundColor|default('#ffffff') %}

        {% if block.data.imageUrl is defined %}
          {% if block.data.imageUrl == '' %}
            {% set imageUrl = block.data.url %}
          {% else %}
            {% set imageUrl = block.data.imageUrl %}
          {% endif %}
        {% endif %}
        
        {% set text = block.data.text ?? presentation.projet.description ?? '' %}
        <section class="p-4" style="background-color: {{ backgroundColor }};">
          <div class="container card-body">
            <div class="row g-4 align-items-center">
              {% if imageUrl %}
                <div class="col-md-5">
                  <img src="{{ imageUrl }}" alt="Illustration projet" class="img-fluid rounded">
                </div>
              {% endif %}
              <div class="col-md-7">
                <div class="content">
                   <span class="fs-4" style="color: {{ textColor }};">{{ (block.data.text ?? '')|raw }}</span>
                </div>
              </div>
            </div>
          </div>
        </section>
      {% endif %}

      {# --- BLOC FORMULES (liste non modifiable) --- #}
      {% if block.type == 'formule' %}
        {% set formuleBlockPresent = true %}
        {% set titleColor = block.data.titleColor|default('#111827') %}
        {% set textColor = block.data.textColor|default('#374151') %}
        {% set backgroundColor = block.data.backgroundColor|default('#ffffff') %}
        {# On attend 'formules' passé par le contrôleur : formules du projet #}
        <section class="card shadow-sm" style="background-color: {{ backgroundColor }}; color: {{ textColor }};">
          <div class="container card-body">
            <h2 class="h4 mb-3" style="color: {{ titleColor }};">Formules de partenariat</h2>
            {% include '@Projet/projet/presentation/preview/block/formule_public.html.twig' %}
          </div>
        </section>
      {% endif %}

      {% if block.type == 'partenaire' %}
        {% include '@Projet/projet/presentation/preview/block/partenaire.html.twig' %}
      {% endif %}

      {# --- PLACEHOLDER pour autres types futurs --- #}
      {% if block.type not in ['text','chiffres','image','description','formule','partenaire','page_style'] %}
        <section class="card">
          <div class="card-body">
            <em class="text-muted">Bloc “{{ block.type }}” non pris en charge dans l’aperçu.</em>
          </div>
        </section>
      {% endif %}

    {% else %}
      <div class="alert alert-info">Aucun contenu publié pour le moment.</div>
    {% endfor %}

    {% if not formuleBlockPresent %}
      <section class="card shadow-sm">
        <div class="card-body text-center">
          <a class="btn btn-primary" href="{{ path('public_presentation_prospection', { projet: presentation.projet.idtoken, formule: 'null' }) }}" data-turbo-frame="offcanvas-frame">
            Je souhaite devenir partenaire
          </a>
        </div>
      </section>
    {% endif %}
  </div>

  </div>
{% endblock %}