/* v3 row actions (reference §2): one main action + a ⋯ menu. The menu is the
   shell's popover menu (.lg-pop, placed under its button by js/v3/shell.js;
   a bottom sheet on phones). Red items last, below a divider, behind a confirm.
   Macro: row_actions() in core/components/_lg_button.html. */

.lg-rowact { display: inline-flex; align-items: center; gap: var(--space-2); }
.lg-rowact__menu:popover-open { width: 16rem; }
.lg-rowact__list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.lg-rowact__divider { margin: var(--space-1) 0; border-block-start: 1px solid var(--border); }
/* Doubled class: shell.css loads after this file and its .lg-menu__item /
   .lg-menu__item svg colours have the same weight, so a single class lost and
   red items showed grey (found in the phase 5 step 2a phone check). */
.lg-menu__item.lg-menu__item--danger,
.lg-menu__item.lg-menu__item--danger svg { color: var(--danger); }
.lg-menu__item.lg-menu__item--danger:hover { background: var(--danger-tint); }

/* Items copied from the page header's secondary buttons show only on phones,
   where those buttons are hidden (Primer: narrow viewports move them into ⋯). */
@media (min-width: 40em) {
  .lg-rowact__phone { display: none; }
}

@media (max-width: 39.99em) {
  .lg-rowact .lg-btn--icon { min-width: var(--touch-target); min-height: var(--touch-target); }
}

/* ⋯ in grid rows (plan §11 #76; NN/g contextual menus, Nov 2025: missed when
   too small, faint or far from its item). Desktop: always visible, quiet when
   idle, lit when its row is hovered or holds keyboard focus. Phone cards: always
   clearly visible (1.25rem icon, text colour, tinted 44px button). Radius stays
   the control radius (core §6: 50% only for dots, avatars, radios). */
@media (min-width: 40em) {
  .lg-grid__row:is(:hover, :focus-within) .lg-rowact__more { color: var(--text); background: var(--neutral-tint); }
}
@media (max-width: 39.99em) {
  .lg-grid__row .lg-rowact__more { color: var(--text); background: var(--neutral-tint); }
  .lg-grid__row .lg-rowact__more svg { inline-size: 1.25rem; block-size: 1.25rem; }
}
.lg-grid__row .lg-grid__act[inert] .lg-rowact__more { color: var(--disabled-text); background: transparent; }