/* Bloc Menu Principal */
.terrena-menu-principal {
    /* Visible uniquement sur desktop */
    display: block;
}

/* Navigation principale */
.terrena-menu-principal__nav {
    width: 100%;
}

.terrena-menu-principal__list {
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: 8px;
}

/* Éléments de menu */
.terrena-menu-principal__list > li > a {
    border-bottom: 1px solid var(--wp--preset--color--border-light);
}

.terrena-menu-principal__list li:last-child {
    border-bottom: none;
}

/* Liens de menu niveau 1 */
.terrena-menu-principal__list > li > a {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.5rem 1rem;
    color: var(--wp--preset--color--text-main);
    text-decoration: none;
    font-family: var(--wp--preset--font-family--rooney-sans);
    font-size: var(--wp--preset--font-size--18);
    font-weight: 700;
    line-height: 1.5;
    transition: background-color 0.2s ease;
    position: relative;
}

/* Icônes sectorielles ACF */
.menu-item-icon {
    width: 48px;
    height: 48px;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 4px;
}

/* Texte du menu */
.menu-item-text {
    flex-grow: 1;
}

/* Fallback pour les éléments sans icône ACF */
.terrena-menu-principal__list > li > a:not(:has(.menu-item-icon))::before {
    content: '';
    width: 48px;
    height: 48px;
    background-color: var(--wp--preset--color--bg-beige);
    border-radius: 50%;
    flex-shrink: 0;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" stroke="%231c1c19" stroke-width="1.5"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 24px;
}

/* Flèches de menu */
.menu-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    transition: transform 0.3s ease;
    cursor: pointer;
    flex-shrink: 0;
    padding: 4px;
    margin-right: -8px;
}

.menu-arrow svg {
    width: 24px;
    height: 24px;
    stroke: var(--wp--preset--color--text-main);
}

.menu-arrow:hover svg,
.menu-arrow:focus svg {
    color: var(--wp--preset--color--text-soft);
    stroke: var(--wp--preset--color--text-soft);
}

/* État ouvert de la flèche */
.menu-arrow.is-open {
    transform: rotate(180deg);
}

/* Sous-menus */
.terrena-menu-principal__list .sub-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: none; /* Géré par JavaScript comme les <details> */
}

.terrena-menu-principal__list .sub-menu > li.current-menu-item,
.terrena-menu-principal__list .sub-menu > li:focus-within,
.terrena-menu-principal__list .sub-menu > li:hover {
    background-color: var(--wp--preset--color--bg-beige);
}

/* Auto-déploiement pour les éléments actifs (CSS pur) - sauf si fermés manuellement */
.terrena-menu-principal__list .current-menu-item.has-dropdown:not(.is-closed) .sub-menu,
.terrena-menu-principal__list .current-menu-ancestor.has-dropdown:not(.is-closed) .sub-menu,
.terrena-menu-principal__list .current-page-ancestor.has-dropdown:not(.is-closed) .sub-menu {
    display: block !important;
}

/* Flèches des éléments actifs auto-déployés - sauf si fermés manuellement */
.terrena-menu-principal__list .current-menu-item.has-dropdown:not(.is-closed) .menu-arrow,
.terrena-menu-principal__list .current-menu-ancestor.has-dropdown:not(.is-closed) .menu-arrow,
.terrena-menu-principal__list .current-page-ancestor.has-dropdown:not(.is-closed) .menu-arrow {
    transform: rotate(180deg);
}

/* Liens de sous-menu */
.terrena-menu-principal__list .sub-menu a {
    display: block;
    padding: 1rem 4rem;
    color: var(--wp--preset--color--text-main);
    text-decoration: none;
    font-family: var(--wp--preset--font-family--rooney-sans);
    font-size: var(--wp--preset--font-size--18);
    font-weight: 700;
    line-height: 1.5;
    transition: background-color 0.2s ease;
}

/* Améliorer l'interaction avec les éléments parent */
.terrena-menu-principal__list > li.has-dropdown > a[href="#"],
.terrena-menu-principal__list > li.has-dropdown > a[href=""],
.terrena-menu-principal__list > li.has-dropdown > a:not([href]) {
    cursor: default;
}


/* Message d'absence de menu */
.no-menu-assigned {
    padding: 2rem;
    text-align: center;
    background-color: var(--wp--preset--color--bg-alert);
    border-radius: 8px;
    color: var(--wp--preset--color--text-alert);
}

.no-menu-assigned p {
    margin: 0 0 1rem 0;
}

