/* =====================================================
 * Oveyo V6.2 — Fix CSS pour menus dropdown coupés
 * =====================================================
 *
 * Bug observé : le menu "..." (3 points) sur la page Utilisateurs
 * affiche un dropdown qui se coupe en dehors de la card.
 *
 * Cause : .card a `overflow:hidden` (pour border-radius), donc tout
 * dropdown positionné en absolu déborde et se coupe.
 *
 * Fix : sur les cards qui contiennent une data-table avec dropdown,
 * on retire l'overflow:hidden et on déclare un z-index pour le dropdown.
 */

/* La card qui contient une table doit pouvoir déborder pour les menus */
.card.card--with-dropdown,
.card:has(.user-action-menu),
.card:has(table.data-table) {
  overflow: visible !important;
}

/* Le dropdown lui-même doit être au-dessus de tout */
.user-action-menu,
.dropdown-menu,
[id^="menu-"] {
  position: absolute;
  z-index: 1000;
  background: white;
  border: 1px solid #DDE3EC;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(15, 31, 54, 0.15);
  min-width: 200px;
  padding: 6px;
}

/* La cellule qui contient le bouton "..." doit positionner le dropdown */
td.has-action-menu,
td:has(button[aria-label="Actions"]) {
  position: relative;
  overflow: visible;
}

/* La table elle-même ne doit pas couper non plus */
.data-table {
  overflow: visible !important;
}

/* Sur mobile, le dropdown doit s'aligner à droite pour ne pas sortir de l'écran */
@media (max-width: 640px) {
  .user-action-menu,
  .dropdown-menu,
  [id^="menu-"] {
    right: 8px;
    left: auto !important;
  }
}

/* =====================================================
 * Bonus : style boutons V6.2 plus cohérent
 * ===================================================== */

.btn--sm {
  padding: 4px 10px !important;
  font-size: 12px !important;
}

.btn--small {
  padding: 4px 10px !important;
  font-size: 12px !important;
}