html {
   min-height: 100vh;
    width: 100vw;
    margin: 0;
    /* On ne met pas de background ici, c'est le JS qui s'en charge */
}


body {
    background: transparent !important;
    margin: 0;
    padding: 0;
    overflow: auto; /* Sécurité supplémentaire */
}
#feeder-canvas {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: auto; /* Ou auto selon ton design */
    background-color: #1a1a1a; /* Fond par défaut */
  }

/* --- LES ÉLÉMENTS DU FORMULAIRE --- */
.control-container {
    position: absolute;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    border-radius: 8px;

    overflow: auto;
    gap: 8px;
    padding: 10px;
}

/* Empêche le texte des labels de casser sur deux lignes */
.control-container .label-text {
    white-space: nowrap !important; /* Force une seule ligne */
    flex-shrink: 0 !important;      /* Interdit à l'input de compresser le label */
    margin-right: 10px;             /* Espace entre label et champ */
}

/* Redéfinit l'input pour qu'il soit flexible et non glouton */

.control-container select, 
.control-container textarea {
    width: 0 !important;      /* Annule le width: 100% du designer */
    flex: 1 1 auto !important; /* L'input prend tout l'espace restant proprement */
    min-width: 50px;           /* Sécurité pour ne pas qu'il disparaisse */
}


/* Force la lisibilité des textes sur le fond sombre */
.control-container label {
    color: #ffffff;
    margin-bottom: 4px;
}

/* --- MEDIACART (FIX FIREFOX / MOBILE) --- */
.bundle-table {
    width: 100%;
    border-collapse: collapse;
    color: #ffffff !important;
}

.bundle-table td, 
.bundle-table th {
    padding: 8px 4px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    color: #ffffff !important;
}

/* Boutons d'achat */
.bundle-table td div[onclick] {
    background: #1473E6 !important;
    color: #ffffff !important;
    font-weight: bold;
    text-align: center;
    border-radius: 6px;
    cursor: pointer;
}


/* --- SCROLLBAR INVISIBLE --- */
.control-container, 
.mediacart,
.canvas-v4 {
    /* Pour Firefox */
    scrollbar-width: none; 
    /* Pour Internet Explorer / Edge */
    -ms-overflow-style: none; 
}



/* Pour Chrome, Safari et Opera */
.control-container::-webkit-scrollbar,
.mediacart::-webkit-scrollbar,
.canvas-v4::-webkit-scrollbar {
    display: none;
}


/* --- MEDIACART : RESPECT DES VARIABLES DU JSON --- */
.mediacart {
    color: var(--mc-fg, #ffffff) !important; /* Utilise le bleu clair du JSON */
    width:100%;
}

.mediacart table {
    width: 100%;
    border-collapse: collapse;
}

.mediacart td {
    padding: 8px 4px;
    border-bottom: 2px solid var(--mc-border, rgba(255,255,255,0.1));

}

/* Liens Preview (▶) */
.mediacart td a {
    color: inherit !important; 
    text-decoration: none;
}
.label-wrapper {
    position: relative;
    display: inline-block;
  }