/* =============================================================================
   CARD WRAPPER STYLES (GLOBAL - SHARED ACROSS COMPONENTS)
   ============================================================================= */

/*
 * These styles must stay global because .activity-preview-wrapper is used by:
 * 1. AglActivityPreview - normal cards
 * 2. AglBoardListView - drag placeholder
 *
 * All other card styles are scoped to AglActivityPreview.razor.css
 */

/* Card wrapper. Radius matches the inner .activity-preview-content (4px) so the
   wrapper bounds don't carve a different-shaped silhouette around the card.
   Hover lift moved to .activity-preview-content (see AglActivityPreview.razor.css)
   so the card's own border + shadow stay the source of truth. */
.activity-preview-wrapper {
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    margin-bottom: var(--card-gap);
    border-radius: 4px;
    text-decoration: none;
    color: inherit;
    transition: all 0.2s ease;
}

.activity-preview-wrapper:hover {
    text-decoration: none;
}

/* Selection uses the canvas seablue family (matches the .activity-preview-content ring). */
.activity-preview-wrapper.is-selected {
    outline: 2px solid #009FE3;
    outline-offset: 2px;
}

.activity-preview-wrapper.is-checked {
    opacity: 0.8;
}

.activity-preview-wrapper.multi-selection-active {
    cursor: pointer;
}

/* Multi-selection active width adjustments - from original activity-preview.styl lines 6-9 */
.activity-preview-wrapper.multi-selection-active .activity-preview {
    width: 159px;
}

.activity-preview-wrapper.multi-selection-active .activity-preview.relaxed-view {
    width: 266px;
}

.activity-preview-wrapper.multi-selection-active .activity-preview-content .activity-preview-status-overlay {
    left: 24px;
}

.activity-preview-wrapper.multi-selection-active::after {
    left: 31px;
}

.activity-preview-wrapper.multi-selection-active .activity-preview-color-stripe {
    left: 24px;
}

.activity-preview-wrapper.placeholder {
    background: #cccccc;
    border-radius: 4px;
}

.activity-preview-wrapper.view-background {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(8px);
}

.activity-preview-wrapper.relaxed-view {
    margin-bottom: var(--card-gap-relaxed);
}