/**
 * Chevron Fix CSS
 * Fixes positioning and styling of chevrons in submenu items
 */

/* Ensure all submenu items with children have proper chevron */
.has-children > a {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    position: relative !important;
    padding-right: 30px !important;
}

/* Add chevron to all submenu items with children if not present */
.has-children > a .submenu-chevron {
    font-size: 0.8rem !important;
    margin-left: 8px !important;
    transition: transform 0.3s ease !important;
    color: #4CAF50 !important;
    position: absolute !important;
    right: 10px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

/* Rotate chevron when submenu is active */
.has-children > a.active .submenu-chevron {
    transform: translateY(-50%) rotate(90deg) !important;
}

/* Desktop specific styles */
@media (min-width: 992px) {
    .has-children > a .submenu-chevron {
        color: rgba(200, 157, 102, 0.7) !important;
    }
    
    .has-children > a:hover .submenu-chevron {
        color: #4CAF50 !important;
    }
}

/* Mobile specific styles */
@media (max-width: 991px) {
    .mobile-nav .has-children > a .submenu-chevron,
    .mobile-menu-container .has-children > a .submenu-chevron {
        right: 15px !important;
        font-size: 1rem !important;
    }
    
    .mobile-nav .has-children > a.active .submenu-chevron,
    .mobile-menu-container .has-children > a.active .submenu-chevron {
        transform: translateY(-50%) rotate(90deg) !important;
    }
}
