:root{
   /* Light gray */
    --HPSP-accordion-border-color:#E0E0E0;
    --HPSP-accordion-background-color: #FCFCFC;   
    --HPSP-accordion-background-color-hover: #FFF;
}

.hpsp-accordion-container{
    border:var(--HPSP-accordion-border-color) 1px solid;
    border-radius:0.25em;
    overflow:hidden;
    background: var(--HPSP-accordion-background-color);
    display: inline-block;
    width: 100%;
    margin-bottom: 0.25em;
   
}
    .hpsp-accordion-container:hover{
        background: var(--HPSP-accordion-background-color-hover);
    }
.hpsp-accordion-panel{
    display:flex !important;   
    justify-content: space-between;
    padding: 0.5em;
    align-items: baseline;   
}
.hpsp-accordion-panel > a{
   text-decoration:none;
}
.hpsp-accordion-panel span{
   color: var(--HPSP-button-main-color);
   font-size: 2em;
}
.hpsp-accordion-panel>a:focus {
    outline-offset: 4px !important;
    outline: 2px solid #ea9c50 !important;
}
.hpsp-accordion-body{
    padding: 0.25em 1em;
}
.hpsp-accordion-container:has(.in) .hpsp-accordion-panel{
   background: var(--HPSP-button-main-color);
}
.hpsp-accordion-container:has(.in) .hpsp-accordion-panel > h3{   
   color: var(--HPSP-button-font-color);
}
.hpsp-accordion-container:has(.in) .hpsp-accordion-panel span{   
   color: var(--HPSP-button-font-color);
}