/**
 * Widget Menu Slide / Sanfona
 *
 * Estilos para widget Elementor com dois modos de navegação:
 * slide (paineis em drill-down) e accordion (sanfona in-place).
 * Handle: theme-slide-accordion-menu-widget
 */

/* ==========================================
   1. ESTRUTURA BASE (comum aos dois modos)
   ========================================== */
.widget-slide-accordion-menu {
    position: relative;
    width: 100%;
    box-sizing: border-box;

    --accordion-icon-size: 14px;
}

.widget-slide-accordion-menu *,
.widget-slide-accordion-menu *:before,
.widget-slide-accordion-menu *:after {
    box-sizing: border-box;
}

.widget-slide-accordion-menu ul,
.widget-slide-accordion-menu li {
    list-style: none !important;
    margin: 0;
    padding: 0;
}

.widget-slide-accordion-menu__item {
    position: relative;
    width: 100%;
}

.widget-slide-accordion-menu__row {
    display: flex;
    align-items: stretch;
    width: 100%;
}

.widget-slide-accordion-menu__link {
    flex: 1;
    display: flex;
    align-items: center;
    text-decoration: none;
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    transition: color 0.3s ease, background-color 0.3s ease;
}

.widget-slide-accordion-menu__title {
    flex: 1;
}

/* ==========================================
   2. MODO SANFONA (accordion)
   ========================================== */

.widget-slide-accordion-menu[data-nav-mode="accordion"] .widget-slide-accordion-menu__toggle {
    flex: 0 0 auto;
    width: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    padding: 0;
    margin: 0;
}

.widget-slide-accordion-menu__toggle-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--accordion-icon-size);
    height: var(--accordion-icon-size);
    transition: transform 0.3s ease;
}

.widget-slide-accordion-menu__toggle-icon i,
.widget-slide-accordion-menu__toggle-icon svg {
    width: var(--accordion-icon-size);
    height: var(--accordion-icon-size);
    display: block;
}

.widget-slide-accordion-menu__item.is-open > .widget-slide-accordion-menu__row .widget-slide-accordion-menu__toggle-icon {
    transform: rotate(180deg);
}

/* Sanfona sem JS de altura: técnica grid-template-rows (0fr -> 1fr) */
.widget-slide-accordion-menu__submenu-wrapper {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s ease;
}

.widget-slide-accordion-menu__item.is-open > .widget-slide-accordion-menu__submenu-wrapper {
    grid-template-rows: 1fr;
}

.widget-slide-accordion-menu__submenu-wrapper > .widget-slide-accordion-menu__submenu {
    overflow: hidden;
    min-height: 0;
}

/* Indentação de níveis aninhados na sanfona */
.widget-slide-accordion-menu__submenu .widget-slide-accordion-menu__link {
    padding-left: 16px;
}

.widget-slide-accordion-menu__submenu .widget-slide-accordion-menu__submenu .widget-slide-accordion-menu__link {
    padding-left: 32px;
}

/* ==========================================
   3. MODO SLIDE (paineis)
   ========================================== */

.widget-slide-accordion-menu[data-nav-mode="slide"] .widget-slide-accordion-menu__panels {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.widget-slide-accordion-menu__panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    visibility: hidden;
    transform: translateX(100%);
    transition: transform 0.35s ease, visibility 0.35s ease;
}

.widget-slide-accordion-menu__panel.is-active {
    position: relative;
    visibility: visible;
    transform: translateX(0);
}

.widget-slide-accordion-menu__panel-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 0px 12px 0px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.widget-slide-accordion-menu__panel-title {
    flex: 1;
    font-weight: 600;
}

.widget-slide-accordion-menu__nav-btn {
    flex: 0 0 auto;
    width: 40px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    padding: 0;
    margin: 0;
    transition: color 0.3s ease, background-color 0.3s ease;
	border-radius: 50px;
}

.widget-slide-accordion-menu__nav-btn svg,
.widget-slide-accordion-menu__nav-btn i {
    width: 1em;
    height: 1em;
    font-size: 1.5em;
}

.widget-slide-accordion-menu__back-text {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    padding: 12px 16px;
}

/* ==========================================
   4. DIVISORES (ambos os modos, via .has-dividers)
   ========================================== */

.widget-slide-accordion-menu.has-dividers .widget-slide-accordion-menu__item:not(:last-child) {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #eeeeee;
}

/* ==========================================
   5. ESTADO ATIVO (item corrente do WordPress)
   ========================================== */

.widget-slide-accordion-menu__item.current-menu-item > .widget-slide-accordion-menu__row .widget-slide-accordion-menu__link,
.widget-slide-accordion-menu__item.current-menu-ancestor > .widget-slide-accordion-menu__row .widget-slide-accordion-menu__link {
    font-weight: bold;
}