/* Accordion Glassmorphism */
@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
    
    /* 1. DEFAULT STATE (Closed, no mouse interaction) */
    .pwr-accordion--glass .pwr-accordion__title,
    .pwr-accordion--glass .pwr-accordion__desc {
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
        background-color: rgba(var(--clr-background-accent-lt-rgb), 0.7) !important; 
        transition: background-color 0.3s ease; /* Smooth transition between states */
    } 
    .pwr--dark .pwr-accordion--glass .pwr-accordion__title,
    .pwr--dark .pwr-accordion--glass .pwr-accordion__desc {
        background-color: rgba(var(--clr-background-accent-dk-rgb), 0.7) !important;
    }

    /* 2. HOVER STATE (Mouse over the accordion) */
    .pwr-accordion--glass:hover .pwr-accordion__title {
        background-color: rgba(var(--clr-background-accent-lt-rgb), 0.85) !important; /* Slightly more opaque */
    }
    .pwr--dark .pwr-accordion--glass:hover .pwr-accordion__title {
        background-color: rgba(var(--clr-background-accent-dk-rgb), 0.85) !important;
    }

    /* 3. ACTIVE STATE (Accordion is clicked and open) */
    .pwr-accordion--glass.active .pwr-accordion__title,
    .pwr-accordion--glass.active .pwr-accordion__desc {
        background-color: rgba(var(--clr-background-accent-lt-rgb), 0.95) !important; /* Almost solid when open */
    }
    .pwr--dark .pwr-accordion--glass.active .pwr-accordion__title,
    .pwr--dark .pwr-accordion--glass.active .pwr-accordion__desc {
        background-color: rgba(var(--clr-background-accent-dk-rgb), 0.95) !important;
    }
}