#custom-designer{

}
#container-designer{
    height:850px;
    background-color: #fff;
}


.has_custom_designer #sidebar{
    display: none;
}
.has_custom_designer .woo-content,.has_custom_designer article,.has_custom_designer .product{
    width:100% !important;
}

#has_designer_menu_left{
    width:100px;
}
/* Style général pour le menu principal */
#has_app_content .menu {
    list-style: none;
    padding: 0;
    margin: 0;
    z-index:1;
    width: 50px;
    font-size:14px;
}

/* Style pour chaque élément du menu */
#has_app_content .menu-item {
    position: relative;
    padding: 10px 15px;
}

/* Style pour les liens du menu */
#has_app_content .menu-item a {
    text-decoration: none;
    color: #000; /* Couleur du texte du lien */
    display: flex;
    align-items: center;
    display: flex;
    flex-direction: column;
}

/* Style pour les icônes du lien */
#has_app_content .menu-item a img, .menu-item a i {

}

/* Style pour le sous-menu */
#has_app_content .sub-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 100%;
    left: 0;
    display: none; /* Le sous-menu est caché par défaut */
    border: 1px solid #ccc; /* Bordure du sous-menu */
    background-color: #fff; /* Couleur de fond du sous-menu */
    z-index: 2;
   // flex-direction: row;
}

/* Style pour les éléments du sous-menu */
#has_app_content .sub-menu .menu-item {
    padding: 8px 12px;
}

/* Afficher le sous-menu lorsque la souris survole un élément de menu avec des enfants */
#has_app_content .menu-item.has-children:hover .sub-menu {
    display: flex;
}

/* Vous pouvez ajouter plus de styles pour les états de survol, les couleurs, etc. */
#has_app_content .menu-item:hover {
    background-color: #f0f0f0; /* Couleur de fond au survol d'un élément de menu */
}

.sub-menu li {
    display: inline-block;
    margin-right: 10px; /* Ajoutez une marge à droite pour l'espacement, ajustez selon les besoins */
}

/* Styles pour les états de survol des liens */
#has_app_content .menu-item a:hover {
    color: #007bff; /* Couleur du texte du lien au survol */
}

#has_app_content .d-flex{
    display: flex;
}
#has_app_content .flex-row{
    flex-direction: row;
}
#has_app_content .flex-column{
    flex-direction: column;
}
#has_app_content .flex-row-auto {
    flex: 0 0 auto;
}