/* ============================================================================
   VRYNO ROW ACTIONS
   ============================================================================
   Two tints for the icons vryno-rowactions.js promotes out of the three-dot
   menu. The geometry is not restated: .lead-action-btn in style.css already
   sets the 30px circle, the hover lift and the fade-in on row hover, and every
   promoted icon carries that class, so a promoted action is the same object as
   the Edit icon that was always there -- only its colour is new.

   .vr-act-edit repeats .lead-action-edit's colours under a name this file
   owns, so the two can diverge later without editing 47 pages.
============================================================================ */

/* View: the primary tint. Measured #482dc1 on --primary-transparent #ece7fb at
   7.29:1, and both sides are theme variables -- theme-runtime.css derives the
   tint with color-mix at 10%, so a customer's own primary keeps the ratio. */
.lead-action-btn.vr-act-view {
    background: var(--primary-transparent);
    color: var(--primary);
}

/* Edit: unchanged from what the product already showed. */
.lead-action-btn.vr-act-edit {
    background: var(--info-transparent);
    color: var(--info);
}

/* Everything else: neutral, so a row of four icons reads as one control group
   rather than four competing signals. --gray-600 rather than --gray-500 --
   #5A5B5B on --light #edeeee measures 5.86:1 against 4.26:1, and these are
   graphical controls with no text beside them. */
.lead-action-btn.vr-act-plain {
    background: var(--light);
    color: var(--gray-600);
}

.lead-action-btn.vr-act-plain:hover {
    background: var(--primary-transparent);
    color: var(--primary);
}

/* The actions column holds at most five icons and no menu. Keep them on one
   line so the column does not jump between a table whose rows all fit and one
   whose rows do not. */
th[data-col="actions"],
td[data-col="actions"] {
    white-space: nowrap;
}

/* The selection bar now receives everything the three-dot menu used to hold,
   so on the busiest page it carries Clear, Convert, Transfer, Update, View,
   Clone, Export and Delete. Its action group wraps rather than overflowing --
   nothing else about the bar changes: same buttons, same size, same colours,
   only a second line when there is no room for a first. */
#bulkActionBar > div {
    flex-wrap: wrap;
    row-gap: 6px;
}

td[data-col="actions"] > .d-flex {
    /* gap-1.5 is a Tailwind-shaped class the theme carries; restate it here so
       a cell this script had to create matches the ones it did not. */
    gap: 6px;
}

/* ---------------------------------------------------------------------------
   DARK
   --light and --info-transparent both flip in dark mode already; the plain
   ink does not, because --gray-600 stays dark there.
   --------------------------------------------------------------------------- */
[data-bs-theme="dark"] .lead-action-btn.vr-act-plain {
    background: rgba(255, 255, 255, .07);
    color: var(--dtf-text, #a9b1c7);
}

[data-bs-theme="dark"] .lead-action-btn.vr-act-plain:hover {
    background: rgba(103, 76, 226, .26);
    color: #a99bff;
}

[data-bs-theme="dark"] .lead-action-btn.vr-act-view {
    background: rgba(103, 76, 226, .22);
    color: #a99bff;
}