html body:not(.wp-admin),
html #poststuff .-preview {

    #accordeon {
        .accordeons {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;

            .accordeon {
                border-radius: 20px;
                overflow: hidden;

                .accordeon_body {
                    display: grid;
                    grid-template-rows: 0fr;
                    transition: all 0.2s ease;
                    background: #eee;

                    .contenu {
                        overflow: hidden;

                        > * {
                            padding: 1rem;
                        }
                    }
                }

                &.open {
                    .accordeon_head {
                        &:before {
                            transform: translate(-50%, calc(-50% + 0.5rem)) rotate(135deg);
                        }
                    }

                    .accordeon_body {
                        grid-template-rows: 1fr;
                    }
                }

                .accordeon_head {
                    padding: 1rem 6rem;
                    background: var(--color, #191937);
                    color: white;
                    font-family: Helvetica Neue Condensed, Helvetica Neue, Helvetica, sans-serif;
                    font-size: 32px;
                    font-weight: 750;
                    font-style: italic;
                    text-align: center;
                    cursor: pointer;
                    position: relative;

                    @media (min-width: 640px){
                        font-size: 1.5rem;
                        padding: 1rem 2rem;
                    }

                    &:before {
                        content: "";
                        position: absolute;
                        right: 2rem;
                        width: 2rem;
                        display: block;
                        aspect-ratio: 1;
                        top: 50%;
                        transform: translate(-50%, calc(-50% - 0.5rem)) rotate(-45deg);
                        border-left: 1px solid white;
                        border-bottom: 1px solid white;

                        @media (min-width: 640px){
                            width: 1rem;
                            right: 1rem;
                        }
                }


            }
        }
    }
}