.backup-action-card {
    position: relative;
    padding-right: 112px;
}

.backup-action-card:focus-visible {
    outline: 3px solid rgba(14, 165, 233, .35);
    outline-offset: 3px;
}

.backup-merge-card {
    border-color: #9fc4ec !important;
    background: linear-gradient(120deg, #eef6ff, #ffffff 62%, #f1fbf7) !important;
}

.backup-merge-card .backup-card-state {
    color: #075daf;
    background: #e6f2ff;
}

.backup-card-state {
    position: absolute;
    right: 16px;
    padding: 7px 10px;
    border: 1px solid #cbd5e1;
    border-radius: 9px;
    background: #f8fafc;
    color: #0b2447;
    font-size: .73rem;
    font-weight: 800;
}

.backup-status {
    margin-top: 18px;
    padding: 12px 15px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    background: #f8fafc;
    color: #52657d;
    font-size: .85rem;
    font-weight: 600;
}

.backup-status[data-kind="success"] {
    border-color: #86efac;
    background: #f0fdf4;
    color: #166534;
}

.backup-status[data-kind="error"] {
    border-color: #fda4af;
    background: #fff1f2;
    color: #be123c;
}

@media (max-width: 720px) {
    .backup-action-card { padding-right: 18px; }
    .backup-card-state { display: none; }
}
