{# Détection du contexte : readonly ou validation #}
{% set is_readonly = is_readonly|default(false) %}
<div class="px-2 py-2 bg-white color-primary w-100 h-100 block-infos-container">
    <div class="d-flex">
        <div class="d-flex flex-column me-2">
            <div class="d-flex justify-content-between {% if not is_readonly %}mb-2{% endif %}">
                <div class="d-flex" style="gap:8px;">
                    {% if not is_readonly %}
                        {# Mode validation : N°Intervention, Date, De, à #}
                        <div class="d-flex align-items-center" style="margin-right: 33px;">
                            <label class="me-2">N°Intervention</label>
                            <a href="" class="text-decoration-none fw-600" target="_blank" style="font-size: 15px;width:98px;">
                                {{ intervention.id }}
                            </a>
                        </div>
                    {% endif %}
                    <div class="d-flex align-items-center">
                        <label class="me-2">Date</label>
                        <input type="text" disabled class="form-control {% if is_readonly %}bg-grey{% endif %}" style="width:100px;" value="{{ intervention.planning.date|date('d/m/Y') }}">
                    </div>
                    <div class="d-flex align-items-center">
                        <label class="me-2">De</label>
                        <input type="{{ type == 'technique' or is_readonly ? 'text' : 'time'}}" name="intervention_heure_debut" {{ type == 'technique' or is_readonly ? 'disabled'}} style="width:50px;padding-left: 6px !important; padding-right: 6px !important;" class="form-control {% if is_readonly %}bg-grey{% endif %}" value="{{ intervention.planning.heureDebut|date('H:i') }}" form="form_validation_intervention">
                    </div>
                    <div class="d-flex align-items-center">
                        <label class="me-2">à</label>
                        <input type="{{ type == 'technique' or is_readonly ? 'text' : 'time'}}" name="intervention_heure_fin" {{ type == 'technique' or is_readonly ? 'disabled'}} style="width:50px;padding-left: 6px !important; padding-right: 6px !important;" class="form-control {% if is_readonly %}bg-grey{% endif %}" value="{{ intervention.planning.heureFin|date('H:i') }}" form="form_validation_intervention">
                    </div>
                    {% if is_readonly %}
                        {# Mode readonly : Durée et Agent #}
                        <div class="d-flex align-items-center">
                            <label class="me-2">Durée</label>
                            <input type="text" disabled class="form-control bg-grey" style="width:70px;" value="{{ intervention.planning.duree ? intervention.planning.duree ~ ' min' : '' }}">
                        </div>
                    {% endif %}
                </div>
                {% if is_readonly %}
                    <div class="d-flex align-items-center ms-auto">
                        <label class="me-2" style="width:39px;">Agent</label>
                        <input type="text" disabled class="form-control bg-grey" style="width:224px;" value="{{ intervention.planning.utilisateurAgent ? intervention.planning.utilisateurAgent.getCodeNom : '' }}">
                    </div>
                {% endif %}
            </div>
            <div class="titre-small">Anomalies</div>
            <textarea disabled style="height:{% if is_readonly and is_pac %}137{% elseif is_readonly %}121{% else %}64{% endif %}px;text-align: left; width:{% if is_readonly %}750{% else %}520{% endif %}px;" class="form-control">{{ intervention.interventionAnomalies ? intervention.interventionAnomalies|map(i => i.anomalie ? i.anomalie.libelle : i.anomalieOracle.libelle)|join("\n") : '' }}</textarea>
            <div class="titre-small">Observations</div>
            <textarea disabled class="form-control {% if not is_readonly and intervention.observations %}bg-orange-input border-orange{% endif %}" style="height:{% if is_readonly %}128{% else %}84{% endif %}px;text-align: left">{{ intervention.observations }}</textarea>
            <div class="titre-small">Commentaire client</div>
            <textarea disabled style="height:{% if is_readonly %}83{% else %}64{% endif %}px;text-align: left" class="form-control">{{ intervention.getCommentaireClient }}</textarea>
            <div class="mt-2" style="max-height: 112px; overflow: auto;border-bottom: 1px solid #ccc">
                {{ include('intervention/_tableau_devis.html.twig') }}
            </div>
        </div>
        <div class="d-flex flex-column flex-grow-1">
            {% if is_readonly %}
                {# Mode readonly : Intervention planifiée et réalisée côte à côte #}
                <div class="d-flex mb-2 justify-content-between">
                    <div class="d-flex align-items-center" style="margin-right: 10px;">
                        <label  style="width:99px;line-height: normal">Intervention</br>planifiée</label>
                        <input type="text" style="width:150px" disabled class="form-control {{ intervention.planning.getTypePlanificationInit and intervention.planning.getTypePlanificationInit.isSurValidation or binome_manquant_init ? 'bg-orange-input border-orange' }}" value="{{ intervention.planning.getTypePlanificationInit ? intervention.planning.getTypePlanificationInit.code }}">
                    </div>
                    <div class="d-flex align-items-center">
                        <label  style="width:99px;line-height: normal">Intervention</br>réalisée</label>
                        <select name="intervention_type_planification" {{ type == 'technique' ? 'disabled'}} style="width:150px" class="form-control">
                            {% for type in typesPlanification %}
                                <option value="{{ type.id }}" {{ intervention.getTypePlanification == type ? 'selected' : '' }}>{{ type.code }}</option>
                            {% endfor %}
                        </select>
                    </div>
                </div>
            {% else %}
                {# Mode validation : Intervention planifiée avec champ "le" #}
                <div class="d-flex mb-2">
                    <div class="d-flex align-items-center" style="margin-right: 10px;">
                        <label style="width:99px;line-height: normal">Intervention</br>planifiée</label>
                        <input type="text" style="width:150px" disabled class="form-control {{ intervention.planning.getTypePlanificationInit and intervention.planning.getTypePlanificationInit.isSurValidation or binome_manquant_init ? 'bg-orange-input border-orange' }}" value="{{ intervention.planning.getTypePlanificationInit ? intervention.planning.getTypePlanificationInit.code }}">
                    </div>
                    <div class="d-flex align-items-center">
                        <label class="me-2">le</label>
                        <input type="text" class="form-control" {{ type == 'technique' ? 'disabled'}} style="width:100px" value="{{ intervention.planning.getDateCreation ? intervention.planning.getDateCreation|date('d/m/Y') }}" form="form_validation_intervention">
                    </div>
                </div>
                <div class="d-flex align-items-center mb-2">
                    <label style="width:99px;line-height: normal">Intervention</br>réalisée</label>
                    <select name="intervention_type_planification" {{ type == 'technique' ? 'disabled'}} style="width:150px" class="form-control {% if (intervention.getTypePlanification != intervention.planning.getTypePlanificationInit or intervention.getTypePlanification.isSurValidation or binome_manquant_int) %}bg-orange-input border-orange{% endif %}">
                        {% for typePlanif in typesPlanification %}
                            <option value="{{ typePlanif.id }}" {{ intervention.getTypePlanification == typePlanif ? 'selected' : '' }}>{{ typePlanif.code }}</option>
                        {% endfor %}
                    </select>
                </div>
            {% endif %}
            <div class="titre-small" style="line-height: 1">Motif modification code intervention</div>
            <textarea disabled style="height:56px;text-align: left" class="form-control {{ intervention.getMotifModifCodeInt ? 'bg-orange-input border-orange' : '' }}">{{ intervention.getMotifModifCodeInt }}</textarea>
            <div class="titre-small mt-1" style="line-height: 1">Cause du retour</div>
            <textarea disabled style="height:{% if is_readonly %}40{% else %}56{% endif %}px;text-align: left" class="form-control"></textarea>

            {% if is_pac %}
                {% if is_readonly %}
                    {# Mode readonly PAC : Affichage avec colonnes pour modules intérieur/extérieur #}
                    <div class="d-flex mt-1">
                        <div class="align-self-end" style="width:235px;"><label style="line-height: normal;">Hauteur<br>sol - haut d'équipement</label></div>
                        <div class="d-flex" style="gap: 1rem;">
                            <div class="d-flex flex-column" style="width:140px;">
                                <label class="titre-small color-orange" style="width:140px; border-bottom: 1px solid #f05b41; margin-bottom: 0.3rem; padding-bottom: 0.2rem;line-height: 8px;">Module intérieur</label>
                                <input disabled style="width:100px" class="form-control bg-grey" value="{{ equipementHauteur and equipementHauteur.hauteur ? equipementHauteur.hauteur|number_format(2, ',', ' ') : '' }}">
                            </div>
                            <div class="d-flex flex-column" style="width:140px;">
                                <label class="titre-small color-orange" style="width:140px; border-bottom: 1px solid #f05b41; margin-bottom: 0.3rem; padding-bottom: 0.2rem;line-height: 8px;">Module extérieur</label>
                                <input disabled style="width:100px" class="form-control bg-grey" value="{{ equipementHauteur and equipementHauteur.hauteurModuleExt ? equipementHauteur.hauteurModuleExt|number_format(2, ',', ' ') : '' }}">
                            </div>
                        </div>
                    </div>
                    {# Questions avec radio buttons alignés sous les modules #}
                    <div class="d-flex align-items-center mt-1">
                        <label style="width:235px;">Est-ce que la mesure est possible ?</label>
                        <div class="d-flex" style="gap: 1rem;">
                            <div class="d-flex" style="width:140px; gap: 0.4rem;">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="mesure_possible_int" value="non" disabled {{ equipementHauteur and not equipementHauteur.mesurePossible ? 'checked' }}>
                                    <label class="form-check-label">Non</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="mesure_possible_int" value="oui" disabled {{ equipementHauteur and equipementHauteur.mesurePossible ? 'checked' }}>
                                    <label class="form-check-label">Oui</label>
                                </div>
                            </div>
                            <div class="d-flex" style="width:140px; gap: 0.4rem;">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="mesure_possible_ext" value="non" disabled {{ equipementHauteur and not equipementHauteur.mesurePossibleModuleExt ? 'checked' }}>
                                    <label class="form-check-label">Non</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="mesure_possible_ext" value="oui" disabled {{ equipementHauteur and equipementHauteur.mesurePossibleModuleExt ? 'checked' }}>
                                    <label class="form-check-label">Oui</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="d-flex align-items-center">
                        <label style="width:235px;">Est-ce que la pose de l'escabeau est possible ?</label>
                        <div class="d-flex" style="gap: 1rem;">
                            <div class="d-flex" style="width:140px;gap: 0.4rem;">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="escabeau_possible_int" value="non" disabled {{ equipementHauteur and not equipementHauteur.escabeauOk ? 'checked' }}>
                                    <label class="form-check-label">Non</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="escabeau_possible_int" value="oui" disabled {{ equipementHauteur and equipementHauteur.escabeauOk ? 'checked' }}>
                                    <label class="form-check-label">Oui</label>
                                </div>
                            </div>
                            <div class="d-flex" style="width:140px;gap: 0.4rem;">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="escabeau_possible_ext" value="non" disabled {{ equipementHauteur and not equipementHauteur.escabeauOkModuleExt ? 'checked' }}>
                                    <label class="form-check-label">Non</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="escabeau_possible_ext" value="oui" disabled {{ equipementHauteur and equipementHauteur.escabeauOkModuleExt ? 'checked' }}>
                                    <label class="form-check-label">Oui</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="d-flex align-items-center">
                        <label style="width:235px;">Est-ce que l'entretien est réalisable ?</label>
                        <div class="d-flex" style="gap: 1rem;">
                            <div class="d-flex" style="width:140px; gap: 0.4rem;">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="entretien_realisable_int" value="non" disabled {{ equipementHauteur and not equipementHauteur.entretienOk ? 'checked' }}>
                                    <label class="form-check-label">Non</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="entretien_realisable_int" value="oui" disabled {{ equipementHauteur and equipementHauteur.entretienOk ? 'checked' }}>
                                    <label class="form-check-label">Oui</label>
                                </div>
                            </div>
                            <div class="d-flex" style="width:140px; gap: 0.4rem;">
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="entretien_realisable_ext" value="non" disabled {{ equipementHauteur and not equipementHauteur.entretienOkModuleExt ? 'checked' }}>
                                    <label class="form-check-label">Non</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input float-none" type="radio" name="entretien_realisable_ext" value="oui" disabled {{ equipementHauteur and equipementHauteur.entretienOkModuleExt ? 'checked' }}>
                                    <label class="form-check-label">Oui</label>
                                </div>
                            </div>
                        </div>
                    </div>
                {% else %}
                    {# Mode validation PAC : Affichage simple côte à côte #}
                    <div class="d-flex align-items-center mt-1">
                        <div class="d-flex align-items-center">
                            <label style="width:103px;line-height: normal">Hauteur<br>module intérieur</label>
                            <input disabled style="width:100px" class="form-control" value="{{ equipementHauteur ? equipementHauteur.hauteur }}">
                        </div>
                        <div class="d-flex align-items-center ms-auto">
                            <label style="width:103px;line-height: normal">Hauteur<br>module extérieur</label>
                            <input disabled style="width:100px" class="form-control" value="{{ equipementHauteur ? equipementHauteur.hauteurModuleExt }}">
                        </div>
                    </div>
                    {# Questions simples pour validation #}
                    <div class="d-flex align-items-center">
                        <label style="width:285px;">Est-ce que la mesure est possible ?</label>
                        <div class="form-check form-check-inline ms-auto" style="margin-right: 16px;">
                            <input class="form-check-input float-none" type="radio" name="mesure_possible" value="non" disabled {{ equipementHauteur and not equipementHauteur.mesurePossible ? 'checked' }}>
                            <label class="form-check-label">Non</label>
                        </div>
                        <div class="form-check form-check-inline me-0">
                            <input class="form-check-input float-none" type="radio" name="mesure_possible" value="oui" disabled {{ equipementHauteur and equipementHauteur.mesurePossible ? 'checked' }}>
                            <label class="form-check-label">Oui</label>
                        </div>
                    </div>
                    <div class="d-flex align-items-center">
                        <label style="width:285px;">Est-ce que la pose de l'escabeau est possible ?</label>
                        <div class="form-check form-check-inline ms-auto" style="margin-right: 16px;">
                            <input class="form-check-input float-none" type="radio" name="escabeau_possible" value="non" disabled {{ equipementHauteur and not equipementHauteur.escabeauOk ? 'checked' }}>
                            <label class="form-check-label">Non</label>
                        </div>
                        <div class="form-check form-check-inline me-0">
                            <input class="form-check-input float-none" type="radio" name="escabeau_possible" value="oui" disabled {{ equipementHauteur and equipementHauteur.escabeauOk ? 'checked' }}>
                            <label class="form-check-label">Oui</label>
                        </div>
                    </div>
                    <div class="d-flex align-items-center">
                        <label style="width:285px;">Est-ce que l'entretien est réalisable ?</label>
                        <div class="form-check form-check-inline ms-auto" style="margin-right: 16px;">
                            <input class="form-check-input float-none" type="radio" name="entretien_realisable" value="non" disabled {{ equipementHauteur and not equipementHauteur.entretienOk ? 'checked' }}>
                            <label class="form-check-label">Non</label>
                        </div>
                        <div class="form-check form-check-inline me-0">
                            <input class="form-check-input float-none" type="radio" name="entretien_realisable" value="oui" disabled {{ equipementHauteur and equipementHauteur.entretienOk ? 'checked' }}>
                            <label class="form-check-label">Oui</label>
                        </div>
                    </div>
                {% endif %}
            {% else %}
                {# Affichage pour chaudière : Hauteur équipement et Mesure CO #}
                <div class="d-flex align-items-center mt-1">
                    <div class="d-flex align-items-center">
                        <label style="width:135px;">Hauteur équipement</label>
                        <input disabled style="width:100px" class="form-control {% if is_readonly %}bg-grey{% endif %}" value="{{ equipementHauteur ? equipementHauteur.hauteur }}">
                    </div>
                    <div class="d-flex align-items-center ms-auto">
                        <label style="width:76px;line-height: normal">Mesure CO</label>
                        <input disabled style="width:100px" class="form-control {% if is_readonly %}bg-grey{% endif %}" value="{{ intervention.mesureCO }}">
                    </div>
                </div>
                {# Affichage pour chaudière : questions uniques #}
                <div class="d-flex align-items-center mt-1">
                    <label style="width:285px;">Est-ce que la mesure est possible ?</label>
                    <div class="form-check form-check-inline ms-auto" style="margin-right: 16px;">
                        <input class="form-check-input float-none" type="radio" name="mesure_possible" value="non" disabled {{ equipementHauteur and not equipementHauteur.mesurePossible ? 'checked' }}>
                        <label class="form-check-label">Non</label>
                    </div>
                    <div class="form-check form-check-inline me-0">
                        <input class="form-check-input float-none" type="radio" name="mesure_possible" value="oui" disabled {{ equipementHauteur and equipementHauteur.mesurePossible ? 'checked' }}>
                        <label class="form-check-label">Oui</label>
                    </div>
                </div>
                <div class="d-flex align-items-center">
                    <label style="width:285px;">Est-ce que la pose de l'escabeau est possible ?</label>
                    <div class="form-check form-check-inline ms-auto" style="margin-right: 16px;">
                        <input class="form-check-input float-none" type="radio" name="escabeau_possible" value="non" disabled {{ equipementHauteur and not equipementHauteur.escabeauOk ? 'checked' }}>
                        <label class="form-check-label">Non</label>
                    </div>
                    <div class="form-check form-check-inline me-0">
                        <input class="form-check-input float-none" type="radio" name="escabeau_possible" value="oui" disabled {{ equipementHauteur and equipementHauteur.escabeauOk ? 'checked' }}>
                        <label class="form-check-label">Oui</label>
                    </div>
                </div>
                <div class="d-flex align-items-center">
                    <label style="width:285px;">Est-ce que l'entretien est réalisable ?</label>
                    <div class="form-check form-check-inline ms-auto" style="margin-right: 16px;">
                        <input class="form-check-input float-none" type="radio" name="entretien_realisable" value="non" disabled {{ equipementHauteur and not equipementHauteur.entretienOk ? 'checked' }}>
                        <label class="form-check-label">Non</label>
                    </div>
                    <div class="form-check form-check-inline me-0">
                        <input class="form-check-input float-none" type="radio" name="entretien_realisable" value="oui" disabled {{ equipementHauteur and equipementHauteur.entretienOk ? 'checked' }}>
                        <label class="form-check-label">Oui</label>
                    </div>
                </div>
            {% endif %}
            <div class="titre-small" style="line-height: 1">Commentaire intervention</div>
            <textarea disabled style="height:{% if is_readonly and is_pac %}88{% elseif is_readonly %}101{% else %}56{% endif %}px;text-align: left" class="form-control"></textarea>
            {% if is_readonly %}
                {# Refus de signature : seulement en mode readonly #}
                <div class="form-check align-items-center mt-1">
                    <input type="checkbox" disabled class="form-check-input" {{ intervention.getCliRefusSignature ? 'checked' : '' }}>
                    <label class="ms-2">Refus de signature</label>
                </div>
                <div class="titre-small" style="line-height: 1">Commentaire refus de signature</div>
                <textarea disabled style="height:64px;text-align: left" class="form-control bg-grey">{{ intervention.getCommentaireRefusSignature ? intervention.getCommentaireRefusSignature : '' }}</textarea>
            {% endif %}
        </div>
    </div>
</div>