/**
 * Shared L2 — select chrome (view purple · execute blue)
 * SOT: bpaas/shared/hub.shared.persona.color.v1.rules.json → select_chrome
 * Lock: HUB_SURFACE_RUNTIME_FOUR_STAGE.standing
 *
 * Packs MUST use classes/tokens only — do not redefine hover hex or soft-on-hover.
 * Execute hover/active = SOLID --select-execute (Actor Client CC/Web, Signals Triage/Conversation, etc.).
 * View filters = purple --select-view (outcome tabs, kind chips, etc.).
 */

/* ═══════════════════════════════════════════════════════════════════
   select-execute — blue actions (idle soft · hover/active SOLID)
   ═══════════════════════════════════════════════════════════════════ */
:is(
  .select-execute,
  .msp-action--primary,
  .msp-action--hero,
  .act-new,
  a.ac-client-link:not(.ac-client-link--muted),
  .ac-client-link--cc:not(.ac-client-link--muted),
  .ac-client-link--web:not(.ac-client-link--muted),
  .work-lane-tab:not(.work-lane-tab--muted),
  .work-lane-tab--conv:not(.work-lane-tab--muted),
  .hub-next-signals-wb--outcomes .work-lane-tabs--queue .work-lane-tab,
  .hub-next-signals-wb--outcomes .work-lane-tabs--queue .work-lane-tab--conv
) {
  color: #fff !important;
  background: var(--select-execute-soft) !important;
  border: 1px solid color-mix(in srgb, var(--select-execute) 50%, transparent) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--select-execute) 28%, transparent);
  text-decoration: none;
  cursor: pointer;
  transition: background 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease,
    filter 0.12s ease, color 0.12s ease;
}

/* SOLID blue on hover */
:is(
  .select-execute,
  .msp-action--primary,
  .msp-action--hero,
  .act-new,
  a.ac-client-link:not(.ac-client-link--muted),
  .ac-client-link--cc:not(.ac-client-link--muted),
  .ac-client-link--web:not(.ac-client-link--muted),
  .work-lane-tab:not(.work-lane-tab--muted),
  .work-lane-tab--conv:not(.work-lane-tab--muted),
  .hub-next-signals-wb--outcomes .work-lane-tabs--queue .work-lane-tab,
  .hub-next-signals-wb--outcomes .work-lane-tabs--queue .work-lane-tab--conv
):hover,
:is(
  .select-execute,
  .msp-action--primary,
  .msp-action--hero,
  .act-new,
  a.ac-client-link:not(.ac-client-link--muted),
  .ac-client-link--cc:not(.ac-client-link--muted),
  .ac-client-link--web:not(.ac-client-link--muted),
  .work-lane-tab:not(.work-lane-tab--muted),
  .work-lane-tab--conv:not(.work-lane-tab--muted),
  .hub-next-signals-wb--outcomes .work-lane-tabs--queue .work-lane-tab,
  .hub-next-signals-wb--outcomes .work-lane-tabs--queue .work-lane-tab--conv
):focus-visible {
  color: #fff !important;
  background: var(--select-execute) !important;
  border-color: var(--select-execute-strong) !important;
  box-shadow: 0 0 0 1px var(--select-execute-strong), 0 4px 12px var(--select-execute-glow) !important;
  filter: brightness(1.04);
}

/* SOLID blue when active / pressed (Triage selected, primary pressed, …) */
:is(
  .select-execute,
  .msp-action--primary,
  .msp-action--hero,
  .act-new,
  .work-lane-tab:not(.work-lane-tab--muted),
  .work-lane-tab--conv:not(.work-lane-tab--muted),
  .hub-next-signals-wb--outcomes .work-lane-tabs--queue .work-lane-tab,
  .hub-next-signals-wb--outcomes .work-lane-tabs--queue .work-lane-tab--conv
).is-active,
:is(
  .select-execute,
  .msp-action--primary,
  .msp-action--hero,
  .act-new,
  .work-lane-tab:not(.work-lane-tab--muted),
  .work-lane-tab--conv:not(.work-lane-tab--muted)
):active {
  color: #fff !important;
  background: var(--select-execute) !important;
  border-color: var(--select-execute-strong) !important;
  box-shadow: 0 0 0 1.5px var(--select-execute), 0 0 14px var(--select-execute-glow) !important;
  filter: none;
}

/* Count chip on execute lane tabs stays readable on solid blue */
.work-lane-tab.is-active .work-lane-tab-count,
.work-lane-tab:hover .work-lane-tab-count,
.work-lane-tab--conv.is-active .work-lane-tab-count,
.work-lane-tab--conv:hover .work-lane-tab-count {
  background: rgba(2, 8, 16, 0.45);
  border-color: rgba(255, 255, 255, 0.2);
  color: #fff;
}

/* Muted / unresolved — never execute blue */
.ac-client-link--muted,
.ac-client-link--muted:hover,
.ac-client-link--muted:focus-visible {
  color: var(--text-tertiary, #64748b) !important;
  border-color: rgba(148, 163, 184, 0.28) !important;
  background: rgba(148, 163, 184, 0.08) !important;
  box-shadow: none !important;
  filter: none !important;
  cursor: default;
  opacity: 0.72;
  pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════════════
   select-view — purple filters (RAD/JOB/DEB/NEIT, kind chips, …)
   ═══════════════════════════════════════════════════════════════════ */
:is(
  .select-view,
  .outcome-tab,
  .hub-next-signals-wb--outcomes .outcome-tab
) {
  color: var(--select-view-strong) !important;
  background: transparent !important;
  border: 1px solid color-mix(in srgb, var(--select-view) 28%, transparent) !important;
  box-shadow: none;
  cursor: pointer;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

:is(
  .select-view,
  .outcome-tab,
  .hub-next-signals-wb--outcomes .outcome-tab
):hover {
  color: #f5f3ff !important;
  background: color-mix(in srgb, var(--select-view) 14%, transparent) !important;
  border-color: color-mix(in srgb, var(--select-view) 45%, transparent) !important;
}

:is(
  .select-view,
  .outcome-tab,
  .hub-next-signals-wb--outcomes .outcome-tab
).is-active {
  color: #f5f3ff !important;
  background: var(--select-view-soft) !important;
  border-color: var(--select-view) !important;
  box-shadow: none !important;
}
