/* =====================================
   BASE – SÉCURITÉ ÉDITORIALE POST
===================================== */

/*.ed-layout * {*/
/*  box-sizing: border-box;*/
/*}*/

/*.ed-layout > * {*/
/*  min-width: 0;*/
/*}*/

/* =====================================
   FLEXBOX & DIRECTION
===================================== */

/*.ed-flex { display: flex; gap: 1rem; }*/
/*.ed-inline-flex { display: inline-flex; gap: 1rem; }*/

/* Direction */
/*.ed-flex-row            { flex-direction: row; }*/
/*.ed-flex-row-reverse    { flex-direction: row-reverse; }*/
/*.ed-flex-col            { flex-direction: column; }*/
/*.ed-flex-col-reverse    { flex-direction: column-reverse; }*/

/* Wrap */
/*.ed-flex-wrap    { flex-wrap: wrap; }*/
/*.ed-flex-nowrap  { flex-wrap: nowrap; }*/

/* =====================================
   ALIGNEMENT (Justify & Align)
===================================== */

/* Axe principal (Justify Content) */
/*.ed-justify-start   { justify-content: flex-start; }*/
/*.ed-justify-center  { justify-content: center; }*/
/*.ed-justify-end     { justify-content: flex-end; }*/
/*.ed-justify-between { justify-content: space-between; }*/
/*.ed-justify-around  { justify-content: space-around; }*/
/*.ed-justify-evenly  { justify-content: space-evenly; }*/

/* Axe secondaire (Align Items) */
/*.ed-items-start    { align-items: flex-start; }*/
/*.ed-items-center   { align-items: center; }*/
/*.ed-items-end      { align-items: flex-end; }*/
/*.ed-items-baseline { align-items: baseline; }*/
/*.ed-items-stretch  { align-items: stretch; }*/

/* Auto-alignement (Align Self) */
/*.ed-self-start   { align-self: flex-start; }*/
/*.ed-self-center  { align-self: center; }*/
/*.ed-self-end     { align-self: flex-end; }*/
/*.ed-self-stretch { align-self: stretch; }*/

/* =====================================
   DIMENSIONNEMENT (Flex Grow/Shrink)
===================================== */

.ed-flex-1 { flex: 1 1 0%; } /* Prend tout l'espace disponible */
/*.ed-grow   { flex-grow: 1; }*/
/*.ed-shrink { flex-shrink: 1; }*/
/*.ed-none   { flex: none; }*/

/* =====================================
   GRID
===================================== */

/*.ed-grid {*/
/*  display: grid;*/
/*  gap: 1.5rem;*/
/*}*/

/*.ed-grid-2 { grid-template-columns: repeat(2, 1fr); }*/
/*.ed-grid-3 { grid-template-columns: repeat(3, 1fr); }*/
/*.ed-grid-4 { grid-template-columns: repeat(4, 1fr); }*/
/*.ed-grid-auto { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }*/

/* =====================================
   ESPACEMENTS
===================================== */

/*.ed-gap-0  { gap: 0; }*/
/*.ed-gap-xs { gap: 0.5rem; }*/
/*.ed-gap-sm { gap: 1rem; }*/
/*.ed-gap-md { gap: 1.5rem; }*/
/*.ed-gap-lg { gap: 2rem; }*/

/* =====================================
   RESPONSIVE
===================================== */


/* Tablette */
/*@media (max-width: 1024px) {*/
/*  .ed-grid-4 { grid-template-columns: repeat(2, 1fr); }*/
/*}*/

/* Mobile */
/*@media (max-width: 768px) {*/
/*  .ed-grid-2, .ed-grid-3, .ed-grid-4 {*/
/*    grid-template-columns: 1fr;*/
/*  }*/

  /* Force la colonne sur mobile pour les lignes flex */
/*  .ed-flex-row {*/
/*    flex-direction: column;*/
/*  }*/
  
/*  .ed-items-start-mobile { align-items: flex-start; }*/
/*}*/

/* =====================================
   BASE – SÉCURITÉ ÉDITORIALE
===================================== */

/* Box sizing pour tout le monde dans l'éditeur */
.editor-styles-wrapper .ed-layout,
.editor-styles-wrapper .ed-layout * {
    box-sizing: border-box;
}

/* Force l'affichage du bloc même s'il est vide pour l'édition */
.editor-styles-wrapper .ed-flex,
.editor-styles-wrapper .ed-grid {
    min-height: 50px;
    outline: 1px dashed rgba(0,0,0,0.1); /* Petit pointillé pour voir le bloc dans l'admin */
    padding: 10px;
    margin: 10px 0;
}

/* =====================================
   FLEXBOX
===================================== */

.ed-flex { 
    display: flex !important; 
    gap: 1rem; 
}

.ed-flex-row     { flex-direction: row !important; }
.ed-flex-col     { flex-direction: column !important; }
.ed-flex-wrap    { flex-wrap: wrap !important; }

/* Alignements */
.ed-justify-center { justify-content: center !important; }
.ed-items-center   { align-items: center !important; }
.ed-justify-between { justify-content: space-between !important; }

/* =====================================
   GRID
===================================== */

.ed-grid {
    display: grid !important;
    gap: 1.5rem;
    align-content: start;
}

.ed-grid-2 { grid-template-columns: repeat(2, 1fr) !important; }
.ed-grid-3 { grid-template-columns: repeat(3, 1fr) !important; }
.ed-grid-4 { grid-template-columns: repeat(4, 1fr) !important; }

/* =====================================
   ESPACEMENTS (GAP)
===================================== */

.ed-gap-0  { gap: 0 !important; }
.ed-gap-xs { gap: 0.5rem !important; }
.ed-gap-sm { gap: 1rem !important; }
.ed-gap-md { gap: 1.5rem !important; }
.ed-gap-lg { gap: 2rem !important; }

/* =====================================
   RESPONSIVE (Aperçu dans l'éditeur)
===================================== */

@media (max-width: 768px) {
    .ed-grid-2, .ed-grid-3, .ed-grid-4 {
        grid-template-columns: 1fr !important;
    }
    .ed-flex-row {
        flex-direction: column !important;
    }
}

/* =====================================
   FIX SPECIFIQUE TINYMCE / GUTENBERG
===================================== */

/* Empêche WordPress d'ajouter des marges parasites sur les enfants directs */
.editor-styles-wrapper .ed-flex > *, 
.editor-styles-wrapper .ed-grid > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Indicateur visuel pour savoir qu'un élément est en mode "Flex" dans l'admin */
.editor-styles-wrapper .ed-flex::before {
    content: "Flex Container";
    display: block;
    font-size: 10px;
    color: #007cba;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-weight: bold;
}