.no-menu-assigned a {
    color: var(--wp--preset--color--text-alert);
    text-decoration: underline;
}

/* Preview dans l'éditeur */
.terrena-menu-principal__preview {
    padding: 1rem;
    border: 2px dashed var(--wp--preset--color--border-light);
    border-radius: 8px;
    background-color: var(--wp--preset--color--bg-tertiary);
    text-align: center;
}

.menu-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    font-weight: 600;
    color: var(--wp--preset--color--text-main);
    font-family: var(--wp--preset--font-family--rooney-sans);
}

.menu-placeholder svg {
    color: var(--wp--preset--color--text-soft);
}

.menu-items-preview {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.menu-item-preview {
    padding: 0.5rem 1rem;
    background-color: var(--wp--preset--color--bg-beige);
    border-radius: 4px;
    font-size: var(--wp--preset--font-size--16);
    color: var(--wp--preset--color--text-main);
    font-family: var(--wp--preset--font-family--rooney-sans);
    font-weight: 700;
}

.menu-note {
    font-size: var(--wp--preset--font-size--14);
    color: var(--wp--preset--color--text-soft);
    font-style: italic;
    margin: 0;
    font-family: var(--wp--preset--font-family--rooney-sans);
}

/* Bouton de fermeture mobile */
.terrena-menu-principal__close {
    display: none;
    position: absolute;
    top: var(--wp--preset--spacing--32);
    right: var(--wp--preset--spacing--32);
    width: 48px;
    height: 48px;
    background: transparent;
    border: none;
    color: var(--wp--preset--color--text-main);
    cursor: pointer;
    z-index: 10000;
    transition: all 0.2s ease;
    border-radius: 5px;
}

.terrena-menu-principal__close:hover {
    background-color: var(--wp--preset--color--bg-secondary);
}

.terrena-menu-principal__close:focus {
    outline: 2px solid var(--wp--preset--color--bg-button);
    outline-offset: 2px;
}

.terrena-menu-principal__close svg {
    width: 100%;
    height: 100%;
}

/* Zone de contenu interne (InnerBlocks) sous le menu - masquée par défaut */
.terrena-menu-principal__mobile-inner {
    display: none;
}

/* Afficher l'InnerBlocks dans l'éditeur (toujours visible en admin) */
.editor-styles-wrapper .terrena-menu-principal__mobile-inner,
.terrena-menu-principal__mobile-inner.is-admin-preview,
.terrena-menu-principal__mobile-inner.editor-visible {
    display: block;
    margin-top: 1rem;
}

/* Label visible dans l'éditeur */
.terrena-menu-principal__inner-label {
    display: none;
}
.editor-styles-wrapper .terrena-menu-principal__inner-label {
    display: block;
    margin: 0.5rem 0 0.25rem 0;
    font-size: var(--wp--preset--font-size--14);
    color: var(--wp--preset--color--text-soft);
    font-family: var(--wp--preset--font-family--rooney-sans);
}

/* Masquer le menu principal sur mobile par défaut */
@media (max-width: 1160px) {
    .terrena-menu-principal {
        display: none !important;
    }

    .menu-mobile-open .is-position-sticky {
        z-index:initial;
        position:static;
     }
    
    /* Afficher le menu principal quand la classe est active sur le body */
    .menu-mobile-open .terrena-menu-principal {
        display: flex !important;
        flex-direction: column;
        position: fixed;
        top: calc(0 + var(--wp-admin--admin-bar--position-offset));
        left: 0;
        right: 0;
        height: calc(100vh - var(--wp-admin--admin-bar--position-offset, 0px));
        background-color: var(--wp--preset--color--bg-primary);
        z-index: 9999;
        overflow: hidden;
        padding: 0;
        background: white;
    }

    .menu-mobile-open .terrena-menu-principal__nav {
        flex-grow: 1;
        height: 100%;
        overflow-y: auto;
        padding: 5.5rem 2rem 2rem 2rem; /* Padding pour le contenu, laissant de la place pour la croix */
        box-sizing: border-box;
    }

    /* Afficher l'InnerBlocks sous le menu quand il est déployé sur mobile */
    .menu-mobile-open .terrena-menu-principal__mobile-inner {
        display: block;
        padding: 1rem 2rem 2rem 2rem;
        background: var(--wp--preset--color--bg-primary);
        border-top: 1px solid var(--wp--preset--color--border-light);
    }
    
    /* Afficher le bouton de fermeture sur mobile */
    .terrena-menu-principal__close {
        display: flex; /* S'assurer qu'il est visible */
        align-items: center;
        justify-content: center;
    }
}