.btn {
    align-items: center;
    border-radius: var(--app-radius-sm);
    display: inline-flex;
    gap: var(--app-space-1);
    justify-content: center;
}

.btn-sm {
    min-height: var(--app-control-height-sm);
}

.btn-xs,
.icon-action {
    align-items: center;
    border: 0;
    border-radius: 50%;
    display: inline-flex;
    height: 1.875rem;
    justify-content: center;
    line-height: 1;
    padding: 0;
    transition: background-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
    width: 1.875rem;
}

.btn-xs + .btn-xs,
.icon-action + .icon-action {
    margin-left: var(--app-space-1);
}

.btn-xs:hover,
.icon-action:hover {
    box-shadow: var(--app-shadow-sm);
    transform: translateY(-1px);
}

.dataTables_wrapper table.dataTable tbody .btn-xs > i,
.dataTables_wrapper table.dataTable tbody .btn-xs > .bx {
    font-size: 1.0625rem !important;
    line-height: 1;
}

.app-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--app-space-2);
    justify-content: flex-end;
}

@media (max-width: 575.98px) {
    .app-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .app-actions .btn {
        width: 100%;
    }
}