/* Styles CSS pour le menu déroulant */
.dropdown {
    position: relative;
    display: inline-block;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #ffffff;
    min-width: 180px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.1);
    z-index: 1000; /* plus haut pour passer au-dessus */
    right: 0; 
    border-radius: 0.5rem; 
    overflow: hidden; 
    margin-top: 6px; /* espace confortable */
    border: 1px solid #e5e7eb;
    pointer-events: auto; /* permet de cliquer dedans */
}

/* S'assurer que .show surpasse toujours .hidden de Tailwind */
.dropdown-content.show,
.dropdown-content.show.hidden {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.dropdown-content a {
    color: #374151; /* gray-700 */
    padding: 10px 16px;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.875rem; 
    line-height: 1.25rem;
    transition: background-color 0.15s ease;
}
.dropdown-content a:hover {
    background-color: #f3f4f6; /* gray-100 */
    color: var(--primary-color, #2563eb);
}
.rotate-180 {
    transform: rotate(180deg);
}