/* Multi-select bar (floating bottom) + selected task highlight */

.task-item.is-multi-selected {
    background: rgb(var(--flowly-accent-primary-rgb, 34 197 94) / 0.12) !important;
    box-shadow: inset 0 0 0 1px rgb(var(--flowly-accent-primary-rgb, 34 197 94) / 0.4);
    border-radius: calc(6px * var(--flowly-radius-k));
}

.multi-select-bar {
    position: fixed;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%) translateY(120%);
    z-index: 9998;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 10px 8px 14px;
    background: linear-gradient(180deg, var(--flowly-bg-overlay, rgba(20, 22, 28, 0.96)) 0%, var(--flowly-bg-overlay, rgba(14, 15, 20, 0.96)) 100%), var(--flowly-bg-body, #08090e);
    border: 1px solid var(--flowly-border-strong, rgba(255, 255, 255, 0.08));
    border-radius: calc(12px * var(--flowly-radius-k));
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5),
                0 0 0 1px rgba(255, 255, 255, 0.02) inset;
    opacity: 0;
    pointer-events: none;
    transition: transform 220ms cubic-bezier(0.25, 0.1, 0.25, 1),
                opacity 180ms ease;
    backdrop-filter: blur(10px);
    max-width: calc(100vw - 32px);
}
.multi-select-bar.is-visible {
    transform: translateX(-50%) translateY(0);
    opacity: 1;
    pointer-events: auto;
}

.multi-select-bar__count {
    font-size: calc(12px * var(--flowly-text-k));
    font-weight: 700;
    color: var(--flowly-text-primary);
    padding-right: 8px;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    margin-right: 2px;
    letter-spacing: 0.02em;
}

.multi-select-bar button {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 11px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: calc(7px * var(--flowly-radius-k));
    color: var(--flowly-text-secondary);
    font-size: calc(12px * var(--flowly-text-k));
    font-weight: 600;
    cursor: pointer;
    transition: background 120ms, color 120ms, border-color 120ms;
    white-space: nowrap;
}
.multi-select-bar button:hover {
    background: rgba(255, 255, 255, 0.08);
    color: var(--flowly-text-primary);
    border-color: rgba(255, 255, 255, 0.12);
}
.multi-select-bar button.is-danger {
    color: var(--flowly-accent-danger, #FF5C4D);
    border-color: rgba(255, 92, 77, 0.18);
}
.multi-select-bar button.is-danger:hover {
    background: rgba(255, 92, 77, 0.1);
    border-color: rgba(255, 92, 77, 0.32);
    color: var(--flowly-accent-danger, #FF5C4D);
}
.multi-select-bar button.is-ghost {
    background: transparent;
    border-color: transparent;
    padding: 7px;
    color: var(--flowly-text-tertiary);
}
.multi-select-bar button.is-ghost:hover {
    background: rgba(255, 255, 255, 0.06);
    color: var(--flowly-text-primary);
}

@media (max-width: 480px) {
    .multi-select-bar {
        bottom: 80px;
        flex-wrap: wrap;
        gap: 4px;
        padding: 8px;
    }
    .multi-select-bar button { font-size: 11px; padding: 6px 9px; }
}