.wp-block-custom-adaptive-accordion {
    margin-bottom: 40px;
    --bc: var(--bc-d); --rc: var(--rc-d); --hc: var(--hc-d); --cc: var(--cc-d); --ic: var(--ic-d);
    --fs: var(--fs-d); --cfs: var(--cfs-d); --clh: var(--clh-d); --h: var(--h-d); 
    --sw: var(--sw-d); --ph: var(--ph-d); --cp: var(--cp-d); --mv: var(--mv-d); --is: var(--is-d);
}

@media (max-width: 1024px) {
    .wp-block-custom-adaptive-accordion {
        --bc: var(--bc-t); --rc: var(--rc-t); --hc: var(--hc-t); --cc: var(--cc-t); --ic: var(--ic-t);
        --fs: var(--fs-t); --cfs: var(--cfs-t); --clh: var(--clh-t); --h: var(--h-t); 
        --sw: var(--sw-t); --ph: var(--ph-t); --cp: var(--cp-t); --mv: var(--mv-t); --is: var(--is-t);
    }
}

@media (max-width: 600px) {
    .wp-block-custom-adaptive-accordion {
        --bc: var(--bc-m); --rc: var(--rc-m); --hc: var(--hc-m); --cc: var(--cc-m); --ic: var(--ic-m);
        --fs: var(--fs-m); --cfs: var(--cfs-m); --clh: var(--clh-m); --h: var(--h-m); 
        --sw: var(--sw-m); --ph: var(--ph-m); --cp: var(--cp-m); --mv: var(--mv-m); --is: var(--is-m);
    }
}

.accordion-item {
    border-top: var(--sw) solid var(--rc);
    overflow: hidden;
    transition: all 0.3s ease;
    /* Logic: Use individual item override if it exists, otherwise use global brand color */
    --active-bg: var(--item-custom-color, var(--bc));
}

.accordion-item.is-open {
    background: var(--active-bg);
    margin: var(--mv) 0;
    border-radius: 8px;
    border-top: none;
}

.accordion-header {
    display: flex;
    justify-content: space-between;
    align-items: center; 
    padding: 0 var(--ph);
    min-height: var(--h);
    cursor: pointer;
    font-size: var(--fs);
    color: var(--hc);
}

.header-title-wrapper {
    flex: 1;
    display: flex;
    align-items: center;
    padding: 10px 0;
}

.accordion-content {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 var(--ph);
    transition: max-height 0.4s ease, opacity 0.3s ease, padding 0.4s ease;
    color: var(--cc);
    font-size: var(--cfs);
    line-height: var(--clh);
}

.accordion-item.is-open .accordion-content {
    max-height: 3000px;
    opacity: 1;
    padding: var(--cp) var(--ph);
}

.icon-target {
    font-size: var(--is);
    color: var(--ic);
    margin-left: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
}

.accordion-item.is-open * { color: #ffffff !important; }