:root {
    --accordion-animation: 0.4s ease;
}

/** Accordion header button styles */
accordion-box {
    display: grid;
    margin: 0.2rem 1rem;
    padding: 0.5rem;
    background-color: aliceblue;
    &:not([collapsed]) {
        accordion-header {
            button {
                color: #000;
                background-color: white;
            }

            button:after {
                background-image: var(--mdb-accordion-btn-active-icon);
                transform: var(--mdb-accordion-btn-icon-transform);
            }
        }
        accordion-content {
            grid-template-rows: 1fr;
        }
    }
    accordion-content {
        display: grid;
        grid-template-rows: 0fr;
        padding-inline: 5px;
        transition: grid-template-rows var(--accordion-animation);
        .accordion-animation-content {
            overflow-y: hidden;
        }
    }
    accordion-header {
        display: block;
        button {
            font-weight: bolder;
            position: relative;
            display: flex;
            align-items: center;
            width: 100%;
            padding: 5px;
            font-size: 1rem;
            text-align: left;
            background-color: white;
            color: #aaaa;
            border: 0;
            border-radius: 0;
            overflow-anchor: none;
            &:after {
                flex-shrink: 0;
                width: var(--mdb-accordion-btn-icon-width);
                height: var(--mdb-accordion-btn-icon-width);
                margin-left: auto;
                content: "";
                background-image: var(--mdb-accordion-btn-icon);
                background-repeat: no-repeat;
                background-size: var(--mdb-accordion-btn-icon-width);
                transition: var(--mdb-accordion-btn-icon-transition);
            }
            &:hover {
                z-index: 2;
            }
            &:focus {
                z-index: 3;
                box-shadow: var(--mdb-accordion-btn-focus-box-shadow);
            }
        }
    }
}