
.accordion  {

    --bulma-accordion-padding: 1rem 1.5rem 1.5rem ;

    .accordion__title {
        margin-bottom: 1em;
    }

    .accordion__wrapper {

    }

    .accordion__item {
        border-bottom: 1px solid #ccc;
    }

    .accordion__item__header {
    }

    .accordion__item__icon {
        cursor: pointer;
        color: var(--bulma-link);
        transition: all .3s ease-out;
    }

    .accordion__header-button {
        
        display: flex;
        padding: var(--bulma-accordion-padding);
        justify-content: space-between;
        cursor: pointer;
        align-items: center;
        gap: 2rem;
    }

    .accordion__item.accordion__item--opened {
        .accordion__item__icon {
            transform: rotate(180deg);
        }
    }


    .accordion__item:not(.accordion__item--opened)  .accordion__item__icon--closed {
            display: flex!important;
    }

    .accordion__item--opened :is(.accordion__item__header, .accordion__item__icon) {
        color: var(--bulma-link)!important;
    }


    .accordion__item__body {
    
        padding: 0 1em;
        overflow: hidden;
        height: 0px;
        transition: all cubic-bezier(0.215, 0.610, 0.355, 1) .2s;
        border-radius: 10px;
    }

    .accordion__item--opened .accordion__item__body {
        height: auto;
        padding: var(--bulma-accordion-padding);
    }


}   

