.lv-accordion-cat{

}

.category-section{
    background: rgba(235, 235, 231, 0.28);
    border-radius: 10px;
    box-shadow: 0px 2px 4px rgb(0 0 0 / 20%);
    padding: 25px;
    scroll-margin-top: 80px;
}

.category-section:not(:last-child){
    margin-bottom: 20px;
}

.category-title,
.category-title a{
        font-weight: 600;
        font-size: 20px;
        line-height: 24px;
        color: #161F29;
        margin-bottom: 10px;
        transition: color 200ms ease-in-out;
    }

    .category-title a:hover{
        color: var( --e-global-color-primary );
    }

.category-post-list{

    }

    .category-post-list__pannel{
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
        margin: 0;
        padding: 0;
    }

    .category-post-list li{
        flex: 1 0 100%;
        max-width: calc(33.333% - 10px);
        list-style-type: none;
        text-align: left;
        display: flex;
        height: 100%;
        align-self: stretch;
    }

    .category-post-list li a{
        font-weight: 500;
        font-size: 14px;
        line-height: 18px;
        color: var( --e-global-color-primary );
        display: block;
        width: 100%;
        transition: text-shadow 200ms ease-in-out;
    }

    .category-post-list li a:hover{
        text-shadow: 0 0 1px rgba(0,0,0,.25);
        color: var( --e-global-color-primary );
    }

    .pannel-top{
        margin-bottom: 10px;
    }

    .pannel-hide{
        max-height: 0;
        height: 0;
        visibility: hidden;
        opacity: 0;
        transition: opacity 200ms ease-out;
    }

.category-show-all{
        display: flex;
        justify-content: center;
        transition: all 200ms ease-out;
    }

    .category-show-all button,
    .category-show-all button:focus {
        padding: 2px;
        border-radius: 50% !important;
        color: #FFF !important;
        width: 26px;
        height: 26px;
        background-color: var( --e-global-color-primary ) !important;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 12px;
        outline: none;
        transition: all 200ms ease-in-out;
    }

    .category-show-all button:hover{
        padding: 2px;
        border-radius: 50%;
        color: var( --e-global-color-primary ) !important;
        width: 26px;
        height: 26px;
        background-color: #FFF !important;
    }

    .category-show-all button .icon-hide{
        display: none;
    }


.category-section.open .category-post-list{
        max-height: 80vh;
        overflow: auto;
    }

    .category-section.open .category-post-list::-webkit-scrollbar {
        width: 2px;
      }
       
      .category-section.open .category-post-list::-webkit-scrollbar-track {
        box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
      }
       
      .category-section.open .category-post-list::-webkit-scrollbar-thumb {
        background-color: var( --e-global-color-primary );
        outline: 1px solid var( --e-global-color-primary );
        border-radius: 2px;
      }

    .category-section.open .pannel-hide{
        max-height: 80vh;
        height: auto;
        visibility: visible;
        opacity: 1;
    }

    .category-section.open .category-show-all .icon-show{
        display: none;
    }

    .category-section.open .category-show-all .icon-hide{
        display: block;
    }

@media screen and (max-width: 640px){

    .category-post-list li{
        max-width: 100%;
    }

}