/* ========================================================================== DROPDOWN COMPONENTS ========================================================================== */ /* Entity Actions Dropdown */ .entity-actions { position: relative; } /* MÊME pastille que `.kebab-btn` (tables.css), au pixel — 2026-08-02. Ce bouton est le dialecte HÉRITÉ du menu de ligne : son menu est `position: absolute` dans le cadre défilant (il se fait rogner dans un tableau large), là où `window.rowActions` détache le sien dans ``. C'est une différence de MÉCANIQUE, qui justifie la migration page par page ; ce n'en était pas une d'APPARENCE, et pourtant il se dessinait avec une bordure grise permanente et un rayon de 8 px face au carré sans bordure du canon. Deux boutons visiblement différents pour la même action, à une page d'écart (/quotes vs /clients). Tant que la migration n'est pas finie, ils se ressemblent au moins. Ne PAS fusionner les deux sélecteurs : le jour où la dernière liste passe à `table_list()`, ce bloc se supprime d'un bloc. */ .entity-actions-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; min-height: 28px; padding: 0; background: none; border: 1px solid transparent; border-radius: var(--radius-sm); color: var(--text-muted); cursor: pointer; transition: background var(--transition), border-color var(--transition), color var(--transition); } .entity-actions-btn:hover { background: var(--gray-100); border-color: var(--gray-300); color: var(--text); } /* L'état ouvert du canon est `.kebab-btn[aria-expanded="true"]`. Le dialecte hérité, lui, ne touche PAS au bouton : `Dropdowns` (core.js) pose `.show` sur le `.entity-dropdown` FRÈRE. L'état ouvert se lit donc sur le frère — vérifié dans core.js, pas supposé. (`:has()` est déjà utilisé par tables.css.) */ .entity-actions-btn:has(+ .entity-dropdown.show) { background: var(--gray-200); border-color: var(--gray-300); color: var(--text); } .entity-actions-btn:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; } .entity-dropdown { position: absolute; top: 100%; right: 0; z-index: var(--z-chrome); min-width: 160px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-lg); overflow: visible; display: none !important; } .entity-dropdown.show { display: block !important; } .entity-dropdown-item { display: flex; align-items: center; gap: var(--space-2); width: 100%; padding: var(--space-2) var(--space-4); color: var(--text); font-size: 0.875rem; background: none; border: none; text-align: left; cursor: pointer; transition: background var(--transition); border-radius: 0; white-space: nowrap; } .entity-dropdown-item:hover { background: var(--gray-100); color: var(--gray-900); } .entity-dropdown-item:first-child { border-radius: var(--radius) var(--radius) 0 0; } .entity-dropdown-item:last-child { border-radius: 0 0 var(--radius) var(--radius); } .entity-dropdown-item:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; } .entity-dropdown-item.danger { color: var(--error); } .entity-dropdown-item.danger:hover { /* css-color-ok: cran historique sans token (rampe status-popover / nuances 50-300) */ background: #fef2f2; color: var(--error-hover); } /* Action indisponible : visible mais inerte, avec son motif sur une 2e ligne. Une action absente se lit comme un bug ; une action grisée qui dit pourquoi se lit comme une règle. Le hover ne réagit pas — rien à cliquer. */ .entity-dropdown-item.is-disabled, .entity-dropdown-item[disabled] { color: var(--text-muted); cursor: not-allowed; } .entity-dropdown-item.is-disabled:hover, .entity-dropdown-item[disabled]:hover { background: none; color: var(--text-muted); } .entity-dropdown-item.is-disabled svg { opacity: .5; } .entity-dropdown-label { display: flex; flex-direction: column; gap: 1px; min-width: 0; } .entity-dropdown-reason { font-size: 0.75rem; line-height: 1.2; color: var(--text-muted); white-space: normal; } .entity-dropdown-divider { height: 1px; background: var(--border); margin: 4px 0; } /* ========================================================================== MENU KEBAB DÉTACHÉ — le menu de la colonne d'actions ========================================================================== Monté dans `` et positionné en `position: fixed` par core.js (`RowActions.open`). C'est ce qui le distingue de `.entity-dropdown`, ancré en `absolute` dans la cellule : celui-là se fait rogner par le `overflow-x: auto` de `.table-container` dès qu'on fait défiler le tableau. Règles importées telles quelles depuis le `