﻿.accordion {
    margin: 20px auto;
    clear: both;
    background-color: white;
}

    .accordion h3 {
        background: #007bff;
        color: white;
        padding: 10px 15px;
        cursor: pointer;
        border: none;
        border-radius: 5px;
        margin: 5px 0;
    }

        .accordion h3:hover {
            background: #0056b3;
        }

    .accordion .ui-accordion-header-active {
        background: #28a745 !important;
    }

        .accordion .ui-accordion-header-active span.toggle-icon {
            content: "\2212"; /* Unicode minus sign */
        }

    .accordion h3 span.toggle-icon {
        float: right;
        font-size: 18px;
        transform: rotate(0deg);
        transition: transform 0.3s ease;
    }

    .accordion .ui-accordion-header-active span.toggle-icon {
        transform: rotate(180deg);
    }

    .accordion div {
        background: #f8f9fa;
        padding: 10px;
        border: 1px solid #ddd;
        border-radius: 5px;
    }
