/**
 * Accordion Animations CSS
 * Provides smooth transitions for accordion open/close animations
 */

/* Base styles for accordion content */
.categoryitems {
    overflow: hidden;
    transition: max-height 0.3s ease-in-out, opacity 0.2s ease-in-out;
    max-height: 0;
    opacity: 0;
}

/* When accordion is active/open */
.categoryitems.accordion-active {
    opacity: 1;
}

@keyframes fadeIn {
    from {
        opacity: 0.8;
    }
    to {
        opacity: 1;
    }
}

/* Smooth transition for accordion headers */
.menuheader, .expandable {
    transition: background-color 0.2s ease;
    position: relative;
}

/* Removed plus/minus indicators as requested */

/* Additional visual feedback on hover */
.menuheader:hover, .expandable:hover {
    background-color: #f5f5f5;
}

/* For better accessibility - focus styles */
.menuheader:focus, .expandable:focus {
    outline: 2px solid #007bff;
    outline-offset: -2px;
}