/* Generic accordion primitive (reusable outside menu) */



[data-app-accordion] > .app-accordion__item + .app-accordion__item {

    margin-top: 6px;

}



.accordion_btn,

.app-accordion__trigger {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 12px;

    width: 100%;

    box-sizing: border-box;

    min-height: 30px;

    padding: 5px 5px;

    margin: 0;

    border: 1px solid #707070;

    border-radius: 10px;

    background: #f3f3f3;

    color: inherit;

    text-align: left;

    cursor: pointer;

    -webkit-appearance: none;

    appearance: none;

    font: inherit;

    box-shadow: none;

    transform: none;

    transition: none;

}



.accordion_btn:hover,

.accordion_btn:active,

.accordion_btn:focus,

.app-accordion__trigger:hover,

.app-accordion__trigger:active,

.app-accordion__trigger:focus {

    background: #f3f3f3;

    border: 1px solid var(--black, #000);

    box-shadow: none;

    transform: none;

}



.accordion_btn:focus,

.app-accordion__trigger:focus {

    outline: none;

}



.accordion_btn:focus-visible,

.app-accordion__trigger:focus-visible {

    outline: 2px solid var(--blue, #0066cc);

    outline-offset: 2px;

}



.app-accordion__label {

    flex: 1 1 auto;

    min-width: 0;

}



.accordion_btn::after,

.app-accordion__trigger::after {

    content: '';

    flex: 0 0 auto;

    width: 0.45em;

    height: 0.45em;

    border-right: 2px solid currentColor;

    border-bottom: 2px solid currentColor;

    transform: rotate(45deg);

    margin-right: 2px;

    transition: transform 0.28s ease;

}



.app-accordion__item.is-open > .accordion_btn::after,

.app-accordion__item.is-open > .app-accordion__trigger::after {

    transform: rotate(-135deg);

}



/* Smooth height: grid 0fr/1fr avoids max-height jank and layout jumps from display:none */

.app-accordion__panel {

    display: grid;

    grid-template-rows: 0fr;

    padding-top: 0;

    overflow: hidden;

    pointer-events: none;

    transition: grid-template-rows 0.28s ease, padding-top 0.28s ease;

}



.app-accordion__panel > * {

    min-height: 0;

    overflow: hidden;

}



.app-accordion__item.is-open > .app-accordion__panel {

    grid-template-rows: 1fr;

    padding-top: 8px;

    pointer-events: auto;

}



[data-app-accordion].app-accordion--instant .app-accordion__panel,

[data-app-accordion].app-accordion--instant .accordion_btn::after,

[data-app-accordion].app-accordion--instant .app-accordion__trigger::after {

    transition: none !important;

}



@media (prefers-reduced-motion: reduce) {

    .app-accordion__panel {

        transition: none;

    }



    .accordion_btn::after,

    .app-accordion__trigger::after {

        transition: none;

    }

}