/* Phase 3a: the keyboard's active task row (js/modules/row-selection.js).
   Same language as the palette's selected result: tint + blue edge. The row is
   focused, so the tint is the focus indicator; no second outline. */
.task-row.row-selected,
.dashboard-note-item.row-selected,
.project-note-item.row-selected,
.area-note-item.row-selected {
    background: var(--accent-blue-light);
    box-shadow: inset 2px 0 0 var(--accent-blue);
}

.row-selected:focus:not(:focus-visible) {
    outline: none;
}

/* Phase 3d: tasks marked with x for a bulk action. A marked row is outlined;
   the active row keeps its edge bar on top. */
.task-row.row-marked {
    background: var(--accent-blue-light);
    box-shadow: inset 0 0 0 1px var(--accent-blue-border, var(--accent-blue));
}

.task-row.row-marked.row-selected {
    box-shadow: inset 2px 0 0 var(--accent-blue), inset 0 0 0 1px var(--accent-blue-border, var(--accent-blue));
}

/* The marked-tasks bar (row-verbs.js): snackbar language, above where
   snackbars appear so the two never overlap. */
.row-bulk-bar {
    position: fixed;
    left: 50%;
    bottom: 88px;
    transform: translateX(-50%);
    z-index: var(--z-popover, 200);
    display: flex;
    align-items: center;
    gap: var(--space-2, 8px);
    padding: 6px var(--space-2, 8px);
    background: var(--bg-elevated);
    border: 1px solid var(--border-light);
    border-radius: 28px;
    box-shadow: var(--shadow-lg);
    font-family: var(--font-family);
    font-size: var(--font-size-14);
}

.row-bulk-count {
    color: var(--text-secondary);
    padding: 0 var(--space-2, 8px);
}

.row-bulk-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 0 var(--space-3, 12px);
    border: 1px solid var(--border-light);
    border-radius: 22px;
    background: transparent;
    color: var(--text-primary);
    font: inherit;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-in-out);
}

.row-bulk-btn:hover,
.row-bulk-btn:focus-visible {
    background: var(--accent-blue-light);
}

.row-bulk-btn kbd {
    font-family: inherit;
    font-size: var(--font-size-xs);
    color: var(--text-tertiary);
}

@media (prefers-reduced-motion: reduce) {
    .row-bulk-btn { transition: none; }
}