// Création de la boîte d'information
const infoBox = document.createElement('div');
infoBox.id = 'info-box';
infoBox.innerHTML = `
    <div id="info-toggle">
        <label>
            <input type="checkbox" id="toggle-display"> <span id="toggle_hide_text">Masquer</span>
        </label>
    </div>
    <div id="info-content">
        <div><strong>Parent :</strong> <span id="element-parent"></span></div>
        <div><strong>Enfant :</strong> <span id="element-info"></span></div>
    </div>
`;

// Ajout des styles
const style = document.createElement('style');
style.textContent = `
    #info-box {
        position: fixed;
        top: 20px;
        right: 40px;
        background: #333;
        color: white;
        padding: 10px 11px;
        border-radius: 8px 8px 0 0;
        min-width: 250px;
        max-width: 250px;
        overflow: hidden;
        box-shadow: 0 4px 6px rgba(0,0,0,0.3);
        font-size: 14px;
        display: none;
        z-index: 9999;
    }
    
    #info-box.visible {
        display: block;
    }
        
    
    #info-box div {
        margin: 5px 0;
    }
    
    #info-box strong {
        color: #4CAF50;
    }
    
    #info-toggle {
        margin-bottom: 10px;
        padding-bottom: 10px;
        border-bottom: 1px solid #555;
    }
    
    #info-box.no_infos {
        max-width: 200px;
        display: block;
        overflow: hidden;
        min-width: auto;
    }

    #info-box.no_infos {
        #info-toggle {
            border-bottom: 0px solid #555;
            padding: 0;
            margin: 0;
        }
        #toggle_hide_text {
            display: none;
        }
    }
    #info-toggle label {
        cursor: pointer;
        user-select: none;
    }
    
    #info-content.hidden {
        display: none;
    }
    .info_id {
        color: #ff0095;
    }
    .info_class {
        color:rgb(0, 200, 215);
    }
    .info_el {
        color:rgb(0, 179, 255);
    }
    .info_prop {
        margin-right: 2px;
    }
`;

// Injection dans le DOM
document.head.appendChild(style);
// document.body.appendChild(infoBox);