/* =============================================================================
   MwMergeEditor styles (global, prefixed with mw-me-*)
   ============================================================================= */

.mw-me-root {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.mw-me-table {
    width: 100%;
}

.mw-me-toggle-col {
    width: 48px;
    text-align: center;
}

.mw-me-property {
    font-weight: 500;
    white-space: nowrap;
}

.mw-me-value {
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 0.6;
}

.mw-me-value-chosen {
    opacity: 1;
    font-weight: 600;
}

/* NOTE: Row color coding by merge action */

.mw-me-row-identical {
    opacity: 0.5;
}

.mw-me-row-automerge {
    background-color: var(--mud-palette-info-lighten, rgba(33, 150, 243, 0.08));
}

.mw-me-row-union {
    background-color: var(--mud-palette-success-lighten, rgba(76, 175, 80, 0.08));
}

.mw-me-row-conflict {
    background-color: var(--mud-palette-warning-lighten, rgba(255, 152, 0, 0.12));
}

/* NOTE: Footer layout */

.mw-me-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 0;
}

.mw-me-ref-count {
    flex: 1;
    text-align: center;
    opacity: 0.7;
}